SelectMenu auto-picks first on blur

[emilsgulbis]

Environment

any

Version

2.15.2

Reproduction

https://stackblitz.com/edit/nuxt-ui-xzdxzu?file=app.vue

Description

Closing SelectMenu by clicking outside of the element triggers first option selection

Additional context

No response

Logs

No response

[YIngChenIt]

this seems to be an issue with headlessui

[ciak0]

Having the same issue

[timb-103]

Yeah, please fix this because I'm trying to update to most recent version so we can use the pro version (as it requires most recent?), however all USelects are broken because of this so I can't upgrade @benjamincanac .

[benjamincanac]

Unfortunately, as mentioned in #1252 (comment) this is an issue with Headless UI and we can't do much about it.

Have you tried to set the resolution @headlessui/vue to 1.7.16 in your package.json? (You will need to use overrides instead of resolutions in your using NPM instead of PNPM or YARN)

{
  "resolutions": {
    "@headlessui/vue": "1.7.16"
  }
}

[benjamincanac]

I want to add that the lack of maintenance of the Vue version of Headless UI is one of the motivation behind the complete rewrite we're doing at the moment to switch to Radix Vue (#1289).

[timb-103]

Alright thanks for the information, I'll give it a go and see! We're also just waiting on your next release so the placeholder bug is also fixed (as you've already done).

Also seen you mentioned this a while ago, were you still planning on doing that?

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.

Update: sorry, I've seen you have done it, did it not fix it?

Doing a great job, thank you!

[benjamincanac]

I had to remove the resolution to fix some other bugs which introduced back this one 😬

[timb-103]

I had to remove the resolution to fix some other bugs which introduced back this one 😬

Ah okay, seems like it doesn't work anyway, was this the other error you fixed?

error [nuxt] error caught during app initialization Error: The requested module 'https://localhost:3000/_nuxt/node_modules/@nuxt/ui/node_modules/@headlessui/vue/dist/headlessui.esm.js?v=a3824729' doesn't provide an export named: 'provideUseId'
Caused by: SyntaxError: The requested module 'https://localhost:3000/_nuxt/node_modules/@nuxt/ui/node_modules/@headlessui/vue/dist/headlessui.esm.js?v=a3824729' doesn't provide an export named: 'provideUseId'

[benjamincanac]

Now you mention it, in https://github.com/tailwindlabs/headlessui/releases/tag/%40headlessui%2Fvue%40v1.7.18 they introduced provideUseId to fix all hydration issues we had (fixed in https://github.com/nuxt/ui/releases/tag/v2.14.0) so we can't go back 😬

The issue is caused by tailwindlabs/headlessui#2712 released in https://github.com/tailwindlabs/headlessui/releases/tag/%40headlessui%2Fvue%40v1.7.17 so not sure what do to about this...

[benjamincanac]

#1981 (comment)