diff --git a/src/Calendar.spec.tsx b/src/Calendar.spec.tsx
index 905e8d09..046ef755 100644
--- a/src/Calendar.spec.tsx
+++ b/src/Calendar.spec.tsx
@@ -707,6 +707,85 @@ describe('Calendar', () => {
expect(onActiveStartDateChange).not.toHaveBeenCalled();
});
+
+ it('returns to start of range when range is completed', () => {
+ const onActiveStartDateChange = vi.fn();
+
+ const initialRange = new Date(2017, 0, 10);
+
+ const { container } = render(
+ ,
+ );
+
+ const nextMonthButton = container.querySelector(
+ 'button.react-calendar__navigation__next-button',
+ ) as HTMLButtonElement;
+
+ act(() => {
+ nextMonthButton.click();
+ });
+ // Disregard the call on the above button click
+ onActiveStartDateChange.mockClear();
+
+ // First day not in the previous month
+ const firstDayTile = container.querySelector(
+ '.react-calendar__tile:not([react-calendar__month-view__days__day--weekend])',
+ ) as HTMLButtonElement;
+
+ act(() => {
+ firstDayTile.click();
+ });
+
+ expect(onActiveStartDateChange).toHaveBeenCalledWith(
+ expect.objectContaining({
+ action: 'onChange',
+ activeStartDate: new Date(2017, 0, 1),
+ view: 'month',
+ }),
+ );
+ });
+
+ it('does not change activeStartDate on range completion when goToRangeStartOnSelect is set to false', () => {
+ const onActiveStartDateChange = vi.fn();
+
+ const initialRange = new Date(2017, 0, 10);
+
+ const { container } = render(
+ ,
+ );
+
+ const nextMonthButton = container.querySelector(
+ 'button.react-calendar__navigation__next-button',
+ ) as HTMLButtonElement;
+
+ act(() => {
+ nextMonthButton.click();
+ });
+ // Disregard the call on the above button click
+ onActiveStartDateChange.mockClear();
+
+ // First day not in the previous month
+ const firstDayTile = container.querySelector(
+ '.react-calendar__tile:not([react-calendar__month-view__days__day--weekend])',
+ ) as HTMLButtonElement;
+
+ act(() => {
+ firstDayTile.click();
+ });
+
+ expect(onActiveStartDateChange).not.toHaveBeenCalled();
+ });
});
describe('handles view change properly', () => {
diff --git a/src/Calendar.tsx b/src/Calendar.tsx
index c7c5c435..8929eaf8 100644
--- a/src/Calendar.tsx
+++ b/src/Calendar.tsx
@@ -496,7 +496,7 @@ export default class Calendar extends Component {
this.setState(nextState, () => {
const args = {
action: nextState.action,
- activeStartDate: nextState.activeStartDate || this.activeStartDate,
+ activeStartDate: nextState.activeStartDate || prevArgs.activeStartDate,
value: ('value' in nextState && nextState.value) || this.value,
view: ('view' in nextState && nextState.view) || this.view,
};
@@ -691,7 +691,7 @@ export default class Calendar extends Component {
...(this.props as CalendarPropsWithDefaults),
value: nextValue,
})
- : null;
+ : this.activeStartDate;
event.persist();