Outside days still show.

[bvelasquez]

Describe the bug
When showOutsideDays is false, outside days still display when using modifierStyles.

<DayPicker
    numberOfMonths={3}
    showOutsideDays={false}
    enableOutsideDaysClick={false}
    disabledDays={{ after: new Date() }}
    selectedDays={selectedDay}
    modifiers={calendarModifiers}
    modifiersStyles={modifierStyles}
    initialMonth={moment().subtract(2, "months").toDate()}
    onDayClick={(day, modifiers = {}) => {
      //
      if (modifiers.disabled) {
        return;
      }
      setSelectedDay(day);
    }}
  />

To Reproduce

1. Set showOutsideDays to false.
2. Pass modifierStyles, selecting dates that cross over two months.
3. The modiferStyles will show up on outside days.

Expected behavior
Nothing should show up when outside days is disabled.

Screenshots
If applicable, add screenshots to help explain your problem.

Code sandbox example of problem: https://codesandbox.io/s/react-day-picker-examples-selected-forked-0ypgp?file=/example.js

Additional context
Add any other context about the problem here.

[gpbl]

Yeah i think you need to target those with some :not(.outside)...

[cgrochowina]

@bvelasquez hi, ive faced same issue. Overiding modifiers styles with 'outside' key name worked for me.

example:

modifiersStyles: {
customDate: {
backgroundColor: 'red'
},
outside: {
backgroundColor: 'transparent'
}}

Hope it will work for you ;)