WUI logo

Textarea

Allows user to get some text informations in multiples lines.

version

4.2.0

install

yarn add @welcome-ui/textarea

usage

import { Textarea } from '@welcome-ui/textarea'

Default #

function () {
const [value, setValue] = React.useState('')
const handleChange = (event) => {
setValue(event.target.value)
}
return <Textarea name="textarea" placeholder="Lorem ipsum dolor sit amet, consectetur adipiscing elit." onChange={handleChange} value={value} />
}

With Field #

function () {
const [value, setValue] = React.useState('')
const handleChange = (event) => {
setValue(event.target.value)
}
return (
<Field label="Description" hint="Description must be <200 words" required>
<Textarea name="textarea2" onChange={handleChange} value={value} />
</Field>
)
}

Properties #

NameType(s)DefaultRequired
autoFocus
Boolean
disabled
Boolean
maxLength
number
minRows
number
5
name
string
onBlur
(event: FocusEvent<HTMLTextAreaElement, Element>) => void
onChange
(event: ChangeEvent<HTMLTextAreaElement>) => void
onFocus
(event: FocusEvent<HTMLTextAreaElement, Element>) => void
onKeyDown
(event: KeyboardEvent<HTMLTextAreaElement>) => void
placeholder
string
value
string
size
"sm"
"md"
"lg"
lg
variant
"error"
"focused"
"info"
"success"
"warning"

Packages #

Dependencies #
Peer dependencies #

Previous

Select