2019-07-18 08:00:54 +00:00
|
|
|
# ComboBox
|
|
|
|
|
|
|
|
#### Description
|
|
|
|
|
|
|
|
Custom combo box input
|
|
|
|
|
|
|
|
#### Usage
|
|
|
|
|
|
|
|
```js
|
|
|
|
import { ComboBox } from 'asc-web-components';
|
|
|
|
|
2019-07-31 18:42:23 +00:00
|
|
|
const options = [
|
|
|
|
{
|
2019-08-06 07:39:33 +00:00
|
|
|
key: 25,
|
2019-07-31 18:42:23 +00:00
|
|
|
label: '25 per page'
|
|
|
|
},
|
|
|
|
{
|
2019-08-06 07:39:33 +00:00
|
|
|
key: 50,
|
2019-07-31 18:42:23 +00:00
|
|
|
label: '50 per page',
|
|
|
|
},
|
|
|
|
{
|
2019-08-06 07:39:33 +00:00
|
|
|
key: 100,
|
2019-07-31 18:42:23 +00:00
|
|
|
label: '100 per page'
|
|
|
|
}
|
|
|
|
];
|
|
|
|
|
2019-08-06 07:39:33 +00:00
|
|
|
<ComboBox options={options} isDisabled={false} withBorder={true} selectedOption={25} onSelect={option => console.log('selected', option)}/>
|
2019-07-18 08:00:54 +00:00
|
|
|
```
|
|
|
|
|
|
|
|
#### Properties
|
|
|
|
|
|
|
|
| Props | Type | Required | Values | Default | Description |
|
|
|
|
| ---------------------- | ----------------- | :------: | ---------------------------- | ------- | -------------------------------------------- |
|
2019-07-26 09:02:08 +00:00
|
|
|
| `options` | `array` | ✅ | - | - | Combo box options |
|
|
|
|
| `isDisabled` | `bool` | - | - | `false` | Indicates that component is disabled |
|
|
|
|
| `withBorder` | `bool` | - | - | `true` | Indicates that component contain border |
|
2019-08-06 07:39:33 +00:00
|
|
|
| `selectedOption` | `string`,`number` | - | - | `0` | Index of option selected by default |
|
|
|
|
| `onSelect` | `func` | - | - | - | Will be triggered whenever an ComboBox is selected option |
|