Menu item focus visible styles show even when using the mouse

[claviska]

The menu item's blue background is the intended style when the browser's heuristics determine that :focus-visible styles should be used, i.e. for keyboard users. In this case, we need more contrast.

Mouse users, however, should see the lighter gray background as a hover state. Less contrast here is OK because they're using a pointing device instead of the keyboard.

Alas, a user reported seeing a problem with these styles. Further investigation led me to this line which is causing the :focus-visible styles to always appear.

shoelace/src/components/menu-item/menu-item.component.ts

Line 102 in 296a24c

this.focus();

[claviska]

/cc @koba-ninkigumi