feat(SelectMenu): add clearable icon to reset modelValue

[emilsgulbis]

🔗 Linked issue

Resolves #1057

❓ 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 clear button to the SelectMenu

📝 Checklist

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

[emilsgulbis]

hey @benjamincanac
tried my best for first time OS PR. If i need to make any adjustments - please let me know

[emilsgulbis]

@benjamincanac Could you please give me some instructions to make this good to merge?

[rasyidly]

up, i really need this feature 🚀

[hasan-ozbey]

what are we waiting for

[benjamincanac]

Sorry for the delay on this, I've updated the PR and merged v3 but do note that this only works when the user actually provide a v-model, this is why I'd rather wait for Reka UI to implement this (unovue/reka-ui#1654).

[lacorde]

Quick workaround for those who need this sooner rather than later :

<USelectMenu
  v-model="selected"
  :items
>
  <template #trailing>
      <UIcon
        v-if="selected"
        name="i-lucide-x"
        class="size-4 cursor-pointer text-dimmed"
        @click="selected = undefined"
      />
  </template>
</USelectMenu>

[maximepvrt]

@emilsgulbis @benjamincanac unovue/reka-ui#2213 has been merged and will be available in the next release 🎉
It adds the new resetModelValueOnClear option along with the <ComboboxCancel /> component.

It would be great to also add same option for InputMenu (#4239)

Linked to #5088

[benjamincanac]

Closing in favor of #5643.