From a2c46f442d26fe33c9b4cc00ddb9b805363edd20 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Fri, 2 Feb 2024 10:44:19 -0800
Subject: [PATCH] fix(search): dont rely on mouse to manipulate focus

---
 quartz/components/scripts/search.inline.ts | 36 +++-------------------
 quartz/components/styles/search.scss       |  1 +
 2 files changed, 6 insertions(+), 31 deletions(-)

diff --git a/quartz/components/scripts/search.inline.ts b/quartz/components/scripts/search.inline.ts
index 1ecf62f..b9b55be 100644
--- a/quartz/components/scripts/search.inline.ts
+++ b/quartz/components/scripts/search.inline.ts
@@ -310,38 +310,12 @@ document.addEventListener("nav", async (e: CustomEventMap["nav"]) => {
     itemTile.href = resolveUrl(slug).toString()
     itemTile.innerHTML = `<h3>${title}</h3>${htmlTags}<p class="preview">${content}</p>`
 
-    async function onMouseEnter(ev: MouseEvent) {
-      if (!ev.target) return
-      currentHover?.classList.remove("focus")
-      currentHover?.blur()
-      const target = ev.target as HTMLInputElement
-      currentHover = target
-      currentHover.classList.add("focus")
-      await displayPreview(target)
+    const handler = (event: MouseEvent) => {
+      if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return
+      hideSearch()
     }
-
-    async function onMouseLeave(ev: MouseEvent) {
-      if (!ev.target) return
-      const target = ev.target as HTMLElement
-      target.classList.remove("focus")
-    }
-
-    const events = [
-      ["mouseenter", onMouseEnter],
-      ["mouseleave", onMouseLeave],
-      [
-        "click",
-        (event: MouseEvent) => {
-          if (event.altKey || event.ctrlKey || event.metaKey || event.shiftKey) return
-          hideSearch()
-        },
-      ],
-    ] as const
-
-    events.forEach(([event, handler]) => {
-      itemTile.addEventListener(event, handler)
-      window.addCleanup(() => itemTile.removeEventListener(event, handler))
-    })
+    itemTile.addEventListener("click", handler)
+    window.addCleanup(() => itemTile.removeEventListener("click", handler))
 
     return itemTile
   }
diff --git a/quartz/components/styles/search.scss b/quartz/components/styles/search.scss
index 24a7284..9cc85df 100644
--- a/quartz/components/styles/search.scss
+++ b/quartz/components/styles/search.scss
@@ -179,6 +179,7 @@
             outline: none;
             font-weight: inherit;
 
+            &:hover,
             &:focus,
             &.focus {
               background: var(--lightgray);