From d3d8d9bfa8c191b5a4c19a72326f046c03b2f422 Mon Sep 17 00:00:00 2001
From: Leah Schumann <leah.schumann@safelite.com>
Date: Tue, 24 Jan 2023 15:55:13 -0500
Subject: [PATCH] Added onShownCallback property and handler

---
 src/digital-components/modal/modal.vue               |  3 +++
 .../service-zip-modal-question.vue                   | 12 +++++++++---
 2 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/digital-components/modal/modal.vue b/src/digital-components/modal/modal.vue
index 7ec090aab..013a42168 100644
--- a/src/digital-components/modal/modal.vue
+++ b/src/digital-components/modal/modal.vue
@@ -49,6 +49,9 @@ export default {
     name: "modal",
     props: {
         cmsWidgetName: String,
+        onShownCallback: {
+            type: Function,
+        },
 
         footerButtonCallback: {
             type: Function,
diff --git a/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue b/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue
index 47577a2ec..1ab55f165 100644
--- a/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue
+++ b/src/layouts/service-location/service-zip-modal-question/service-zip-modal-question.vue
@@ -13,13 +13,13 @@
                 href="#!"
                 data-bs-toggle="modal"
                 :data-bs-target="getModalId"
-                aria-label="Modal window"
-                @click-event="onModalOpen" />
+                aria-label="Modal window" />
         </div>
     </div>
     <modal
         ref="zipCodeInputModal"
         :cmsWidgetName="this.modalWidgetName"
+        :onShownCallback="onModalOpen"
         :footerButtonCallback="setZip">
         <div class="ps-4 pe-4 pb-4">
             <textboxQuestion
@@ -62,6 +62,7 @@ import textboxQuestion from "@/digital-components/textbox-question/textbox-quest
 import { defineRule } from "vee-validate";
 import { required, regex } from "@/helpers/validation-rules";
 import { errorMessages } from "@/constants/error-messages";
+import { isNoUnitNumericStyleProp } from "@vue/shared";
 
 // Define Validation Rules
 defineRule("zip-required", required(errorMessages.SERVICE_ZIP_REQUIRED));
@@ -104,7 +105,12 @@ export default {
             this.$refs.zipCodeInputModal.resetButtonStyle();
         },
 
-        focusOnZipInput() {},
+        focusOnZipInput() {
+            this.$nextTick(() => {
+                const input = this.$refs.zipInputTextQuestion.$refs.serviceZipCodeInput;
+                input.focus();
+            });
+        },
 
         onModalOpen() {
             this.serviceZipCodeInput = this.serviceZip;