Combobox

"use client";

import {
  Combobox,
  ComboboxContent,
  ComboboxEmpty,
  ComboboxInput,
  ComboboxItem,
  ComboboxList,
} from "@/components/ui/combobox";

const fruits = [
  { label: "Apple", value: "apple" },
  { label: "Banana", value: "banana" },
];

export default function Example() {
  return (
    <Combobox items={fruits}>
      <ComboboxInput placeholder="Search a fruit..." className="w-56" />
      <ComboboxContent>
        <ComboboxEmpty>No results.</ComboboxEmpty>
        <ComboboxList>
          {(item) => (
            <ComboboxItem key={item.value} value={item}>
              {item.label}
            </ComboboxItem>
          )}
        </ComboboxList>
      </ComboboxContent>
    </Combobox>
  );
}