From 93af8f6dcd19275cde1cbb08bdb0aca875dbce5c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tu=C4=9F=C3=A7e=20K=C3=BC=C3=A7=C3=BCko=C4=9Flu?=
 <tugcekucukoglu.860@gmail.com>
Date: Tue, 9 Aug 2022 17:37:01 +0300
Subject: [PATCH] AutoComplete | update keyboard accessibility

---
 src/components/autocomplete/AutoComplete.vue | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/src/components/autocomplete/AutoComplete.vue b/src/components/autocomplete/AutoComplete.vue
index f33d8c8d6..588c04406 100755
--- a/src/components/autocomplete/AutoComplete.vue
+++ b/src/components/autocomplete/AutoComplete.vue
@@ -198,6 +198,7 @@ export default {
     data() {
         return {
             id: UniqueComponentId(),
+            inputText: null,
             focused: false,
             focusedOptionIndex: -1,
             focusedMultipleOptionIndex: -1,
@@ -357,6 +358,8 @@ export default {
             }
         },
         onInput(event) {
+            this.inputText = event.target.value;
+
             if (this.searchTimeout) {
                 clearTimeout(this.searchTimeout);
             }
@@ -537,6 +540,7 @@ export default {
         },
         onArrowRightKey() {
             this.focusedOptionIndex = -1;
+            this.$refs.multiContainer.focus();
         },
         onHomeKey(event) {
             event.currentTarget.setSelectionRange(0, 0);
@@ -597,13 +601,20 @@ export default {
             }
         },
         onArrowLeftKeyOnMultiple() {
-            this.focusedMultipleOptionIndex = this.focusedMultipleOptionIndex < 1 ? 0 : this.focusedMultipleOptionIndex - 1;
+            if (!ObjectUtils.isNotEmpty(this.inputText) && this.modelValue && this.modelValue.length > 0) {
+                this.focusedMultipleOptionIndex = this.focusedMultipleOptionIndex < 1 ? 0 : this.focusedMultipleOptionIndex - 1;
+            }
         },
         onArrowRightKeyOnMultiple() {
-            this.focusedMultipleOptionIndex++;
+            if (!ObjectUtils.isNotEmpty(this.inputText) && this.modelValue && this.modelValue.length > 0) {
+                this.focusedMultipleOptionIndex++;
 
-            if (this.focusedMultipleOptionIndex > (this.modelValue.length - 1)) {
-                this.focusedMultipleOptionIndex = -1;
+                if (this.focusedMultipleOptionIndex > (this.modelValue.length - 1)) {
+                    this.focusedMultipleOptionIndex = -1;
+                    this.$refs.focusInput.focus();
+                }
+            }
+            else {
                 this.$refs.focusInput.focus();
             }
         },