# use-fuse

> A tiny wrapper around the Fuse.js fuzzy-search library using React Hooks.

Latest version **0.0.3** (published 2019-04-08) · MIT license · 0 weekly downloads

## Install

```sh
npm install use-fuse
pnpm add use-fuse
yarn add use-fuse
bun add use-fuse
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2019-04-08 |
| First published | 2019-04-07 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 4.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 7 |
| Author | Balázs Sági |
| Maintainers | balazssagi |

## Links

- npm: https://www.npmjs.com/package/use-fuse
- Repository: https://github.com/balazssagi/use-fuse
- Homepage: https://github.com/balazssagi/use-fuse#readme
- Issues: https://github.com/balazssagi/use-fuse/issues
- npm.io page: https://npm.io/package/use-fuse

## Dependencies (2)

- [fuse.js](https://npm.io/package/fuse.js.md) ^3.4.4
- [@types/react](https://npm.io/package/@types/react.md) ^16.8.12

## Recent versions

- 0.0.3 (latest) — 2019-04-08
- 0.0.2 — 2019-04-08
- 0.0.1 — 2019-04-07

## README

A tiny wrapper around the [Fuse.js](https://fusejs.io/) fuzzy-search library using React Hooks.

# Demo

[Basic usage](https://codesandbox.io/s/github/balazssagi/use-fuse/tree/master/example)

# Install

using NPM:

```bash
npm install use-fuse --save
```

or Yarn:

```bash
yarn add use-fuse --save
```

# Usage

The library exports a single hook.

## Example

```jsx
import React from 'react'
import useFuse from 'use-fuse'

// see: https://fusejs.io/
const fuseOptions = {
    keys: ['name'],
    threshold: 0.6,
}

function App() {
    const [list] = React.useState([
        { name: 'Hesse' },
        { name: 'Pelevin' },
        { name: 'Steinbeck' },
        { name: 'Moore' },
        { name: 'Atwood' },
    ])
    const [search] = React.useState('')
    const filteredList = useFuse(list, search, fuseOptions)

    return (
        <ul>
            {filteredList.map(item => (
                <li key={item.name}>{item.name}</li>
            ))}
        </ul>
    )
}
```

## Parameters

```js
 useFuse(list, searchTerm, fuseOptions) : filteredList
```

| Parameter   | Type   | Required | Note                                   |
| ----------- | ------ | -------- | -------------------------------------- |
| list        | array  | ✓        | The list to filter                     |
| searchTerm  | string | ✓        | The search term to filter by           |
| fuseOptions | object | ✓        | see [Fuse.js Docs](https://fusejs.io/) |

# TypeScript

Type definition of Fuse.js has some limitations so you may have to use some type casting if using TypeScript.

---
_Source: https://npm.io/package/use-fuse · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
