Preview

Installation

npx sigma-ui@latest add textarea

Usage

<script setup lang="ts">
import { ref } from 'vue';
import { Textarea } from '@/components/ui/textarea';

const message = ref('');
</script>

<template>
  <Textarea
    v-model="message"
    placeholder="Type your message here."
  />
</template>

• v-model binds the value. Any other attribute, such as placeholder, rows, or disabled, is passed to the native <textarea>.

Examples

Default

Disabled

With Label

With Text

With Button

Form

API Reference

Textarea

Props

Prop	Type	Default
modelValue Current value of the textarea; use with v-model.	string | number	-

Events

Event	Payload
update:modelValue Emitted when the user changes the value.	unknown[]

Accessibility

Renders a native <textarea> element. Associate it with a Label through id and for, or set aria-label, so it has an accessible name.

Key	Description
Tab	Moves focus to the textarea.
Enter	Inserts a new line.