Dropdown: Typing in the filter box clears the selection

[matthew-dean]

Describe the bug

I'm not sure why, but for some reason this Dropdown behavior differs from what's on the PrimeVue website (even though this is forked from the StackBlitz links on this page). I'm having the same issue -- if I start typing to filter the list, it will not preserve the selected item. I want the Dropdown to ALWAYS have an item from the list selected, even if the list is filtered and that item is not showing.

Reproducer

https://stackblitz.com/edit/primevue-create-vue-typescript-issue-template-y9th74?file=src%2FApp.vue

PrimeVue version

3.47.2

Vue version

3.x

Language

TypeScript

Build / Runtime

Vue CLI App

Browser(s)

Chrome 123

Steps to reproduce the behavior

1. Go to the Stackblitz link
2. Note that there is a selection
3. Click the dropdown and start typing to filter the list
4. Note that the dropdown box suddenly "empties" the previously selected item

Expected behavior

I want to be able to limit the Dropdown to always having a selection from the list (and ideally defaulting to the first item, just like an HTML dropdown would). See: https://github.com/orgs/primefaces/discussions/1663

[Heunsig]

Although the exact reason why the selected value disappears when typing in the filter box is unclear, I found a workaround to solve this issue.
By customizing the #value slot in the Dropdown, the problem can be fixed. Here’s an example of how to solve this issue using your code base:

<Dropdown
  filter
  v-model="selectedDomain"
  :options="domainsFiltered"
  optionValue="name"
  optionLabel="name"
>
  <template #value="{ value, placeholder }">
    <template v-if="value">
      {{ value }}
    </template>
    <template v-else>
      {{ placeholder }}
    </template>
  </template>
</Dropdown>