npm · #1626 most downloaded on npm

react-day-picker

10.0.1149M downloads/mogpbl/react-day-picker ↗New releases in your daily digest, changelog included.

Customizable Date Picker for React

Last release 4 months ago
15 May 2026
Ships fairly regularly
a new release about every 3 weeks
Nearly every release is documented
notes for 59 of the last 60 stable releases
1 version withdrawn
withdrawn after publishing
12 years old
292 releases · first in 2014

Release timeline

292 releases since 2014

20142016201820202022

Releases

2.0.224 May 2016
Fixed a bug when canChangeMonth is set to true (#168).
Release date: 2016-05-24

Fixed a bug when canChangeMonth is set to true (#168).

Open source →
2.0.115 May 2016
_Release date: 2016-05-15_ Fix npm release.
Release date: 2016-05-15

Fix npm release.

Open source →
2.0.014 Apr 2016Breaking

One column per quarter.

This release mainly improves the component’s API (thus some breaking changes) and add some new props.

Release Date: 2016-05-15

This release mainly improves the component’s API (thus some breaking changes) and add some new props.

Code has been split in multiple components and tests have been rewritten with enzyme. It should be easier to add and test the upcoming new features!

Thanks everyone for the support and for the help on making this component better 🤗 If you have issues or suggestions, don't forget the Gitter room!

Breaking changes

The onDay* event handlers receive as third argument an object of modifiers instead of an array.

This mean that if you where writing:

onDayClick(e, day, modifiers) {
  if (modifiers.indexOf('selected') > -1) {
    console.log('This day is selected')
  }
}

you must now write:

onDayClick(e, day, modifiers) {
  if (modifiers.selected === true) {
    console.log('This day is selected')
  }
}

or better:

onDayClick(e, day, { selected }) {
  if (selected) {
    console.log('This day is selected')
  }
}

Removed onDayTouchTap. Use onDayClick instead. If you need more granularity over touch events, you can use the new onDayTouchStart and onDayTouchEnd props. See #153 for more details.
Fixed import with CommonJS modules (#136).

This affects code using require('react-day-picker').default or similar syntax, which was required for v1.3.0. Now you can require('react-day-picker') as usual, i.e. without specifying default. If you are using ES2015 modules import DayPicker from 'react-day-picker', this change shouldn't affect you.

New formatDay function in LocaleUtils.

If you are using your custom LocaleUtils to localize the calendar, you need to implement this function as well, which is required to format the newly added #132 (see the documentation for an example). If you are localizing using moment, this change shouldn't affect you.

New props

New disabledDays and selectedDays props. They receive a function (day) => Bool as value to easily define which day should have the selected or disabled modifiers. See #34 for more details.

So if you were writing something like:

<DayPicker
  modifiers={
    ({ selected: (day) => isDaySelected(day) },
    { disabled: (day) => isDayDisabled(day) })
  }
/>

now you can write:

<DayPicker
  selectedDays={(day) => isDaySelected(day)}
  disabledDays={(day) => isDayDisabled(day)}
/>

Added reverseMonths prop to render the most recent month first. (#141 by @sonrtomas
Added onDayKeyDown, onDayTouchStart, onDayTouchEnd props.

Improvements

Navigate between weeks or years using left/right or up/down arrow keys (#132 by limscoder)
Added various aria-* attributes (#132 by limscoder)

Bug fixes

Navigation with keyboard when using fromMonth or endMonth