aria-label | string | | Aria-label. The text input requires an associated id or aria-label. |
className | string | | Additional classes added to the text input. |
customIcon | React.ReactNode | | Custom icon to render. If the validated prop is also passed, this will render an icon in addition to a validated icon. |
expandedProps | TextInputExpandedObj | | Prop to apply expanded styling to the text input and link it to the element it is controlling. This should be used when the input controls a menu and that menu is expandable. |
isDisabled | boolean | | Flag to show if the text input is disabled. |
Deprecated: isExpanded | boolean | | Flag to apply expanded styling. expandedProps should now be used instead. |
Deprecated: isLeftTruncated | boolean | | Use isStartTruncated instead. Trim text at start |
isRequired | boolean | | Flag indicating whether the input is required |
isStartTruncated | boolean | | Trim text at start |
onBlur | (event?: any) => void | | Callback function when text input is blurred (focus leaves) |
onChange | (event: React.FormEvent<HTMLInputElement>, value: string) => void | | A callback for when the text input value changes. |
onFocus | (event?: any) => void | | Callback function when text input is focused |
ouiaId | number | string | | Value to overwrite the randomly generated data-ouia-component-id. |
ouiaSafe | boolean | | Set the value of data-ouia-safe. Only set to true when the component is in a static state, i.e. no animations are occurring. At all other times, this value must be false. |
placeholder | string | | Placeholder of the text input when there is no value |
readOnlyVariant | 'plain' | 'default' | | Sets the input as readonly and determines the readonly styling. |
type | | 'text'
| 'date'
| 'datetime-local'
| 'email'
| 'month'
| 'number'
| 'password'
| 'search'
| 'tel'
| 'time'
| 'url' | | Type that the text input accepts. |
validated | 'success' | 'warning' | 'error' | 'default' | | Value to indicate if the text input is modified to show that validation state.
If set to success, text input will be modified to indicate valid state.
If set to error, text input will be modified to indicate error state. |
value | string | number | | Value of the text input. |