fix: click outside to hide autocompleted servers
This commit is contained in:
parent
727d05915f
commit
ca1b7169f1
|
@ -78,6 +78,13 @@ function onEnter(e: KeyboardEvent) {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function escapeAutocomplete(evt: KeyboardEvent) {
|
||||||
|
if (!autocompleteShow)
|
||||||
|
return
|
||||||
|
autocompleteShow = false
|
||||||
|
evt.stopPropagation()
|
||||||
|
}
|
||||||
|
|
||||||
function select(index: number) {
|
function select(index: number) {
|
||||||
server = filteredServers[index]
|
server = filteredServers[index]
|
||||||
}
|
}
|
||||||
|
@ -87,6 +94,10 @@ onMounted(async () => {
|
||||||
knownServers = await $fetch('/api/list-servers')
|
knownServers = await $fetch('/api/list-servers')
|
||||||
fuse = new Fuse(knownServers, { shouldSort: true })
|
fuse = new Fuse(knownServers, { shouldSort: true })
|
||||||
})
|
})
|
||||||
|
|
||||||
|
onClickOutside($$(input), () => {
|
||||||
|
autocompleteShow = false
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
@ -123,7 +134,7 @@ onMounted(async () => {
|
||||||
@keydown.down="move(1)"
|
@keydown.down="move(1)"
|
||||||
@keydown.up="move(-1)"
|
@keydown.up="move(-1)"
|
||||||
@keydown.enter="onEnter"
|
@keydown.enter="onEnter"
|
||||||
@keydown.esc.prevent="autocompleteShow = false"
|
@keydown.esc.prevent="escapeAutocomplete"
|
||||||
@focus="autocompleteShow = true"
|
@focus="autocompleteShow = true"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
|
Loading…
Reference in a new issue