Form helpers

Form

useZodForm + FormField, the react-hook-form bridge.

@codeways/ui/form

FormField + useZodForm

The suite's one bridge from react-hook-form to the Field API. Try submitting empty, or type taken into Order number to see a server-applied field error.

Usage

import { FormField, useZodForm } from "@codeways/ui/form";
import { Input } from "@codeways/ui/input";

const form = useZodForm(schema, { defaultValues });

<FormField control={form.control} name="poNumber" label="Order number" optional>
  {({ field, id, describedBy }) => <Input {...field} id={id} aria-describedby={describedBy} />}
</FormField>