showMonthYearDropdown read view not reachable via Tab / keyboard
Describe the bug
When showMonthYearDropdown is enabled, the combined month/year read-view toggle is rendered as a plain <div onClick> in MonthYearDropdown.renderReadView (src/month_year_dropdown.tsx), unlike MonthDropdown and YearDropdown, which render their read-view toggles as <button type="button">. Because it's a <div>, the element is not part of the natural tab order and does not respond to Enter/Space, making it unreachable and unusable via keyboard alone.
To Reproduce Steps to reproduce the behavior:
- Render a
DatePickerwithshowMonthYearDropdownenabled. - Open the calendar and try to reach the month/year read-view toggle using only the
Tabkey. - Notice the toggle is skipped in the tab order.
- Even with focus forced onto it, pressing
EnterorSpacedoes not open the dropdown.
Expected behavior
The month/year read-view toggle should be focusable via Tab and should open the dropdown when activated with Enter or Space, consistent with the standalone MonthDropdown and YearDropdown read views.
Screenshots https://github.com/user-attachments/assets/1f183a00-25be-4e65-bbc3-da3a61514c1f
Suggested fix
Change the <div> in renderReadView to a <button type="button">. The shared CSS for all three *-read-view classes (src/stylesheets/datepicker.scss:606-632) already covers this, so no style changes are needed.
Source: Hacker0x01/react-datepicker