svelte-autocomplete
Lightweight typeahead / autocomplete component made with Svelte.js
- no dependencies
- can handle asynchronous data
- use plain lists or key / value pairs
http://svelte-autocomplete.surge.sh/
Try the demo atInstall
npm install svelte-autocomplete
Usage
Import the component directly in your Svelte project.
components: AutoComplete ...
And then use it like so:
Loading data from API...
Options
Prop | Type | Default | Description |
---|---|---|---|
name | String | - | Form input name |
class | String | - | Additional styles for input element |
items | Array | - | Array with items, can be a plain list or key, value pairs |
isAsync | Boolean | false | If retrieving API data asynchronously |
minChar | Number | 2 | Min. characters to type before popup shows |
maxItems | Number | 10 | Max. items to show in popup |
fromStart | Boolean | true | Match from the start or anywhere in the string |
Slots
Slot | Prop dependencies | Description |
---|---|---|
default | isAsync | custom loading indication |
Made with Svelte
It's made with Svelte, which means you don't need any JS framework. Just use the dist/index.js
file in any Javascript project:
include the bundle:
create component like so:
const myComponent = target: document data: name: 'fruits' itemStart: 1 items: ...