Other interactive elements inside a combobox dropdown

[wouterlms]

Is it possible to include other interactive elements, like a button, within a combobox dropdown? I understand the reasoning behind the "limitations," but in certain use cases, it would be helpful to have something like a "Clear" button that is tabbable.

For context, I’ve implemented my own version of the combobox using a listbox, which is structured as follows:

<Listbox>
  <Popover>
    <template #trigger>
      <ListboxFilter />
    </template>

    <template #content>
      <ListboxContent>
        <!-- Can I add a button here?  -->

        <ListboxItem>
          <!-- ... -->
        </ListboxItem>
      </ListboxContent>
    </template>
  </Popover>
</Listbox>

The problem is that when I add a button, it gets immediately focused, making it impossible to refocus the input. This makes sense since the popover enforces a focus trap. Disabling the focus trap on the popover content doesn’t seem to have any effect.

I also have a select variant where the full listbox is contained within the dropdown. In that case, it's possible to include other elements outside of ListboxRoot. Still, I’m curious if there’s a way to make it work in the scenario above.

[wouterlms]

It seems to be possible with the reka Combobox, just not with my custom implementation since it uses a popover.