# TextArea

A standard textarea (multi line text box)

## Installation

```tsx
import { TextArea } from 'uxp/components';
```

## Signature

```tsx
const TextArea: React.ForwardRefExoticComponent<React.RefAttributes<ITextAreaInstanceProps> & ITextAreaProps>
```

## Properties

| Name        | Type                                                                                | Mandatory | Default Value | Example Value |
| ----------- | ----------------------------------------------------------------------------------- | --------- | ------------- | ------------- |
| value       | string                                                                              | Yes       | -             | -             |
| onChange    | (value: string) => void                                                             | Yes       | -             | -             |
| onFocus     | () => void                                                                          | No        | -             | -             |
| onBlur      | (vale: string) => void                                                              | No        | -             | -             |
| onKeyDown   | (e: React.KeyboardEvent, val: string) => void                                       | No        | -             | -             |
| className   | string                                                                              | No        | -             | -             |
| styles      | React.CSSProperties                                                                 | No        | -             | -             |
| readOnly    | boolean                                                                             | No        | -             | -             |
| tabIndex    | number                                                                              | No        | -             | -             |
| rows        | number                                                                              | No        | -             | -             |
| cols        | number                                                                              | No        | -             | -             |
| spacingMode | [SpacingMode](https://help.iviva.com/uxp/v5/additional-resources/types/spacingmode) | No        | -             | -             |

## Ref Handlers

Available methods through ref:

| Method     | Type                         | Description                   |
| ---------- | ---------------------------- | ----------------------------- |
| focus      | () => void                   | focus the input               |
| getElement | () => React.MutableRefObject | this will return the  element |

## Related Types

* [ITextAreaProps](https://help.iviva.com/uxp/v5/additional-resources/types/itextareaprops)
* [SpacingMode](https://help.iviva.com/uxp/v5/additional-resources/types/spacingmode)
* [ITextAreaInstanceProps](https://help.iviva.com/uxp/v5/additional-resources/types/itextareainstanceprops)