Open vinaysharma14 opened 4 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.
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):