Skip to main content

Component <Textarea />

Props

PropsTypeMeaningPossible values
textareaSizestringChange textarea sizesm / md
layoutstringChange textarea general stylesfilled / outlined
shapestringChange borders shaperounded / squared
labelstringAdd textarea labelstring
msgstringAdd message below the input. Color depends on statusstring
statusstringSet textarea statussuccess / error
resizebooleanEnadle/disable textarea resize ablilitytrue / falce



States

Examples:

<Textarea placeholder="Enter some text..." />
<Textarea placeholder="Enter some text..." disabled />



Sizes

Examples:

<Textarea textareaSize="sm" placeholder="Enter some text..." />
<Textarea textareaSize="md" placeholder="Enter some text..." />



Layouts

Examples:

<Textarea layout="filled" placeholder="Enter some text..." />
<Textarea layout="outlined" placeholder="Enter some text..." />



Shape

Examples:

<Textarea shape="rounded" placeholder="Enter some text..." />
<Textarea shape="squared" placeholder="Enter some text..." />



With label

Example:

<Textarea label="Enter some text" placeholder="Here..." />



Statuses and message

Examples:

<Textarea msg="Just type somethig" placeholder="Enter some text..." />
<Textarea msg="Well done!" placeholder="Enter some text..." success />
<Textarea msg="Try again" placeholder="Enter some text..." error />
Just type somethig
Well done!
Try again



Withou resize

Example:

<Textarea placeholder="Enter some text..." resize={false} />