```js import Dropdown from '@invisionag/iris-react-dropdown'; ```
npm install @invisionag/iris-react-dropdown``js`
import Dropdown from '@invisionag/iris-react-dropdown';
A general single select dropdown component.
It extends react-select and any of its props can be passed to this component as well. See https://react-select.com/props for a full list.
`
const options = [
{label: "First Option", value: 1},
{label: "Second Option", value: 2},
]
A custom option renderer can be provided. This works well in conjunction with individualised option arrays:
`
const options = [
{label: "First Option", value: 1, someValue: "hi!"},
{label: "Second Option", value: 2, someValue: "ho!"},
]{option.someValue}}/>
The dropdown can be made searchable by providing the searchable prop.
If the dropdown has more then 7 entries it will automatically be searchable.
Beware: This will have significant performance issues when a lot of options (100+) are provided!
`
const options = [
{label: "First Option", value: 1, someValue: "hi!"},
{label: "Second Option", value: 2, someValue: "ho!"},
]
The dropdown can be multi selectable by providing the multi prop.onChange
Be sure to provide the value as an array. The callback returns a an array of values as well.
`
const options = [
{label: "First Option", value: 1, someValue: "hi!"},
{label: "Second Option", value: 2, someValue: "ho!"},
]