Auto-closing calendar when date set via custom button

[viveleroi]

I have a custom "Today" button in the "custom calendar container" component. It works fine but because it uses a setter function from our form and not anything with the datepicker itself, the calendar doesn't close when the date is selected. How can I implement this?

I see an open prop that I guess I can use but that means I need to manage the state myself and I'd rather not have to do that. Is there any other approach?

const CalendarWrap = ({
  setDate,
  showAsUtc
}: CalendarWrapProps): ((props: CalendarContainerProps) => JSX.Element) => {
  const Wrap = ({ children }: CalendarContainerProps): JSX.Element => (
    <CalendarContainer>
      {children}
      <footer className={styles.calendarFooter}>
        <Button
          text='Today'
          uiVariant='accentPrimary'
          onClick={(): void => {
            setDate(new Date())
          }}
        />
        <Button
          text='Clear'
          uiVariant='primary'
          onClick={(): void => {
            setDate(null)
          }}
        />
      </footer>
    </CalendarContainer>
  )

  return Wrap
}


<DatePicker
  calendarContainer={CalendarWrap({ setDate: onChangeHandler })}
  ...
/>