fix: click outside to hide autocompleted servers

This commit is contained in:
三咲智子 2023-01-01 23:12:02 +08:00
parent 727d05915f
commit ca1b7169f1
No known key found for this signature in database
GPG key ID: 69992F2250DFD93E

View file

@ -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