@@ -464,6 +464,10 @@ export class MenuItem extends LikeAnchor(
464464 this . setAttribute ( 'tabindex' , '-1' ) ;
465465 this . addEventListener ( 'keydown' , this . handleKeydown ) ;
466466 this . addEventListener ( 'mouseover' , this . handleMouseover ) ;
467+ // Register pointerenter/leave for ALL menu items (not just those with submenus)
468+ // so items without submenus can close sibling submenus when hovered
469+ this . addEventListener ( 'pointerenter' , this . handlePointerenter ) ;
470+ this . addEventListener ( 'pointerleave' , this . handlePointerleave ) ;
467471 if ( ! this . hasAttribute ( 'id' ) ) {
468472 this . id = `sp-menu-item-${ randomID ( ) } ` ;
469473 }
@@ -626,18 +630,21 @@ export class MenuItem extends LikeAnchor(
626630 return ;
627631 }
628632
629- // Close other submenus
630- if ( ! this . open ) {
631- this . menuData . parentMenu ?. closeDescendentOverlays ( ) ;
632- }
633+ // Close sibling submenus before opening this one
634+ this . menuData . parentMenu ?. closeDescendentOverlays ( ) ;
633635
634636 if ( this . leaveTimeout ) {
635637 clearTimeout ( this . leaveTimeout ) ;
636638 delete this . leaveTimeout ;
637639 this . recentlyLeftChild = false ;
638640 return ;
639641 }
640- this . focus ( ) ;
642+
643+ // Only focus items with submenus on hover (to show they're interactive)
644+ // Regular items should not show focus styling on hover, only on keyboard navigation
645+ if ( this . hasSubmenu ) {
646+ this . focus ( ) ;
647+ }
641648 this . openOverlay ( ) ;
642649 }
643650
@@ -782,16 +789,6 @@ export class MenuItem extends LikeAnchor(
782789 this . handleSubmenuTriggerClick ,
783790 options
784791 ) ;
785- this . addEventListener (
786- 'pointerenter' ,
787- this . handlePointerenter ,
788- options
789- ) ;
790- this . addEventListener (
791- 'pointerleave' ,
792- this . handlePointerleave ,
793- options
794- ) ;
795792 this . addEventListener (
796793 'sp-opened' ,
797794 this . handleSubmenuOpen ,
0 commit comments