I am having an issue utilizing the DayPicker
api for use of the pop-up calendar. I need to close/hide when I click outside the calendar. I want to work like the DayPickerInput
component work but with our the textbox input. I ONLY need the popup calendar. Using onBlur
only partially works because if I click a week, it does not immediately recognize the focus the calendar container. I am really struggling with this and I am sure there is a simple solution.
Here is code snippet:
<div className={calendarPopOut} onBlur={handleClickOutside}>
<DayPicker
disabledDays={currentCalendarWeek}
className={dayPicker}
showOutsideDays
month={currentSelectedMonth}
toMonth={currentMonth}
weekdayElement={<ThreeCharacterAbv />}
onDayClick={handleChange}
onBlur={handleClickOutside}
/>
</div>