[v2]: Explore adding debounceValidateMs prop

[jaredpalmer]

This prop would take a number as a prop and internally Formik would debounce all non-submit-related validation calls.

[jannikbuschke]

+1, would totally like to see that

[alexweber]

Any updates on this?

[yongzhi-chen]

+1. this is a really nice to have feature

[johnrom]

I think validation can be a little more granular than this. Along with the theme of creating "bindings" for validators like Yup, I think we can also create default bindings for the default Formik validators -- FormValidator and FieldValidator, then we can compose this and let users wrap it with whatever they want to. This is how I'd handle it in my V3 reducer refs branch:

import { FormValidator, FieldValidator } from 'formik';
import { YupValidator } from '@formik/yup';

type ValidationHandler<Values extends FormikValues> = (
  getState: () => FormikState, 
  dispatch: React.Dispatch<FormikMessage>
) => Promise<FormikErrors<Values>>;

export const defaultValidator: ValidationHandler<Values> = (getState, dispatch) => {
    return Promise.all([
      FormValidator(getState, dispatch),
      FieldValidator(getState, dispatch),
      YupValidator(getState, dispatch),
   ]);
};

// in Formik
const runAllValidations = const useEventCallback(
  () => (props.validationHandler ?? defaultValidator)(getState, dispatch), 
  [props.validationHandler, defaultValidator, getState, dispatch]
);

// in userland
import { Formik, defaultValidationHandler } from 'formik';

const myForm = () => {
  const validationHandler = useDebounce(defaultValidationHandler, 300);

  return <Formik validationHandler={validationHandler} validate={() => console.log('this API doesn't change, it is what FormValidator uses')} />
}

(eventually we would deprecate YupValidator from defaultValidator, and @formik/yup would expose a YupValidationHandler which includes the YupValidator)