전체 카탈로그
Data InputTextArea26 props

Text Area

TextArea is a multi-line text input for collecting longer-form content like comments, descriptions, or messages. Use it when the expected input spans multiple lines. For shorter...

공식 문서 열기
live previewData Input

Preview

Ready to publish

Import

import {TextArea} from '@astryxdesign/core/TextArea';

Astryx 문서 권장 방식대로 root barrel이 아니라 컴포넌트 subpath에서 가져옵니다.

When to use

TextArea is a multi-line text input for collecting longer-form content like comments, descriptions, or messages. Use it when the expected input spans multiple lines. For shorter...

textareatextfieldmultilinecommentmessageautoresizeautosizecharlimit

Important props

changeAction(value: string, e: ChangeEvent<HTMLTextAreaElement>) => void | Promise<void>optional
status{ type: warning | error | success; message?: string }optional
sizesm | md | lgoptional

Theming targets

astryx-textarea

Best practices

  • DoProvide a visible label so users know what to enter. If the label must be hidden, set isLabelHidden with a descriptive label for screen readers.
  • DoSet maxLength with a character counter when there is a defined limit; it helps users stay within bounds before they submit.
  • DoUse the status prop to surface validation feedback inline: show success when input is valid, warning for soft limits, and error for hard failures.
  • DoAdd a description or placeholder to clarify expected content, like "Describe the issue in detail," but never rely on placeholder alone as the only label.