first

documentation/elements/forms/textarea/textarea-disabled-documentation.md

@@ -0,0 +1,51 @@
+---
+state:
+  textarea: ''
+  disabled: true
+---
+
+### Disabled
+
+A `VTextarea` can be shown in a disabled state. For that, you need to wrap it
+inside a `<VControl />` component. Simply add the `disabled` attribute
+to the target textarea element.
+
+<!--code-->
+
+```vue
+<script setup lang="ts">
+
+const textarea = ref('')
+const disabled = ref(true)
+</script>
+
+<template>
+  <VField>
+    <VControl>
+      <VTextarea
+        v-model="textarea"
+        rows="4"
+        placeholder="A longer message..."
+        :disabled="disabled"
+      />
+    </VControl>
+  </VField>
+</template>
+```
+
+<!--/code-->
+
+<!--example-->
+
+<VField>
+  <VControl>
+    <VTextarea
+      v-model="frontmatter.state.textarea"
+      rows="4"
+      placeholder="A longer message..."
+      :disabled="frontmatter.state.disabled"
+    ></VTextarea>
+  </VControl>
+</VField>
+
+<!--/example-->