React-calendar: showNeighboringMonth = false doesn't seem to work when coupled with showDoubleView

[LeoLozes]

First of all, thanks for the great component you've made!

I was doing some testing with these parameters, and the showNeighboringMonth parameter works as intended:

      <Calendar
        minDate={new Date()}
        selectRange={true}
        showNeighboringMonth={false}
        locale={"es"}
      />

However when coupling with showDoubleView, it doesn't seem to work:

      <Calendar
        minDate={new Date()}
        selectRange={true}
        showDoubleView={true}
        showNeighboringMonth={false}
        locale={"es"}
      />

Am I doing something wrong on my end?

Edit: found a workaround, by adding a css rule:

.react-calendar__month-view__days__day--neighboringMonth {
  display: none;
}

[lauterry]

Hi

I have the same issue as @LeoLozes

Thx for the workaround

[lauterry]

Hi

The documentation explains well why showNeighboringMonth = false doesn't seem to work when coupled with showDoubleView.

showDoubleView = true forces showFixedNumberOfWeeks = true which forces showNeighboringMonth = true

[LeoLozes]

You are right!
However I don't really see why this is enforced since the calendar seems to work fine with the css rule applied, and I think is what makes most sense. You don't really want to see the next month in the first calendar when you have just besides it.

I'd say is how most of the biggest websites work (and it's why I need it to be that way as well):

[lauterry]

Hi @LeoLozes

I'm totally agree with you.

Maybe the mainteners can explain why showNeighboringMonth is enforced to true when showDoubleView = true ?

Best regards !

[lauterry]

@LeoLozes

BTW, have you encountered the issue explained here https://github.com/wojtekmaj/react-calendar/issues/339 with the DoubleView Calendar ?

If so, how have you solved the pb ?

[lauterry]

Hi @LeoLozes

Your workaround is not totally right and caused this issue : https://github.com/wojtekmaj/react-calendar/issues/482

The correct workaround is :

.react-calendar__month-view__days__day--neighboringMonth {
  visibility: hidden;
}

Best regards