React Date Range Picker issue - not focusing on input field while date range picker is open on first click

41 views Asked by At

I am using react-DateRangePicker, and using input field with this and when clicking on input it's opening that date range, but it's not focusing on input field while date range picker is open. Behavior I want is this: when I click on input it opens that date range picker but also focuses on that input so I can manually add date also.

<input
   ref={dateRangePickerInput}
   value={value}
   onChange={handleCustomDate}
   className='form-control fc-xs rounded'
   onClick={show}
/>
<Menu
    className='calender-menu'
    anchorEl={position}
    open={openRangePicker}
    onClose={hide}
    MenuListProps={{
        'aria-labelledby': 'basic-button',
    }}
>
   <DateRangePicker
       onChange={item => handleChange([item.selection], dateType)}
       editableDateInputs={true}
       moveRangeOnFirstSelection={false}
       ranges={range}
       months={2}
       direction="horizontal"
       todayButton="Today"
       autoFocus={true}
   />
</Menu>
0

There are 0 answers