useFancyForm
fancy-inertiaForm hook.
Why
Server-side form validation errors and submission state get lost in the wiring between Inertia's event-based API and react-fancy's simpler value props. You end up manually wiring error messages, checking loading state, and handling the event-vs-raw-value mismatch across different input types (native inputs emit ChangeEvent, but Select and Switch emit raw values). Without this bridge, forms become repetitive boilerplate and agent-driveable surfaces can't read/write field state via stable handles.
What
useFancyForm is a hook that wraps Inertia's useForm() and returns a FancyFormBridge with a field(name) helper. Each field(name) call returns a FancyFieldBridge — a bundle of { value, onChange, error, loading, name } ready to spread directly into any react-fancy input. The onChange handler is dual-mode: it sniffs whether the event is a React ChangeEvent (native Input/Textarea) or a raw value (Select/Switch/MultiSwitch) and unwraps automatically. Server errors flow into error, submission state into loading, and all Inertia methods (post, put, patch, delete, submit, reset, clearErrors) are forwarded.How
Import from
@particle-academy/fancy-inertia, call const form = useFancyForm({ fieldName: initialValue, ... }), then spread <Input {...form.field("fieldName")} /> into any react-fancy input and wire <Button onClick={() => form.post("/endpoint")}> for the submit. Agents can observe field state via form.data and form.errors, and update via form.setData() or direct onChange mutations — no event translation needed.