Build validated forms with labels, errors, and pending state

At a glanceCopy Anchor Link

• Who: Developers collecting validated input with accessible errors.
• What: Validated forms (schema, field errors, pending submit) on react-hook-form + zod.
• Use when: For any form needing validation or async submit.
• Avoid when: For a single search box — use Input directly instead.
• See also: Lay out fieldsets, fields, and error lists, Collect text input with a label

InstallCopy Anchor Link

pnpm add @zedtech/zedkit-ui

Latest: 0.3.0 (via changesets).

ExampleCopy Anchor Link

import { Form, FormField, FormSubmit, Input, useValidatedForm } from "@zedtech/zedkit-ui";
const form = useValidatedForm<Values>(schemaFromContracts, { defaultValues });
// <Form {...form}><form onSubmit={form.handleSubmit(save)}>
// <FormField control={form.control} name="name" render={...} />
// <FormMessage /> shows the error; <FormSubmit pendingLabel={t.saving}>

Wraps: react-hook-form, @hookform/resolvers, zod