# Select

Displays a list of options for the user to pick from—triggered by a button.

## Installation
```shell
fcnui add select
```

> :warning: **Important**:
> When added, need to stop running app and run `flutter pub get` to install all necessary dependencies.

## Depends

Adds the following components to your project along with the input component:

- [Form](/docs/components/form)
- [Input](/docs/components/input)
- [Disabled](/docs/components/disabled)

## Examples
import DefaultIframe from '../../src/components/default_iframe'

### Basic
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=Basic" height={500}/>

### Multi Select
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=multiSelect" height={500}/>

### Disabled
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=disabled" height={500}/>

### Disabled Items
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=disabledItems" height={500}/>

### Form
> [Docs](/docs/components/form)

<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=form" height={500}/>

### Colorful
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=colorful" height={500}/>

### Search
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=search" height={500}/>

### Controlled
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=controlled" height={500}/>

### Custom Items
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=customItems" height={500}/>

### Network
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=network" height={500}/>

### Custom button
<DefaultIframe src="https://fcnui-playground.vercel.app/#/select?variant=customButton" height={500}/>