When displaying 2 months and having an embedded calendar, the months shift when the user selects the second calendar

[diasqazaqbro]

Describe the bug
When selecting a start date from the second calendar in a multi-month react-datepicker component, the selected month of the second calendar automatically shifts to the next month, and the focus switches back to the first calendar.

To Reproduce
Steps to reproduce the behavior:

Use the react-datepicker component with monthsShown={2} and selectsRange={true}.
Open the date picker and select a start date from the second calendar.
Observe that the second calendar shifts its displayed month, and the focus returns to the first calendar.

Expected behavior
The second calendar should remain in place, displaying the same month, and the focus should not switch to the first calendar. Both calendars should independently maintain their current view.

Screenshots

2024-12-11.17-38-54.mp4

Desktop:
OS: Macbook M2
Browser: Chrome

Additional context
This issue seems related to the focusSelectedMonth behavior, where selecting a range date causes the calendar to refocus and update its displayed month.
Using a workaround with focusSelectedMonth={false} and dynamically setting it to true using a timeout not resolve this problem

[diasqazaqbro]

"react-datepicker": "^4.8.0",

[ludotg]

Hi @diasqazaqbro !

Could you share your workaround here, please?

I think that the issue #5362 I opened yesterday is related.

[hj462]

Any update on this issue

[MobeenRashid]

@diasqazaqbro, we are facing the same issue. Were you able to fix it? Any workaround?