kobaltedev / kobalte

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

Using <a> inside a DropdownMenu.Item is broken #389

Closed Vexcited closed 5 months ago

Vexcited commented 6 months ago

Describe the bug

When clicking on a <a> inside of a DropdownMenu.Item, we don't get any navigation and the dropdown closes.

To Reproduce Steps to reproduce the behavior:

  1. Use a dropdown and have a link as item of that dropdown
<DropdownMenu.Item asChild>
  <As component="a" href="/hello">
    {props.children}
  </As>
</DropdownMenu.Item>

Expected behavior

When you click on it, it should navigate and close the dropdown.

Screenshots

image

I have a navbar on every routes containing that dropdown.

Desktop (please complete the following information):

Additional context

If I add closeOnSelect={false}, it works but then it doesn't close the dropdown. Is there a way that I can maybe close the dropdown after 100ms or after a tick using queueMicrotask ?