API reference > @kontsedal/olas-react > useFieldInput

useFieldInput() function

JSX-ready spread for binding a Field<T> to a native <input> /<textarea> / <select>. Subscribes to the field's value, errors, and touched signals; returns props you can spread directly:

<input {...useFieldInput(form.fields.title)} />

For non-string fields, pass a transform:

<input
  type="number"
  {...useFieldInput(form.fields.age, {
    transform: { parse: Number, format: String },
  })}
/>

The returned onChange reads e.target.value and writes through the transform; onBlur calls markTouched() so validateOn: 'blur' modes activate without any extra wiring. aria-invalid is set when the field has been touched AND has errors (avoid the "errors on every keystroke" UX even when validators run on change). For the error *message*, render your own element and point the input at it with aria-describedby={errId} — the hook does NOT emit aria-errormessage because per ARIA that attribute takes an element-ID reference, not the error text.

Signature:

export declare function useFieldInput<T extends string>(field: Field<T>, options?: UseFieldInputOptions<T>): UseFieldInputResult;

Parameters

Parameter	Type	Description
field	Field<T>
options	UseFieldInputOptions<T>	(Optional)

Returns:

UseFieldInputResult