Prevent Enter Key from Triggering Selection During IME Composition in AutoCompletePlus (#2285)

src/components/primevueOverride/AutoCompletePlus.vue

@@ -6,11 +6,27 @@ export default {
   name: 'AutoCompletePlus',
   extends: AutoComplete,
   emits: ['focused-option-changed'],
+  data() {
+    return {
+      // Flag to determine if IME is active
+      isComposing: false
+    }
+  },
   mounted() {
     if (typeof AutoComplete.mounted === 'function') {
       AutoComplete.mounted.call(this)
     }
 
+    // Retrieve the actual <input> element and attach IME events
+    const inputEl = this.$el.querySelector('input')
+    if (inputEl) {
+      inputEl.addEventListener('compositionstart', () => {
+        this.isComposing = true
+      })
+      inputEl.addEventListener('compositionend', () => {
+        this.isComposing = false
+      })
+    }
     // Add a watcher on the focusedOptionIndex property
     this.$watch(
       () => this.focusedOptionIndex,
@@ -19,6 +35,18 @@ export default {
         this.$emit('focused-option-changed', newVal)
       }
     )
+  },
+  methods: {
+    // Override onKeyDown to block Enter when IME is active
+    onKeyDown(event) {
+      if (event.key === 'Enter' && this.isComposing) {
+        event.preventDefault()
+        event.stopPropagation()
+        return
+      }
+
+      AutoComplete.methods.onKeyDown.call(this, event)
+    }
   }
 }
 </script>