feat(editor): edit shortcut to set focus into the editor
continuous-integration/drone/pr Build is failing Details

This commit is contained in:
kolaente 2023-10-21 19:46:46 +02:00
parent aa715dd9e1
commit 859fc1e94e
Signed by: konrad
GPG Key ID: F40E70337AB24C9B
1 changed files with 18 additions and 0 deletions

View File

@ -144,6 +144,7 @@ import {useI18n} from 'vue-i18n'
import BaseButton from '@/components/base/BaseButton.vue' import BaseButton from '@/components/base/BaseButton.vue'
import XButton from '@/components/input/button.vue' import XButton from '@/components/input/button.vue'
import {Placeholder} from '@tiptap/extension-placeholder' import {Placeholder} from '@tiptap/extension-placeholder'
import {eventToHotkeyString} from '@github/hotkey'
const {t} = useI18n() const {t} = useI18n()
@ -176,6 +177,7 @@ const {
bottomActions = [], bottomActions = [],
showSave = false, showSave = false,
placeholder = '', placeholder = '',
editShortcut = '',
} = defineProps<{ } = defineProps<{
modelValue: string, modelValue: string,
uploadCallback?: UploadCallback, uploadCallback?: UploadCallback,
@ -183,6 +185,7 @@ const {
bottomActions?: BottomAction[], bottomActions?: BottomAction[],
showSave?: boolean, showSave?: boolean,
placeholder?: string, placeholder?: string,
editShortcut?: string,
}>() }>()
const emit = defineEmits(['update:modelValue', 'save']) const emit = defineEmits(['update:modelValue', 'save'])
@ -404,10 +407,16 @@ function setLink() {
onMounted(() => { onMounted(() => {
document.addEventListener('paste', handleImagePaste) document.addEventListener('paste', handleImagePaste)
if(editShortcut !== '') {
document.addEventListener('keydown', setFocusToEditor)
}
}) })
onBeforeUnmount(() => { onBeforeUnmount(() => {
document.removeEventListener('paste', handleImagePaste) document.removeEventListener('paste', handleImagePaste)
if(editShortcut !== '') {
document.removeEventListener('keydown', setFocusToEditor)
}
}) })
function handleImagePaste(event) { function handleImagePaste(event) {
@ -418,6 +427,15 @@ function handleImagePaste(event) {
} }
}) })
} }
// See https://github.com/github/hotkey/discussions/85#discussioncomment-5214660
function setFocusToEditor(event) {
const hotkeyString = eventToHotkeyString(event)
if (!hotkeyString) return
if (hotkeyString !== editShortcut || editor.value?.isFocused) return
event.preventDefault()
editor.value?.commands.focus()
}
</script> </script>
<style lang="scss"> <style lang="scss">