feat: Clear form element values when hidden

legalconsenthub/app/components/FormStepperWithNavigation.vue

@@ -99,10 +99,13 @@ const { stepper, activeStepperItemIndex, stepperItems, currentFormElementSection
   computed(() => props.formElementSections)
 )
 
-const { evaluateVisibility } = useFormElementVisibility()
+const { evaluateFormElementVisibility } = useFormElementVisibility()
+const { clearHiddenFormElementValues } = useFormElementValueClearing()
 const { processSpawnTriggers } = useSectionSpawning()
 const { cloneElement } = useClonableElements()
 
+const previousVisibilityMap = ref<Map<string, boolean>>(new Map())
+
 const allFormElements = computed(() => {
   return props.formElementSections.flatMap(
     (section) => section.formElementSubSections?.flatMap((subsection) => subsection.formElements) ?? []
@@ -110,7 +113,7 @@ const allFormElements = computed(() => {
 })
 
 const visibilityMap = computed(() => {
-  return evaluateVisibility(allFormElements.value)
+  return evaluateFormElementVisibility(allFormElements.value)
 })
 
 const visibleSubsections = computed(() => {
@@ -137,6 +140,7 @@ onMounted(() => {
   if (props.initialSectionIndex !== undefined) {
     activeStepperItemIndex.value = props.initialSectionIndex
   }
+  previousVisibilityMap.value = visibilityMap.value
 })
 
 async function handleAddInputForm(position: number, subsectionKey: string) {
@@ -191,9 +195,22 @@ function handleCloneElement(element: FormElementDto, position: number, subsectio
 function handleFormElementUpdate(updatedFormElements: FormElementDto[], subsectionKey: string) {
   let updatedSections = updateSubsectionElements(props.formElementSections, subsectionKey, updatedFormElements)
   updatedSections = processSpawnTriggers(updatedSections, updatedFormElements)
+  updatedSections = clearNewlyHiddenFormElements(updatedSections)
   emit('update:formElementSections', updatedSections)
 }
 
+function clearNewlyHiddenFormElements(sections: FormElementSectionDto[]): FormElementSectionDto[] {
+  const allElements = sections.flatMap(
+    (section) => section.formElementSubSections?.flatMap((subsection) => subsection.formElements) ?? []
+  )
+  const newVisibilityMap = evaluateFormElementVisibility(allElements)
+
+  const clearedSections = clearHiddenFormElementValues(sections, previousVisibilityMap.value, newVisibilityMap)
+  previousVisibilityMap.value = newVisibilityMap
+
+  return clearedSections
+}
+
 function getSubsectionKey(
   section: FormElementSectionDto | undefined,
   sectionIndex: number,