Hacker0x01
When displaying 2 months and having an embedded calendar, the months shift when the user selects the second calendar
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
https://github.com/user-attachments/assets/27321661-e2ab-436d-97c1-a9da29ade159
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
Hi @diasqazaqbro !
Could you share your workaround here, please?
I think that the issue #5362 I opened yesterday is related.
@diasqazaqbro, we are facing the same issue. Were you able to fix it? Any workaround?
Is this issue still reproducible? If yes can you please share a sample code snippet. I couldn't reproduce it
