Browse components

TextField

import TextField from "@shpaw415/mui-lite/TextField";

Why use it

TextField is the all-in-one text input with label, helper text, and variants. Use for forms; drop to FormControl + Input when you need finer composition.

Demo

Variants
Outlined

Helper text under filled field

With value

Label stays floated when filled

Multiline
Notes

Boolean multiline → textarea

multiline={{ minRows: 3, maxRows: 6 }}

Example

import TextField from "@shpaw415/mui-lite/TextField";
 
<TextField label="Email" variant="outlined" helpText="Required" />
<TextField label="Notes" multiline variant="filled" />

Props

PropTypeDefault
variantstandard | outlined | filledstandard
labelstring
helpTextstring
colorerror | success | secondary
multilineboolean | rows config
startIcon / endIconReactNode