How to show selected days in day picker?

It looks like the supported way to select a day in the DayPicker is to define modifiers and change the class of the day element. When I say select a day, I mean show the day is selected in the user interface by force (in the event that we are showing edit time, we have a previously set time) or when the user is actually interacting with the DayPicker. This seems slow / inefficient because the date comparison code in the modifiers method needs to be run for each day and it looks like regardless of number of months showing, it renders 90 days (maybe the month before and month after)? So that’s 90 comparisons every time a day is tapped, a month is changed, or we forcefully set the selected date and re-render the component to reflect that. Maybe it’s just a documentation issue. Is there a better way?

Right now I do something like…

  dayClick = (date) => {
    this.setState({selectedDay: date});
  }
...
<DayPicker
  id="date_input"
  numberOfMonths={1}
  onDayClick={this.dayClick}
  modifiers={{selected: (day) => 
    day.isSame(this.state.selectedDay, 'd')}}
/>

The SingleDatePicker has a date prop for selected date but it doesn’t look like the DayPicker does.

[alpjor]

It looks to me like the modifiers that are currently passed into <DayPicker are getting lost in here: https://github.com/airbnb/react-dates/blob/master/src/components/CalendarMonthGrid.jsx#L223 and again here: https://github.com/airbnb/react-dates/blob/master/src/components/CalendarMonth.jsx#L142

why would we need to pass modifiers that are scoped to a month name?

[majapw]

So sorry for the delayed response. 😢 I definitely just missed some issues when things got crazy at work, and this was one of them, unfortunately. Thanks for responding anyways!