Textarea

Multi-line text input with InputWrapper styling. Supports prefix icon and programmatic control.

Import

import { Textarea } from 'vuiii'

Basic Usage

View in Storybook

// Basic usage import { Textarea } from 'vuiii'

<Textarea v-model="description" placeholder="Enter description..." />

Props

Prop	Type	Default	Description
modelValue	string	-	Bound value (use with v-model)
prefixIcon	string	-	Icon name to show before the textarea
size	'small' | 'normal' | 'large'	'normal'	Textarea size
invalid	boolean	false	Applies the invalid/error styling
pill	boolean	false	Rounded pill shape
disabled	boolean	false	Disables the textarea
readonly	boolean	false	Makes the textarea read-only
rows	number | string	-	Number of visible rows (native attribute)

Slots

Slot	Description
prefix	Content before the textarea (replaces prefixIcon)

Events

Event	Payload	Description
prefix-icon-click	-	When the prefix icon is clicked

More Examples

// With rows and placeholder
<Textarea v-model="content" placeholder="Write your message..." rows="5" />

// With prefix icon
<Textarea v-model="notes" prefix-icon="document-text" placeholder="Notes..." />

// Validation state
<Textarea v-model="bio" :invalid="errors.bio" placeholder="Bio" />

Storybook

For interactive examples with all variants, see Textarea in Storybook.