diff --git a/README.md b/README.md
index 97b966d..2b26015 100644
--- a/README.md
+++ b/README.md
@@ -69,6 +69,7 @@ For more details see __[Storybook](https://dtupalov.github.io/react-material-ui-
| page | number | 0 | Current page. Start with 0 |
| onPageChanged | Function | | Function trigger when `page` was changed. Signature ```(page: number) => any``` |
| perPage | number | 5 | Quantity of displaying items per page. |
+| onPerPageChanged | Function | | Function trigger when `perPage` was changed. Signature ```(perPage: number) => any``` |
| perPageOption | number[] | [5, 10, 15] | Per page option. Displayed on the paging panel |
| selectedRows | number[] | [] | Indexes of selected rows |
| selectable | boolean | true | Enable selections |
diff --git a/src/withReactMUIDatatableModel.js b/src/withReactMUIDatatableModel.js
index 080b72a..a3ee828 100644
--- a/src/withReactMUIDatatableModel.js
+++ b/src/withReactMUIDatatableModel.js
@@ -266,7 +266,11 @@ export default compose(
props.onPageChanged && props.onPageChanged(page);
},
- changePerPage: props => count => props.setPerPage(count),
+ changePerPage: props => count => {
+ props.setPerPage(count);
+
+ props.onPerPageChanged && props.onPerPageChanged(count);
+ },
handleSelect: props => selectedRows => props.setSelectedRows(selectedRows),
handleDelete: props => selectedRows => {
const nextData = props.data.filter(
diff --git a/stories/ReactMUIDatatable.stories.js b/stories/ReactMUIDatatable.stories.js
index 1772899..14dfa17 100644
--- a/stories/ReactMUIDatatable.stories.js
+++ b/stories/ReactMUIDatatable.stories.js
@@ -75,6 +75,14 @@ storiesOf('ReactMUIDatatable/Props', module)
perPage={15}
/>
))
+ .add('onPerPageChanged', () => (
+
+ ))
.add('perPageOption', () => (
{
onSortChanged = jest.fn(({ columnName, direction }) => {});
onFilterValuesChanged = jest.fn(filterValues => {});
onPageChanged = jest.fn(page => {});
+ onPerPageChanged = jest.fn(perPage => {});
data = [
{
@@ -93,6 +95,7 @@ describe('withReactMUIDatatableModel', () => {
onSortChanged={onSortChanged}
onFilterValuesChanged={onFilterValuesChanged}
onPageChanged={onPageChanged}
+ onPerPageChanged={onPerPageChanged}
/>
)
.root.findByType(MockedComponent);
@@ -408,6 +411,12 @@ describe('withReactMUIDatatableModel', () => {
);
});
+ it('should call onPerPageChanged if perPage was changed', () => {
+ RenderedMockedComponent.props.changePerPage(10);
+
+ expect(onPerPageChanged).toBeCalledWith(10);
+ });
+
it('should paginate', () => {
const expectedDisplayDataOnSecondPage = [
{