React-dates: Add custom modifiers for DayPickerRangeController and DayPickerSingleController

[yokomizor]

What do you think about custom modifiers for DayPickerRangeController and DayPickerSingleController?

Using these controllers we can highlight a day using isDayHighlighted. It works very well when we have a single case of hightlighted days.

I am wondering if there is an easy way to add a custom highlight for scenarios where you have more than one, eg.: Special days and Very special days.

Something like:

const myModifiers = {
  'important-event-but-not-a-highlight': day => this.props.importantEvent(day),
}

<DayPickerSingleController
  ...
  modifiers={myModifiers}
  />

Then we could use the .CalendarDay--important-event-but-not-a-highlight class to style this cell.

Do you think it would be useful? Is there another way to highlight a day other than isDayHighlighted?

Cheers!

[liahwallace1]

I need this to add half day styling to checkin/checkout days.

[mitko993]

I would find it useful if we could define acceptable modifiers for the controller, just as in the example above and then in renderCalendarDay() i could simply just set which modifiers i want for the rendering CalendarDay. Currently any custom modifiers are simply not applied.

[yokomizor]

Apparently this proposal was not very popular, so I am closing it. I no longer use react-dates and now I feel out of context.