From c98ab6e3fcdfa09533a6b404298b42473b9fbb45 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, 6 Jun 2023 16:20:55 +0300
Subject: [PATCH] Refactor #3965 - For OrderList

---
 components/lib/orderlist/BaseOrderList.vue |  6 +++---
 components/lib/orderlist/OrderList.vue     | 16 +++++-----------
 2 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/components/lib/orderlist/BaseOrderList.vue b/components/lib/orderlist/BaseOrderList.vue
index 6cd926bfc..29a665fd3 100644
--- a/components/lib/orderlist/BaseOrderList.vue
+++ b/components/lib/orderlist/BaseOrderList.vue
@@ -53,11 +53,11 @@ const classes = {
     header: 'p-orderlist-header',
     container: 'p-orderlist-list-container',
     list: 'p-orderlist-list',
-    item: ({ context }) => [
+    item: ({ instance, item, id }) => [
         'p-orderlist-item',
         {
-            'p-highlight': context.active,
-            'p-focus': context.focused
+            'p-highlight': instance.isSelected(item),
+            'p-focus': id === instance.focusedOptionId
         }
     ]
 };
diff --git a/components/lib/orderlist/OrderList.vue b/components/lib/orderlist/OrderList.vue
index 65bd0c55b..16b8b411d 100755
--- a/components/lib/orderlist/OrderList.vue
+++ b/components/lib/orderlist/OrderList.vue
@@ -59,20 +59,14 @@
                         :id="id + '_' + i"
                         v-ripple
                         role="option"
-                        :class="
-                            cx('item', {
-                                context: {
-                                    active: isSelected(item),
-                                    focused: `${id}_${i}` === focusedOptionId
-                                }
-                            })
-                        "
-                        :data-p-highlight="isSelected(item)"
+                        :class="cx('item', { item, id: `${id}_${i}` })"
                         @click="onItemClick($event, item, i)"
                         @touchend="onItemTouchEnd"
                         :aria-selected="isSelected(item)"
                         @mousedown="onOptionMouseDown(i)"
                         v-bind="getPTOptions(item, 'item')"
+                        :data-p-highlight="isSelected(item)"
+                        :data-p-focused="`${id}_${i}` === focusedOptionId"
                     >
                         <slot name="item" :item="item" :index="i"> </slot>
                     </li>
@@ -448,13 +442,13 @@ export default {
         findNextItem(item) {
             let nextItem = item.nextElementSibling;
 
-            if (nextItem) return !(DomHandler.getAttribute(nextItem, 'data-p-section') === 'item') ? this.findNextItem(nextItem) : nextItem;
+            if (nextItem) return !(DomHandler.getAttribute(nextItem, 'data-pc-section') === 'item') ? this.findNextItem(nextItem) : nextItem;
             else return null;
         },
         findPrevItem(item) {
             let prevItem = item.previousElementSibling;
 
-            if (prevItem) return !(DomHandler.getAttribute(nextItem, 'data-p-section') === 'item') ? this.findPrevItem(prevItem) : prevItem;
+            if (prevItem) return !(DomHandler.getAttribute(nextItem, 'data-pc-section') === 'item') ? this.findPrevItem(prevItem) : prevItem;
             else return null;
         },
         updateListScroll() {