zio/elk
2
0
Fork 0
Code Releases 2 Packages 1 Activity

feat(editor): show fetching state of name auto complete

Browse source
This commit is contained in:
Anthony Fu 2022-11-27 14:34:38 +08:00
parent 8dd91002d7
commit b475377f64
3 changed files with 16 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

13
components/tiptap/TiptapMentionList.vue
View file

@ -4,6 +4,7 @@ import type { Account } from 'masto'
const { items, command } = defineProps<{
items: Account[]
command: Function
isPending?: boolean
}>()
let selectedIndex = $ref(0)
@ -41,7 +42,13 @@ defineExpose({
</script>
<template>
<div relative bg-base text-base shadow border="~ base rounded" text-sm py-2 overflow-x-hidden overflow-y-auto max-h-100>
<div v-if="isPending || items.length" relative bg-base text-base shadow border="~ base rounded" text-sm py-2 overflow-x-hidden overflow-y-auto max-h-100>
<template v-if="isPending">
<div flex gap-1 items-center p2 animate-pulse>
<div i-ri:loader-2-line animate-spin />
<span>Fetching...</span>
</div>
</template>
<template v-if="items.length">
<button
v-for="(item, index) in items"
@ -53,8 +60,6 @@ defineExpose({
<AccountInfo :account="item" />
</button>
</template>
<div v-else block m0 w-full text-left px2 py1 italic op30>
No result
</div>
</div>
<div v-else />
</template>