AutoForm
A form built from a form hook — one control per field, chosen from each field's real datatype.
<AutoForm> renders one control per field. The fields come from the form's value keys; each control is chosen from the field's datatype.
1
<
AutoForm
form
={
useUpdateAirportForm
({
formValues
:
{
code
:
""
,
name
:
""
,
active
:
true
}
})}
/>
That datatype is real: the form hook validates against the write JSON Schema, which carries type, format, enum, maxLength and the compiler's x-rastack-relation FK marker. getFieldStructure surfaces all of it:
text input (with maxLength)
string, format: date-time
dropdown (options from the enum)
scalar input; override to a picker
› Good to know
This enrichment is not auto-form-only — any code reading useForm().getFormField(name) now gets { type, maxLength, options, relation, nullable, format }.
Submit, validation, disabled/loading state and touched-gated errors are all wired from the hook. Override any field — label, control, options for an FK picker, or a fully custom render:
2
form
={
useUpdateTerminalForm
({
formValues
:
{
label
:
""
,
airport
:
0
,
active
:
true
}
})}
6
{
name
:
"airport"
,
label
:
"Airport"
,
input
:
"select"
,
options
:
airportOptions
},
7
{
name
:
"active"
,
label
:
"In service"
},
1
const
model
=
useAutoForm
(
form
,
{
exclude
:
[
"internalId"
]
});
2
// { fields: [{ name, id, label, input, field, options? }],
3
// submit, reset, canSubmit, isSubmitting, errors }
Build with AI
Every page is available as clean Markdown for LLMs and coding agents. Point one at the files below to build on top of React API Stack.
React API Stack · alpha · built to scale to millions