Repository: gpbl/react-day-picker (ts)

Issue:
Add `onTodayButtonClick` event handler
This event handle should be called when the `todayButton` prop is set and the today button is clicked. See https://github.com/gpbl/react-day-picker/issues/528.

**`onTodayButtonClick` signature:**
`(day: Date, modifiers: Object, e: SyntheticEvent) ⇒ undefined`

### Usage example

```jsx
class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.handleTodayButtonClick = this.handleTodayButtonClick.bind(this);
    this.state = {
      selectedDay: undefined,
    };
  }
  handleTodayButtonClick(day, modifiers, e) {
    this.setState({ selectedDay: day });
  }
  render() {
    return (
      <div>
        <DayPicker
          todayButton="Go to Today"
          onTodayButtonClick={this.handleTodayButtonClick}
        />
      </div>
    );
  }
}
```

### Checklist

- [ ] Add `onTodayButtonClick` prop (default is `undefined`)
- [ ] Add unit test
- [ ] Update API docs
- [ ] Update today button example

Pull request:
Add onTodayButtonClick prop
Close #529 

Patch:
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5cf19ca2e..afafab61d 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,11 @@
+## Next version
+
+_The following changes are not released yet, but are on the master branch and will released soon._
+
+**New features**
+
+* Added [`onTodayButtonClick`](http://react-day-picker.js.org/api/DayPicker#onTodayButtonClick) prop ([#529](https://github.com/gpbl/react-day-picker/issues/529))
+
 ## [v6.2.0](https://github.com/gpbl/react-day-picker/tree/v6.2.0) (2017-10-05)
 
 * Add TypeScript definitions for DayPickerInput ([#487](https://github.com/gpbl/react-day-picker/issues/487) by [adidahiya](https://github.com/adidahiya) and [lpcarignan](https://github.com/lpcarignan))
diff --git a/docs/package.json b/docs/package.json
index 6390923f1..e6d2cdfa0 100644
--- a/docs/package.json
+++ b/docs/package.json
@@ -22,8 +22,8 @@
     "prismjs": "1.8.1",
     "prop-types": "15.6.0",
     "react": "16.0.0",
-    "react-day-picker": "6.2.1",
+    "react-day-picker": "../",
     "react-helmet": "5.2.0",
     "react-markdown": "3.0.0-rc3"
   }
-}
\ No newline at end of file
+}
diff --git a/docs/src/code-samples/examples/customization-today-button.js b/docs/src/code-samples/examples/customization-today-button.js
index 315c7485d..d7603d83c 100644
--- a/docs/src/code-samples/examples/customization-today-button.js
+++ b/docs/src/code-samples/examples/customization-today-button.js
@@ -3,5 +3,14 @@ import DayPicker from 'react-day-picker';
 import 'react-day-picker/lib/style.css';
 
 export default function Example() {
-  return <DayPicker month={new Date(2017, 4, 5)} todayButton="Go to Today" />;
+  return (
+    <DayPicker
+      month={new Date(2017, 4, 5)}
+      todayButton="Go to Today"
+      modifiers={{
+        foo: new Date(),
+      }}
+      onTodayButtonClick={(day, modifiers) => console.log(day, modifiers)}
+    />
+  );
 }
diff --git a/docs/src/pages/api/DayPicker.js b/docs/src/pages/api/DayPicker.js
index 29f939219..ff1dd52a8 100644
--- a/docs/src/pages/api/DayPicker.js
+++ b/docs/src/pages/api/DayPicker.js
@@ -76,7 +76,8 @@ export default () => (
       <a href="#onDayTouchEnd">onDayTouchEnd</a>,{' '}
       <a href="#onDayTouchStart">onDayTouchStart</a>,{' '}
       <a href="#onFocus">onFocus</a>, <a href="#onKeyDown">onKeyDown</a>,{' '}
-      <a href="#onMonthChange">onMonthChange</a>
+      <a href="#onMonthChange">onMonthChange</a>,{' '}
+      <a href="#onTodayButtonClick">onTodayButtonClick</a>
     </p>
 
     <h4>Public Methods</h4>
@@ -632,6 +633,18 @@ export default () => (
         <a href="#showWeekNumbers">showWeekNumbers</a> is set to{' '}
         <code>true</code>).
       </p>
+      <h3>
+        <Anchor id="onTodayButtonClick" />
+        onTodayButtonClick{' '}
+        <code>
+          (day: Date, modifiers: Array&lt;String&gt;, e: SyntheticEvent) ⇒
+          undefined
+        </code>
+      </h3>
+      <p>
+        Event hander when the user clicks on the today button (when{' '}
+        <a href="#todayButton">todayButton</a> is set).
+      </p>
       <hr />
       <h2 id="components-methods">Public Methods</h2>
       <h3>
diff --git a/docs/yarn.lock b/docs/yarn.lock
index 7c979bb2a..b8cae121e 100644
--- a/docs/yarn.lock
+++ b/docs/yarn.lock
@@ -6388,9 +6388,8 @@ rc@^1.0.1, rc@^1.1.6, rc@^1.1.7:
     minimist "^1.2.0"
     strip-json-comments "~2.0.1"
 
-react-day-picker@6.2.1:
+react-day-picker@../:
   version "6.2.1"
-  resolved "https://registry.yarnpkg.com/react-day-picker/-/react-day-picker-6.2.1.tgz#fc22b809db792386d1468d3f46d725ad91e04db9"
   dependencies:
     object-assign "^4.1.1"
     prop-types "^15.6.0"
diff --git a/src/DayPicker.js b/src/DayPicker.js
index f02a20195..6fbc5121d 100644
--- a/src/DayPicker.js
+++ b/src/DayPicker.js
@@ -9,6 +9,7 @@ import Weekday from './Weekday';
 import * as Helpers from './Helpers';
 import * as DateUtils from './DateUtils';
 import * as LocaleUtils from './LocaleUtils';
+import * as ModifiersUtils from './ModifiersUtils';
 import classNames from './classNames';
 
 import { ENTER, SPACE, LEFT, UP, DOWN, RIGHT } from './keys';
@@ -122,6 +123,7 @@ export default class DayPicker extends Component {
     onMonthChange: PropTypes.func,
     onCaptionClick: PropTypes.func,
     onWeekClick: PropTypes.func,
+    onTodayButtonClick: PropTypes.func,
   };
 
   static defaultProps = {
@@ -424,8 +426,18 @@ export default class DayPicker extends Component {
   }
 
   handleTodayButtonClick = e => {
-    this.showMonth(new Date());
+    const today = new Date();
+    const month = new Date(today.getFullYear(), today.getMonth());
+    this.showMonth(month);
     e.target.blur();
+    if (this.props.onTodayButtonClick) {
+      e.persist();
+      this.props.onTodayButtonClick(
+        new Date(today.getFullYear(), today.getMonth(), today.getDate()),
+        ModifiersUtils.getModifiersForDay(today, this.props.modifiers),
+        e
+      );
+    }
   };
 
   renderNavbar() {


Test patch:
diff --git a/test/daypicker/events.js b/test/daypicker/events.js
index 67c917ca9..df70c797f 100644
--- a/test/daypicker/events.js
+++ b/test/daypicker/events.js
@@ -282,6 +282,25 @@ describe('DayPicker’s events handlers', () => {
       formatMonthTitle(new Date())
     );
   });
+  it('should call `onTodayButtonClick` when clicking the today button', () => {
+    const onTodayButtonClick = jest.fn();
+    const today = new Date();
+    const wrapper = mount(
+      <DayPicker
+        todayButton="Today"
+        modifiers={{ foo: today }}
+        initialMonth={new Date(2015, 1)}
+        onTodayButtonClick={onTodayButtonClick}
+      />
+    );
+    wrapper.find('button.DayPicker-TodayButton').simulate('click');
+    expect(onTodayButtonClick).toHaveBeenCalled();
+    const receivedDate = onTodayButtonClick.mock.calls[0][0];
+    expect(receivedDate.getDate()).toBe(today.getDate());
+    expect(receivedDate.getFullYear()).toBe(today.getFullYear());
+    expect(receivedDate.getMonth()).toBe(today.getMonth());
+    expect(onTodayButtonClick.mock.calls[0][1]).toEqual(['foo']);
+  });
   it('should call `onWeekClick` when clicking on a week number', () => {
     const handleWeekClick = jest.fn();
     const wrapper = mount(