Textarea

import { Textarea } from '@chakra-ui/react'

<Textarea placeholder='Here is a sample placeholder' />

function Example() {
  let [value, setValue] = React.useState('')

  let handleInputChange = (e) => {
    let inputValue = e.target.value
    setValue(inputValue)
  }
  return (
    <>
      <Text mb='8px'>Value: {value}</Text>
      <Textarea
        value={value}
        onChange={handleInputChange}
        placeholder='Here is a sample placeholder'
        size='sm'
      />
    </>
  )
}

function ResizeExample() {
  const [resize, setResize] = React.useState('horizontal')

  return (
    <>
      <RadioGroup defaultValue={resize} onChange={setResize} mb={6}>
        <Stack direction='row' spacing={5}>
          <Radio value='horizontal'>Horizontal</Radio>
          <Radio value='vertical'>Vertical</Radio>
          <Radio value='none'>None</Radio>
        </Stack>
      </RadioGroup>

      <Textarea
        placeholder='Here is a sample placeholder'
        size='sm'
        resize={resize}
      />
    </>
  )
}

<Textarea isDisabled placeholder='Here is a sample placeholder' />

<Textarea isInvalid placeholder='Here is a sample placeholder' />