Feature playground

Try radio, checkbox groups, dates, datetime, files, matrices, tuples, records, and contact branches. Show values displays local data after validation; this demo does not upload files or call an API.

Usage

Use your form instance from useForm. See the initial setup.

const schema = z.object({
  name: z.string(),
  plan: z.enum(["free", "pro"]),
  tags: z.array(z.string()),
});

<ErlForm
  form={form}
  schema={schema}
  fieldConfig={{
    name: { label: "Name" },
    plan: { type: "radio" },
    tags: { item: { placeholder: "Tag" } },
  }}
/>

The result serializes File metadata so it is readable; the actual field value remains a File. See API, Arrays, and Discriminated unions for configuration details.