Text area

A text area lets users enter long form text which spans over multiple lines.

Installation

Package installation information
Installyarn add @atlaskit/textarea
SourceBitbucket.org, (opens new window)
npm@atlaskit/textarea, (opens new window)
Bundleunpkg.com, (opens new window)

Props

appearance

Description

Controls the appearance of the field. Subtle shows styling on hover. None prevents all field styling. Take care when using the none appearance as this doesn't include accessible interactions.

Type"standard" | "subtle" | "none"

createAnalyticsEvent

Description

You should not be accessing this prop under any circumstances. It is provided by @atlaskit/analytics-next and integrated in the component

Type(payload: AnalyticsEventPayload) => UIAnalyticsEvent

defaultValue

Description

The default value of the text area.

Typestring

isCompact

Description

Sets whether the field should expand to fill available horizontal space.

Typeboolean

isDisabled

Description

Sets the field as uneditable, with a changed hover state, and prevents it from showing in the focus order. Wherever possible, prefer using validation and error messaging over disabled fields for a more accessible experience.

Typeboolean

isInvalid

Description

Sets styling to indicate that the input is invalid.

Typeboolean

isMonospaced

Description

Sets the content text value to monospace.

Typeboolean

isReadOnly

Description

If true, prevents the value of the input from being edited.

Typeboolean

isRequired

Description

Sets whether the field is required for form that the field is part of.

Typeboolean

maxHeight

Description

The maximum height of the text area.

Typestring

minimumRows

Description

The minimum number of rows of text to display.

Typenumber

name

Description

Name of the input form control.

Typestring

onBlur

Description

Handler to be called when the input is blurred.

Type(event: FocusEvent<HTMLTextAreaElement, Element>) => void

onChange

Description

Handler to be called when the input changes.

Type(event: ChangeEvent<HTMLTextAreaElement>) => void

onFocus

Description

Handler to be called when the input is focused.

Type(event: FocusEvent<HTMLTextAreaElement, Element>) => void

placeholder

Description

The placeholder text within the text area. Don't use placeholder text to provide instructions as it disappears on data entry.

Typestring

ref

Description
No description.
Type((instance: HTMLTextAreaElement) => void) | RefObject<HTMLTextAreaElement>

resize

Description

Enables resizing of the text area. The default setting is smart. Auto enables resizing in both directions. Horizontal enables resizing only along the X axis. Vertical enables resizing only along the Y axis. Smart vertically grows and shrinks the text area automatically to wrap your input text. None explicitly disallows resizing of the text area.

Type"none" | "auto" | "vertical" | "horizontal" | "smart"

spellCheck

Description

Enables native spell check on the textarea element.

Typeboolean

testId

Description

A testId prop is provided for specified elements, which is a unique string that appears as a data attribute data-testid in the rendered code, serving as a hook for automated tests.

Typestring

theme

Description

The theme function TextArea consumes to derive theming constants for use in styling its components

Typeany

value

Description

The value of the text area.

Typestring
Was this page helpful?
We use this feedback to improve our documentation.
© 2026 AtlassianTrademark, (opens new window)Privacy, (opens new window)License