From f76f4b36b0e6995ab76ee3a90520e47d7df3f3e7 Mon Sep 17 00:00:00 2001
From: Thijs Louisse <Thijs.Louisse@ing.com>
Date: Fri, 8 Mar 2024 10:51:33 +0100
Subject: [PATCH] fix(overlays): only use elementToFocusAfterHide when provided
 as HTMLElement

---
 .changeset/moody-ways-tap.md               |  5 +++++
 packages/overlays/src/OverlayController.js | 22 +++++++++++++---------
 2 files changed, 18 insertions(+), 9 deletions(-)
 create mode 100644 .changeset/moody-ways-tap.md

diff --git a/.changeset/moody-ways-tap.md b/.changeset/moody-ways-tap.md
new file mode 100644
index 000000000..27b60f23b
--- /dev/null
+++ b/.changeset/moody-ways-tap.md
@@ -0,0 +1,5 @@
+---
+'@lion/overlays': patch
+---
+
+fix: only use elementToFocusAfterHide when provided as HTMLElement
diff --git a/packages/overlays/src/OverlayController.js b/packages/overlays/src/OverlayController.js
index c19f0e5e2..546890fe2 100644
--- a/packages/overlays/src/OverlayController.js
+++ b/packages/overlays/src/OverlayController.js
@@ -244,8 +244,9 @@ export class OverlayController extends EventTargetShim {
    * @type {HTMLElement}
    */
   get contentWrapperNode() {
-    return /** @type {HTMLElement} */ (this.__contentWrapperNode ||
-      this.config?.contentWrapperNode);
+    return /** @type {HTMLElement} */ (
+      this.__contentWrapperNode || this.config?.contentWrapperNode
+    );
   }
 
   /**
@@ -262,8 +263,9 @@ export class OverlayController extends EventTargetShim {
    * @type {HTMLElement}
    */
   get elementToFocusAfterHide() {
-    return /** @type {HTMLElement} */ (this.__elementToFocusAfterHide ||
-      this.config?.elementToFocusAfterHide);
+    return /** @type {HTMLElement} */ (
+      this.__elementToFocusAfterHide || this.config?.elementToFocusAfterHide
+    );
   }
 
   /**
@@ -588,8 +590,9 @@ export class OverlayController extends EventTargetShim {
     if (this.__isContentNodeProjected && this.contentWrapperNode.isConnected) {
       // We need to keep track of the original local context.
       /** config [l2], [l4] */
-      this.__originalContentParent = /** @type {HTMLElement} */ (this.contentWrapperNode
-        .parentNode);
+      this.__originalContentParent = /** @type {HTMLElement} */ (
+        this.contentWrapperNode.parentNode
+      );
     } else if (cfgToAdd.contentNode && cfgToAdd.contentNode.isConnected) {
       // We need to keep track of the original local context.
       /** config [l1], [l3], [g1] */
@@ -905,15 +908,16 @@ export class OverlayController extends EventTargetShim {
 
   /** @protected */
   _restoreFocus() {
-    const { activeElement } = /** @type {* & ShadowRoot} */ (this
-      .__contentWrapperNode).getRootNode();
+    const { activeElement } = /** @type {* & ShadowRoot} */ (
+      this.__contentWrapperNode
+    ).getRootNode();
     // We only are allowed to move focus if we (still) 'own' it.
     // Otherwise we assume the 'outside world' has, purposefully, taken over
     if (
       activeElement &&
       /** @type {HTMLElement} */ (this.__contentWrapperNode).contains(activeElement)
     ) {
-      if (this.elementToFocusAfterHide) {
+      if (this.elementToFocusAfterHide instanceof HTMLElement) {
         this.elementToFocusAfterHide.focus();
       } else {
         activeElement.blur();