Textarea

Quick start

Here's a quick start guide to get started with the textarea component

Importing Component

import { TextArea } from "@hover-design/react";

Code Snippets and Examples

Default

<TextArea placeholder="AutoSize"></TextArea>

Fixedsize

<TextArea placeholder="Fixedsize" fixedSize={true}></TextArea>

Rows & Cols

<TextArea placeholder="Rows" rows={5}></TextArea>

<TextArea placeholder="Cols" cols={10}></TextArea>

Maximum & Minimum Length

<TextArea
  placeholder="Maximum height"
  maxlength={12}
  defaultValue="Hover Maximum"
></TextArea>

<TextArea
  placeholder="Minimum height"
  minlength={10}
  defaultValue="Hover Minimum"
></TextArea>

Hover MaximumHover Minimum

Status Border

<TextArea placeholder="Error" statusBorder="red"></TextArea>

<TextArea placeholder="Warning" statusBorder="yellow"></TextArea>

<TextArea placeholder="Valid" statusBorder="green"></TextArea>

Props Referece

Attributes	Values	Optional ?
children	JSX.Element	Yes
autocomplete	on | off	Yes
autocorrect	on | off	Yes
autofocus	boolean	Yes
resize	boolean	Yes
statusBorder	string	Yes
cols	number	Yes
rows	number	Yes
minlength	number	Yes
maxlength	number	Yes
disabled	boolean	Yes
required	boolean	Yes
name	string	Yes
placeholder	string	Yes
readonly	boolean	Yes
spellcheck	true | default | false	Yes
wrap	hard | soft | off	Yes
onChange	() => void;	Yes