This prop helps users to fill forms faster, especially on mobile devices. The name can be confusing, as it’s more like an autofill. You can learn more about it following the specification.
If true
, the input
element will be focused during the first mount.
The color of the component. It supports those theme colors that make sense for this component.
The default input
element value. Use when the component is not controlled.
If true
, the input
element will be disabled.
End InputAdornment
for this component.
If true
, the input will indicate an error. This is normally obtained via context from
FormControl.
If true
, the input will take up the full width of its container.
The id of the input
element.
The component used for the input
element.
Either a string to use a DOM element or a component.
Attributes applied to the input
element.
Pass a ref to the input
element.
If dense
, will adjust vertical spacing. This is normally obtained via context from
FormControl.
If true
, a textarea element will be rendered.
Name attribute of the input
element.
Callback fired when the input is blurred.
Notice that the first argument (event) might be undefined.
Callback fired when the value is changed.
The short hint displayed in the input before the user enters a value.
It prevents the user from changing the value of the field (not from interacting with the field).
If true
, the input
element will be required.
Number of rows to display when multiline option is set to true.
Maximum number of rows to display when multiline option is set to true.
Minimum number of rows to display when multiline option is set to true.
Start InputAdornment
for this component.
Type of the input
element. It should be a valid HTML5 input type.
The value of the input
element, required for a controlled component.
InputBase
contains as few styles as possible.
It aims to be a simple building block for creating an input.
It contains a load of style reset and some state logic.
Demos:
API:
InputBase
contains as few styles as possible.
It aims to be a simple building block for creating an input.
It contains a load of style reset and some state logic.
Name | Type | Description |
---|---|---|
aria-describedby | string | |
autoComplete | string | This prop helps users to fill forms faster, especially on mobile devices. The name can be confusing, as it’s more like an autofill. You can learn more about it following the specification. |
autoFocus | bool | If |
classes | object | Override or extend the styles applied to the component. See CSS API below for more details. |
className | string | |
color | 'primary' | 'secondary' | The color of the component. It supports those theme colors that make sense for this component. |
defaultValue | any | The default |
disabled | bool | If |
endAdornment | node | End |
error | bool | If |
fullWidth | bool | If |
id | string | The id of the |
inputComponent | elementType | The component used for the |
inputProps | object | Attributes applied to the |
inputRef | custom | Pass a ref to the |
margin | 'dense' | 'none' | If |
multiline | bool | If |
name | string | Name attribute of the |
onBlur | function | Callback fired when the input is blurred. Notice that the first argument (event) might be undefined. |
onChange | function | The event source of the callback.
You can pull out the new value by accessing |
onClick | function | |
onFocus | function | |
onKeyDown | function | |
onKeyUp | function | |
placeholder | string | The short hint displayed in the input before the user enters a value. |
readOnly | bool | It prevents the user from changing the value of the field (not from interacting with the field). |
renderSuffix | function | |
required | bool | If |
rows | number | string | Number of rows to display when multiline option is set to true. |
rowsMax | number | string | Maximum number of rows to display when multiline option is set to true. |
rowsMin | number | string | Minimum number of rows to display when multiline option is set to true. |
startAdornment | node | Start |
type | string | Type of the |
value | any | The value of the |