useInput API

API reference docs for the useInput hook. Learn about the input parameters and other APIs of this exported module.

Demos

For examples and details on the usage of this React hook, visit the demo pages:

import useInput from '@mui/base/useInput';

Name	Type	Description
defaultValue	unknown	The default value. Use when the component is not controlled.
disabled	boolean	If `true`, the component is disabled. The prop defaults to the value (`false`) inherited from the parent FormControl component.
error	boolean	If `true`, the `input` will indicate an error by setting the `aria-invalid` attribute. The prop defaults to the value (`false`) inherited from the parent FormControl component.
inputRef	React.Ref<HTMLInputElement>
onBlur	React.FocusEventHandler
onChange	React.ChangeEventHandler<HTMLInputElement>
onClick	React.MouseEventHandler
onFocus	React.FocusEventHandler
required	boolean	If `true`, the `input` element is required. The prop defaults to the value (`false`) inherited from the parent FormControl component.
value	unknown

Name	Type	Default	Description
disabled	boolean	false	If `true`, the component will be disabled.
error	boolean	false	If `true`, the `input` will indicate an error by setting the `aria-invalid` attribute.
focused	boolean	false	If `true`, the `input` will be focused.
formControlContext	FormControlUnstyledState \| undefined		Return value from the `useFormControlUnstyledContext` hook.
getInputProps	<TOther extends Record<string, any> = {}>(externalProps?: TOther) => UseInputInputSlotProps<TOther>		Resolver for the input slot's props.
getRootProps	<TOther extends Record<string, any> = {}>(externalProps?: TOther) => UseInputRootSlotProps<TOther>		Resolver for the root slot's props.
required	boolean	false	If `true`, the `input` will indicate that it's required.
value	unknown		The `value` of the `input` element.