React-datepicker: Close calendar from customInput

[xrado]

I'm using custom input to enable form submit on enter, but input calendar stays open.
Is there a way to close it?

[alex-shamshurin]

+1
This is another reason why we need isOpen property

[rafeememon]

More discussion about an isOpen prop on #283 and #531

[danilvalov]

I use the following solution:

closeDatePicker() {
  const {datepicker} = this.refs;

  datepicker.setOpen(false);
}

render() {
   return (
      <div>
        <DateInput
          ref="datepicker"
          {...options}
        />
      </div>
    );
}

[Tautorn]

I'm use a footer button to close my calendar, like this:

const [myRef, setMyRef] = useState(false)

const closeCalendar = () => {
  myRef.setOpen(false)
}

return (
  <DatePicker
      ref={(r) => {
        setMyRef(r)
      }} 
     {...props}
  >
    <button onClick={closeCalendar}>Close</button>
  </DatePicker>
)

[matviishyn]

Solution with hooks

let datepickerRef = useRef(null);

  const openDatepicker = () => {
    datepickerRef.setOpen(true);
  };

 <DatePicker
        ref={(r) => datepickerRef = r}
        {...props}
/>

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.