solid-validation

Submit empty and both fields should refuse. Fill them in and it saves after 400ms. Anything at @example.com comes back rejected by the server.

That form is running the real library. Two ref factories, one store:

const { formSubmit, validate, errors, isSubmitting } = useForm();

<form ref={formSubmit(onSubmit)}>
  <input type='email' name='email' required ref={validate()} />
  <span>{errors.email}</span>

  <input name='handle' required ref={validate(() => [minLength(3), noSpaces])} />
  <span>{errors.handle}</span>
</form>

What it does

required, type="email", minlength and pattern already work in every browser. What browsers do not give you is the error message in a place you can style, position and translate. useForm runs the native check, falls through to your own validators when the native check passes, and writes whatever failed into a reactive store keyed by field name.

There is no schema to declare and no field registry to keep in sync. A field joins the form by being marked with ref={validate()}, and it leaves when it unmounts.

What it does not do

It does not manage your values. There is no values store and no controlled-input wrapper. Read values with FormData on submit, or with your own signals. The library only owns error state.

It also does not validate on every keystroke. Errors appear on blur and on submit, and clear on the next input into a field that is already showing one.