From 8ae44b13ed4931fa4445a66acbf2d29be8933c9b Mon Sep 17 00:00:00 2001
From: Cesar Gonzalez <cesar.a.gonzalezcs@gmail.com>
Date: Fri, 5 Apr 2024 16:33:03 -0500
Subject: [PATCH] [CL-255] Opening a menu by mouse click shows an outline on
 the first submenu item (#8629)

---
 libs/components/src/menu/menu-item.directive.ts | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/libs/components/src/menu/menu-item.directive.ts b/libs/components/src/menu/menu-item.directive.ts
index 2a50dd366f..77246bbcdf 100644
--- a/libs/components/src/menu/menu-item.directive.ts
+++ b/libs/components/src/menu/menu-item.directive.ts
@@ -16,12 +16,12 @@ export class MenuItemDirective implements FocusableOption {
     "tw-bg-background",
     "tw-text-left",
     "hover:tw-bg-secondary-100",
-    "focus:tw-bg-secondary-100",
-    "focus:tw-z-50",
-    "focus:tw-outline-none",
-    "focus:tw-ring",
-    "focus:tw-ring-offset-2",
-    "focus:tw-ring-primary-700",
+    "focus-visible:tw-bg-secondary-100",
+    "focus-visible:tw-z-50",
+    "focus-visible:tw-outline-none",
+    "focus-visible:tw-ring",
+    "focus-visible:tw-ring-offset-2",
+    "focus-visible:tw-ring-primary-700",
     "active:!tw-ring-0",
     "active:!tw-ring-offset-0",
   ];