Support zod schemas out of the box

[capaj]

Feature request

be able to use zod schemas same as yup.

Current Behavior

currently I can only use yup schemas.

Desired Behavior

be able to use zod schemas instead of yup schemas.

Suggested Solution

either replace yup schemas, or keep the support for them and add zod as another option

Who does this impact? Who is this for?

everyone

Describe alternatives you've considered

https://github.com/robertLichtnow/zod-formik-adapter but it would be nice to be able to use it without additional dependency

Additional context

[johnrom]

My personal thoughts on this are here: #3109

We can split it up into using an plugin-based approach for all validator types, like formik-validator-yup, formik-validator-zod.

This would actually require an additional dependency, but in this case the additional dependency is a net positive because you wouldn't be loading Yup validations, for example, into your project even though you're not using them.

On the maintenance side, it's much better to keep each formik package doing one thing, where the core Formik package would be creating a canvas on which plugins could work instead of trying to do everything at the same time.

The API would be something like:

import { createFormik } from 'formik';
import { zodValidator } from 'formik-validator-zod';

const { Formik, useFormik } = createFormik()
  .addPlugin(zodValidator);

const MyForm = () => {
  const formik = useFormik({ initialValues: {} });
  // OR
  return <Formik initialValues={{}} />
}

The final API would be dependent on how it worked in practice, I used a slightly different one in the linked issue.

(disclaimer: I don't know what Zod is)

[dennis-gonzales]

+1

[nickserv]

Zod is another validation library, but with more of a focus on strong TypeScript support. Since Yup isn't even installed by Formik by default, we should be able to take the same approach to support Zod schemas.

[johnrom]

@nickmccurdy this library hasn't had activity in a long time so probably best to look elsewhere. otherwise, it's true that Formik doesn't install Yup, but it is tightly bound to it using validationSchema. It achieves this because it is passed a schema which includes the API needed for validation -- Formik just casts it to any and hopes for the best.

This is obviously not an ideal solution for a validation library firmly rooted in typescript since this would break the type safety between Formik and Zod without installing the Zod types themselves. That's why I'd recommend:

A. Using the validate prop with a strongly typed binding to Zod, if you must use this library B. Look into other libraries which provide a validator binding interface C. Formik provide some formal mechanism to add custom validators (if it ever comes back)