CreateFormHookOptions

Defined in: packages/react-form/src/AppForm/createFormHookTypes.public.ts:56

Configures the components and reusable defaults returned by createFormHook.

Default objects are resolved by form core before the corresponding usage-site options. Non-listener properties always take precedence, including when explicitly set to undefined. Listener arrays follow the configured listenersMerge strategy.

Example#

const { useAppForm } = createFormHook({
  formComponents: {
    actions: {
      SubmitButton,
    },
  },
  fieldComponents: {
    inputs: {
      TextField,
    },
  },
  defaultFormOptions: {
    errorVisibility: ({ fieldState }) => fieldState.meta.isBlurred,
  },
  defaultFieldOptions: {
    errorBoundary: true,
  },
})

// Registered namespaces retain their shape on the form and field APIs:
// <form.actions.SubmitButton />
// <field.inputs.TextField />

Extends#

• ReactFormComponentMap<TFormComponents, TFieldComponents>

Type Parameters#

TFormComponents#

TFormComponents extends ReactComponentTree

Library-managed. Do not specify explicitly.

TFieldComponents#

TFieldComponents extends ReactComponentTree

Library-managed. Do not specify explicitly.

Properties#

defaultFieldOptions?#

optional defaultFieldOptions?: DefaultFieldOptions;

Defined in: packages/react-form/src/AppForm/createFormHookTypes.public.ts:89

Defaults for every field and array-field component owned by the form.

Non-listener options passed to the component override these defaults, including when explicitly set to undefined. Listener arrays follow listenersMerge. This includes group.Field and group.ArrayField.

Example#

defaultFieldOptions: {
  errorVisibility: ({ fieldState }) => fieldState.meta.isBlurred,
},

defaultFormGroupOptions?#

optional defaultFormGroupOptions?: DefaultFormGroupOptions;

Defined in: packages/react-form/src/AppForm/createFormHookTypes.public.ts:105

Defaults for every form.FormGroup component.

Options passed to the component override these defaults, including when an option is explicitly undefined.

Example#

defaultFormGroupOptions: {
  onSubmitInvalid: ({ groupApi }) => {
    console.error('Invalid group', groupApi.name)
  },
},

defaultFormOptions?#

optional defaultFormOptions?: DefaultFormOptions;

Defined in: packages/react-form/src/AppForm/createFormHookTypes.public.ts:74

Defaults for every form created by useAppForm.

Non-listener options passed to useAppForm override these defaults, including when explicitly set to undefined. Listener arrays follow listenersMerge.

Example#

defaultFormOptions: {
  errorVisibility: ({ state }) => state.submissionAttempts > 0,
},

fieldComponents#

fieldComponents: TFieldComponents;

Defined in: packages/react-form/src/AppForm/componentMap.public.ts:31

Components and component namespaces exposed on each App Field API.

Inherited from#

ReactFormComponentMap.fieldComponents

formComponents#

formComponents: TFormComponents;

Defined in: packages/react-form/src/AppForm/componentMap.public.ts:29

Components and component namespaces exposed on each App Form API.

Inherited from#

ReactFormComponentMap.formComponents