admin: streamline item modal actions

frontend/src/components/TagBadgeInput.vue

@@ -12,6 +12,7 @@ const props = defineProps({
 const emit = defineEmits(['update:modelValue'])
 
 const draft = ref('')
+const isComposing = ref(false)
 
 const normalizedTags = computed(() =>
   Array.from(
@@ -50,6 +51,7 @@ function removeTag(tag) {
 }
 
 function handleKeydown(event) {
+  if (event.isComposing || isComposing.value) return
   if (event.key === 'Enter') {
     event.preventDefault()
     addDraftTag()
@@ -62,8 +64,17 @@ function handleKeydown(event) {
 }
 
 function handleBlur() {
+  if (isComposing.value) return
   addDraftTag()
 }
+
+function handleCompositionStart() {
+  isComposing.value = true
+}
+
+function handleCompositionEnd() {
+  isComposing.value = false
+}
 </script>
 
 <template>
@@ -83,6 +94,8 @@ function handleBlur() {
       :maxlength="maxTagLength"
       @keydown="handleKeydown"
       @blur="handleBlur"
+      @compositionstart="handleCompositionStart"
+      @compositionend="handleCompositionEnd"
     />
   </div>
 </template>