### Async

Validations can be performed asynchronously while the user is filling out the form. To define validations on the server, see TODO. Then, pass the name of the validation to the `validation` prop.

```jsx
import useForm, { Form } from "../../src/hooks/use-form"
import TextField from "../../src/components/text-field"
import Stack from "../../src/components/stack"
import SubmitButton from "../../src/components/submit-button"

function Example() {
  const form = useForm({ initialData: {} })

  return (
    <Form form={form} method="POST" action="/people" validation="people">
      <Stack spacing={2}>
        <TextField label="First name" name="first_name" />
        <TextField label="Last name" name="last_name" />
        <SubmitButton>Save</SubmitButton>
      </Stack>
    </Form>
  )
}

;<Example />
```

### On Submit

Validations can also be rendered inline on form submit. By adding a boolean `validation` prop (not a string), the errors returned from the controller action will be rendered inline

```jsx
import useForm, { Form } from "../../src/hooks/use-form"
import TextField from "../../src/components/text-field"
import Stack from "../../src/components/stack"
import SubmitButton from "../../src/components/submit-button"

function Example() {
  const form = useForm({ initialData: {} })

  return (
    <Form form={form} method="POST" action="/people" validation>
      <Stack spacing={2}>
        <TextField label="First name" name="first_name" />
        <TextField label="Last name" name="last_name" />
        <SubmitButton>Save</SubmitButton>
      </Stack>
    </Form>
  )
}

;<Example />
```