fix(List, Menu): [juno-core] fix list item focus inside issue with mu…

…i focus-visible issue
ringcentral · Sep 12, 2024 · 985231b · 985231b
1 parent 5fbbe9b
commit 985231b
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/packages/juno-core/src/components/List/ListItem/styles/ListItemStyle.tsx b/packages/juno-core/src/components/List/ListItem/styles/ListItemStyle.tsx
@@ -64,12 +64,22 @@ export const sharedListItemStyle: RcThemedStyled<
       background-color: ${setAlpha(baseColor, 0.05)};
     `};
 
+    &.${
+        // mui focus visible have issue in old version, we use the focus-visible polyfill class to do that
+
+        // that for menuItem, because in current version of menuItem that not support focused classes
+        // TODO: that can be remove after upgrade to V5
+        mainClasses.focusVisible
+      },
+      &.Mui-focusVisible {
+      background-color: unset;
+    }
+
     ${
       // that for menuItem, because in current version of menuItem that not support focused classes
       // TODO: that can be remove after upgrade to V5
       focusVisible
-    },
-    &.${mainClasses.focusVisible} {
+    } {
       background-color: ${() => {
         // to override mui focus visible style when item is highlighted
         if (useFocusRing && highlighted) {

diff --git a/sync-github.json b/sync-github.json
@@ -1,3 +1,3 @@
 {
-  "latestCommitSHA": "c2e94d441bd943056e5be88c9a632ebbece64ad5"
+  "latestCommitSHA": "c3dd213f2453d6bca230cd0950fb2861ee42037e"
 }