Ignore keys used for text highlight

src/index.js

@@ -27,21 +27,16 @@ export default {
   },
   data () {
     return {
-      focused: false
+      focused: false,
+      body: ''
     }
   },
   computed: {
-    valueModel: {
-      get () { return this.value },
-      set (value) {
-        this.$emit('input', value)
-      }
-    },
     showPlaceholder () {
-      return !this.valueModel.replace(/^\s*\n/gm, '').length
+      return !this.body.replace(/^\s*\n/gm, '').length
     },
     computedBody () {
-      return highlight(this.valueModel, {
+      return highlight(this.body, {
         extractUrlsWithoutProtocol: this.extractUrlsWithoutProtocol
       })
     }
@@ -69,14 +64,18 @@ export default {
     },
     clear () {
       this.$refs.mbody.innerText = ''
-      this.valueModel = ''
+      this.body = ''
     },
     onKeyUp (e) {
+      const keysToIgnore = ['Shift', 'Meta', 'Control', 'Alt', 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight']
+      if (keysToIgnore.includes(e.key)) return
+
       let caretPosition = this.getCaretPos()
-      if (e.keyCode === 13) { // Enter key
+      if (e.key === 'Enter') {
         caretPosition++
       }
-      this.valueModel = e.target.innerText
+      this.body = e.target.innerText
+      this.$emit('input', this.body)
       this.$nextTick(() => {
         this.setCaretPos(caretPosition)
       })