Pass value, label as Items on Combobox, selectmenu Props

[Ok9xNirab]

Basic combobox example:

<Combobox
  items={['Banana', 'Orange', 'Apple', 'Mango']}
  onChange={selected => console.log(selected)}
  placeholder="Fruit"
  autocompleteProps={{
    // Used for the title in the autocomplete.
    title: 'Fruit'
  }}
/>

I want to pass items something like :

const items = [
 { label: "A", value: 1 },
 { label: "B", value: 2 },
]

When select any of this item , then it should return only value via onChange event.

Is it possible now ?? I didn't find anything in Documentation !!

[brandongregoryscott]

You can pass a list of custom items to the Combobox (see example here), you just need to provide an itemToString function (which provides the label). The onChange handler will return the whole item, though, so you'd need to do something like...

<Combobox
  initialSelectedItem={{ label: 'Banana' }}
  items={[{ label: 'Banana', id: 1 }, { label: 'Pear', id: 2 }, { label: 'Kiwi', id: 3 }]}
  itemToString={item => (item ? item.label : '')}
  onChange={selected => console.log(selected.id)}
/>

[Ok9xNirab]

Thanks !