From 833f965e8b0c118c34a0a6037e6b711bd1077981 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Thu, 19 Sep 2024 16:18:06 -0400
Subject: [PATCH 01/11] feat: add search bar to nav bar

---
 es-design-system/layouts/nav.vue              |  3 +-
 es-vue-base/src/lib-components/EsNavBar.vue   | 48 ++++++++++++++++++-
 .../src/lib-components/EsNavBarSearchBar.vue  | 46 ++++++++++++++++++
 3 files changed, 95 insertions(+), 2 deletions(-)
 create mode 100644 es-vue-base/src/lib-components/EsNavBarSearchBar.vue

diff --git a/es-design-system/layouts/nav.vue b/es-design-system/layouts/nav.vue
index dab77f75e..3a4f319e1 100644
--- a/es-design-system/layouts/nav.vue
+++ b/es-design-system/layouts/nav.vue
@@ -2,7 +2,8 @@
     <div>
         <es-nav-bar
             :account-content="accountContent"
-            :global-content="globalContent">
+            :global-content="globalContent"
+            show-search>
             <template #logo>
                 <ds-es-logo />
             </template>
diff --git a/es-vue-base/src/lib-components/EsNavBar.vue b/es-vue-base/src/lib-components/EsNavBar.vue
index 7f4450081..e088f387b 100644
--- a/es-vue-base/src/lib-components/EsNavBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBar.vue
@@ -100,6 +100,17 @@
                                 <slot name="logo" />
                             </template>
                         </es-nav-bar-top-level-menu>
+                        <div v-if="showSearch" class="nav-item d-none d-lg-block pt-100">
+                            <es-button
+                                variant="link"
+                                class="nav-link dropdown-toggle d-none d-lg-flex flex-nowrap py-100"
+                                @click="toggleSearchBar()">
+                                <icon-search
+                                    class="align-self-center account-icon"
+                                    width="20px"
+                                    height="20px" />
+                            </es-button>
+                        </div>
                         <!-- desktop account menu -->
                         <es-nav-bar-account-menu
                             :auth-items="accountContent.loggedIn.items"
@@ -107,7 +118,24 @@
                             :logged-out="accountContent.loggedOut" />
                     </b-container>
                     <!-- mobile+desktop product menus -->
-                    <b-container class="d-flex flex-lg-nowrap justify-content-lg-end product-menu">
+                    <b-container v-if="searchBarOpen">
+                        <div class="row w-100">
+                            <es-nav-bar-search-bar>
+                                <template #close>
+                                    <es-button
+                                        class="position-absolute"
+                                        style="right: 0"
+                                        variant="link"
+                                        @click="toggleSearchBar()">
+                                        <icon-x
+                                            width="30px"
+                                            height="30px" />
+                                    </es-button>
+                                </template>
+                            </es-nav-bar-search-bar>
+                        </div>
+                    </b-container>
+                    <b-container v-else class="d-flex flex-lg-nowrap justify-content-lg-end product-menu">
                         <div class="row">
                             <es-nav-bar-product-menu
                                 v-for="product in globalContent.products"
@@ -225,6 +253,8 @@ import EsNavBarAccountMenu from './EsNavBarAccountMenu.vue';
 import EsNavBarLink from './EsNavBarLink.vue';
 import EsNavBarProductMenu from './EsNavBarProductMenu.vue';
 import EsNavBarTopLevelMenu from './EsNavBarTopLevelMenu.vue';
+import EsNavBarSearchBar from './EsNavBarSearchBar.vue';
+import IconX from '../lib-icons/icon-x.vue';
 
 export default {
     name: 'EsNavBar',
@@ -234,17 +264,33 @@ export default {
         EsNavBarLink,
         EsNavBarProductMenu,
         EsNavBarTopLevelMenu,
+        EsNavBarSearchBar
     },
     props: {
         accountContent: {
             type: Object,
             required: true,
         },
+        showSearch: {
+            type: Boolean,
+            default: false,
+        },
         globalContent: {
             type: Object,
             required: true,
         },
     },
+    data() {
+        return {
+            searchBarOpen: false,
+        }
+    },
+    methods: {
+        toggleSearchBar() {
+            this.searchBarOpen = !this.searchBarOpen;
+            console.log(this.searchBarOpen);
+        }
+    },
     mounted() {
         // CUSTOM GLOBAL-NAV SCRIPT STARTS
 
diff --git a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
new file mode 100644
index 000000000..0666c5122
--- /dev/null
+++ b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
@@ -0,0 +1,46 @@
+<template>
+   <div class="align-items-center w-100 d-flex justify-content-center position-relative">
+        <div class="d-flex align-items-center mx-auto justify-content-center w-100">
+            <es-form-input
+                class="mt-3 w-50"
+                id="searchBar"
+                v-model="searchText"
+                label-sr-only
+                :placeholder="label">
+                <template #prefixIcon>
+                    <icon-search />
+                </template>
+            </es-form-input>
+            <es-button class="ml-50">
+                {{ buttonText }}
+            </es-button>
+        </div>
+        <slot name="close" />
+    </div>
+</template>
+
+<script lang="js">
+import EsNavBarLink from './EsNavBarLink.vue';
+
+export default {
+    name: 'EsNavBarSearchBar',
+    components: {
+        EsNavBarLink,
+    },
+    props: {
+        label: {
+            type: String,
+            default: 'Try "best solar panels"',
+        },
+        buttonText: {
+            type: String,
+            default: 'Search',
+        },
+    },
+    data() {
+        return {
+            searchText: '',
+        }
+    },
+};
+</script>

From 1980176dd4bacb5e74de1a1eb1de652be736ab3d Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Thu, 19 Sep 2024 16:24:17 -0400
Subject: [PATCH 02/11] chore: remove console log

---
 es-vue-base/src/lib-components/EsNavBar.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/es-vue-base/src/lib-components/EsNavBar.vue b/es-vue-base/src/lib-components/EsNavBar.vue
index e088f387b..3a438225e 100644
--- a/es-vue-base/src/lib-components/EsNavBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBar.vue
@@ -288,7 +288,6 @@ export default {
     methods: {
         toggleSearchBar() {
             this.searchBarOpen = !this.searchBarOpen;
-            console.log(this.searchBarOpen);
         }
     },
     mounted() {

From 4c16f835e6e574bd95793f8383fab4f78c842bdd Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Thu, 19 Sep 2024 16:29:37 -0400
Subject: [PATCH 03/11] fix: apply v-model to search bar usage

---
 es-vue-base/src/lib-components/EsNavBar.vue          |  4 +++-
 es-vue-base/src/lib-components/EsNavBarSearchBar.vue | 10 +++-------
 2 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/es-vue-base/src/lib-components/EsNavBar.vue b/es-vue-base/src/lib-components/EsNavBar.vue
index 3a438225e..32b202369 100644
--- a/es-vue-base/src/lib-components/EsNavBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBar.vue
@@ -120,7 +120,8 @@
                     <!-- mobile+desktop product menus -->
                     <b-container v-if="searchBarOpen">
                         <div class="row w-100">
-                            <es-nav-bar-search-bar>
+                            <es-nav-bar-search-bar
+                                v-model="searchText">
                                 <template #close>
                                     <es-button
                                         class="position-absolute"
@@ -283,6 +284,7 @@ export default {
     data() {
         return {
             searchBarOpen: false,
+            searchText: '',
         }
     },
     methods: {
diff --git a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
index 0666c5122..154af5a8e 100644
--- a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
@@ -4,9 +4,10 @@
             <es-form-input
                 class="mt-3 w-50"
                 id="searchBar"
-                v-model="searchText"
+                v-bind="$attrs"
                 label-sr-only
-                :placeholder="label">
+                :placeholder="label"
+                v-on="$listeners" >
                 <template #prefixIcon>
                     <icon-search />
                 </template>
@@ -37,10 +38,5 @@ export default {
             default: 'Search',
         },
     },
-    data() {
-        return {
-            searchText: '',
-        }
-    },
 };
 </script>

From 12cfde3ce2fef25287c0d86a42ff7bb50adf8321 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Thu, 19 Sep 2024 16:38:19 -0400
Subject: [PATCH 04/11] fix: apply v-model to nav bar usage

---
 es-design-system/layouts/nav.vue            | 7 +++++++
 es-vue-base/src/lib-components/EsNavBar.vue | 4 ++--
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/es-design-system/layouts/nav.vue b/es-design-system/layouts/nav.vue
index 3a4f319e1..f2fdea3f0 100644
--- a/es-design-system/layouts/nav.vue
+++ b/es-design-system/layouts/nav.vue
@@ -1,6 +1,8 @@
 <template>
     <div>
+        text: {{ searchText }}
         <es-nav-bar
+            v-model="searchText"
             :account-content="accountContent"
             :global-content="globalContent"
             show-search>
@@ -53,6 +55,11 @@ import { getEsNavBarAccountContent, getEsNavBarGlobalContent } from '@energysage
 /* eslint-disable vue/multi-word-component-names, vue/component-definition-name-casing */
 export default {
     name: 'NavLayout',
+    data() {
+        return {
+            searchText: '',
+        };
+    },
     computed: {
         accountContent() {
             return getEsNavBarAccountContent();
diff --git a/es-vue-base/src/lib-components/EsNavBar.vue b/es-vue-base/src/lib-components/EsNavBar.vue
index 32b202369..14f06c63c 100644
--- a/es-vue-base/src/lib-components/EsNavBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBar.vue
@@ -121,7 +121,8 @@
                     <b-container v-if="searchBarOpen">
                         <div class="row w-100">
                             <es-nav-bar-search-bar
-                                v-model="searchText">
+                                v-bind="$attrs"
+                                v-on="$listeners" >
                                 <template #close>
                                     <es-button
                                         class="position-absolute"
@@ -284,7 +285,6 @@ export default {
     data() {
         return {
             searchBarOpen: false,
-            searchText: '',
         }
     },
     methods: {

From 00a621144fa3cdccd3a8248f60b8c7e9a2a7da79 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Thu, 19 Sep 2024 16:39:41 -0400
Subject: [PATCH 05/11] chore: remove logging

---
 es-design-system/layouts/nav.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/es-design-system/layouts/nav.vue b/es-design-system/layouts/nav.vue
index f2fdea3f0..d3a086631 100644
--- a/es-design-system/layouts/nav.vue
+++ b/es-design-system/layouts/nav.vue
@@ -1,6 +1,5 @@
 <template>
     <div>
-        text: {{ searchText }}
         <es-nav-bar
             v-model="searchText"
             :account-content="accountContent"

From 3177fff9ffe2a0bc0d1d35d6334cb62ffa62f0a3 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Thu, 19 Sep 2024 16:46:21 -0400
Subject: [PATCH 06/11] style: fix lint errors

---
 es-vue-base/src/lib-components/EsNavBar.vue   | 23 ++++++++++---------
 .../src/lib-components/EsNavBarSearchBar.vue  | 10 +++-----
 es-vue-base/tests/EsZipCodeForm.spec.js       |  2 +-
 3 files changed, 16 insertions(+), 19 deletions(-)

diff --git a/es-vue-base/src/lib-components/EsNavBar.vue b/es-vue-base/src/lib-components/EsNavBar.vue
index 14f06c63c..0fc392d79 100644
--- a/es-vue-base/src/lib-components/EsNavBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBar.vue
@@ -100,7 +100,8 @@
                                 <slot name="logo" />
                             </template>
                         </es-nav-bar-top-level-menu>
-                        <div v-if="showSearch" class="nav-item d-none d-lg-block pt-100">
+                        <div v-if="showSearch"
+                            class="nav-item d-none d-lg-block pt-100">
                             <es-button
                                 variant="link"
                                 class="nav-link dropdown-toggle d-none d-lg-flex flex-nowrap py-100"
@@ -122,7 +123,7 @@
                         <div class="row w-100">
                             <es-nav-bar-search-bar
                                 v-bind="$attrs"
-                                v-on="$listeners" >
+                                v-on="$listeners">
                                 <template #close>
                                     <es-button
                                         class="position-absolute"
@@ -137,7 +138,8 @@
                             </es-nav-bar-search-bar>
                         </div>
                     </b-container>
-                    <b-container v-else class="d-flex flex-lg-nowrap justify-content-lg-end product-menu">
+                    <b-container v-else
+                        class="d-flex flex-lg-nowrap justify-content-lg-end product-menu">
                         <div class="row">
                             <es-nav-bar-product-menu
                                 v-for="product in globalContent.products"
@@ -256,7 +258,6 @@ import EsNavBarLink from './EsNavBarLink.vue';
 import EsNavBarProductMenu from './EsNavBarProductMenu.vue';
 import EsNavBarTopLevelMenu from './EsNavBarTopLevelMenu.vue';
 import EsNavBarSearchBar from './EsNavBarSearchBar.vue';
-import IconX from '../lib-icons/icon-x.vue';
 
 export default {
     name: 'EsNavBar',
@@ -266,7 +267,7 @@ export default {
         EsNavBarLink,
         EsNavBarProductMenu,
         EsNavBarTopLevelMenu,
-        EsNavBarSearchBar
+        EsNavBarSearchBar,
     },
     props: {
         accountContent: {
@@ -285,12 +286,7 @@ export default {
     data() {
         return {
             searchBarOpen: false,
-        }
-    },
-    methods: {
-        toggleSearchBar() {
-            this.searchBarOpen = !this.searchBarOpen;
-        }
+        };
     },
     mounted() {
         // CUSTOM GLOBAL-NAV SCRIPT STARTS
@@ -450,5 +446,10 @@ export default {
 
         // CUSTOM GLOBAL-NAV SCRIPT ENDS
     },
+    methods: {
+        toggleSearchBar() {
+            this.searchBarOpen = !this.searchBarOpen;
+        },
+    },
 };
 </script>
diff --git a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
index 154af5a8e..01caa4385 100644
--- a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
@@ -1,13 +1,13 @@
 <template>
-   <div class="align-items-center w-100 d-flex justify-content-center position-relative">
+    <div class="align-items-center w-100 d-flex justify-content-center position-relative">
         <div class="d-flex align-items-center mx-auto justify-content-center w-100">
             <es-form-input
-                class="mt-3 w-50"
                 id="searchBar"
+                class="mt-3 w-50"
                 v-bind="$attrs"
                 label-sr-only
                 :placeholder="label"
-                v-on="$listeners" >
+                v-on="$listeners">
                 <template #prefixIcon>
                     <icon-search />
                 </template>
@@ -21,13 +21,9 @@
 </template>
 
 <script lang="js">
-import EsNavBarLink from './EsNavBarLink.vue';
 
 export default {
     name: 'EsNavBarSearchBar',
-    components: {
-        EsNavBarLink,
-    },
     props: {
         label: {
             type: String,
diff --git a/es-vue-base/tests/EsZipCodeForm.spec.js b/es-vue-base/tests/EsZipCodeForm.spec.js
index 8cbfb1c8c..d4aafd910 100644
--- a/es-vue-base/tests/EsZipCodeForm.spec.js
+++ b/es-vue-base/tests/EsZipCodeForm.spec.js
@@ -19,7 +19,7 @@ describe('EsZipCodeForm', () => {
         // Simulate a delay (e.g., 2 seconds)
         await new Promise((resolve) => {
             setTimeout(() => {
-              resolve();
+                resolve();
             }, 2000);
         });
 

From f1686e1104f9488e95be7b0edbbd59f431e97b49 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Fri, 20 Sep 2024 09:44:10 -0400
Subject: [PATCH 07/11] style: add indentation

---
 es-vue-base/src/lib-components/EsNavBar.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/es-vue-base/src/lib-components/EsNavBar.vue b/es-vue-base/src/lib-components/EsNavBar.vue
index 0fc392d79..c9e91006f 100644
--- a/es-vue-base/src/lib-components/EsNavBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBar.vue
@@ -100,7 +100,8 @@
                                 <slot name="logo" />
                             </template>
                         </es-nav-bar-top-level-menu>
-                        <div v-if="showSearch"
+                        <div
+                            v-if="showSearch"
                             class="nav-item d-none d-lg-block pt-100">
                             <es-button
                                 variant="link"
@@ -138,7 +139,8 @@
                             </es-nav-bar-search-bar>
                         </div>
                     </b-container>
-                    <b-container v-else
+                    <b-container
+                        v-else
                         class="d-flex flex-lg-nowrap justify-content-lg-end product-menu">
                         <div class="row">
                             <es-nav-bar-product-menu

From da0cca5199a218120c1e53e5e2bfe26cad073230 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Mon, 23 Sep 2024 14:29:58 -0400
Subject: [PATCH 08/11] fix: changes based on feedback

---
 es-bs-base/scss/_nav.scss                            | 11 +++++++++++
 es-design-system/layouts/nav.vue                     |  9 ++++++++-
 es-design-system/package-lock.json                   |  6 +++---
 es-vue-base/src/lib-components/EsNavBar.vue          | 12 +++++++++---
 es-vue-base/src/lib-components/EsNavBarSearchBar.vue | 12 +++++++++++-
 5 files changed, 42 insertions(+), 8 deletions(-)

diff --git a/es-bs-base/scss/_nav.scss b/es-bs-base/scss/_nav.scss
index 1abd4b15f..869ae351c 100644
--- a/es-bs-base/scss/_nav.scss
+++ b/es-bs-base/scss/_nav.scss
@@ -29,6 +29,17 @@
   }
 }
 
+.nav-button {
+  &:hover {
+    background: variables.$blue-50 !important;
+  }
+
+  &:focus,
+  &.focus {
+    border-color: variables.$blue-500;
+  }
+}
+
 //
 // Tabs
 //
diff --git a/es-design-system/layouts/nav.vue b/es-design-system/layouts/nav.vue
index d3a086631..e14d2654f 100644
--- a/es-design-system/layouts/nav.vue
+++ b/es-design-system/layouts/nav.vue
@@ -4,7 +4,8 @@
             v-model="searchText"
             :account-content="accountContent"
             :global-content="globalContent"
-            show-search>
+            show-search
+            @searchButtonClicked="searchButtonClicked">
             <template #logo>
                 <ds-es-logo />
             </template>
@@ -84,5 +85,11 @@ export default {
             return getEsNavBarGlobalContent();
         },
     },
+    methods: {
+        searchButtonClicked() {
+            /* eslint-disable-next-line no-console */
+            console.log('Searching...');
+        },
+    },
 };
 </script>
diff --git a/es-design-system/package-lock.json b/es-design-system/package-lock.json
index 49c9bf455..47b6b2f6f 100644
--- a/es-design-system/package-lock.json
+++ b/es-design-system/package-lock.json
@@ -2778,9 +2778,9 @@
             }
         },
         "node_modules/@energysage/es-vue-base": {
-            "version": "2.0.6",
-            "resolved": "https://registry.npmjs.org/@energysage/es-vue-base/-/es-vue-base-2.0.6.tgz",
-            "integrity": "sha512-cnfD+B7wSTvFODLduKiQlMMuA0cnvB6UtXa9XVicAAID9WhARErxJzjFSmLeNv3LEQxC8plooLGv5AMqRVZxGw==",
+            "version": "2.1.0",
+            "resolved": "https://registry.npmjs.org/@energysage/es-vue-base/-/es-vue-base-2.1.0.tgz",
+            "integrity": "sha512-Q+ZKazgbYEkDQGFiZHjX8s8J1dw/qt3BN/bKHUBfzM5eFHVgA4aAasYTZv5pspZ8LH02ZI3nEloAlf9xA5ouxA==",
             "dependencies": {
                 "path": "^0.12.7",
                 "vue-the-mask": "^0.11.1"
diff --git a/es-vue-base/src/lib-components/EsNavBar.vue b/es-vue-base/src/lib-components/EsNavBar.vue
index c9e91006f..ebf4af318 100644
--- a/es-vue-base/src/lib-components/EsNavBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBar.vue
@@ -105,7 +105,8 @@
                             class="nav-item d-none d-lg-block pt-100">
                             <es-button
                                 variant="link"
-                                class="nav-link dropdown-toggle d-none d-lg-flex flex-nowrap py-100"
+                                aria-label="Open search bar"
+                                class="nav-button nav-link dropdown-toggle d-none d-lg-flex flex-nowrap py-100"
                                 @click="toggleSearchBar()">
                                 <icon-search
                                     class="align-self-center account-icon"
@@ -124,10 +125,12 @@
                         <div class="row w-100">
                             <es-nav-bar-search-bar
                                 v-bind="$attrs"
-                                v-on="$listeners">
+                                v-on="$listeners"
+                                @searchButtonClicked="searchButtonClicked">
                                 <template #close>
                                     <es-button
-                                        class="position-absolute"
+                                        class="position-absolute nav-button"
+                                        aria-label="Close search bar"
                                         style="right: 0"
                                         variant="link"
                                         @click="toggleSearchBar()">
@@ -452,6 +455,9 @@ export default {
         toggleSearchBar() {
             this.searchBarOpen = !this.searchBarOpen;
         },
+        searchButtonClicked() {
+            this.$emit('searchButtonClicked');
+        },
     },
 };
 </script>
diff --git a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
index 01caa4385..5bac98262 100644
--- a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
@@ -12,7 +12,9 @@
                     <icon-search />
                 </template>
             </es-form-input>
-            <es-button class="ml-50">
+            <es-button
+                class="ml-50"
+                @click="$emit('searchButtonClicked')">
                 {{ buttonText }}
             </es-button>
         </div>
@@ -21,9 +23,17 @@
 </template>
 
 <script lang="js">
+import EsButton from './EsButton.vue';
+import EsFormInput from './EsFormInput.vue';
+import IconSearch from '../lib-icons/icon-search.vue';
 
 export default {
     name: 'EsNavBarSearchBar',
+    components: {
+        EsButton,
+        EsFormInput,
+        IconSearch
+    },
     props: {
         label: {
             type: String,

From 3668b27806bd0f189d67d9fba36474c2ba9d5dc8 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Mon, 23 Sep 2024 14:42:14 -0400
Subject: [PATCH 09/11] style: add trailing comma

---
 es-vue-base/src/lib-components/EsNavBarSearchBar.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
index 5bac98262..9eba40baa 100644
--- a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
@@ -32,7 +32,7 @@ export default {
     components: {
         EsButton,
         EsFormInput,
-        IconSearch
+        IconSearch,
     },
     props: {
         label: {

From 294f780dd7d5f1ff4cae1d4206dcc5f55be5fa87 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Wed, 25 Sep 2024 10:07:14 -0400
Subject: [PATCH 10/11] fix: emit event on enter

---
 es-vue-base/src/lib-components/EsNavBar.vue          | 3 +--
 es-vue-base/src/lib-components/EsNavBarSearchBar.vue | 1 +
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/es-vue-base/src/lib-components/EsNavBar.vue b/es-vue-base/src/lib-components/EsNavBar.vue
index ebf4af318..6514c6b86 100644
--- a/es-vue-base/src/lib-components/EsNavBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBar.vue
@@ -125,8 +125,7 @@
                         <div class="row w-100">
                             <es-nav-bar-search-bar
                                 v-bind="$attrs"
-                                v-on="$listeners"
-                                @searchButtonClicked="searchButtonClicked">
+                                v-on="$listeners">
                                 <template #close>
                                     <es-button
                                         class="position-absolute nav-button"
diff --git a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
index 9eba40baa..eb7292e25 100644
--- a/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
+++ b/es-vue-base/src/lib-components/EsNavBarSearchBar.vue
@@ -7,6 +7,7 @@
                 v-bind="$attrs"
                 label-sr-only
                 :placeholder="label"
+                @keyup.enter="$emit('searchButtonClicked')"
                 v-on="$listeners">
                 <template #prefixIcon>
                     <icon-search />

From d5d2e413814ac0d27061a2bcfc0cb502c1777f71 Mon Sep 17 00:00:00 2001
From: Hannah Roth <hannah.roth@energysage.com>
Date: Wed, 25 Sep 2024 10:19:37 -0400
Subject: [PATCH 11/11] chore: might as well print out the searchText

---
 es-design-system/layouts/nav.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/es-design-system/layouts/nav.vue b/es-design-system/layouts/nav.vue
index e14d2654f..2b9d959c7 100644
--- a/es-design-system/layouts/nav.vue
+++ b/es-design-system/layouts/nav.vue
@@ -88,7 +88,7 @@ export default {
     methods: {
         searchButtonClicked() {
             /* eslint-disable-next-line no-console */
-            console.log('Searching...');
+            console.log('Searching...', this.searchText);
         },
     },
 };