Skip to main content

Textarea

The TextareaAutosize component automatically adjust the textarea height on keyboard and window resize events.

img

Usage​

import React from 'react'
import { TextArea } from 'qdm-component-library'

function App() {
  return <TextArea />
}
export default App

Reference​

Props​

here all the list of Props you can use for Textarea Component

error​

If true, the label will be displayed in an error state.

import React from 'react'
import { TextArea } from 'qdm-component-library'
function App() {
  return <TextArea error={true} />
}
export default App

helperText​

It shows the error message in Textarea .

import React from 'react'
import { TextArea } from 'qdm-component-library'
function App() {
  return <TextArea error={true} helperText="I'm a error" />
}
export default App

helperTextType​

In Qdm Component we provide 3 types of helperTextType.

  • error
  • warring
  • success
import React from 'react'
import { TextArea } from 'qdm-component-library'
function App() {
  return (
    <TextArea error={true} helperText="I'm a error" helperTextType="error" />
  )
}
export default App

onChange​

The onChange attribute fires the moment when the value of the element is changed.

import React from 'react'
import { TextArea } from 'qdm-component-library'
function App() {
  return (
    <TextArea
      onChange={(evt) => {
        fun(evt)
      }}
    />
  )
}
export default App

helperTextStyle​

Its an style attribute specifies helperTextStyle, elements type Object

inLineStyles​

props give addition props to the text area element type Object

borderColor​

props for changing border color of the text area string

elevation​

props for box shadow for button group '0'|'1' |'2' |'3' |'4'

variant​

Three types of variant 1.standard for only bottom bordered text area 2.outlined for fully bordered text area 3.none for border none 'standard'|'outlined'|'none