gpbl / react-day-picker

DayPicker is a customizable date picker component for React. Add date pickers, calendars, and date inputs to your web applications.

Home Page:https://daypicker.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Bug: With numberOfMonths >= 2 and, when tabbing from the `Prev` navigation button, it goes to the calendar instead of the `Next` navigation button

euljr opened this issue Β· comments

Bug description

Hello πŸ‘‹

I found a weird behavior when tabbing through elements when there are multiple months, when tabbing from one navigation button, it doesn't focus on the next navigation button, instead, the focus goes to the calendar.

I guess this happens because the captions are inside each month container πŸ€”.

I'll get some time to learn the codebase, in case there isn't a fix before, I'll see if I can help with something other than opening this issue πŸ˜„

To reproduce

Fork this CodeSandbox: https://codesandbox.io/s/intelligent-sunset-z6ypid with the code to reproduce the issue.

Steps

  1. Focus Prev navigation button (<)
  2. Press Tab
  3. The focus is now on the calendar, and not the caption navigation

Expected behavior

When focused on the Prev navigation button, it should focus on the Next navigation button after pressing Tab.

Screenshots

output

@euljr Thanks for the bug report. Will work on it!