<script type='module' src="http://developer.powerpeers.com/social/1.0.0/custom-select.js" />
<!-- or module import -->
<script type="module" src="http://developer.powerpeers.com/social/1.0.0/custom-select.js" />
const options = [
{ label: 'Solar panel', value: '1' },
{ label: 'Wind', value: '2' },
];
<custom-select
name="devices"
label="Devices"
placeholder="Select a device"
options=${options}
@click=${onClick}>
</custom-button>
Property |
Type |
Description |
Possible Values |
*name* |
string |
Name of the input field. Which could be used in a form as field identifier. |
devices, source mixes, etc. |
*label* |
string |
Label which is positioned above the dropdown |
devices, source mixes, etc. |
value |
string |
Active value of the dropdown |
|
*options* |
Array |
Dropdown options |
```javascript
[
{ label: 'Solar panel', value: '1' },
{ label: 'Wind', value: '2' },
]
```
|
disabled |
boolean |
|
```html
```
|
Theme |
theme-powerpeers |
boolean |
Apply predefined powerpeers theme |
```html
```
|
Name |
Description |
Detail / Payload |
@onChange |
// Todo change to custom events
|
```{ target: ..., currentTarget: ..., ... }``` |
@onChangeDelayed |
// Todo change to custom events
|
```{ target: ..., currentTarget: ..., ... }``` |
@onKeyUp |
// Todo change to custom events
|
```{ target: ..., currentTarget: ..., ... }``` |