react-modern-calendar-datepicker icon indicating copy to clipboard operation
react-modern-calendar-datepicker copied to clipboard

Disable Auto Close when clicked on date?

Open Ugikie opened this issue 3 years ago • 0 comments

I have searched the docs everywhere for this and hopefully I didn't miss it and am wasting everyone's time with this issue, but I am wondering if there is a way to prevent the calendar from automatically closing once a date is selected. Here is my component so you can see what type of datepicker/calendar I am using...

<DatePicker
    value={selectedDay}
    onChange={setSelectedDay}
    renderInput={renderCustomInput} // render a custom input
    shouldHighlightWeekends
/>

Edit: Looking through the code it looks like this can be done fairly easily? Maybe just add an optional prop to the base calendar/datepicker component called autoCloseOnDateSelected or something and then just use that parameter to adjust the logic here:

const handleCalendarChange = newValue => {
    const valueType = getValueType(value);
    onChange(newValue);
    if (valueType === TYPE_SINGLE_DATE) setCalendarVisiblity(false); //Add option here if they don't want it to close
    else if (valueType === TYPE_RANGE && newValue.from && newValue.to) setCalendarVisiblity(false);
  };

And then I'm sure you would just have to add another case for if they click out of the calendar to close it, or add a little X button...

Hopefully this is possible and if so, I would really make this component just that much better!

Ugikie avatar Mar 24 '21 20:03 Ugikie