Click outside day of month then React DatePicker auto close, can't not select end date?

[ThangDoanSpiderBox]

Describe the bug React DatePicker - Click outside day of month and calendar auto close, can't not select end date?

When i clicked April 30 then React DatePicker auto close. And I not choose end date.

But when I click May 1 or any day of May i't work well.

I try shouldCloseOnSelect={false} but not work.

To Reproduce

This is my code

export const DateRangePicker= ({ fromDate, toDate, onDatesChange }: DateRangePickerProps) => {
  const [startDate, setStartDate] = useState(fromDate)
  const [endDate, setEndDate] = useState(toDate)

  const clearDates = () => {
    setStartDate(null)
    setEndDate(null)
    onDatesChange(null, null)
  }

  // eslint-disable-next-line react/display-name
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  const FilterDateButton: FC = forwardRef<any, any>(({ value, onClick }, ref) => (
    <div
      className='flex justify-between items-center border rounded-lg p-2 shadow-sm mt-1_5 filter-date-button w-full'
      onClick={onClick}
      ref={ref}
    >
      <div
        className={clsx({
          'text-gray-400': !startDate && !endDate,
          'text-gray-900': startDate && endDate,
        })}
      >
        {value || 'DD/MM/YYYY'}
      </div>

      <div className='flex items-center gap-x-2'>
        {startDate && endDate && (
          <X
            className='cursor-pointer'
            size={20}
            onClick={event => {
              event.stopPropagation()
              clearDates()
            }}
          />
        )}

        <Calendar className='cursor-pointer' size={20} />
      </div>
    </div>
  ))

  const handleChangedDateRange = (dates: [Date | null, Date | null], event: SyntheticEvent) => {
    event.stopPropagation()
    event.preventDefault()

    const [start, end] = dates
    setStartDate(start)
    setEndDate(end)

    if (start && end) {
      onDatesChange(start, end)
    }
  }

  return (
    <div className='custom-date-picker'>
      <DatePicker
        dateFormat='dd/MM/YYYY'
        onChange={(dates: [Date | null, Date | null], event: SyntheticEvent) => handleChangedDateRange(dates, event)}
        startDate={startDate}
        endDate={endDate}
        maxDate={new Date()}
        selectsRange
        useWeekdaysShort
        popperPlacement='bottom-start'
        customInput={<FilterDateButton />}
        renderCustomHeader={({ monthDate, decreaseMonth, increaseMonth }) => (
          <div className='flex justify-between items-center bg-white p-2'>
            <ChevronLeft strokeWidth={2} size={20} className='gray-900 cursor-pointer' onClick={decreaseMonth} />
            <span className='text-base font-medium'>{isoToFormat(monthDate.toISOString(), 'MMM yyyy')}</span>
            <ChevronRight strokeWidth={2} size={20} className='gray-900 cursor-pointer' onClick={increaseMonth} />
          </div>
        )}
      />
    </div>
  )
}

Expected behavior I want when click day outside month panel still open to select end date.

Thank team 🧡