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>