Form Control

The Form Control component is a utility that lets you associate a form input with auxiliary components, such as labels, error indicators, or helper text.

useFormControlContext API

Import

import useFormControlContext from '@mui/base/FormControl';
// or
import { useFormControlContext } from '@mui/base';

You can learn about the difference by reading this guide on minimizing bundle size.

Parameters

This hook does not accept any input parameters.

Return value

Name	Type	Description
disabled	boolean	If `true`, the label, input and helper text should be displayed in a disabled state.
error	boolean	If `true`, the label is displayed in an error state.
filled	boolean	If `true`, the form element has some value.
focused	boolean	If `true`, the form element is focused and not disabled.
onBlur	() => void	Callback fired when the form element has lost focus.
onChange	React.ChangeEventHandler<NativeFormControlElement>	Callback fired when the form element's value is modified.
onFocus	() => void	Callback fired when the form element receives focus.
required	boolean	If `true`, the label will indicate that the `input` is required.
value	unknown	The value of the form element.