Textarea
A textarea allows user to create multi-line text inputs.
Usage
Import the Textarea component from “figBlocks”.
<Textarea placeholder="some value here" /> Textarea with label
Import Textarea and Label component from “figBlocks”.
<div> <Label for="txt1">Enter the text here</Label> <Textarea id="txt1" placeholder="some value here" /> </div>
Disabled state
The textarea can be disabled by passing the disabled prop.
<Textarea disabled value="A quick brow fox jumps over a lazy dog" /> Custom rows
The number of rows can be customized using the rows prop. The rows value should be greater than 2.
<Textarea rows="6" value="A quick brow fox jumps over a lazy dog" /> Resize
Textarea can be made resizable by the resize prop.
<Textarea resize value="A quick brow fox jumps over a lazy dog" /> Props
id | string | undefined | Id of the textarea. |
rows | number | 2 | Custom row count, the value should be greater than 2. |
name | string | undefined | The name of the input element, used when submitting a form. |
value | string | undefined | The value of the textarea. |
resize | boolean | false | If true, the textarea will be resizable. |
disabled | boolean | false | If true, the textarea will be disabled. |
placeholder | string | undefined | Placeholder text. |
class | string | undefined | Custom CSS classname for styling. |
Events
on:clickon:mouseoveron:mouseenteron:mouseleaveon:changeon:inputon:keydownon:keyupon:focuson:bluron:paste