From 0512362f388893152143bf5fbb0e7a6cffabcc15 Mon Sep 17 00:00:00 2001
From: mertsincan <sincan.mert@gmail.com>
Date: Wed, 24 Jan 2024 16:22:47 +0000
Subject: [PATCH] Fixed #5144 - Keyboard accessibility is not working on
 OrderList and PickList

---
 components/lib/orderlist/OrderList.vue | 15 +++++++--------
 components/lib/picklist/PickList.vue   | 12 ++++++------
 2 files changed, 13 insertions(+), 14 deletions(-)

diff --git a/components/lib/orderlist/OrderList.vue b/components/lib/orderlist/OrderList.vue
index dc16a0ed0..6408f6e36 100755
--- a/components/lib/orderlist/OrderList.vue
+++ b/components/lib/orderlist/OrderList.vue
@@ -142,6 +142,7 @@ export default {
         onListFocus(event) {
             this.focused = true;
             this.findCurrentFocusedIndex();
+            this.scrollInView(this.focusedOptionIndex);
             this.$emit('focus', event);
         },
         onListBlur(event) {
@@ -189,9 +190,7 @@ export default {
             }
         },
         onOptionMouseDown(event, index) {
-            this.focused = true;
-            this.focusedOptionIndex = `${this.id}_${index}`;
-            event.preventDefault();
+            this.changeFocusedOptionIndex(index);
         },
         onOptionMouseMove(index) {
             if (this.focusOnHover && this.focused) {
@@ -282,13 +281,13 @@ export default {
             return DomHandler.findSingle(this.list, `[data-pc-section="item"][id=${this.focusedOptionIndex}]`);
         },
         findCurrentFocusedIndex() {
-            this.focusedOptionIndex = this.findFirstSelectedOptionIndex();
+            if (this.focusedOptionIndex === -1) {
+                this.focusedOptionIndex = this.findFirstSelectedOptionIndex();
 
-            if (this.autoOptionFocus && this.focusedOptionIndex === -1) {
-                this.focusedOptionIndex = this.findFirstFocusedOptionIndex();
+                if (this.autoOptionFocus && this.focusedOptionIndex === -1) {
+                    this.focusedOptionIndex = this.findFirstFocusedOptionIndex();
+                }
             }
-
-            this.scrollInView(this.focusedOptionIndex);
         },
         findFirstFocusedOptionIndex() {
             const firstFocusableItem = DomHandler.findSingle(this.list, '[data-pc-section="item"]');
diff --git a/components/lib/picklist/PickList.vue b/components/lib/picklist/PickList.vue
index 68f843d5f..b5ad7090d 100755
--- a/components/lib/picklist/PickList.vue
+++ b/components/lib/picklist/PickList.vue
@@ -304,6 +304,7 @@ export default {
         onListFocus(event, listType) {
             this.focused[listType] = true;
             this.findCurrentFocusedIndex(listType);
+            this.scrollInView(this.focusedOptionIndex, listType);
             this.$emit('focus', event);
         },
         onListBlur(event, listType) {
@@ -314,7 +315,6 @@ export default {
         onOptionMouseDown(event, index, listType) {
             this.focused[listType] = true;
             this.focusedOptionIndex = index;
-            event.preventDefault();
         },
         onOptionMouseMove(index, listType) {
             if (this.focusOnHover && this.focused[listType]) {
@@ -752,13 +752,13 @@ export default {
             return DomHandler.findSingle(this.$refs[listType].$el, `[data-pc-section="item"][id=${this.focusedOptionIndex}]`);
         },
         findCurrentFocusedIndex(listType) {
-            this.focusedOptionIndex = this.findFirstSelectedOptionIndex(listType);
+            if (this.focusedOptionIndex === -1) {
+                this.focusedOptionIndex = this.findFirstSelectedOptionIndex(listType);
 
-            if (this.autoOptionFocus && this.focusedOptionIndex === -1) {
-                this.focusedOptionIndex = this.findFirstFocusedOptionIndex(listType);
+                if (this.autoOptionFocus && this.focusedOptionIndex === -1) {
+                    this.focusedOptionIndex = this.findFirstFocusedOptionIndex(listType);
+                }
             }
-
-            this.scrollInView(this.focusedOptionIndex, listType);
         },
         findFirstFocusedOptionIndex(listType) {
             const firstFocusableItem = DomHandler.findSingle(this.$refs[listType].$el, '[data-pc-section="item"]');