jungsoft / materialui-daterange-picker

A react date range picker implementation using @material-ui.
MIT License
70 stars 79 forks source link

Range error when selectedRange smaller or larger than validatedRange #18

Open RonaldCY opened 3 years ago

RonaldCY commented 3 years ago

e.g.

(args: DateRangePickerWrapperProps) => {
  const initialDateRange = {
    startDate: addDays(new Date(), -3),
    endDate: addDays(new Date(), 3),
  }

  const definedRanges = [{
    label: "Default",
    startDate: addDays(new Date(), -3),
    endDate: addDays(new Date(), 3),
  }, {
    label: "Start of Month",
    startDate: startOfMonth(new Date()),
    endDate: addDays(startOfMonth(new Date()), 2),
  }, {
    label: "End of Month",
    startDate: addDays(endOfMonth(new Date()), -2),
    endDate: endOfMonth(new Date()),
  }]
  const  minDate = addDays(new Date(), -2);
  const maxDate = addDays(new Date(), 2);

  return (
    <DateRangePicker
      {...args}
      onChange={(r) => console.log(r)}
      initialDateRange={initialDateRange}
      definedRanges={definedRanges}
      minDate={minDate}
      maxDate={maxDate}
    />
  );
}

when I changed the minDate and maxDate validated out of range of the defined range, the range error will be come out

suggested sol on DateRangePicker.tsx @ ftn of setDateRangeValidated:

...
    if (newStart && newEnd && (newEnd >= minDateValid && newStart <= maxDateValid)) {
      if (newEnd >= minDateValid)
        range.startDate = newStart = max([newStart, minDateValid]);
      if (newStart <= maxDateValid)
        range.endDate = newEnd = min([newEnd, maxDateValid]);
...