Add naive support to auto-expand selected values on initialization

client/src/components/Form/Elements/FormDrilldown/FormDrilldown.vue

@@ -78,7 +78,7 @@ function onSelectAll(selected: boolean): void {
 <template>
     <div v-if="hasOptions">
         <b-form-checkbox
-            v-if="props.multiple"
+            v-if="multiple"
             v-localize
             :checked="selectAllChecked"
             :indeterminate="selectAllIndeterminate"
@@ -87,7 +87,7 @@ function onSelectAll(selected: boolean): void {
             Select/Unselect All
         </b-form-checkbox>
         <form-drilldown-list
-            :multiple="props.multiple"
+            :multiple="multiple"
             :current-value="currentValue"
             :options="options"
             :handle-click="handleClick" />

client/src/components/Form/Elements/FormDrilldown/FormDrilldownList.vue

@@ -14,7 +14,7 @@ const props = defineProps<Props>();
 
 <template>
     <div>
-        <ul v-for="option in props.options" :key="option.name" class="ui-drilldown m-0">
+        <ul v-for="(option, index) in props.options" :key="option.name" class="ui-drilldown m-0">
             <form-drilldown-option
                 :multiple="props.multiple"
                 :current-value="currentValue"

client/src/components/Form/Elements/FormDrilldown/FormDrilldownOption.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { computed, ref, type ComputedRef } from "vue";
+import { computed, onMounted, ref, type ComputedRef } from "vue";
 import FormDrilldownList from "./FormDrilldownList.vue";
-import type { Option } from "./utilities";
+import { getAllValues, type Option } from "./utilities";
 
 export interface Props {
     currentValue: string[];
@@ -36,6 +36,19 @@ const singleValue = computed({
 function toggleChildren(): void {
     showChildren.value = !showChildren.value;
 }
+
+function toggleInitialization(): void {
+    const childValues = getAllValues(props.option.options);
+    for (const childValue of childValues) {
+        if (props.currentValue.includes(childValue)) {
+            showChildren.value = true;
+            break;
+        }
+    }
+}
+onMounted(() => {
+    toggleInitialization();
+});
 </script>
 
 <template>
@@ -63,7 +76,7 @@ function toggleChildren(): void {
             v-if="hasOptions"
             v-show="showChildren"
             :current-value="currentValue"
-            :multiple="props.multiple"
+            :multiple="multiple"
             :options="option.options"
             :handle-click="handleClick" />
     </li>