From 0268be9970c56594021697c21765454f3e25cc5f Mon Sep 17 00:00:00 2001
From: Bryan Stopp <bryan.stopp@gmail.com>
Date: Wed, 29 Nov 2023 16:18:42 -0600
Subject: [PATCH 1/2] Improve the performance of the hero search form.

---
 blocks/hero/search/home.css                       |  7 ++++++-
 blocks/hero/search/home.js                        | 15 ++++++++-------
 .../shared/search-countries/search-countries.js   |  2 +-
 3 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/blocks/hero/search/home.css b/blocks/hero/search/home.css
index 59117177..7dbedee2 100644
--- a/blocks/hero/search/home.css
+++ b/blocks/hero/search/home.css
@@ -18,6 +18,11 @@
   display: none;
 }
 
+.hero.block .content .homes .search-bar .search-country-select-parent {
+  position: relative;
+  width: 80px;
+}
+
 .hero.block .content .homes .search-bar .suggester-input {
   flex: 1;
 }
@@ -45,7 +50,7 @@
   justify-content: center;
 }
 
-.hero.block .content .homes .search-bar .filter span.icon svg {
+.hero.block .content .homes .search-bar .filter span.icon img {
   height: 22px;
   width: 22px;
   color: var(--black);
diff --git a/blocks/hero/search/home.js b/blocks/hero/search/home.js
index c73af908..7049d910 100644
--- a/blocks/hero/search/home.js
+++ b/blocks/hero/search/home.js
@@ -5,7 +5,7 @@ import {
 
 function observeForm() {
   const script = document.createElement('script');
-  script.type = 'text/partytown';
+  script.type = 'module';
   script.innerHTML = `
     const script = document.createElement('script');
     script.type = 'module';
@@ -76,6 +76,7 @@ async function buildForm() {
     </div>
     <div class="search-bar" role="search">
       <div class="search-suggester">
+        <div class="search-country-select-parent"></div>
         <div class="suggester-input">
           <input type="text" placeholder="${getPlaceholder()}" aria-label="${getPlaceholder()}" name="keyword">
           <input type="hidden" name="query">
@@ -113,12 +114,12 @@ async function buildForm() {
     input.setAttribute('aria-label', placeholder);
   };
 
-  const countrySelect = await buildCountrySelect(changeCountry);
-  if (countrySelect) {
-    form.querySelector('.search-suggester').prepend(countrySelect);
-  }
-  decorateIcons(form);
-  observeForm();
+  buildCountrySelect(changeCountry).then((select) => {
+    if (select) {
+      form.querySelector('.search-country-select-parent').append(select);
+    }
+  });
+  window.setTimeout(observeForm, 3000);
   return form;
 }
 
diff --git a/blocks/shared/search-countries/search-countries.js b/blocks/shared/search-countries/search-countries.js
index eddb21ac..27fef4e5 100644
--- a/blocks/shared/search-countries/search-countries.js
+++ b/blocks/shared/search-countries/search-countries.js
@@ -108,7 +108,7 @@ export async function build(...callbacks) {
   selected.classList.add('selected');
   selected.setAttribute('aria-haspopup', 'listbox');
   selected.setAttribute('aria-expanded', 'false');
-  selected.setAttribute('aria-label', 'Select Country');
+  selected.setAttribute('aria-label', `${first.value} - Select Country`);
   selected.setAttribute('role', 'button');
   selected.setAttribute('tabIndex', '0');
   selected.innerHTML = imgHTML(first.value);

From 02ae2bc25138db093257191230be84c09910e78e Mon Sep 17 00:00:00 2001
From: Bryan Stopp <bryan.stopp@gmail.com>
Date: Wed, 29 Nov 2023 16:20:59 -0600
Subject: [PATCH 2/2] Fix lint.

---
 blocks/hero/search/home.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/blocks/hero/search/home.js b/blocks/hero/search/home.js
index 7049d910..069079cc 100644
--- a/blocks/hero/search/home.js
+++ b/blocks/hero/search/home.js
@@ -1,4 +1,3 @@
-import { decorateIcons } from '../../../scripts/aem.js';
 import {
   build as buildCountrySelect,
 } from '../../shared/search-countries/search-countries.js';