SelectMenu onBlur selects first item when searchable is true

[NilsEvers]

Environment

• Operating System: Darwin
• Node Version: v21.5.0
• Nuxt Version: 3.9.1
• CLI Version: 3.10.0
• Nitro Version: 2.8.1
• Package Manager: npm@10.2.4
• Builder: -
• User Config: modules, ssr, devtools, typescript, imports, colorMode, ui, sanctum
• Runtime Modules: nuxt-auth-sanctum@0.0.14, @nuxt/ui@2.12.0, @nuxtjs/color-mode@3.3.2, @nuxtjs/i18n@8.0.0, @vueuse/nuxt@10.7.2
• Build Modules: -

Version

v2.12.0

Reproduction

1. Add a SelectMenu with the searchable prop set to true
2. No value is yet selected in the SelectMenu
3. Open the menu
4. Click outside the menu to cancel the selection
5. The first item will be selected now

The issue can easily be reproduced with the example from the docs.

Description

When using the SelectMenu with searchable set to true, the first item is selected when clicking outside the menu.

If the selection is cancelled by pressing the esc key the issue does not occur.

Additional context

No response

Logs

No response

[benjamincanac]

Indeed, I've never noticed that. Unfortunately, it has something to do with Headless UI Combobox internal behaviour, it does the same thing when playing with their example: https://headlessui.com/vue/combobox.

Maybe this https://github.com/tailwindlabs/headlessui/blob/main/packages/%40headlessui-vue/src/components/combobox/combobox.ts#L1239?

[NilsEvers]

Your right, the problem is upstream. I created an issue for Headless UI.

[benjamincanac]

The next release will have this d67c748 that pins @headlessui/vue to the previous version so it doesn't break any combobox. The issue was also present in the CommandPalette and InputMenu as they all use the Combobox.

[benjamincanac]

Should be fixed in https://github.com/nuxt/ui/releases/tag/v2.12.1.

[gamersover]

Looks like the InputMenu still have this issue.

[GrothDK]

Yeh, i'm also running into this issue.....
Edit: There is a recent open issue about this. #1708

[1hakr]

The issue still exists