feat(InputMenu): add allowFreeInput prop to behave like a real input

[maximelebreton]

Unfinished Pull Request – Need Guidance / Help :)

Add allowFreeInput prop to InputMenu component.

This prop enables users to type any value in the input field, even if it is not present in the items list. When enabled, the typed value is directly reflected in v-model, making the InputMenu behave more like a standard input field rather than a strict select.

🔗 Linked issue

Resolves #4859

❓ Type of change

• 📖 Documentation (updates to the documentation or readme)
• 🐞 Bug fix (a non-breaking change that fixes an issue)
• 👌 Enhancement (improving an existing functionality)
• ✨ New feature (a non-breaking change that adds functionality)
• 🧹 Chore (updates to the build process or auxiliary tools and libraries)
• ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

📚 Description

• Added allowFreeInput?: boolean prop (default: false)
• Updated ComboboxInput to emit update:modelValue when free input is allowed
• Maintains backward compatibility for users who do not enable this prop

Previously, it was not possible to have an autocomplete behavior
where suggestions appear but the typed value always takes priority.
The input acted like a SelectMenu, requiring the value to exist
in the items list.

With allowFreeInput, the user can type any value, which is
directly reflected in v-model, while still showing suggestions
from the items list.

📝 Checklist

• I have linked an issue or discussion.
• I have updated the documentation accordingly.

[pkg-pr-new]

npm i https://pkg.pr.new/@nuxt/ui@4942

commit: 67541d3

[maximelebreton]

Sorry, it's my first pull request. I realize that just making tweaks isn't the right approach, and I’m not fully sure how to proceed cleanly.
If someone can guide me in the right direction, I’d really appreciate it.

[maximelebreton]

I've tried to contribute, but I wasn't able to create a clean pull request, so I'm losing my changes.

That said, I still feel that InputMenu does not behave like a true input but more like a SelectMenu. I don't understand why InputMenu and SelectMenu are so similar.

From my perspective, InputMenu should act as an autocomplete, where the user's input is the priority, and shouldn't be cleared on blur.

Here's an example of what I imagine InputMenu should be (a true autocomplete, and not a select menu):
https://codesandbox.io/p/sandbox/nuxt-ui-autocomplete-ggl25s

@benjamincanac I'd love to hear your thoughts on this and whether you agree with this approach or see it differently.

[benjamincanac]

@maximelebreton The InputMenu component is built on top of Reka UI's Combobox component: https://reka-ui.com/docs/components/combobox

Do you manage to achieve your expected behavior with it? 🤔