feat: Update version to 2.2.2, enhance global navigation exclusion logic, and improve hover behavior in MegaMenu

src/extensions/megaMenu/MegaMenu.module.scss

@@ -70,6 +70,15 @@ $menuLayer: var(--megaMenuZIndex, 6000);
         padding: 0;
     }
 
+    .mega-menu-top-item:hover,
+    .mega-menu-top-item:focus-within,
+    .mega-menu-top-item:active,
+    .mega-menu-top-item.is-open,
+    .mega-menu-top-item.is-active {
+        background: $neutralLighter;
+        color: $neutralPrimary;
+    }
+
     .mega-menu-mobile-toggle {
         display: none;
     }
@@ -132,8 +141,8 @@ $menuLayer: var(--megaMenuZIndex, 6000);
     .menu-item-text:hover,
     .menu-item-toggle:hover,
     .menu-item-toggle[aria-expanded='true'] {
-        background: $neutralLighter;
-        color: $neutralPrimary;
+        background: transparent;
+        color: inherit;
         text-decoration: none;
     }
 
@@ -309,8 +318,9 @@ $menuLayer: var(--megaMenuZIndex, 6000);
         outline: none;
     }
 
-    .flyout-link:hover,
+    .flyout-item:hover > .flyout-link,
     .flyout-item:focus-within > .flyout-link,
+    .flyout-item:active > .flyout-link,
     .flyout-item.is-active > .flyout-link {
         background: $neutralLighter;
         color: $neutralPrimary;
@@ -461,7 +471,7 @@ $menuLayer: var(--megaMenuZIndex, 6000);
         .menu-item-toggle {
             width: 44px;
             margin: 0;
-            border-left: 1px solid $neutralLight;
+            border-left: 0;
         }
 
         .mega-menu {

src/extensions/megaMenu/MegaMenuRenderer.ts

@@ -23,8 +23,8 @@ export interface IMegaMenuRendererStrings {
 }
 
 export class MegaMenuRenderer {
-    private static readonly hoverOpenDelayMs: number = 140;
-    private static readonly hoverCloseDelayMs: number = 180;
+    private static readonly hoverOpenDelayMs: number = 0;
+    private static readonly hoverCloseDelayMs: number = 0;
     private _container: HTMLElement | undefined;
     private _documentKeydownHandler: ((event: KeyboardEvent) => void) | undefined;
     private _documentClickHandler: ((event: MouseEvent) => void) | undefined;
@@ -657,6 +657,7 @@ export class MegaMenuRenderer {
         const label: string = this.getTriggerLabel(trigger);
         trigger.setAttribute('aria-expanded', 'true');
         trigger.setAttribute('aria-label', this.strings.closeSubmenu + ' ' + label);
+        (trigger.parentElement as HTMLElement).classList.add('is-open');
         menu.setAttribute('aria-expanded', 'true');
         menu.classList.add('js-open');
         this.announce(label + ' ' + this.strings.opened);
@@ -667,6 +668,7 @@ export class MegaMenuRenderer {
         const label: string = this.getTriggerLabel(trigger);
         trigger.setAttribute('aria-expanded', 'false');
         trigger.setAttribute('aria-label', this.strings.openSubmenu + ' ' + label);
+        (trigger.parentElement as HTMLElement).classList.remove('is-open');
         menu.setAttribute('aria-expanded', 'false');
         menu.classList.remove('js-open');
         this.announce(label + ' ' + this.strings.closed);