Text Input
Single-line field or multiline area with Field Wrapper label/helper. Figma name: Text Input.
Appearance
Content
Value
State
Layout & behavior
Props — TextInput
View MUI docs| Prop | Type | Description |
|---|---|---|
size | "large" | "medium" | "small" | "extraSmall" | Control height. Default medium (40). |
color | "primary" | "secondary" | primary = solid border; secondary = soft border. |
multiline | boolean | Renders a textarea when true. |
type | "text" | "password" | string | Native HTML input type. Use password to conceal field contents. Field-only; ignored when multiline. |
startIconName | FaIconName | Leading FA icon. Field-only; omitted when unset or multiline. |
label | string | Field label above the control. |
helperText | ReactNode | Helper or validation message below. |
helperIconName | FaIconName | Optional icon beside helper text. |
showHelper | boolean | Show helper row when helperText is set. |
sentiment | "default" | "success" | "warning" | "error" | Validation tone for label and helper. |
error | boolean | Error field styling. |
readOnly | boolean | Read-only; not editable. |
disabled | boolean | Disables interaction. |
required | boolean | Native required on the control + * after the Field Wrapper label. |
placeholder | string | Placeholder text. |
value | string | Controlled value. |
defaultValue | string | Uncontrolled initial value. |
rows | number | Textarea row count when multiline. |