Почему происходит сбой рендеринга моей формы antd при включении DatePicker?

У меня есть компонент, который отображает простую форму, выглядящую следующим образом:

const { saveButtonProps, formProps, formLoading, queryResult } = useForm();
return (
  <Form {...formProps} layout='vertical'>
    <Form.Item hidden name = "id" />
     
    <....blah blah blah, other form items.../>

    <Row gutter = {[32, 32]}>
      <Col span = {8}>
        <Form.Item name = "reportDate" label = "Report Date" initialValue = {dayjs(formProps?.initialValues?.reportDate)}>
          <DatePicker placeholder = "Report Date" />
        </Form.Item>
      </Col>
    </Row>
  </Form>
)

Однако когда я перехожу на страницу, ничего не отображается, и я получаю сообщение об ошибке «date4.isValid не является функцией». Просматривая трассировку стека, он выдается PickerInput/hooks/useFieldsInvalidate, который в конечном итоге отслеживает rc-picker/es/generate/dayjs.js.

Я думаю, что useForm понимает, что я хочу визуализировать значение «reportDate» в JSON, которое возвращается с сервера внутри компонента, и немедленно обрабатывает его как объект типа dayjs? Если я изменю элемент управления <Form.Item> на что-то вроде стандартного ввода, страница будет отображаться нормально и будет содержать ожидаемые данные.

А если я помещу компонент DatePicker за пределы формы и просто установлю его начальное значение dayjs(formProps?.initialValues?.reportDate), он также установит дату правильно. Итак, есть ли что-то дополнительное, что мне нужно сделать в вызове useForm, чтобы заставить его преобразовать возвращаемое значение в формат, который он, очевидно, ожидает с самого начала?

Примечание: все это делается с использованием платформы Refine, поэтому вызов useForm поступает из @refinedev/antd.