Timepicker is remounted on every click when passing a calendarContainer

[AbdelHajou]

Describe the bug When passing a calendarContainer to the Datepicker with showTimeSelect enabled and shouldCloseOnSelect set to false, the timepicker gets remounted whenever the user selects a time. This causes the timepicker to try to center the selected time, but this fails because it calculates the center position based on the calendarContainer's clientHeight (which is 0).

To Reproduce

Go to https://reactdatepicker.com/#example-select-time and change the example to:

() => {
  const [startDate, setStartDate] = useState(new Date());
  
  const CustomContainer = ({className, children}) => {
    return (
      <div className={className}>{children}</div>
    );
  };
  
  return (
    <DatePicker
      selected={startDate}
      onChange={(date) => setStartDate(date)}
      showTimeSelect
      timeFormat="HH:mm"
      timeIntervals={15}
      timeCaption="time"
      dateFormat="MMMM d, yyyy h:mm aa"
      shouldCloseOnSelect={false}
      calendarContainer={CustomContainer}
    />
  );
};

Open the datepicker and select a time. The timepicker will remount and try to center the selected time, but it scrolls up too far.

Expected behavior It should either not scroll at all (like the default behavior when not passing a custom container) or it should correctly center the selected time.

Desktop (please complete the following information):

• OS: Windows 11
• Browser: Chrome
• Version 106.0.5249.120

Additional context https://github.com/Hacker0x01/react-datepicker/blob/2400071e5ca3839d564cfca056eaeb5e76286329/src/time.jsx#L63-L76

In the componentDidMount of the Time component, it tries to calculate the center position based on the clientHeight of the monthContainer. When passing a custom container, this clientHeight always returns 0 for some reason.

The bug does not occur when defining the Custom Container as a separate component.