FormState

Specifies the state and callback properties provided by the Form component. The FormState interface provides comprehensive access to the form's state and behavior through the onFormStateChange callback. It allows parent components to build custom form UIs with full access to validation state, field values, and form event handlers.

Props

The following table outlines the props for the FormState:

NameTypeDefaultDescription
allowSubmit
boolean
-

Specifies if the form can be submitted. True when all fields are valid; otherwise, all fields are marked as touched when attempted to submit.

errors
Record<string, string>
-

Specifies the current validation errors for all fields indexed by field name. Fields without errors won't appear in this object.

fieldNames
Record<string, string>
-

Specifies a dictionary of field names for easy access to form fields.

modified
Record<string, boolean>
-

Specifies which fields in the form have been modified from their initial values.

submitted
boolean
-

Specifies if the form has been submitted at least once. True after a submission attempt regardless of validation result.

touched
Record<string, boolean>
-

Specifies which fields have been touched (blurred after interaction). Useful for determining when to display validation messages.

valid
Record<string, boolean>
-

Specifies which fields in the form are valid (have no validation errors).

values
Record<string, FormValueType>
-

Specifies the current values for all form fields indexed by field name. Access individual values using: values.fieldName

const username = formState.values.username;
visited
Record<string, boolean>
-

Specifies which fields have been visited (received focus).