From 52819b428b06e31e7dcceb5006bf992abdb639e4 Mon Sep 17 00:00:00 2001
From: Sam Becker <sam@sambecker.com>
Date: Sun, 27 Apr 2025 10:37:47 -0500
Subject: [PATCH] Prevent tooltips being stuck after navigation

---
 src/components/primitives/TooltipPrimitive.tsx | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/components/primitives/TooltipPrimitive.tsx b/src/components/primitives/TooltipPrimitive.tsx
index 7673546e..215578ca 100644
--- a/src/components/primitives/TooltipPrimitive.tsx
+++ b/src/components/primitives/TooltipPrimitive.tsx
@@ -63,6 +63,14 @@ export default function TooltipPrimitive({
     </div>
     : contentProp;
 
+  // Blur after clicking to prevent keyboard focus being stuck
+  // when tooltip is combined with a button
+  const blurActiveElement = () => {
+    if (document.activeElement instanceof HTMLElement) {
+      document.activeElement.blur();
+    }
+  };
+
   return (
     <Tooltip.Provider {...{ delayDuration, skipDelayDuration }}>
       <Tooltip.Root open={includeButton ? isOpen : undefined}>
@@ -70,12 +78,18 @@ export default function TooltipPrimitive({
           {includeButton
             ? <button
               ref={refTrigger}
-              onClick={() => setIsOpen(!isOpen)}
+              onClick={() => {
+                setIsOpen(!isOpen);
+                blurActiveElement();
+              }}
               className={clsx('link', classNameTrigger)}
             >
               {children}
             </button>
-            : <span className={classNameTrigger}>
+            : <span
+              className={classNameTrigger}
+              onClick={blurActiveElement}
+            >
               {children}
             </span>}
         </Tooltip.Trigger>