Skip to content

Commit e1f99dc

Browse files
authored
docs: add basic usage demo
1 parent fcc8107 commit e1f99dc

File tree

1 file changed

+36
-0
lines changed

1 file changed

+36
-0
lines changed

packages/multiple-select-vanilla/README.md

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,42 @@ Available [**Live demo**](https://ghiscoding.github.io/multiple-select-vanilla/)
99
npm install multiple-select-vanilla
1010
```
1111

12+
## Basic Usage
13+
14+
#### 1. From a native `<select>`
15+
16+
```html
17+
<select class="multiple-select full-width" data-test="select1">
18+
<option value="1">First</option>
19+
<option value="2">Second</option>
20+
<option value="3">Third</option>
21+
<option value="4">Fourth</option>
22+
</select>
23+
```
24+
25+
and then initialize ms-select
26+
27+
```ts
28+
import { multipleSelect } from 'multiple-select-vanilla';
29+
30+
const ms = multipleSelect('.multiple-select');
31+
```
32+
33+
##### 2. From data
34+
35+
```ts
36+
import { multipleSelect } from 'multiple-select-vanilla';
37+
38+
const ms = multipleSelect('.multiple-select', {
39+
data: [
40+
{ text: 'First', value: 1 },
41+
{ text: 'Second', value: 2 },
42+
{ text: 'Third', value: 3 },
43+
{ text: 'Fourth', value: 4 },
44+
]
45+
});
46+
```
47+
1248
## Changelog
1349

1450
[CHANGELOG](https://github.com/ghiscoding/multiple-select-vanilla/blob/main/packages/multiple-select-vanilla/CHANGELOG.md)

0 commit comments

Comments
 (0)