Svelte Fuse
Svelte wrapper for Fuse.js.
Installation
NPM
npm install --save-dev svelte-fuse
Yarn
yarn add svelte-fuse -D
PNPM
pnpm add svelte-fuse -D
Usage
Live demo
You can view the demo and its source code for a working example.
Snippet
<script lang="ts">
import SvelteFuse from 'svelte-fuse';
import type { ResultType } from 'svelte-fuse';
type Contact = {
id: number;
name: string;
email: string;
phone: string;
address: string;
birthday: string;
};
const contacts: Contact[] = [
{
id: 1,
name: 'John Doe',
email: '[email protected]',
phone: '123-456-7890',
address: '123 Main Street, Anytown, CA 12345',
birthday: '1980-01-01'
}
// ...
];
let fuseOptions = {
keys: ['name']
};
let query = '';
let result: ResultType<Contact> = [];
</script>
<SvelteFuse list={contacts} options={fuseOptions} bind:query bind:result />
Props
| Name | Type | Description |
|---|---|---|
| list | ReadonlyArray<T> |
The list of items to search. |
| options | Fuse.IFuseOptions<any> |
The Fuse.js options. |
| query | string |
The search query. |
| result | ResultType<T> |
The search result. |
How to contribute
If you have any ideas on how to improve this project, feel free to contribute. To do so, you can either open an issue or a pull request.
This project was developed with @sveltejs/package. Please read https://kit.svelte.dev/docs/packaging first if you want to change the source code.
License
Under the MIT License.
