From 4b96a730023c546c108bad9474bd3f33145c8dc9 Mon Sep 17 00:00:00 2001
From: Debra Fong <debsfong@gmail.com>
Date: Tue, 4 Sep 2018 14:38:48 -0700
Subject: [PATCH 1/2] add onChange for pagination component

---
 packages/pagination/src/elements/Pagination.example.md |  6 +++++-
 packages/pagination/src/elements/Pagination.js         | 10 +++++++++-
 2 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/pagination/src/elements/Pagination.example.md b/packages/pagination/src/elements/Pagination.example.md
index 96b3f36e256..557eda7f352 100644
--- a/packages/pagination/src/elements/Pagination.example.md
+++ b/packages/pagination/src/elements/Pagination.example.md
@@ -5,7 +5,11 @@ initialState = {
   currentPage: 1
 };
 
-<Pagination totalPages={25} currentPage={state.currentPage} onStateChange={setState} />;
+<Pagination
+  totalPages={25}
+  currentPage={state.currentPage}
+  onChange={currentPage => setState({ currentPage })}
+/>;
 ```
 
 ### Custom Page Padding
diff --git a/packages/pagination/src/elements/Pagination.js b/packages/pagination/src/elements/Pagination.js
index 4b8137bb7a5..601fd60160d 100644
--- a/packages/pagination/src/elements/Pagination.js
+++ b/packages/pagination/src/elements/Pagination.js
@@ -46,6 +46,10 @@ export default class Pagination extends ControlledComponent {
      * @param {Any} newState.currentPage - The newly selected page
      */
     onStateChange: PropTypes.func,
+    /**
+     * @param {Any} currentPage - The newly selected page
+     */
+    onChange: PropTypes.func,
     /**
      * The root ID to use for descendants. A unique ID is created if none is provided.
      **/
@@ -212,7 +216,7 @@ export default class Pagination extends ControlledComponent {
    * we must mutate the data to compute currentPage
    */
   onPaginationStateChange = newProps => {
-    const { totalPages } = this.props;
+    const { totalPages, onChange } = this.props;
     const { currentPage } = this.getControlledState();
 
     if (newProps.selectedKey === PREVIOUS_KEY && currentPage > 1) {
@@ -233,6 +237,10 @@ export default class Pagination extends ControlledComponent {
       newProps.currentPage = newProps.selectedKey;
     }
 
+    if (newProps.currentPage !== undefined) {
+      onChange && onChange(newProps.currentPage);
+    }
+
     this.setControlledState(newProps);
   };
 

From ba20422175063afe91d1daa0ed78863ea15a3bed Mon Sep 17 00:00:00 2001
From: Austin Green <agreen@zendesk.com>
Date: Wed, 5 Sep 2018 11:04:30 -0700
Subject: [PATCH 2/2] Add missing prop-type and testing

---
 packages/pagination/src/elements/Pagination.js    |  5 +++++
 .../pagination/src/elements/Pagination.spec.js    | 15 ++++++++++++++-
 2 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/packages/pagination/src/elements/Pagination.js b/packages/pagination/src/elements/Pagination.js
index 601fd60160d..d200545f50d 100644
--- a/packages/pagination/src/elements/Pagination.js
+++ b/packages/pagination/src/elements/Pagination.js
@@ -32,6 +32,10 @@ export default class Pagination extends ControlledComponent {
      * The currently selected page
      */
     currentPage: PropTypes.number.isRequired,
+    /**
+     * The currently focused key
+     */
+    focusedKey: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
     /**
      * The total number of pages available
      */
@@ -43,6 +47,7 @@ export default class Pagination extends ControlledComponent {
     pagePadding: PropTypes.number,
     /**
      * @param {Object} newState
+     * @param {Any} newState.focusedKey - The newly focused page key
      * @param {Any} newState.currentPage - The newly selected page
      */
     onStateChange: PropTypes.func,
diff --git a/packages/pagination/src/elements/Pagination.spec.js b/packages/pagination/src/elements/Pagination.spec.js
index 1ca40214efd..bb19be52252 100644
--- a/packages/pagination/src/elements/Pagination.spec.js
+++ b/packages/pagination/src/elements/Pagination.spec.js
@@ -17,18 +17,21 @@ import Page from '../views/Page';
 
 describe('Pagination', () => {
   let onStateChange;
+  let onChange;
 
   const BasicExample = ({ currentPage = 1, totalPages = 5, ...other } = {}) => (
     <Pagination
       totalPages={totalPages}
       currentPage={currentPage}
       onStateChange={onStateChange}
+      onChange={onChange}
       {...other}
     />
   );
 
   beforeEach(() => {
     onStateChange = jest.fn();
+    onChange = jest.fn();
   });
 
   describe('transformPageProps', () => {
@@ -146,7 +149,7 @@ describe('Pagination', () => {
   });
 
   describe('Pages', () => {
-    it('updates currentPage when selected', () => {
+    it('updates onStateChange with currentPage when selected', () => {
       const wrapper = mountWithTheme(<BasicExample currentPage={1} totalPages={5} />);
 
       wrapper
@@ -156,6 +159,16 @@ describe('Pagination', () => {
       expect(onStateChange).toHaveBeenCalledWith({ currentPage: 2 });
     });
 
+    it('updates onChange with currentPage when selected', () => {
+      const wrapper = mountWithTheme(<BasicExample currentPage={1} totalPages={5} />);
+
+      wrapper
+        .find(Page)
+        .at(2)
+        .simulate('click');
+      expect(onChange).toHaveBeenCalledWith(2);
+    });
+
     it('hides front gap when currentPage is within padding range', () => {
       const wrapper = mountWithTheme(<BasicExample currentPage={1} totalPages={25} />);
       const children = wrapper