diff --git a/src/DateRangePicker.spec.tsx b/src/DateRangePicker.spec.tsx
index 56c18efb..319bac70 100644
--- a/src/DateRangePicker.spec.tsx
+++ b/src/DateRangePicker.spec.tsx
@@ -666,7 +666,7 @@ describe('DateRangePicker', () => {
const onChange = vi.fn();
const valueFrom = new Date(2018, 0, 1);
const valueTo = new Date(2018, 6, 1);
- const value = [valueFrom, valueTo];
+ const value = [valueFrom, valueTo] as [Date, Date];
const { container } = render();
@@ -760,7 +760,7 @@ describe('DateRangePicker', () => {
const onChange = vi.fn();
const valueFrom = new Date(2018, 0, 1);
const valueTo = new Date(2018, 6, 1);
- const value = [valueFrom, valueTo];
+ const value = [valueFrom, valueTo] as [Date, Date];
const { container } = render();
diff --git a/src/DateRangePicker.tsx b/src/DateRangePicker.tsx
index ac9ecd90..6d1acc19 100644
--- a/src/DateRangePicker.tsx
+++ b/src/DateRangePicker.tsx
@@ -10,7 +10,7 @@ import DateInput from 'react-date-picker/dist/cjs/DateInput';
import { isMaxDate, isMinDate } from './shared/propTypes';
-import type { ClassName, Detail, LooseValue } from './shared/types';
+import type { ClassName, Detail, LooseValue, Value } from './shared/types';
const baseClassName = 'react-daterange-picker';
const outsideActionEvents = ['mousedown', 'focusin', 'touchstart'];
@@ -77,7 +77,7 @@ type DateRangePickerProps = {
nativeInputAriaLabel?: string;
onCalendarClose?: () => void;
onCalendarOpen?: () => void;
- onChange?: (value: Date | null | (Date | null)[]) => void;
+ onChange?: (value: Value) => void;
onFocus?: (event: React.FocusEvent) => void;
openCalendarOnFocus?: boolean;
portalContainer?: HTMLElement;
@@ -160,10 +160,7 @@ export default function DateRangePicker(props: DateRangePickerProps) {
}
}
- function onChange(
- value: Date | null | (Date | null)[],
- shouldCloseCalendar = shouldCloseCalendarProps,
- ) {
+ function onChange(value: Value, shouldCloseCalendar = shouldCloseCalendarProps) {
if (shouldCloseCalendar) {
closeCalendar();
}
@@ -173,7 +170,7 @@ export default function DateRangePicker(props: DateRangePickerProps) {
}
}
- function onChangeFrom(nextValue: Date | null | (Date | null)[], closeCalendar: boolean) {
+ function onChangeFrom(nextValue: Value, closeCalendar: boolean) {
const [nextValueFrom] = Array.isArray(nextValue) ? nextValue : [nextValue];
const [, valueTo] = Array.isArray(value) ? value : [value];
@@ -182,7 +179,7 @@ export default function DateRangePicker(props: DateRangePickerProps) {
onChange([nextValueFrom || null, valueToDate], closeCalendar);
}
- function onChangeTo(nextValue: Date | null | (Date | null)[], closeCalendar: boolean) {
+ function onChangeTo(nextValue: Value, closeCalendar: boolean) {
const [, nextValueTo] = Array.isArray(nextValue) ? nextValue : [null, nextValue];
const [valueFrom] = Array.isArray(value) ? value : [value];
diff --git a/src/shared/types.ts b/src/shared/types.ts
index 7b09b89d..2eead473 100644
--- a/src/shared/types.ts
+++ b/src/shared/types.ts
@@ -2,6 +2,12 @@ export type ClassName = string | null | undefined | (string | null | undefined)[
export type Detail = 'century' | 'decade' | 'year' | 'month';
-export type LooseValue = string | Date | null | (string | Date | null)[];
+type LooseValuePiece = string | Date | null;
+
+export type LooseValue = LooseValuePiece | [LooseValuePiece, LooseValuePiece];
export type RangeType = 'century' | 'decade' | 'year' | 'month' | 'day';
+
+type ValuePiece = Date | null;
+
+export type Value = ValuePiece | [ValuePiece, ValuePiece];