react-datepicker
react-datepicker copied to clipboard
initialVisibleMonth ignored when startDate and endDate are set
@datepicker-react/hooks or @datepicker-react/styled version e.g. @datepicker-react/[email protected]
Describe the bug
When passing in a startDate and endDate parameter to the in addition to a initialVisibleMonth useDatePicker hook, the initialVisibleMonth is ignored, and the the initialVisibleMonth defaults to the startDate
Source code (including props configuration) Steps to reproduce the behavior:
const [state, setState] = useState({
startDate: new Date(2020, 1, 1),
endDate: new Date(2022, 1, 1),
focusedInput: START_DATE
});
const {
firstDayOfWeek,
activeMonths,
isDateSelected,
isDateHovered,
isFirstOrLastSelectedDate,
isDateBlocked,
isDateFocused,
onDateHover,
onDateSelect,
onDateFocus,
goToPreviousMonths,
goToNextMonths
} = useDatepicker({
startDate: state.startDate,
endDate: state.endDate,
focusedInput: state.focusedInput,
onDatesChange: handleDateChange,
initialVisibleMonth: new Date(2022, 1, 1),
numberOfMonths: 2
});
function handleDateChange(data) {
if (!data.focusedInput) {
setState({ ...data, focusedInput: START_DATE });
} else {
setState(data);
}
}
Screenshots/Gifs
If applicable, add screenshots or gifs to help explain your problem.
initialVisibleMonth param respected:

initialVisibleMonth ignored, view is set to startDate:

Desktop (please complete the following information): N/A
Smartphone (please complete the following information): N/A
Is the issue reproducible in Storybook? Unknown - netlify link returns a 404
Additional context Add any other context about the problem here. It is an edge case where the datepicker is pre-filled with a range over 2 months.
I have been using this as a workaround
React.useEffect(() => goToDate(endDate, [goToDate]);
as a workaround to go to the current date