[Feature Request] Combobox

[alessiogmonti]

Hello,
When adding a search component to the Select component, something like:

<Select.Root defaultValue="apple">
  <Select.Trigger />
  <Select.Content>
    <Select.Group>

      <TextField.Root
          placeholder="Search..."
          value={search}
          onChange={handleSearchInput}>
          <TextField.Slot>
            <MagnifyingGlassIcon height="16" width="16" />
          </TextField.Slot>
        </TextField.Root>

    </Select.Group>
    <Select.Separator />
    <Select.Group>
      <Select.Label>Vegetables</Select.Label>
      <Select.Item value="carrot">Carrot</Select.Item>
      <Select.Item value="potato">Potato</Select.Item>
    </Select.Group>
  </Select.Content>
</Select.Root>

Typing in the text field causes focus to jump to the list items. It would be nice to be able to disable focus to prevent this from happening.

My understanding is that the preferred way to do this is rebuilding the Search/Select inside Popover, which is what I'm doing, so I've made this a feature request instead of an issue.

I think it would be worth adding this because there are some additional conveniences in the Select component for rendering and selecting list items that are missing inside Popover.

[vladmoroz]

You are essentially asking for a combobox, which is much more complex than composing a select with a text field. This is something we are tracking on the Primitives side and out of scope for Radix Themes right now

[vladmoroz]

In the meantime I'd suggest to use an unstyled component library that provides a combobox primitive and style it with Radix Themes CSS variables