2019-06-24 14:33:15 +00:00
# DropDownItem
## Usage
```js
import { DropDownItem } from 'asc-web-components';
```
#### Description
Is a item of DropDown component
2019-07-04 11:43:55 +00:00
To add an avatar username and email when you turn on the isUserPreview parameter, you need to add the parameters of the Avatar component: source - link to the user's avatar, userName - user name and label - user’ s email address.
2019-06-24 14:33:15 +00:00
#### Usage
```js
2019-07-26 14:23:40 +00:00
< DropDownItem isSeparator = {false} isUserPreview = {false} isHeader = {false} label = 'Button 1' icon = 'NavLogoIcon' onClick = {() = > console.log('Button 1 clicked')} />
2019-06-24 14:33:15 +00:00
```
#### Properties
| Props | Type | Required | Values | Default | Description |
| ------------------ | -------- | :------: | --------------------------- | -------------- | ----------------------------------------------------------------- |
| `isSeparator` | `bool` | - | - | `false` | Tells when the dropdown item should display like separator |
2019-07-04 11:43:55 +00:00
| `isUserPreview` | `bool` | - | - | `false` | Tells when the dropdown item should display like User preview |
2019-07-12 10:40:37 +00:00
| `isHeader` | `bool` | - | - | `false` | Tells when the dropdown item should display like header |
2019-06-24 14:33:15 +00:00
| `label` | `string` | - | - | `Dropdown item` | Dropdown item text |
2019-07-26 14:23:40 +00:00
| `icon` | `string` | - | - | - | Dropdown item icon |
2019-07-12 10:40:37 +00:00
| `onClick` | `func` | - | - | - | What the dropdown item will trigger when clicked |
2019-07-26 14:23:40 +00:00
| `disabled` | `bool` | - | - | `false` | Tells when the dropdown item should display like disabled |