Remix Validated Form v3.2.0

New Features

getInputProps

useField is now a lot simpler to use for most cases thanks to the new getInputProps. You can read about it in more detail here.

import { useField } from "remix-validated-form";

type MyInputProps = {
  name: string;
  label: string;
};

export const MyInput = ({ name, label }: InputProps) => {
  const { error, getInputProps } = useField(name);
  return (
    <div>
      <label htmlFor={name}>{label}</label>
      <input {...getInputProps({ id: name })} />
      {error && (
        <span className="my-error-class">{error}</span>
      )}
    </div>
  );
};

Touched states

It is now possible to track the touched state of a field with the touched and setTouched return values of useField (docs).

hasBeenSubmitted in form context

You can now determine if the user has attempted to submit the form using hasBeenSubmitted from useFormContext (docs).

Docs changes

The props headers in the reference section are now linkable. 😄

PRs

Includes #25