Svelte tags input using Bulma
A rich component for input tags with help of Bulma css
Install
npm install svelte-bulma-tag-input --save
import Tags from "svelte-bulma-tag-input";
<Tags bind:tags maxTags={5} />
@import "<PATH>/node_modules/svelte-bulma-tag-input/src/scss/styles";
Options
| Option | Type | Default | Description |
|---|---|---|---|
| addKeys | Array |
ENTER 13 | Set which keys add new values |
| removeKeys | Array |
BACKSPACE 8 | Set which keys remove new values |
| maxTags | Number |
5 | Set maximum number of tags |
| disabled | Boolean |
false |
Disable input |
| hasError | Boolean |
false |
Set input error state |
| allowDuplicates | Boolean |
false |
Set the entered tags to be duplicatable |
| tagColor | String |
primary |
Set the tag color |
| tagSize | String |
normal |
Set the tag size |
| inputSize | String |
normal |
Set the input field size |
| placeholder | String |
null |
Set a placeholder |
| on:change | Function |
undefined |
To get the event fire from the tag change |
A complete list of key codes
License
This project is open source and available under the MIT License.
Author
2021
