Merge branch 'develop' into defect/CSR-934

src/digital-components/base-input-button/button-functionality-props.js

@@ -4,8 +4,15 @@ export const inputButtonProps = {
         required: true,
     },
     modelValue: {
-        type: [Array, String, Number],
         required: true,
+        validator: function (prop) {
+            return (
+                prop === null ||
+                Array.isArray(prop) ||
+                typeof prop === "string" ||
+                (typeof prop === "number" && !Number.isNaN(prop))
+            );
+        },
     },
     isMultiSelect: Boolean,
     groupName: {

src/digital-components/button-question/button-question.vue

@@ -1,4 +1,5 @@
-<!-- Documented in confluence https://safelite.atlassian.net/wiki/spaces/DC/pages/76644418/Button+Question+Component -->
+<!-- Documented in confluence
+https://safelite.atlassian.net/wiki/spaces/DC/pages/76644418/Button+Question+Component -->
 <template>
     <div
         :class="
@@ -68,16 +69,19 @@
             </fieldset>
         </div>
         <div class="row form-test-error mt-1">
-            <error-message :name="formatString(groupName)" v-if="!suppressError"></error-message>
+            <error-message
+                class="small"
+                :name="formatString(groupName)"
+                v-if="!suppressError"></error-message>
         </div>
     </div>
 </template>
 
 <script>
-import listButton from "@/fmg-components/ux-components/list-button/list-button";
-import listButtonHorizontal from "@/fmg-components/ux-components/list-button-horizontal/list-button-horizontal";
-import listCard from "@/fmg-components/ux-components/list-card/list-card";
-import radio from "@/fmg-components/ux-components/radio/radio";
+import listButton from "@/ux-components/list-button/list-button";
+import listButtonHorizontal from "@/ux-components/list-button-horizontal/list-button-horizontal";
+import listCard from "@/ux-components/list-card/list-card";
+import radio from "@/ux-components/radio/radio";
 import { ErrorMessage } from "vee-validate";
 
 export default {

src/digital-components/modal/modal.vue

@@ -42,7 +42,7 @@
 </template>
 
 <script>
-import buttonMain from "@/fmg-components/ux-components/button-main/button-main";
+import buttonMain from "@/ux-components/button-main/button-main";
 
 export default {
     name: "modal",

src/digital-components/textbox-question/textbox-question.vue

@@ -32,8 +32,8 @@
                 @focus="$emit('focus', $event.target.value)" />
             <button v-if="includeSearchIcon" type="submit" aria-label="Search button" />
         </div>
-        <div v-show="errorMessage" class="row my-2 form-test-error">
-            <span class="d-inline-flex mt-0" role="alert">{{ errorMessage }}</span>
+        <div v-show="errorMessage" class="row my-1 form-test-error">
+            <span class="d-inline-flex small mt-0" role="alert">{{ errorMessage }}</span>
         </div>
     </div>
 </template>

src/fmg-components/funnel-footer/funnel-footer.vue

@@ -29,8 +29,8 @@
 </template>
 
 <script>
-import textLink from "@/fmg-components/ux-components/text-link/text-link";
-import buttonMain from "@/fmg-components/ux-components/button-main/button-main";
+import textLink from "@/ux-components/text-link/text-link";
+import buttonMain from "@/ux-components/button-main/button-main";
 
 export default {
     name: "funnelFooter",

src/fmg-components/funnel-header/funnel-header.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import eventBus from "@/helpers/event-bus/event-bus";
 import { globalEvents } from "@/constants/events";
 import menuModal from "@/fmg-components/funnel-header/menu-modal/menu-modal";

src/fmg-components/funnel-header/menu-modal/menu-modal.vue

@@ -78,7 +78,7 @@
 </template>
 
 <script>
-import textLink from "@/fmg-components/ux-components/text-link/text-link";
+import textLink from "@/ux-components/text-link/text-link";
 export default {
     name: "menuModal",
     data() {

src/fmg-components/layouts/questions-page-layout/questions-page-layout.vue

@@ -37,7 +37,7 @@
 // Components
 import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
 import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import questionChain from "@/digital-components/question-chain/question-chain";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
 import funnelFooter from "@/fmg-components/funnel-footer/funnel-footer";

src/layouts/address-lookup/address-lookup.vue

@@ -86,7 +86,7 @@ import funnelFooter from "@/fmg-components/funnel-footer/funnel-footer";
 import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
 import customerQuestions from "@/layouts/address-lookup/customer-questions/customer-questions";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
 
 import { Form, defineRule } from "vee-validate";

src/layouts/address-lookup/customer-questions/address-questions/address-questions.spec.js

@@ -1,6 +1,6 @@
 // Components
 import addressQuestions from "@/layouts/address-lookup/customer-questions/address-questions/address-questions";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 
 // Supporting Files
 import { mount, shallowMount } from "@vue/test-utils";

src/layouts/address-lookup/customer-questions/address-questions/address-questions.vue

@@ -73,7 +73,7 @@
 <script>
 import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
 import dropdownQuestion from "@/digital-components/dropdown-question/dropdown-question";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import { applicationConfig } from "@/constants/application-config.js";
 import { defineRule } from "vee-validate";
 import { required, regex } from "@/helpers/validation-rules";

src/layouts/address-vehicles/address-vehicles-question/address-vehicles-question.vue

@@ -22,7 +22,7 @@
 
 <script>
 import buttonQuestion from "@/digital-components/button-question/button-question";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 
 // Supporting files
 import { getDamageString } from "@/helpers/damage-helper";

src/layouts/address-vehicles/address-vehicles.vue

@@ -50,7 +50,7 @@ import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
 import funnelFooter from "@/fmg-components/funnel-footer/funnel-footer";
 import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import addressVehiclesQuestion from "@/layouts/address-vehicles/address-vehicles-question/address-vehicles-question";
 
 // Supporting files

src/layouts/estimate/estimate.vue

@@ -89,7 +89,7 @@ import funnelFooter from "@/fmg-components/funnel-footer/funnel-footer";
 import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
 import buttonQuestion from "@/digital-components/button-question/button-question";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
 import textBlock from "@/digital-components/text-block/text-block";
 import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";

src/layouts/license-plate-lookup/license-plate-lookup.vue

@@ -95,7 +95,7 @@ import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
 import funnelFooter from "@/fmg-components/funnel-footer/funnel-footer";
 import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
 import textBlock from "@/digital-components/text-block/text-block";
 

src/layouts/quote/service-package-question/service-package-radio/service-package-radio.vue

@@ -52,7 +52,7 @@
 
 <script>
 import baseInputButton from "@/digital-components/base-input-button/base-input-button";
-import textLink from "@/fmg-components/ux-components/text-link/text-link";
+import textLink from "@/ux-components/text-link/text-link";
 import inputButtonWrapperMixin from "@/mixins/input-button-wrapper-mixin";
 import {
     getLinkDisplayTextFromCopy,

src/layouts/vehicle-damage/vehicle-damage.vue

@@ -67,7 +67,7 @@ import sideDoorOptions from "@/layouts/vehicle-damage/side-door-options/side-doo
 import damageLocationQuestion from "@/layouts/vehicle-damage/damage-location-question/damage-location-question";
 import windshieldOptions from "@/layouts/vehicle-damage/windshield-options/windshield-options";
 import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-question/replace-options-question";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 
 // Supporting files
 import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

src/layouts/vehicle-damage/windshield-options/windshield-options.vue

@@ -42,7 +42,7 @@
 import windshieldDamageTypeQuestion from "@/layouts/vehicle-damage/windshield-options/windshield-damage-type-question/windshield-damage-type-question";
 import windshieldChipCountQuestion from "@/layouts/vehicle-damage/windshield-options/windshield-chip-count-question/windshield-chip-count-question";
 import replaceOptionsQuestion from "@/layouts/vehicle-damage/replace-options-question/replace-options-question";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 
 import { defineRule } from "vee-validate";
 import { required } from "@/helpers/validation-rules";

src/layouts/vehicle-parts/vehicle-parts.vue

@@ -49,7 +49,7 @@ import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
 import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
 import funnelFooter from "@/fmg-components/funnel-footer/funnel-footer";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import loadingModal from "@/fmg-components/loading-modal/loading-modal.vue";
 // Supporting Files
 import { fetchCmsContentForPage } from "@/helpers/cms-content-helper";

src/layouts/vin-lookup/vin-information/vin-information.vue

@@ -11,7 +11,7 @@
 </template>
 
 <script>
-import textLink from "@/fmg-components/ux-components/text-link/text-link";
+import textLink from "@/ux-components/text-link/text-link";
 //Supporting files
 import { settleAllPromises } from "@/helpers/layout-helper";
 export default {

src/layouts/vin-lookup/vin-lookup.vue

@@ -114,7 +114,7 @@ import funnelHeader from "@/fmg-components/funnel-header/funnel-header";
 import funnelFooter from "@/fmg-components/funnel-footer/funnel-footer";
 import vehicleBanner from "@/fmg-components/vehicle-banner/vehicle-banner";
 import funnelSubHeader from "@/fmg-components/funnel-sub-header/funnel-sub-header";
-import alert from "@/fmg-components/ux-components/alert/alert";
+import alert from "@/ux-components/alert/alert";
 import textboxQuestion from "@/digital-components/textbox-question/textbox-question";
 import vinInformation from "@/layouts/vin-lookup/vin-information/vin-information";
 import textBlock from "@/digital-components/text-block/text-block";

src/mixins/input-button-wrapper-mixin.spec.js

@@ -1,10 +1,10 @@
 import { mount } from "@vue/test-utils";
 import baseInputButton from "@/digital-components/base-input-button/base-input-button";
 import inputButtonWrapperMixin from "@/mixins/input-button-wrapper-mixin";
-import listButtonHorizontal from "@/fmg-components/ux-components/list-button-horizontal/list-button-horizontal";
-import listButton from "@/fmg-components/ux-components/list-button/list-button";
-import listCard from "@/fmg-components/ux-components/list-card/list-card";
-import radio from "@/fmg-components/ux-components/radio/radio";
+import listButtonHorizontal from "@/ux-components/list-button-horizontal/list-button-horizontal";
+import listButton from "@/ux-components/list-button/list-button";
+import listCard from "@/ux-components/list-card/list-card";
+import radio from "@/ux-components/radio/radio";
 
 describe("input-button-wrapper-mixin", () => {
     describe("mouse clicks", () => {

src/styles/common-typography-styles.scss

@@ -42,7 +42,7 @@ h6,
 
 .small {
     font-size: 0.875rem;
-    line-height: 1.7;
+    line-height: 1.7142857143;
     font-weight: 400;
 }
 

src/ux-components/button-main/button-main.vue

@@ -17,7 +17,7 @@
 </template>
 
 <script>
-import loader from "@/fmg-components/ux-components/loader/loader";
+import loader from "@/ux-components/loader/loader";
 
 export default {
     name: "buttonMain",

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

@@ -23,7 +23,7 @@
 </template>
 
 <script>
-import loader from "@/fmg-components/ux-components/loader/loader";
+import loader from "@/ux-components/loader/loader";
 import baseInputButton from "@/digital-components/base-input-button/base-input-button";
 import inputButtonWrapperMixin from "@/mixins/input-button-wrapper-mixin";
 

src/ux-components/loader/loader.vue

@@ -42,7 +42,7 @@ export default {
     //Spinner basics
     &:after {
         content: "";
-        mask: url(../../../assets/img/icons/spinner.svg);
+        mask: url(../../assets/img/icons/spinner.svg);
         mask-size: cover;
         position: relative;
         width: 1rem;