#3683·formik

Typescript error in FormikErrors when using a field with a type Date

Author: JArdiotJnesisCreated Nov 10, 2022Updated Dec 3, 2025
LabelsType: Bug

Bug report

Current Behavior

If model contains a field of type Date, the related error field has type FormikErrors<Date> and can not be used in the JSX/TSX. Error is : Type 'FormikErrors<Date> | undefined' is not assignable to type 'ReactNode'.

It seems to be due to the FormikErrors type which has been designed to handle nested object, but this behaviour doesn't work for Date type.

The error is only noticed with package "@types/react" 18.0.25". In version 17.0.52, type is the same but the error is not displayed.

Expected behavior

I expect that in the following sample I can use "formik.errors.creationDate" in the jsx code.

Reproducible example

With package "@types/react" 18.0.25

type ModelWithDate = {
    creationDate: Date;
  }

  const formik = useFormik<ModelWithDate>({
    initialValues: {
      creationDate: new Date(1, 1, 1, 0, 0),
    },
    onSubmit: form => {}
  });

  return (<div>{formik.errors.creationDate}</div>);

Suggested solution(s)

Change FormikErrors type to allow Date type.

Replacing [K in keyof Values]?: Values[K] extends any[] ? Values[K][number] extends object ? FormikErrors<Values[K][number]>[] | string | string[] : string | string[] : Values[K] extends object ? FormikErrors<Values[K]> : string; by [K in keyof Values]?: Values[K] extends any[] ? Values[K][number] extends object ? FormikErrors<Values[K][number]>[] | string | string[] : string | string[] : Values[K] extends Date ? string : Values[K] extends object ? FormikErrors<Values[K]> : string; do the job but there is maybe better to do.

Additional context

With package "@types/react" 18.0.25. Version <18 does not notice the error

Your environment

Software Version(s)
Formik 2.2.9
React 18.2.0
TypeScript 4.6.3
Browser Chromium 101
npm/Yarn npm 8.19.2
Operating System Arch Linux