From ca1b7169f11f9fd3ab52c3fe7e59e5228c29fe5d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= <sxzz@sxzz.moe>
Date: Sun, 1 Jan 2023 23:12:02 +0800
Subject: [PATCH] fix: click outside to hide autocompleted servers

---
 components/user/UserSignIn.vue | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/components/user/UserSignIn.vue b/components/user/UserSignIn.vue
index d0d4ba7d37..46467345ec 100644
--- a/components/user/UserSignIn.vue
+++ b/components/user/UserSignIn.vue
@@ -78,6 +78,13 @@ function onEnter(e: KeyboardEvent) {
   }
 }
 
+function escapeAutocomplete(evt: KeyboardEvent) {
+  if (!autocompleteShow)
+    return
+  autocompleteShow = false
+  evt.stopPropagation()
+}
+
 function select(index: number) {
   server = filteredServers[index]
 }
@@ -87,6 +94,10 @@ onMounted(async () => {
   knownServers = await $fetch('/api/list-servers')
   fuse = new Fuse(knownServers, { shouldSort: true })
 })
+
+onClickOutside($$(input), () => {
+  autocompleteShow = false
+})
 </script>
 
 <template>
@@ -123,7 +134,7 @@ onMounted(async () => {
           @keydown.down="move(1)"
           @keydown.up="move(-1)"
           @keydown.enter="onEnter"
-          @keydown.esc.prevent="autocompleteShow = false"
+          @keydown.esc.prevent="escapeAutocomplete"
           @focus="autocompleteShow = true"
         >
         <div