fix: emoji picker not showing emojis (#569)

zio/stable
Joaquín Sánchez 2022-12-27 13:28:02 +01:00 committed by GitHub
parent f4bd2cab5c
commit 1c61aef83b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 10 additions and 16 deletions

View File

@ -10,8 +10,14 @@ const el = $ref<HTMLElement>()
let picker = $ref<Picker>()
async function openEmojiPicker() {
if (!picker) {
await updateCustomEmojis()
await updateCustomEmojis()
if (picker) {
picker.update({
theme: isDark.value ? 'dark' : 'light',
custom: customEmojisData.value,
})
}
else {
const promise = import('@emoji-mart/data').then(r => r.default)
const { Picker } = await import('emoji-mart')
picker = new Picker({
@ -28,28 +34,16 @@ async function openEmojiPicker() {
el?.appendChild(picker as any as HTMLElement)
}
const hidePicker = () => {
const hideEmojiPicker = () => {
if (picker)
el?.removeChild(picker as any as HTMLElement)
}
watch(isDark, () => {
picker?.update({
theme: isDark.value ? 'dark' : 'light',
})
})
watch(customEmojisData, () => {
picker?.update({
custom: customEmojisData.value,
})
})
</script>
<template>
<VDropdown
@apply-show="openEmojiPicker()"
@apply-hide="hidePicker()"
@apply-hide="hideEmojiPicker()"
>
<button btn-action-icon :title="$t('tooltip.emoji')">
<div i-ri:emotion-line />