better autocomplete handling, fix leak

This commit is contained in:
Henry Jameson 2022-10-10 20:26:32 +03:00
parent 692342a77f
commit faca1b31e3
1 changed files with 11 additions and 13 deletions

View File

@ -145,7 +145,7 @@ const EmojiInput = {
!this.temporarilyHideSuggestions !this.temporarilyHideSuggestions
}, },
textAtCaret () { textAtCaret () {
return (this.wordAtCaret || {}).word || '' return this.wordAtCaret?.word
}, },
wordAtCaret () { wordAtCaret () {
if (this.modelValue && this.caret) { if (this.modelValue && this.caret) {
@ -197,6 +197,12 @@ const EmojiInput = {
return emoji.displayText return emoji.displayText
} }
},
onInputScroll () {
this.$refs.hiddenOverlay.scrollTo({
top: this.input.scrollTop,
left: this.input.scrollLeft
})
} }
}, },
mounted () { mounted () {
@ -225,13 +231,7 @@ const EmojiInput = {
input.addEventListener('click', this.onClickInput) input.addEventListener('click', this.onClickInput)
input.addEventListener('transitionend', this.onTransition) input.addEventListener('transitionend', this.onTransition)
input.addEventListener('input', this.onInput) input.addEventListener('input', this.onInput)
// FIXME LEAK input.addEventListener('scroll', this.onInputScroll)
input.addEventListener('scroll', (e) => {
this.$refs.hiddenOverlay.scrollTo({
top: this.input.scrollTop,
left: this.input.scrollLeft
})
})
}, },
unmounted () { unmounted () {
const { input } = this const { input } = this
@ -244,6 +244,7 @@ const EmojiInput = {
input.removeEventListener('click', this.onClickInput) input.removeEventListener('click', this.onClickInput)
input.removeEventListener('transitionend', this.onTransition) input.removeEventListener('transitionend', this.onTransition)
input.removeEventListener('input', this.onInput) input.removeEventListener('input', this.onInput)
input.removeEventListener('scroll', this.onInputScroll)
} }
}, },
watch: { watch: {
@ -256,11 +257,10 @@ const EmojiInput = {
} }
}, },
textAtCaret: async function (newWord) { textAtCaret: async function (newWord) {
if (newWord === undefined) return
const firstchar = newWord.charAt(0) const firstchar = newWord.charAt(0)
if (newWord === firstchar) { if (newWord === firstchar) {
if (firstchar === ' ') { this.suggestions = []
this.suggestions = []
}
return return
} }
const matchedSuggestions = await this.suggest(newWord, this.maybeLocalizedEmojiNamesAndKeywords) const matchedSuggestions = await this.suggest(newWord, this.maybeLocalizedEmojiNamesAndKeywords)
@ -292,10 +292,8 @@ const EmojiInput = {
}, 0) }, 0)
}, },
togglePicker () { togglePicker () {
console.log('piick')
this.input.focus() this.input.focus()
if (!this.pickerShown) { if (!this.pickerShown) {
console.log('pick')
this.scrollIntoView() this.scrollIntoView()
this.$refs.picker.showPicker() this.$refs.picker.showPicker()
this.$refs.picker.startEmojiLoad() this.$refs.picker.startEmojiLoad()