Concepts
Client Forms
For client-side only forms without server actions. Uses bind:value for state and validates with Zod before calling onsubmit.
Basic Usage
<script lang="ts">
import { TypedForm } from '@repo/form'
import { z } from 'zod/v4'
const schema = z.object({
name: z.string(),
email: z.string().email(),
})
let value = $state(TypedForm.getInitial(schema))
function handleSubmit() {
console.log(value)
}
</script>
<TypedForm.Client bind:value {schema} onsubmit={handleSubmit} />With Initial Values
<script lang="ts">
let value = $state({
name: 'John',
email: 'john@example.com',
})
</script>
<TypedForm.Client bind:value {schema} onsubmit={handleSubmit} />