diff --git a/package.json b/package.json
index ff90e01..0f7c691 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "react-js-pagination",
- "version": "3.0.3",
+ "version": "3.0.4",
"description": "Simple, easy to use component for pagination. Compatible with bootstrap paginator stylesheets",
"main": "./dist/Pagination.js",
"scripts": {
diff --git a/src/components/Page.js b/src/components/Page.js
index f0fe184..402fe3d 100644
--- a/src/components/Page.js
+++ b/src/components/Page.js
@@ -63,7 +63,7 @@ export default class Page extends Component {
return (
-
+
{pageText}
diff --git a/src/components/Pagination.js b/src/components/Pagination.js
index 76d3e11..c5f1da6 100644
--- a/src/components/Pagination.js
+++ b/src/components/Pagination.js
@@ -11,9 +11,14 @@ export default class Pagination extends React.Component {
activePage: PropTypes.number,
itemsCountPerPage: PropTypes.number,
pageRangeDisplayed: PropTypes.number,
+ pageAriaLabel: PropTypes.string,
+ prevPageAriaLabel: PropTypes.string,
prevPageText: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ nextPageAriaLabel: PropTypes.string,
nextPageText: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ lastPageAriaLabel: PropTypes.string,
lastPageText: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
+ firstPageAriaLabel: PropTypes.string,
firstPageText: PropTypes.oneOfType([PropTypes.string, PropTypes.element]),
disabledClass: PropTypes.string,
hideDisabled: PropTypes.bool,
@@ -39,9 +44,14 @@ export default class Pagination extends React.Component {
itemsCountPerPage: 10,
pageRangeDisplayed: 5,
activePage: 1,
+ pageAriaLabel: "Go to page number :page",
+ prevPageAriaLabel: "Go to previous page",
prevPageText: "⟨",
+ firstPageAriaLabel: "Go to first page",
firstPageText: "«",
+ nextPageAriaLabel: "Go to next page",
nextPageText: "⟩",
+ lastPageAriaLabel: "Go to last page",
lastPageText: "»",
innerClass: "pagination",
itemClass: undefined,
@@ -103,7 +113,12 @@ export default class Pagination extends React.Component {
linkClassNext,
linkClassLast,
hideFirstLastPages,
- getPageUrl
+ getPageUrl,
+ pageAriaLabel,
+ firstPageAriaLabel,
+ prevPageAriaLabel,
+ nextPageAriaLabel,
+ lastPageAriaLabel
} = this.props;
const paginationInfo = new paginator(
@@ -128,7 +143,7 @@ export default class Pagination extends React.Component {
linkClass={linkClass}
activeClass={activeClass}
activeLinkClass={activeLinkClass}
- ariaLabel={`Go to page number ${i}`}
+ ariaLabel={pageAriaLabel.replace(':page', i)}
/>
);
}
@@ -145,7 +160,7 @@ export default class Pagination extends React.Component {
itemClass={cx(itemClass, itemClassPrev)}
linkClass={cx(linkClass, linkClassPrev)}
disabledClass={disabledClass}
- ariaLabel="Go to previous page"
+ ariaLabel={prevPageAriaLabel}
/>
);
@@ -161,7 +176,7 @@ export default class Pagination extends React.Component {
itemClass={cx(itemClass, itemClassFirst)}
linkClass={cx(linkClass, linkClassFirst)}
disabledClass={disabledClass}
- ariaLabel="Go to first page"
+ ariaLabel={firstPageAriaLabel}
/>
);
@@ -177,7 +192,7 @@ export default class Pagination extends React.Component {
itemClass={cx(itemClass, itemClassNext)}
linkClass={cx(linkClass, linkClassNext)}
disabledClass={disabledClass}
- ariaLabel="Go to next page"
+ ariaLabel={nextPageAriaLabel}
/>
);
@@ -195,7 +210,7 @@ export default class Pagination extends React.Component {
itemClass={cx(itemClass, itemClassLast)}
linkClass={cx(linkClass, linkClassLast)}
disabledClass={disabledClass}
- ariaLabel="Go to last page"
+ ariaLabel={lastPageAriaLabel}
/>
);