Text Area

Displays a multi-line text field input.

defaultValue

string

invalid

booleanDefault: false

radius

smallnonemediumlargefull

resize

noneverticalhorizontalboth

size

123

value

string

variant

softclassicsurface
Default: surface

Deprecated

state

deprecated
disablednormalread-onlyinvalid

Also supports MarginProps: `m`, `mb`, `ml`, `mr`, `mt`, `mx`, `my`

Use the variant prop to control the visual style of the Text Area.

The state prop is deprecated, as the types of state it represents may not be mutually exclusive. Use disabled, readOnly or invalid instead.

The invalid prop indicates that the field’s value is invalid. Fields are styled as valid by default, though built-in client-side validation still applies. In a future version we may synchronize styled validation with the field’s internal validity state.

Dashboard

3 variants found

TextArea in Create Permission Dialogdashboard
TextArea in Edit Permission Dialogdashboard
size 2 textarea in Chat Inputdashboard
size=2variant=surface

Context

PropTypeDefaultRequired
defaultValue
stringno
invalid
booleanfalseno
radius
"small" | "none" | "medium" | "large" | "full"no
resize
Responsive<"none" | "vertical" | "horizontal" | "both">no
size
Responsive<"1" | "2" | "3">no
statedeprecated
"disabled" | "normal" | "read-only" | "invalid"no
value
stringno
variant
"soft" | "classic" | "surface"surfaceno

Also supports MarginProps: m, mb, ml, mr, mt, mx, my

stateType: "disabled" | "normal" | "read-only" | "invalid"

Usage

Used 17 times across 1 package

Dashboard
17

Variant Distribution

size

2
100%

variant

surface
100%

Where it's used

17 files

/:environmentId/roles-and-permissions/resource-types/edit/content-panel

packages/dashboard/src/app/(private)/(chromeless)/[environmentId]/roles-and-permissions/resource-types/edit/content-panel/create-details-tab.tsx1
packages/dashboard/src/app/(private)/(chromeless)/[environmentId]/roles-and-permissions/resource-types/edit/content-panel/details-tab.tsx1
packages/dashboard/src/components/ai-chat/chat-input.tsx1
packages/dashboard/src/components/configuration/oauth-settings/oauth-settings-modal.tsx1
packages/dashboard/src/components/flags/create-flag-dialog.tsx1
packages/dashboard/src/components/flags/edit-flag-dialog.tsx1
packages/dashboard/src/components/page/header-feedback.tsx1
packages/dashboard/src/components/permissions/create-permission-dialog.tsx1
packages/dashboard/src/components/permissions/edit-permission-dialog.tsx1
packages/dashboard/src/components/pipes/request-custom-provider-dialog.tsx1

Show 7 more files