kobaltedev / kobalte

A UI toolkit for building accessible web apps and design systems with SolidJS.
https://kobalte.dev
MIT License
1.2k stars 61 forks source link

Menubar: Incorrect trigger interaction on menu close #333

Closed fnky closed 5 months ago

fnky commented 6 months ago

Describe the bug

When closing the menu there are two cases where the menu will close visually but stay in a state as if the menu is open.

  1. Clicking on the trigger will continue to open menus when hovering over other triggers.
  2. Closing the menu with Escape will stop keyboard navigation and highlight other triggers, without opening the menu.

To Reproduce Steps to reproduce the behavior:

First case;

  1. Click on a trigger to open its menu.
  2. Click on the trigger again to close the menu.
  3. Hover other triggers; it will open their menus.

Second case;

  1. Click on a trigger to open its menu.
  2. Press Escape to close the menu.
  3. Hover other triggers; Will highlight items on hover, but keyboard navigation and interaction doesn't work.

Expected behavior

For the first case, after closing the menu on the trigger, other triggers should not open when hovered.

For the second case, it should close the menu, and keep keyboard navigation functioning.

Screenshots

First case
Second case

Desktop (please complete the following information):

Additional context See Radix UI Menubar as an example of expected behavior.

jer3m01 commented 6 months ago

Thanks again!