From c1e93ce675811eb3e13e55017e3dc6da952ce438 Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Tue, 20 Feb 2024 13:34:53 -0500
Subject: [PATCH 1/2] fix close behavior when select is in a shadow root

---
 docs/pages/resources/changelog.md         |  1 +
 src/components/select/select.component.ts | 24 +++++++++++++++--------
 2 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/docs/pages/resources/changelog.md b/docs/pages/resources/changelog.md
index 532b28735b..4d3e2816ed 100644
--- a/docs/pages/resources/changelog.md
+++ b/docs/pages/resources/changelog.md
@@ -15,6 +15,7 @@ New versions of Shoelace are released as-needed and generally occur when a criti
 ## Next
 
 - Fixed a bug in `<sl-rating>` that caused the rating to not reset in some circumstances [#1877]
+- Fixed a bug in `<sl-select>` that caused the menu to not close when rendered in a shadow root
 
 ## 2.14.0
 
diff --git a/src/components/select/select.component.ts b/src/components/select/select.component.ts
index 44f18cac48..a0ea2f530f 100644
--- a/src/components/select/select.component.ts
+++ b/src/components/select/select.component.ts
@@ -224,7 +224,6 @@ export default class SlSelect extends ShoelaceElement implements ShoelaceFormCon
     //
     // https://github.com/shoelace-style/shoelace/issues/1763
     //
-    const root = this.getRootNode();
     if ('CloseWatcher' in window) {
       this.closeWatcher?.destroy();
       this.closeWatcher = new CloseWatcher();
@@ -235,16 +234,25 @@ export default class SlSelect extends ShoelaceElement implements ShoelaceFormCon
         }
       };
     }
-    root.addEventListener('focusin', this.handleDocumentFocusIn);
-    root.addEventListener('keydown', this.handleDocumentKeyDown);
-    root.addEventListener('mousedown', this.handleDocumentMouseDown);
+    document.addEventListener('focusin', this.handleDocumentFocusIn);
+    document.addEventListener('keydown', this.handleDocumentKeyDown);
+    document.addEventListener('mousedown', this.handleDocumentMouseDown);
+
+    // If the component is rendered in a shadow root, we need to attach the focusin listener there too
+    if (this.getRootNode() !== document) {
+      this.getRootNode().addEventListener('focusin', this.handleDocumentFocusIn);
+    }
   }
 
   private removeOpenListeners() {
-    const root = this.getRootNode();
-    root.removeEventListener('focusin', this.handleDocumentFocusIn);
-    root.removeEventListener('keydown', this.handleDocumentKeyDown);
-    root.removeEventListener('mousedown', this.handleDocumentMouseDown);
+    document.removeEventListener('focusin', this.handleDocumentFocusIn);
+    document.removeEventListener('keydown', this.handleDocumentKeyDown);
+    document.removeEventListener('mousedown', this.handleDocumentMouseDown);
+
+    if (this.getRootNode() !== document) {
+      this.getRootNode().removeEventListener('focusin', this.handleDocumentFocusIn);
+    }
+
     this.closeWatcher?.destroy();
   }
 

From 0d7c8e3fb364c21c0d0da4954860c718b5692a5a Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Tue, 20 Feb 2024 13:36:09 -0500
Subject: [PATCH 2/2] add pr

---
 docs/pages/resources/changelog.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/pages/resources/changelog.md b/docs/pages/resources/changelog.md
index 4d3e2816ed..a74811be4e 100644
--- a/docs/pages/resources/changelog.md
+++ b/docs/pages/resources/changelog.md
@@ -15,7 +15,7 @@ New versions of Shoelace are released as-needed and generally occur when a criti
 ## Next
 
 - Fixed a bug in `<sl-rating>` that caused the rating to not reset in some circumstances [#1877]
-- Fixed a bug in `<sl-select>` that caused the menu to not close when rendered in a shadow root
+- Fixed a bug in `<sl-select>` that caused the menu to not close when rendered in a shadow root [#1878]
 
 ## 2.14.0