End key ignores calendarStartDay for non-Sunday weeks
Describe the bug
When calendarStartDay is set to a value other than 0, keyboard navigation with the Home and End keys uses inconsistent week boundaries.
For example, with calendarStartDay={1}:
Homecorrectly moves focus to Monday, the first day of the week.Endincorrectly moves focus to Saturday.Endshould move focus to Sunday, the last day of a Monday–Sunday week.
This occurs because the Home handler passes locale and calendarStartDay to getStartOfWeek, while the End handler calls getEndOfWeek without either value.
To Reproduce
import {useState} from 'react';
import DatePicker from 'react-datepicker';
import 'react-datepicker/dist/react-datepicker.css';
export default function App() {
const [selected, setSelected] = useState<Date | null>(
new Date(2024, 5, 12)
);
return (
<DatePicker
inline
selected={selected}
onChange={setSelected}
calendarStartDay={1}
/>
);
}- Focus Wednesday, June 12, 2024.
- Press
Home. - Focus moves to Monday, June 10, which is correct.
- Focus Wednesday, June 12 again.
- Press
End. - Focus moves to Saturday, June 15.
Expected behavior
With calendarStartDay={1}, pressing End should move focus to Sunday, June 16—the last day of the configured Monday–Sunday week.
Home and End should calculate their destinations using the same locale and calendarStartDay configuration.
Screenshots
Not applicable.
Desktop (please complete the following information):
- OS: macOS Tahoe 26.6.2
- Browser: Chrome
- Version: 152
Smartphone (please complete the following information):
Not applicable.
Additional context
react-datepicker: 9.1.0- Related issue: https://github.com/Hacker0x01/react-datepicker/issues/4420
- Home/End navigation was implemented in: https://github.com/Hacker0x01/react-datepicker/pull/4430
- The current implementation calls:
getStartOfWeek(date, locale, calendarStartDay)for HomegetEndOfWeek(date)for End
Source: Hacker0x01/react-datepicker