From 4b06f682659e2bb400e365d5deef3155da338cb4 Mon Sep 17 00:00:00 2001
From: Denis Lugowski <denis.lugowski@gmail.com>
Date: Sat, 6 Dec 2025 18:00:27 +0100
Subject: [PATCH] feat: Add textarea form element

---
 CLAUDE.md                                     |  4 +--
 api/legalconsenthub.yml                       |  1 +
 legalconsenthub/app/components/FormEngine.vue |  2 ++
 .../components/formelements/TheTextarea.vue   | 31 ++++++++++++++++++
 testdata.json                                 | 32 +++++++++----------
 5 files changed, 52 insertions(+), 18 deletions(-)
 create mode 100644 legalconsenthub/app/components/formelements/TheTextarea.vue

diff --git a/CLAUDE.md b/CLAUDE.md
index 4eeed1a..77fadf1 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -99,7 +99,7 @@ Application Form
             └── Form Elements (FormElement)
                  ├── id (UUID - generated by backend)
                  ├── reference (string - custom key like "art_der_massnahme")
-                 ├── type (SELECT, CHECKBOX, RADIOBUTTON, TEXTFIELD, SWITCH, TITLE_BODY_TEXTFIELDS)
+                 ├── type (SELECT, CHECKBOX, RADIOBUTTON, TEXTFIELD, TEXTAREA, SWITCH, TITLE_BODY_TEXTFIELDS, DATE)
                  ├── title, description
                  ├── options (FormOption[])
                  │    ├── value, label
@@ -227,7 +227,7 @@ Form elements can be conditionally shown or hidden based on the values of other
   "reference": "testphase_zeitraum",
   "title": "Testphase Zeitraum",
   "description": "Zeitraum der Testphase",
-  "type": "TEXTFIELD",
+  "type": "TEXTAREA",
   "options": [
     {
       "value": "",
diff --git a/api/legalconsenthub.yml b/api/legalconsenthub.yml
index a40f280..0ac9366 100644
--- a/api/legalconsenthub.yml
+++ b/api/legalconsenthub.yml
@@ -1457,6 +1457,7 @@ components:
         - CHECKBOX
         - RADIOBUTTON
         - TEXTFIELD
+        - TEXTAREA
         - SWITCH
         - TITLE_BODY_TEXTFIELDS
         - DATE
diff --git a/legalconsenthub/app/components/FormEngine.vue b/legalconsenthub/app/components/FormEngine.vue
index 6119d29..e1bb078 100644
--- a/legalconsenthub/app/components/FormEngine.vue
+++ b/legalconsenthub/app/components/FormEngine.vue
@@ -89,6 +89,8 @@ function getResolvedComponent(formElement: FormElementDto) {
       return resolveComponent('TheSwitch')
     case 'TEXTFIELD':
       return resolveComponent('TheInput')
+    case 'TEXTAREA':
+      return resolveComponent('TheTextarea')
     case 'TITLE_BODY_TEXTFIELDS':
       return resolveComponent('TheTitleBodyInput')
     case 'DATE':
diff --git a/legalconsenthub/app/components/formelements/TheTextarea.vue b/legalconsenthub/app/components/formelements/TheTextarea.vue
new file mode 100644
index 0000000..f0bee2c
--- /dev/null
+++ b/legalconsenthub/app/components/formelements/TheTextarea.vue
@@ -0,0 +1,31 @@
+<template>
+  <UFormField :label="label">
+    <UTextarea v-model="modelValue" class="w-full" autoresize />
+  </UFormField>
+</template>
+
+<script setup lang="ts">
+import type { FormOptionDto } from '~~/.api-client'
+
+const props = defineProps<{
+  label?: string
+  formOptions: FormOptionDto[]
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:formOptions', value: FormOptionDto[]): void
+}>()
+
+const modelValue = computed({
+  get: () => props.formOptions[0]?.value ?? '',
+  set: (val) => {
+    const firstOption = props.formOptions[0]
+    if (val && firstOption) {
+      const updatedModelValue = [...props.formOptions]
+      updatedModelValue[0] = { ...firstOption, value: val.toString() }
+      emit('update:formOptions', updatedModelValue)
+    }
+  }
+})
+</script>
+
diff --git a/testdata.json b/testdata.json
index bc5987a..6d5ccaa 100644
--- a/testdata.json
+++ b/testdata.json
@@ -107,7 +107,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "testphase_findet_statt",
@@ -153,7 +153,7 @@
                   "employeeDataCategory": "SENSITIVE"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "verwendung_anonymisierter_daten",
@@ -173,7 +173,7 @@
                   "employeeDataCategory": "REVIEW_REQUIRED"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "verwendung_anonymisierter_daten",
@@ -193,7 +193,7 @@
                   "employeeDataCategory": "SENSITIVE"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "verwendung_anonymisierter_daten",
@@ -233,7 +233,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "abgeloestes_system",
@@ -273,7 +273,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "geaendertes_system",
@@ -299,7 +299,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "HIDE",
                 "sourceFormElementReference": "art_der_massnahme",
@@ -319,7 +319,7 @@
                   "employeeDataCategory": "REVIEW_REQUIRED"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "HIDE",
                 "sourceFormElementReference": "art_der_massnahme",
@@ -339,7 +339,7 @@
                   "employeeDataCategory": "REVIEW_REQUIRED"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "HIDE",
                 "sourceFormElementReference": "art_der_massnahme",
@@ -365,7 +365,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "HIDE",
                 "sourceFormElementReference": "art_der_massnahme",
@@ -385,7 +385,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "HIDE",
                 "sourceFormElementReference": "art_der_massnahme",
@@ -405,7 +405,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "HIDE",
                 "sourceFormElementReference": "art_der_massnahme",
@@ -535,7 +535,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "modulbasiertes_system",
@@ -555,7 +555,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "modulbasiertes_system",
@@ -575,7 +575,7 @@
                   "employeeDataCategory": "NON_CRITICAL"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "modulbasiertes_system",
@@ -647,7 +647,7 @@
                   "employeeDataCategory": "REVIEW_REQUIRED"
                 }
               ],
-              "type": "TEXTFIELD",
+              "type": "TEXTAREA",
               "visibilityCondition": {
                 "conditionType": "SHOW",
                 "sourceFormElementReference": "wirtschaftliche_auswirkungen",