With 2 months shown and inline calendar, the months shift when range selected spans the 2 months

I have an inline calendar with 2 months shown. Whenever a user selects a date range that spans the 2 months, if the range is not in the same month, the left month slides out of view. As seen in the gif below, In order to view the full range, a user must select the back arrow to see the range again.

Here is my code

<DatePicker
  inline
  selected={this.state.startDate}
  startDate={this.state.startDate}
  endDate={this.state.endDate}
  onChange={this.handleDateSelect}
  monthsShown={2}
  shouldCloseOnSelect={false}
/>

I feel as if there should be a prop to enable / disable this.

[aij]

I don’t think the months were intended to shift when selecting a day. It seems like a buggy interaction between monthsShown and inline. (Normally, the date picker would close after selecting a date, so re-opening to the last selected date is fine/expected, but staying open and shifting is weird.)

[NoelBaron]

This is definitely not fixed… 2021 😆

Have you tried this? focusSelectedMonth={true}

@BeKnowDo this is actually fixed with focusSelectedMonth={false}. See gif.

<DatePicker 
  focusSelectedMonth={false}
  startDate={startDate}
  endDate={endDate}
  monthsShown={2}
  selectsRange
  inline
  disabledKeyboardNavigation // <-- active-day bug is still open
  onChange={(e) => {  setDateRange(e) }}
/>