useSetFormProps

useSetFormProps lets a component inside the form replace the form-level validate function that was passed to useForm. Use it when the rules depend on something only a child component knows about, like which tab or section is shown.

import { useSetFormProps } from 'wit-form';

const setFormProps = useSetFormProps({ formId });

function ShippingSection() {
  const setFormProps = useSetFormProps();

  useEffect(() => {
    setFormProps({
      validate: (values) =>
        !values.shipping?.address ? ['Add a shipping address'] : [],
    });
    // Go back to the validate passed to useForm when this section unmounts
    return () => setFormProps({ validate: null });
  }, [setFormProps]);

  return <AddressFields prefix="shipping" />;
}