From 5aab120fe5b730bed6fc5142f297302a09f93f5e 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: Fri, 28 Apr 2023 13:15:44 +0300
Subject: [PATCH] Refactor #3907 - options have changed as context

---
 components/lib/contextmenu/ContextMenu.d.ts   |  4 ++--
 components/lib/contextmenu/ContextMenuSub.vue |  2 +-
 components/lib/dock/Dock.d.ts                 | 12 ++++++++++
 components/lib/dock/DockSub.vue               | 24 +++++++++++++------
 components/lib/megamenu/MegaMenu.d.ts         |  4 ++--
 components/lib/megamenu/MegaMenuSub.vue       |  2 +-
 components/lib/menu/Menu.d.ts                 | 12 ++++++++++
 components/lib/menu/Menuitem.vue              |  2 +-
 components/lib/menubar/Menubar.d.ts           |  4 ++--
 components/lib/menubar/MenubarSub.vue         |  2 +-
 components/lib/panelmenu/PanelMenu.d.ts       | 17 +++++++++++++
 components/lib/panelmenu/PanelMenuSub.vue     |  2 +-
 components/lib/tabmenu/TabMenu.d.ts           |  4 ++--
 components/lib/tabmenu/TabMenu.vue            |  2 +-
 components/lib/tieredmenu/TieredMenu.d.ts     |  4 ++--
 components/lib/tieredmenu/TieredMenuSub.vue   |  2 +-
 16 files changed, 75 insertions(+), 24 deletions(-)

diff --git a/components/lib/contextmenu/ContextMenu.d.ts b/components/lib/contextmenu/ContextMenu.d.ts
index e23c66909..90b3ee5c1 100755
--- a/components/lib/contextmenu/ContextMenu.d.ts
+++ b/components/lib/contextmenu/ContextMenu.d.ts
@@ -20,7 +20,7 @@ export declare type ContextMenuPassThroughOptionType = ContextMenuPassThroughAtt
 export interface ContextMenuPassThroughMethodOptions {
     props: ContextMenuProps;
     state: ContextMenuState;
-    options: ContextMenuOptions;
+    context: ContextMenuContext;
 }
 
 /**
@@ -129,7 +129,7 @@ export interface ContextMenuState {
 /**
  * Defines current options in ContextMenu component.
  */
-export interface ContextMenuOptions {
+export interface ContextMenuContext {
     /**
      * Current active state of menuitem as a boolean.
      * @defaultValue false
diff --git a/components/lib/contextmenu/ContextMenuSub.vue b/components/lib/contextmenu/ContextMenuSub.vue
index d4aab6021..b1fe95df4 100755
--- a/components/lib/contextmenu/ContextMenuSub.vue
+++ b/components/lib/contextmenu/ContextMenuSub.vue
@@ -149,7 +149,7 @@ export default {
         },
         getPTOptions(processedItem, key) {
             return this.ptm(key, {
-                options: {
+                context: {
                     active: this.isItemActive(processedItem),
                     focused: this.isItemFocused(processedItem)
                 }
diff --git a/components/lib/dock/Dock.d.ts b/components/lib/dock/Dock.d.ts
index ca2ceb066..2c11c73bb 100644
--- a/components/lib/dock/Dock.d.ts
+++ b/components/lib/dock/Dock.d.ts
@@ -19,6 +19,7 @@ export declare type DockPassThroughOptionType = DockPassThroughAttributes | ((op
 export interface DockPassThroughMethodOptions {
     props: DockProps;
     state: DockState;
+    context: DockContext;
 }
 
 /**
@@ -88,6 +89,17 @@ export interface DockState {
     focusedOptionIndex: number;
 }
 
+/**
+ * Defines current options in Dock component.
+ */
+export interface DockContext {
+    /**
+     * Current active state of menuitem as a boolean.
+     * @defaultValue false
+     */
+    active: boolean;
+}
+
 /**
  * Defines tooltip options
  */
diff --git a/components/lib/dock/DockSub.vue b/components/lib/dock/DockSub.vue
index dc2271001..98be1c103 100644
--- a/components/lib/dock/DockSub.vue
+++ b/components/lib/dock/DockSub.vue
@@ -25,9 +25,9 @@
                     :aria-disabled="disabled(processedItem)"
                     @click="onItemClick($event, processedItem)"
                     @mouseenter="onItemMouseEnter(index)"
-                    v-bind="ptm('menuitem')"
+                    v-bind="getPTOptions(getItemId(index), 'menuitem')"
                 >
-                    <div class="p-menuitem-content" v-bind="ptm('content')">
+                    <div class="p-menuitem-content" v-bind="getPTOptions(getItemId(index), 'content')">
                         <template v-if="!templates['item']">
                             <router-link v-if="processedItem.to && !disabled(processedItem)" v-slot="{ navigate, href, isActive, isExactActive }" :to="processedItem.to" custom>
                                 <a
@@ -38,10 +38,10 @@
                                     tabindex="-1"
                                     aria-hidden="true"
                                     @click="onItemActionClick($event, processedItem, navigate)"
-                                    v-bind="ptm('action')"
+                                    v-bind="getPTOptions(getItemId(index), 'action')"
                                 >
                                     <template v-if="!templates['icon']">
-                                        <span v-ripple :class="['p-dock-icon', processedItem.icon]" v-bind="ptm('icon')"></span>
+                                        <span v-ripple :class="['p-dock-icon', processedItem.icon]" v-bind="getPTOptions(getItemId(index), 'icon')"></span>
                                     </template>
                                     <component v-else :is="templates['icon']" :item="processedItem"></component>
                                 </a>
@@ -54,10 +54,10 @@
                                 :target="processedItem.target"
                                 tabindex="-1"
                                 aria-hidden="true"
-                                v-bind="ptm('action')"
+                                v-bind="getPTOptions(getItemId(index), 'action')"
                             >
                                 <template v-if="!templates['icon']">
-                                    <span v-ripple :class="['p-dock-icon', processedItem.icon]" v-bind="ptm('icon')"></span>
+                                    <span v-ripple :class="['p-dock-icon', processedItem.icon]" v-bind="getPTOptions(getItemId(index), 'icon')"></span>
                                 </template>
                                 <component v-else :is="templates['icon']" :item="processedItem"></component>
                             </a>
@@ -138,9 +138,19 @@ export default {
         getItemProp(processedItem, name) {
             return processedItem && processedItem.item ? ObjectUtils.getItemValue(processedItem.item[name]) : undefined;
         },
+        getPTOptions(id, key) {
+            return this.ptm(key, {
+                context: {
+                    active: this.isItemActive(id)
+                }
+            });
+        },
         isSameMenuItem(event) {
             return event.currentTarget && (event.currentTarget.isSameNode(event.target) || event.currentTarget.isSameNode(event.target.closest('.p-menuitem')));
         },
+        isItemActive(id) {
+            return id === this.focusedOptionIndex;
+        },
         onListMouseLeave() {
             this.currentIndex = -3;
         },
@@ -262,7 +272,7 @@ export default {
             return [
                 'p-dock-item',
                 {
-                    'p-focus': id === this.focusedOptionIndex,
+                    'p-focus': this.isItemActive(id),
                     'p-disabled': this.disabled(item),
                     'p-dock-item-second-prev': this.currentIndex - 2 === index,
                     'p-dock-item-prev': this.currentIndex - 1 === index,
diff --git a/components/lib/megamenu/MegaMenu.d.ts b/components/lib/megamenu/MegaMenu.d.ts
index 3a0e776f7..89cf08513 100755
--- a/components/lib/megamenu/MegaMenu.d.ts
+++ b/components/lib/megamenu/MegaMenu.d.ts
@@ -19,7 +19,7 @@ export declare type MegaMenuPassThroughOptionType = MegaMenuPassThroughAttribute
 export interface MegaMenuPassThroughMethodOptions {
     props: MegaMenuProps;
     state: MegaMenuState;
-    options: MegaMenuOptions;
+    context: MegaMenuContext;
 }
 
 /**
@@ -142,7 +142,7 @@ export interface MegaMenuState {
 /**
  * Defines current options in MegaMenu component.
  */
-export interface MegaMenuOptions {
+export interface MegaMenuContext {
     /**
      * Current active state of menuitem as a boolean.
      * @defaultValue false
diff --git a/components/lib/megamenu/MegaMenuSub.vue b/components/lib/megamenu/MegaMenuSub.vue
index 20c288345..2cc6f877e 100644
--- a/components/lib/megamenu/MegaMenuSub.vue
+++ b/components/lib/megamenu/MegaMenuSub.vue
@@ -153,7 +153,7 @@ export default {
         },
         getPTOptions(processedItem, key) {
             return this.ptm(key, {
-                options: {
+                context: {
                     active: this.isItemActive(processedItem),
                     focused: this.isItemFocused(processedItem)
                 }
diff --git a/components/lib/menu/Menu.d.ts b/components/lib/menu/Menu.d.ts
index 9262d5a41..0fd3a36db 100755
--- a/components/lib/menu/Menu.d.ts
+++ b/components/lib/menu/Menu.d.ts
@@ -19,6 +19,7 @@ export declare type MenuPassThroughOptionType = MenuPassThroughAttributes | ((op
 export interface MenuPassThroughMethodOptions {
     props: MenuProps;
     state: MenuState;
+    context: MenuContext;
 }
 
 /**
@@ -107,6 +108,17 @@ export interface MenuState {
     selectedOptionIndex: number;
 }
 
+/**
+ * Defines current options in Menu component.
+ */
+export interface MenuContext {
+    /**
+     * Current focused state of menuitem as a boolean.
+     * @defaultValue false
+     */
+    focused: boolean;
+}
+
 /**
  * Defines valid properties in Menu component.
  */
diff --git a/components/lib/menu/Menuitem.vue b/components/lib/menu/Menuitem.vue
index 1e9971ede..293da0c81 100644
--- a/components/lib/menu/Menuitem.vue
+++ b/components/lib/menu/Menuitem.vue
@@ -43,7 +43,7 @@ export default {
         },
         getPTOptions(key) {
             return this.ptm(key, {
-                options: {
+                context: {
                     focused: this.isItemFocused()
                 }
             });
diff --git a/components/lib/menubar/Menubar.d.ts b/components/lib/menubar/Menubar.d.ts
index fb2776347..f4281938b 100755
--- a/components/lib/menubar/Menubar.d.ts
+++ b/components/lib/menubar/Menubar.d.ts
@@ -19,7 +19,7 @@ export declare type MenubarPassThroughOptionType = MenubarPassThroughAttributes
 export interface MenubarPassThroughMethodOptions {
     props: MenubarProps;
     state: MenubarState;
-    options: MenubarOptions;
+    context: MenubarContext;
 }
 
 /**
@@ -139,7 +139,7 @@ export interface MenubarState {
 /**
  * Defines current options in Menubar component.
  */
-export interface MenubarOptions {
+export interface MenubarContext {
     /**
      * Current active state of menuitem as a boolean.
      * @defaultValue false
diff --git a/components/lib/menubar/MenubarSub.vue b/components/lib/menubar/MenubarSub.vue
index 08c593ef8..fbf563d7f 100755
--- a/components/lib/menubar/MenubarSub.vue
+++ b/components/lib/menubar/MenubarSub.vue
@@ -144,7 +144,7 @@ export default {
         },
         getPTOptions(processedItem, key) {
             return this.ptm(key, {
-                options: {
+                context: {
                     active: this.isItemActive(processedItem),
                     focused: this.isItemFocused(processedItem)
                 }
diff --git a/components/lib/panelmenu/PanelMenu.d.ts b/components/lib/panelmenu/PanelMenu.d.ts
index e30a959e8..86c8978be 100755
--- a/components/lib/panelmenu/PanelMenu.d.ts
+++ b/components/lib/panelmenu/PanelMenu.d.ts
@@ -19,6 +19,7 @@ export declare type PanelMenuPassThroughOptionType = PanelMenuPassThroughAttribu
 export interface PanelMenuPassThroughMethodOptions {
     props: PanelMenuProps;
     state: PanelMenuState;
+    context: PanelMenuContext;
 }
 
 /**
@@ -122,6 +123,22 @@ export interface PanelMenuState {
     activeItem: MenuItem[];
 }
 
+/**
+ * Defines current options in PanelMenu component.
+ */
+export interface PanelMenuContext {
+    /**
+     * Current active state of menuitem as a boolean.
+     * @defaultValue false
+     */
+    active: boolean;
+    /**
+     * Current focused state of menuitem as a boolean.
+     * @defaultValue false
+     */
+    focused: boolean;
+}
+
 /**
  * Custom expanded keys metadata.
  * @see {@link PanelMenuProps.expandedKeys}
diff --git a/components/lib/panelmenu/PanelMenuSub.vue b/components/lib/panelmenu/PanelMenuSub.vue
index e1cae6f93..84f87b190 100755
--- a/components/lib/panelmenu/PanelMenuSub.vue
+++ b/components/lib/panelmenu/PanelMenuSub.vue
@@ -124,7 +124,7 @@ export default {
         },
         getPTOptions(processedItem, key) {
             return this.ptm(key, {
-                options: {
+                context: {
                     active: this.isItemActive(processedItem),
                     focused: this.isItemFocused(processedItem)
                 }
diff --git a/components/lib/tabmenu/TabMenu.d.ts b/components/lib/tabmenu/TabMenu.d.ts
index d5ce6e79e..fe5991fae 100755
--- a/components/lib/tabmenu/TabMenu.d.ts
+++ b/components/lib/tabmenu/TabMenu.d.ts
@@ -19,7 +19,7 @@ export declare type TabMenuPassThroughOptionType = TabMenuPassThroughAttributes
 export interface TabMenuPassThroughMethodOptions {
     props: TabMenuProps;
     state: TabMenuState;
-    options: TabMenuOptions;
+    context: TabMenuContext;
 }
 
 /**
@@ -78,7 +78,7 @@ export interface TabMenuState {
 /**
  * Defines current options in TabMenu component.
  */
-export interface TabMenuOptions {
+export interface TabMenuContext {
     /**
      * Order of the menuitem
      */
diff --git a/components/lib/tabmenu/TabMenu.vue b/components/lib/tabmenu/TabMenu.vue
index d06be9806..5778ad8e5 100755
--- a/components/lib/tabmenu/TabMenu.vue
+++ b/components/lib/tabmenu/TabMenu.vue
@@ -99,7 +99,7 @@ export default {
     methods: {
         getPTOptions(key, index) {
             return this.ptm(key, {
-                options: {
+                context: {
                     order: index
                 }
             });
diff --git a/components/lib/tieredmenu/TieredMenu.d.ts b/components/lib/tieredmenu/TieredMenu.d.ts
index 4184996d2..679704a75 100755
--- a/components/lib/tieredmenu/TieredMenu.d.ts
+++ b/components/lib/tieredmenu/TieredMenu.d.ts
@@ -19,7 +19,7 @@ export declare type TieredMenuPassThroughOptionType = TieredMenuPassThroughAttri
 export interface TieredMenuPassThroughMethodOptions {
     props: TieredMenuProps;
     state: TieredMenuState;
-    options: TieredMenuOptions;
+    context: TieredMenuContext;
 }
 
 /**
@@ -123,7 +123,7 @@ export interface TieredMenuState {
 /**
  * Defines current options in TieredMenu component.
  */
-export interface TieredMenuOptions {
+export interface TieredMenuContext {
     /**
      * Current active state of menuitem as a boolean.
      * @defaultValue false
diff --git a/components/lib/tieredmenu/TieredMenuSub.vue b/components/lib/tieredmenu/TieredMenuSub.vue
index e8b2c9807..dcf3574fb 100755
--- a/components/lib/tieredmenu/TieredMenuSub.vue
+++ b/components/lib/tieredmenu/TieredMenuSub.vue
@@ -130,7 +130,7 @@ export default {
         },
         getPTOptions(processedItem, key) {
             return this.ptm(key, {
-                options: {
+                context: {
                     active: this.isItemActive(processedItem),
                     focused: this.isItemFocused(processedItem)
                 }