Autocomplete

<AutocompleteRoot items={items}>
  <AutocompleteInput placeholder="Search..." />

  <AutocompleteContent>
    <AutocompleteEmpty>No results found.</AutocompleteEmpty>
    <AutocompleteList>
      {(item) => (
        <AutocompleteItem key={item.id} value={item}>
          {item.label}
        </AutocompleteItem>
      )}
    </AutocompleteList>
  </AutocompleteContent>
</AutocompleteRoot>

<AutocompleteRoot items={items}>
  <AutocompleteInput placeholder="Search..." />

  <AutocompletePortal>
    <AutocompleteBackdrop />
    <AutocompletePositioner sideOffset={4}>
      <AutocompletePopup>
        <AutocompleteEmpty>No results found.</AutocompleteEmpty>
        <AutocompleteList>
          {(item) => (
            <AutocompleteItem key={item.id} value={item}>
              {item.label}
            </AutocompleteItem>
          )}
        </AutocompleteList>
      </AutocompletePopup>
    </AutocompletePositioner>
  </AutocompletePortal>
</AutocompleteRoot>