@chakra-ui/textarea
TypeScript icon, indicating that this package has built-in type declarations

2.1.2 • Public • Published

Textarea

The Textarea component allows you to easily create multi-line text inputs.

Installation

yarn add @chakra-ui/textarea

Import component

import { Textarea } from "@chakra-ui/textarea"

Basic Usage

<Textarea defaultValue="This is a textarea" placeholder="A simple textarea" />

Disabled

Pass the isDisabled prop to put the textarea in the disabled state

<Textarea isDisabled placeholder="A disabled textarea" />

Invalid

Pass the isInvalid prop to put the textarea in the invalid state

<Textarea isInvalid placeholder="An invalid textarea" />

Sizes

Pass the size prop to change the size of the textarea

<>
  <Textarea
    size="sm"
    placeholder="A sample placeholder"
    defaultValue="This is a small textarea"
  />
  <Textarea
    placeholder="A sample placeholder"
    defaultValue="This is a default textarea"
  />
  <Textarea
    size="lg"
    placeholder="A sample placeholder"
    defaultValue="This is a large textarea"
  />
</>

Resize

Pass the resize prop to resize to textarea in the vertical or horizontal direction

<Textarea placeholder="Here is a sample placeholder" resize="horizontal" />

Package Sidebar

Install

npm i @chakra-ui/textarea

Weekly Downloads

542,748

Version

2.1.2

License

MIT

Unpacked Size

21.1 kB

Total Files

17

Last publish

Collaborators

  • segunadebayo
  • _codebender828