When displaying 2 months and having an embedded calendar, the months shift when the user selects the second calendar #5275
Description
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