fix(pagination): add pageSizeInputDisabled prop to Pagination

carbon-design-system · May 12, 2020 · e2a4f5d · e2a4f5d
1 parent 46d64cc
commit e2a4f5d
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 1 deletion.
diff --git a/packages/react/src/components/Pagination/Pagination-story.js b/packages/react/src/components/Pagination/Pagination-story.js
@@ -23,6 +23,10 @@ const props = () => ({
   page: number('The current page (page)', 1),
   totalItems: number('Total number of items (totalItems)', 103),
   pagesUnknown: boolean('Total number of items unknown (pagesUnknown)', false),
+  pageSizeInputDisabled: boolean(
+    'Disable page size input (pageInputDisabled)',
+    false
+  ),
   pageInputDisabled: boolean('Disable page input (pageInputDisabled)', false),
   backwardText: text(
     'The description for the backward icon (backwardText)',

diff --git a/packages/react/src/components/Pagination/Pagination.js b/packages/react/src/components/Pagination/Pagination.js
@@ -127,6 +127,11 @@ export default class Pagination extends Component {
      * `true` if the select box to change the page should be disabled.
      */
     pageInputDisabled: PropTypes.bool,
+
+    /**
+     * `true` if the select box to change the page size should be disabled.
+     */
+    pageSizeInputDisabled: PropTypes.bool,
   };
 
   static defaultProps = {
@@ -141,6 +146,7 @@ export default class Pagination extends Component {
     pagesUnknown: false,
     isLastPage: false,
     pageInputDisabled: false,
+    pageSizeInputDisabled: false,
     itemText: (min, max) => `${min}–${max} items`,
     pageText: page => `page ${page}`,
   };
@@ -188,7 +194,10 @@ export default class Pagination extends Component {
         Math.max(Math.ceil(this.props.totalItems / this.state.pageSize), 1)
     ) {
       this.setState({ page });
-      this.props.onChange({ page, pageSize: this.state.pageSize });
+      this.props.onChange({
+        page,
+        pageSize: this.state.pageSize,
+      });
     }
   };
 
@@ -233,6 +242,7 @@ export default class Pagination extends Component {
       pagesUnknown,
       isLastPage,
       pageInputDisabled,
+      pageSizeInputDisabled,
       totalItems,
       onChange, // eslint-disable-line no-unused-vars
       page: pageNumber, // eslint-disable-line no-unused-vars
@@ -278,6 +288,7 @@ export default class Pagination extends Component {
             noLabel
             inline
             onChange={this.handleSizeChange}
+            disabled={pageSizeInputDisabled}
             value={statePageSize}>
             {pageSizes.map(size => (
               <SelectItem key={size} value={size} text={String(size)} />