How to control the time of day in React Suite's DateRangePicker?

Question

I cannot for the life of me figure out how to default the time of day in DateRangePicker to 00:00:00 for start date and 23:59:59 for end date.

The time of day simply defaults to the current time on the computer, which, frankly, is rarely what the requirements for a date range are. So It's hard for me to imagine there is no way to do what I'm trying to do. Check out the screenshot:

Here I picked the date range of Apr 22 to May 4. But notice the time of day. In order to set those to 00:00:00 and 23:59:59 respectively, I have to click on those times and scroll around to pick specific time of day, which is super annoying to do every time.

The documentation says nothing about the time. Also their GitHub issues page does not address this. What am I missing here. It seems like such an obvious oversight to not allow you to set a default time of day.

Answer 1

You can set the default time on the calendar via defaultCalendarValue.

<DateRangePicker
  format="yyyy-MM-dd HH:mm:ss"
  defaultCalendarValue={[new Date('2022-02-01 00:00:00'), new Date('2022-03-01 23:59:59')]}
/>

This has also been updated in the example on the rsuite official website. https://rsuitejs.com/components/date-range-picker/#date-time-or-time