CSR-735 | Update list-button-horizontal to accept strings

src/layouts/quote/cash-or-insurance-question/cash-or-insurance-question.vue

@@ -30,7 +30,7 @@ export default ({
                 // Convert to CMS answer name from bool
                 var cmsAnswerValue = this.modelValue ? "InsuranceAnswer" : "CashAnswer";
                 // list-button-horizontal expects an array of values
-                return [cmsAnswerValue];
+                return cmsAnswerValue;
             },
             set: function(newValue) {
                 // Convert back to bool for parent component

src/ux-components/list-button-horizontal/list-button-horizontal.vue

@@ -24,6 +24,7 @@
 <script>
 import { useField } from "vee-validate";
 import loader from "@/ux-components/loader/loader";
+import { toRef } from "vue";
 import { queryStrings } from "@/constants/query-strings";
 
 export default {
@@ -57,14 +58,25 @@ export default {
       checkValue: Boolean,
     };
   },
-  created() {
-    if (Array.isArray(this.selectedValues)) {
-      this.checkValue = this.isMultiSelect
-        ? this.selectedValues.includes(this.value)
-        : this.selectedValues[0];
+  mounted() {
+    if (Array.isArray(this.validateValue)) {
+      this.checkValue = this.isValueSelectedByArray(this.selectedValues);
+      const isSelectedByValidator = this.isValueSelectedByArray(this.validateValue);
+      
+      if (this.checkValue != isSelectedByValidator) {
+        this.handleChange(this.value);
+      }
+    }
+    else {
+      this.checkValue = this.selectedValues;
     }
   },
   methods: {
+    isValueSelectedByArray(arr) {
+      return this.isMultiSelect
+        ? arr.includes(this.value)
+        : arr[0];
+    },
     displayLoader() {
       this.isLoaderDisplayed = true;
     },
@@ -123,11 +135,14 @@ export default {
     const {
       handleChange,
       errors,
-    } = useField(props.groupName, props.validationRules, fieldOptions);
+      value
+    } = useField(toRef(props, "groupName"), toRef(props, "validationRules"), fieldOptions); 
 
+    const validateValue = value;
     return {
       handleChange,
       errors,
+      validateValue,
       fieldOptions, // only need to expose this for unit test purposes
     };
   },