Dropdown with mode="hover" breaks interaction on touch device

[WouS95]

Environment

• Operating System: Darwin
• Node Version: v18.20.3
• Nuxt Version: 3.14.1592
• CLI Version: 3.17.2
• Nitro Version: 2.10.4
• Package Manager: [email protected]
• Builder: -
• User Config: default
• Runtime Modules: @nuxt/[email protected], @nuxt/[email protected], @nuxt/[email protected], @vueuse/[email protected]
• Build Modules: -

Is this bug related to Nuxt or Vue?

Nuxt

Version

3.13.2

Reproduction

1. Use this template: https://github.com/nuxt-ui-pro/dashboard
2. Run the app (npm run dev) (or run the demo: https://dashboard-template.nuxt.dev/)
3. Open devtools and toggle device toolbar
4. Click on the menu icon and then the nuxt text on the top.
5. It is buggy because the hover mode is not taking into account the touch device input.

Description

I use the template from https://github.com/nuxt-ui-pro/dashboard and tested it on mobile.
The component UDropdown has a mode of 'hover'. This however breaks the interaction on mobile/touch devices.

This is reproduced in the devtools using the mobile emulator, as well as your own device (ios).

Additional context

I believe this to be a bug since an example should be working properly on all devices without workarounds.

Logs