TextArea

Component for displaying a textarea with customizable size, rows, and error state

function TextAreaExample() {
  return (
    <TextArea
      error={false}
      size="medium"
      minRows={1}
      maxRows={5}
      placeholder="Placeholder text"
      defaultValue=""
      disabled={false}
    />
  );
}

Props

className

Typestring

Custom class name for the textarea

defaultValue

Typestring

Initial value of the textarea

disabled

Typeboolean

Whether the textarea is disabled

error

Typeboolean

Whether the textarea has an error

maxRows

Typenumber

Maximum number of rows the textarea can expand to

minRows

Typenumber

Minimum number of rows the textarea can expand to

onBlur

Typesignature

Function called when the input loses focus. The event parameter may be undefined.

onChange

Typesignature

Callback function to handle change in textarea value

onClick

Typesignature

Callback function to handle click

placeholder

Typestring

Placeholder text for the textarea

size

TypeExtract

Default'medium'

Size of the textarea

spellCheck

Typeboolean

Enables or disables browser spell checking

value

Typestring

Controlled value of the textarea

CSS Variables

Color

--ax-public-textarea-color-disabled

--ax-public-textarea-root-background-color-error

--ax-public-textarea-root-border-color

--ax-public-textarea-root-border-color-error

--ax-public-textarea-root-border-color-focus

--ax-public-textarea-root-color

--ax-public-textarea-root-color-disabled

--ax-public-textarea-root-color-error

Size

--ax-public-textarea-root-border-size