Textarea
Allows user to get some text informations in multiples lines.
version
4.1.2
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 #
Name | Type(s) | Default | Required |
---|---|---|---|
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
SelectNext
TimePicker