Hacker0x01 / react-datepicker

A simple and reusable datepicker component for React
https://reactdatepicker.com/
MIT License
8.09k stars 2.24k forks source link

Unable To Select Date With Arrow Keys #5136

Open vinaysharma14 opened 4 weeks ago

vinaysharma14 commented 4 weeks ago

Describe the bug Date receiving a pseudo focus (actual focus stays on the selected date) while navigating with arrow keys doesn't get selected.

To Reproduce

Date selection doesn't change with arrow keys:

https://github.com/user-attachments/assets/9df2a492-40fc-46ff-b18b-924e48d7b9e8

Fixing the above issue would also fix the below issue where keyboard selection styles are absent for selected date:

https://github.com/user-attachments/assets/97a51e23-af87-4b0e-b224-b1d0bdd2a767

Expected behavior

A new prop should be introduced which should select date with arrow keys similar to native date input:

https://github.com/user-attachments/assets/77d1f204-5545-425c-a91e-c179ef7f072f

Desktop (please complete the following information):

ahaws-govcio commented 3 weeks ago

👍 Although you can navigate with the arrow keys, for assistive technologies (i.e. screen readers) there is no announcement of the dates as you move within the calendar. For accessibility, the user doesn't know what is changing or what they are selecting.