Current focus can be lost if next or previous month buttons become disabled

[mrdaniellewis]

To reproduce

import { DayPicker } from "react-day-picker";
import "react-day-picker/style.css";

export default function App() {
  return (
    mode="single"
    disabled={{ after: new Date() }}
    endMonth={new Date()}
  );
}

CodeSandbox: https://codesandbox.io/p/sandbox/daypicker-bug-report-forked-cff2m5?workspaceId=ws_RGtEKXawCzJL1meZNuGGuQ

Using the keyboard:

1. tab to the previous month button
2. click
3. tab to the next month button
4. click

Actual Behaviour

The next month button becomes disabled and focus is lost.

Expected Behaviour

Something should be focused. I'm not 100% sure the correct pattern:

Option 1: Do not disable the button, mark with aria-disabled="true", and tabIndex={-1} to take it out of tab order. The button will remain focused, but will act as disabled.
Option 2: Focus something nearby, eg the other month navigation button.

https://adrianroselli.com/2023/08/where-to-put-focus-when-deleting-a-thing.html

I'm not sure how much of an issue this is. I believe it is an issue and it can cause screen-readers to move the current focus to the body throwing the user to the top of the page. However, I'm not completely sure this is that catastrophic an issue with the latest browsers and screen-readers.