Input

The Input component provides users with a field to enter and edit text.

useInput API

import useInput from '@mui/base/useInput';
// or
import { useInput } from '@mui/base';

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	Description
disabled	boolean	If `true`, the component will be disabled.
error	boolean	If `true`, the `input` will indicate an error by setting the `aria-invalid` attribute.
focused	boolean	If `true`, the `input` will be focused.
formControlContext	FormControlState \| undefined	Return value from the `useFormControlContext` 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.
inputRef	React.RefCallback<HTMLInputElement> \| null
required	boolean	If `true`, the `input` will indicate that it's required.
value	unknown	The `value` of the `input` element.