react-day-picker - npm Package Versions

v5.3.0

Release Date: 2017-04-25

• Include Typescript Type Definitions (#303)
• Added: a new modifiersStyles prop to add inline style to the days matching the given modifiers (see example).
• Added: isDayBefore, isDayAfter functions to DateUtils.

Bug fixes

• Functions were not considered in arrays of modifiers (#301)
• Fixes possible issues when comparing days with different timezones (#307)

v5.2.3

Release date: 2017-04-14

• Fixed PropTypes warnings in React 15.5.

v5.2.0

Release Date: 2017-03-09

• Allow overriding today modifier (#279 by maxdubrinsky)

• Pass React Components to navBarElement, captionElement, weekdayElement (#280 by cwmoo740)

• Fixed aria roles for weekdays and months HTML elements (#276 by oigewan)

v5.1.2

Release date: 2017-03-03

• Fixed: an issue with keyboard navigation when using classNames prop (#269 by oigewan, #275)
• Fixed: installation issue with bower

v5.1.1

Release Date: 2017-03-03

• New classNames prop (#264).

  Use this prop to change the CSS class names or add support for CSS modules (#73, see this example).

• New month prop (#263).

  This differs from the initialMonth props as it causes the calendar to re-render when its value changes.

• Added: aria-label attributes to the navigation bar with the new labels prop (#258).

v5.0.0

_Release Date: 2017-02-14

This release focuses on improving perfomance and the component's api-daypicker.

• New modifiers value types (#254)

  Use dates, arrays, or ranges as modifier types, not just functions:

  <DayPicker
  -     selectedDays={ day => DateUtils.isSameDay(day, this.state.selectedDay)}
  +     selectedDays={ this.state.selectedDay }
  />
  

  Read more in the modifiers documentation.

• Breaking change Event handlers signature has changed (#256)

  All events handlers like onDayClick, onCaptionClick, etc. now receive the Syntethic Event as last argument. Thus you must change your event handlers as follow:

  onDayClick={
  - (e, day, modifiers) => {
  + (day, modifiers, e)
      e.preventDefault();
      console.log(day);
      console.log(modifiers);
    }
  }
  

• Breaking change Use containerProps to pass props to the container div element. Before, any prop was passed to the container element degrading performance (#255):

  <DayPicker
  -    data-thing="foo"
  +    containerProps={ 'data-thing': 'foo' }
  />
  

v4.0.0

_Release Date: 2017-02-10

• Pass the day's modifiers to the renderDay prop function (#237)

• Breaking change Updating initialMonth will not show anymore a different month after the first mount (#169)

  If you need the calendar to display a different month, use the month prop.

• Breaking change Use lang HTML attribute instead of a specific CSS class name.

  This change may break your style or layout if you are styling the component according to the current locale. If this is the case, change your CSS to use the lang attribute selector. For examples, if you are styling the calendar for the de locale:

  - .DayPicker--de {
  + .DayPicker[lang="de"] {
    background: yellow;
  }