{"_id":"@cwlogo/svelte-tags-input","name":"@cwlogo/svelte-tags-input","dist-tags":{"latest":"3.0.0"},"versions":{"3.0.0":{"name":"@cwlogo/svelte-tags-input","version":"3.0.0","description":"Fully customizable Svelte component to enter tags.","main":"dist/index.js","module":"dist/index.mjs","svelte":"src/Tags.svelte","scripts":{"build":"rollup -c","prepare":"npm run build","dev":"rollup -c -w"},"keywords":["svelte","tags","input"],"repository":{"type":"git","url":"git+https://github.com/agustinl/svelte-tags-input.git"},"author":{"name":"Agustin Lautaro","email":"aencaje@gmail.com"},"license":"MIT","devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","rollup":"^2.45.2","rollup-plugin-css-only":"^3.1.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-svelte":"^7.1.0","svelte":"^3.37.0"},"homepage":"https://svelte-tags-input.vercel.app/","bugs":{"url":"https://github.com/agustinl/svelte-tags-input/issues"},"gitHead":"2da9397dd59da1f9a558e222861b26ed48b12c14","_id":"@cwlogo/svelte-tags-input@3.0.0","_nodeVersion":"16.15.1","_npmVersion":"8.11.0","dist":{"integrity":"sha512-bMyDC0pZRdsER2/NME1t5K4L2R3+iFL9J5hGB3mtZyhO33TCEkURH6IXZBtWDFuMejOrqWt9WEnfJPIxw8HhwQ==","shasum":"ed2bc2a18b2eb8f7f5f0dc9f51a072bfb8cca7f9","tarball":"https://registry.npmjs.org/@cwlogo/svelte-tags-input/-/svelte-tags-input-3.0.0.tgz","fileCount":10,"unpackedSize":109135,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDB/wfkn3bU++6LMfEl2T0j8S3AkidZ6PL/JDFBsQ8dqQIhAPHSJqmgmU1tTL4tbhwstWNOgH91N2kNUERIMC3hIZ4j"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJjV+ZpACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmoE5RAAoyYLTaLHZntKOzcp7NKQrwwuNEHz5q87AAaqbPFvNEWrb2ie\r\n3QKr8XRamseXPweZW5aMwsKH/LNvMlppOrKH84qp4A8fZXoAIa5GajzpbyUQ\r\ndwXB4e/gjHU7Pu6FTHVcZ2b+KKywk68dTUIVdYpJo50ghipDvc0mZZQpi9Nb\r\nQbGDKvQczhhRBQDg/03NttLso8mRLJGzX0ychmsZGPZBxlumU8nWx3nhwc+I\r\n9n99ItuYNTNh8O9EIFdENw9tPErs1n38+Jw9aYdwIMtCLOPucaHJPLkCZ2lg\r\ndWHPw/6lle00sq3q2KsxJ7oLV5+UZyDFV647+lG/XMT3PIkq47gUHu0h7fMQ\r\nMEnXjznzjCD04k/5+S6l1zAX1jOHOuo5cOFWDIb51vOZ4JTdsr1C1DNC5hTR\r\nKAfGEONbLaizie7TACtq/YrfO3yvVzAs9WlJbCuHB7c8fRd56UKuWNFHHoq5\r\ng88VKHzt7tR8NSDevqDZMM5hUhH1y7g9CMvzQsMq33iHK/dJ5fAs0b92uAcn\r\nmvwHz4JP2hQpP9f+xdfy8qBFrambPctY7lM+LVgxHMfNUUOIVcgZ7iNIOhAW\r\nmyHBGsMtXGAqa7D7d5DUSIROGzD2QNBteoTEi/yGqk9P1HQBdT4R74O1tEVr\r\nXBg0PRK6ZRo57KCNcC92u/UpiPs7EwYhP7s=\r\n=38Bp\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"cwlogo","email":"cwlogo@pm.me"},"directories":{},"maintainers":[{"name":"cwlogo","email":"cwlogo@pm.me"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/svelte-tags-input_3.0.0_1666705000990_0.3718837520130669"},"_hasShrinkwrap":false}},"time":{"created":"2022-10-25T13:36:40.920Z","3.0.0":"2022-10-25T13:36:41.153Z","modified":"2022-10-25T13:36:41.304Z"},"maintainers":[{"name":"cwlogo","email":"cwlogo@pm.me"}],"description":"Fully customizable Svelte component to enter tags.","homepage":"https://svelte-tags-input.vercel.app/","keywords":["svelte","tags","input"],"repository":{"type":"git","url":"git+https://github.com/agustinl/svelte-tags-input.git"},"author":{"name":"Agustin Lautaro","email":"aencaje@gmail.com"},"bugs":{"url":"https://github.com/agustinl/svelte-tags-input/issues"},"license":"MIT","readme":"
\n
\n svelte-tags-input\n
\n
Svelte tags input is a component to use with Svelte and easily enter tags and customize some options
\n \n
\n\n\n\n
\n\n## [Basic REPL Example](https://svelte.dev/repl/72eb8ee74ab546cdbcab11e91c965471?version=3.24.0)\n\n## Install\n\n```bash\nnpm install svelte-tags-input --save\n```\n\n```javascript\nimport Tags from \"svelte-tags-input\";\n\n\n```\n\n## Options\n\n| Option | Type | Default | Description |\n| --- | --- | --- | --- |\n| on:tags | `Function` | `undefined` | To get the values |\n| addKeys | `Array` | ENTER 13 | Set which keys add new values |\n| removeKeys | `Array` | BACKSPACE 8 | Set which keys remove new values |\n| allowPaste | `Boolean` | `false` | Enable pasting of a tag or tag group |\n| allowDrop | `Boolean` | `false` | Enable drag and drop of a tag or tag group |\n| splitWith | `String` | , | Choose what character split you group of tags _Work only if allowDrop or allowPaste are true_ |\n| maxTags | `Number` | `false` | Set maximum number of tags |\n| onlyUnique | `Boolean` | `false` | Set the entered tags to be unique |\n| placeholder | `String` | `false` | Set a placeholder |\n| autoComplete | `Array` or `fn()` | `false` | Set an array of elements to create a auto-complete dropdown |\n| autoCompleteKey | `String` | `false` | Set a key to search on `autoComplete` array of objects |\n| autoCompleteFilter | `Boolean` | `true` | If `false` disable auto complete filter and return endpoint response without filter |\n| onlyAutocomplete | `Boolean` | `false` | Only accept tags inside the auto complete list |\n| name | `String` | `svelte-tags-input` | Set a `name` attribute |\n| id | `String` | Random Unique ID | Set a `id` attribute |\n| allowBlur | `Boolean` | `false` | Enable add tag when input blur |\n| disable | `Boolean` | `false` | Disable input |\n| minChars | `Number` | `1` | Minimum length of search text to show autoComplete list. If 0, autoComplete list shows all results when click on input |\n| labelText | `String` | `svelte-tags-input` | Custom text for input label |\n| labelShow | `Boolean` | `false` | If `true` the label will be visible |\n\n##### [A complete list of key codes](https://keycode.info/)\n\n## Full example\n### [Full REPL Example](https://svelte.dev/repl/129f603083664aab9e5d10fe867745e2?version=3.24.0) \n\n```javascript\nimport Tags from \"svelte-tags-input\";\n\n// If on:tags is defined\nlet tag = \"\";\n\nfunction handleTags(event) {\n tag = event.detail.tags;\n}\n\nconst countryList = [\n \"Afghanistan\",\n \"Albania\",\n \"Algeria\",\n \"American Samoa\",\n \"Andorra\",\n \"Angola\",\n \"Anguilla\",\n \"Antarctica\",\n \"Antigua and Barbuda\",\n \"Argentina\"\n ...\n];\n\n\n```\n\n## Example with `autoComplete` function\n### [REPL Example](https://svelte.dev/repl/dc827c219cf44a1a9f1bfc711438af26?version=3.32.1) \n\n```javascript\nimport Tags from \"svelte-tags-input\";\n\nlet tag = \"\";\n\nfunction handleTags(event) {\n tag = event.detail.tags;\n}\n\nconst customAutocomplete = async () => {\n const list = await fetch('https://restcountries.com/v2/all?fields=name,alpha3Code,flag');\n const res = await list.json();\n\n return res;\n}\n\n\n\n{#each tag as country, index}\n
{index} - {country.name}
\n \n{/each}\n```\n\n## [FAQs](https://svelte-tags-input.vercel.app#faqs)\n\n## [CHANGELOG](CHANGELOG.md)\n\n## License\n\nThis project is open source and available under the [MIT License](LICENSE).\n\n## Author\n\n[@agustinl](https://www.agustinl.com?ref=github-sti)\n\n##### 2022\n","readmeFilename":"README.md"}
![\"Svelte](\"https://svelte-tags-input.vercel.app/readme-image.png\")
![](\"https://img.shields.io/npm/v/svelte-tags-input.svg\"/)
\n![](\"https://img.shields.io/badge/License-MIT-blue.svg\"/){kind=icon}
\n![](\"https://madewithsvelte.com/storage/repo-shields/2151-shield.svg\"/)
\n