From 9d9ae356d07e599163a6b4b801c7a74f570a80cd Mon Sep 17 00:00:00 2001
From: tugcekucukoglu <tugcekucukoglu.860@gmail.com>
Date: Tue, 8 Oct 2024 12:54:50 +0300
Subject: [PATCH] Refactor #6538

---
 .../src/cascadeselect/CascadeSelect.vue       | 66 ++++++++++---------
 .../src/cascadeselect/CascadeSelectSub.vue    | 15 +----
 2 files changed, 37 insertions(+), 44 deletions(-)

diff --git a/packages/primevue/src/cascadeselect/CascadeSelect.vue b/packages/primevue/src/cascadeselect/CascadeSelect.vue
index 45581ab1bf..2a4b28c918 100644
--- a/packages/primevue/src/cascadeselect/CascadeSelect.vue
+++ b/packages/primevue/src/cascadeselect/CascadeSelect.vue
@@ -71,9 +71,9 @@
                             :optionGroupIcon="optionGroupIcon"
                             :optionGroupLabel="optionGroupLabel"
                             :optionGroupChildren="optionGroupChildren"
-                            @option-change="onOptionChange"
-                            @option-focus-move-change="onOptionFocusMoveChange"
-                            @option-focus-enter-change="onOptionFocusChangeEnter"
+                            @option-change="onOptionClick"
+                            @option-focus-change="onOptionMouseMove"
+                            @option-focus-enter-change="onOptionMouseEnter"
                             :pt="pt"
                             :unstyled="unstyled"
                         />
@@ -304,53 +304,55 @@ export default {
 
             this.clicked = false;
         },
-        onOptionChange(event, isSelectable = true) {
-            const { originalEvent, processedOption, isFocus, isHide } = event;
+        onOptionChange(event) {
+            const { processedOption } = event;
 
             if (isEmpty(processedOption)) return;
 
             const { index, key, level, parentKey, children } = processedOption;
             const grouped = isNotEmpty(children);
-            const root = isEmpty(processedOption.parent);
+            const activeOptionPath = this.activeOptionPath.filter((p) => p.parentKey !== parentKey && p.parentKey !== key);
+
+            if (grouped) {
+                activeOptionPath.push(processedOption);
+            }
+
+            this.focusedOptionInfo = { index, level, parentKey };
+            this.activeOptionPath = activeOptionPath;
+        },
+        onOptionClick(event) {
+            const { originalEvent, processedOption, isFocus, isHide } = event;
+            const { index, key, level, parentKey } = processedOption;
+            const grouped = this.isProccessedOptionGroup(processedOption);
             const selected = this.isSelected(processedOption);
 
             if (selected) {
-                this.focusedOptionInfo = { index, level, parentKey };
                 this.activeOptionPath = this.activeOptionPath.filter((p) => key !== p.key && key.startsWith(p.key));
-
-                this.dirty = !root;
+                this.focusedOptionInfo = { index, level, parentKey };
             } else {
-                const activeOptionPath = this.activeOptionPath.filter((p) => p.parentKey !== parentKey && p.parentKey !== key);
-
-                activeOptionPath.push(processedOption);
+                if (grouped) {
+                    this.onOptionChange(event);
+                } else {
+                    const activeOptionPath = this.activeOptionPath.filter((p) => p.parentKey !== parentKey);
 
-                this.focusedOptionInfo = { index, level, parentKey };
-                this.activeOptionPath = activeOptionPath;
-            }
+                    activeOptionPath.push(processedOption);
 
-            if (grouped) {
-                this.dirty = true;
-                this.onOptionGroupSelect(originalEvent, processedOption);
-            } else {
-                isSelectable && this.onOptionSelect(originalEvent, processedOption, isHide);
+                    this.focusedOptionInfo = { index, level, parentKey };
+                    this.activeOptionPath = activeOptionPath;
+                }
             }
 
+            grouped ? this.onOptionGroupSelect(originalEvent, processedOption) : this.onOptionSelect(originalEvent, processedOption, isHide);
             isFocus && focus(this.$refs.focusInput);
         },
-        onOptionFocusMoveChange(event) {
-            if (this.focusOnHover) {
-                const { originalEvent, processedOption } = event;
-                const { index, level, parentKey } = processedOption;
-
-                this.focusedOptionInfo = { index, level, parentKey };
-                this.changeFocusedOptionIndex(originalEvent, index);
+        onOptionMouseEnter(event) {
+            if (this.dirty) {
+                this.onOptionChange(event);
             }
         },
-        onOptionFocusChangeEnter(event) {
-            if (this.dirty) {
-                this.onOptionChange(event, false);
-            } else {
-                this.onOptionFocusMoveChange(event);
+        onOptionMouseMove(event) {
+            if (this.focused) {
+                this.changeFocusedOptionIndex(event, event.processedOption.index);
             }
         },
         onOptionSelect(event, processedOption, isHide = true) {
diff --git a/packages/primevue/src/cascadeselect/CascadeSelectSub.vue b/packages/primevue/src/cascadeselect/CascadeSelectSub.vue
index fc04e58e8c..bcb29a34c9 100644
--- a/packages/primevue/src/cascadeselect/CascadeSelectSub.vue
+++ b/packages/primevue/src/cascadeselect/CascadeSelectSub.vue
@@ -51,9 +51,9 @@
                     :optionGroupIcon="optionGroupIcon"
                     :optionGroupLabel="optionGroupLabel"
                     :optionGroupChildren="optionGroupChildren"
-                    @option-change="onOptionChange"
-                    @option-focus-change="onOptionFocusChange"
-                    @option-focus-enter-change="onOptionFocusEnterChange"
+                    @option-change="$emit('option-change', $event)"
+                    @option-focus-change="$emit('option-focus-change', $event)"
+                    @option-focus-enter-change="$emit('option-focus-enter-change', $event)"
                     :pt="pt"
                     :unstyled="unstyled"
                 />
@@ -148,15 +148,6 @@ export default {
         onOptionMouseMove(event, processedOption) {
             this.$emit('option-focus-change', { originalEvent: event, processedOption });
         },
-        onOptionChange(event) {
-            this.$emit('option-change', event);
-        },
-        onOptionFocusChange(event) {
-            this.$emit('option-focus-change', event);
-        },
-        onOptionFocusEnterChange(event) {
-            this.$emit('option-focus-enter-change', event);
-        },
         containerRef(el) {
             this.container = el;
         },