Datepicker onChange event type Error when selectsRange prop is true

[Lukaoxp]

Describe the bug Using a datepicker with selectsRange in TypeScript, the onChange event show a Type error as below: Type '(date: Date | null, event: SyntheticEvent<any, Event> | undefined) => void' is not assignable to type '(date: [Date | null, Date | null], event: SyntheticEvent<any, Event> | undefined) => void'.ts(2769)

Although in the ReactDatePickerProps from index.d.ts there is a typing for onChange, it seems to not be working correctly with the prop WithRange. onChange( date: WithRange extends false | undefined ? (WithMultiple extends false | undefined ? Date | null : Date[] | null) : [Date | null, Date | null], event: React.SyntheticEvent<any> | undefined, ): void;

To Reproduce Steps to reproduce the behavior:

1 - Create a datepicker that receives a onChange event with the props extending from ReactDatePickerProps. 2 - Add the onChange property to it 3 - Add the selectsRange property to it 4 - See the error.

Here is my code:

import DatePicker, { ReactDatePickerProps } from 'react-datepicker';

interface DatePickerProps extends ReactDatePickerProps {}

export const newDatePicker= (props: DatePickerProps ) => {
const {
    disabled,
    isClearable,
    onChange
  } = props;

<DatePicker
            isClearable={isClearable}
            selectsRange={true}
            onChange={onChange}
            monthsShown={2}
            selected={new Date()}
            startDate={new Date()}
            endDate={new Date()}
            customInput={<TextField />}
            fixedHeight
            dateFormat={'yyyy/MM/dd'}
          />
}

Expected behavior It should identify that the event is correctly typed.

Screenshots If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: [Windows 11]
• Browser [None]
• Version [6.2.0]

Additional context In this case I'm trying to use the component on a Form and pass the onChange as a prop. But didn't find a way to fix the typing error without messing with the "index.d.ts" file.

[mirus-ua]

The types for v 6.2.0 are managed by the external package. You can reopen the issue there or wait until v7

[yuki0410-dev]

@Lukaoxp (@mirus-ua ) v7 has been released, has the problem been resolved?

[Lukaoxp]

I still have to try v7. I have came with a workaround by not using the same interface for both datepicker and rangepicker.

I'll try and return with some feedaback