Mobile Date Picker Doesn't Open on first Click

I’m experiencing an issue with various settings on the latest iOS with the portal and without the portal. In which a prompt on the device appears either via a Done or an X as shown here:

The user has to click done in order for the prompt to pop up. This is only an issue on iOS devices and not on android phones.

      <SingleDatePicker
        {...this.props}
        id="date_input"
        date={date}
        numberOfMonths={months}
        placeholder="00/00/00"
        focused={focused}
        onDateChange={this.onDateChange}
        onFocusChange={this.onFocusChange}
      />

      <SingleDatePicker
        {...this.props}
        id="date_input"
        date={date}
        withFullScreenPortal={true}
        withPortal={true}
        numberOfMonths={months}
        placeholder="00/00/00"
        focused={focused}
        onDateChange={this.onDateChange}
        onFocusChange={this.onFocusChange}
      />

[NickTiut]

Any news on this? Anything I can do to help? An ugly workaround I’m using for this is to blur the input on focus: onFocusChange={(focused) => { $('.DateInput__input').blur(); self.setState({ focusedInput: focused }); }} It flashes the done bar on the bottom for a sec, and then the datepicker appears.

[StefanoPastore]

I found this approach:

let placeholder = document.createElement('div');
let isSupportedTouch = 'ontouchend' in placeholder;
// cross-browser check
if (!isSupportedTouch) {
  placeholder.setAttribute('ontouchend', 'return;');
  isSupportedTouch = typeof placeholder.ontouchend === 'function';
}
const event = isSupportedTouch ? 'touchstart' : 'click';
placeholder = null;

What do you think?