Skip to content

Do fuzzy matching using FZF algorithm in JavaScript

License

Notifications You must be signed in to change notification settings

ajitid/fzf-for-js

Repository files navigation

FZF for JavaScript

Tests Docs deployment status

Docs · Demo · GitHub · NPM

Originally available as a fuzzy finder for CLIs, FZF for JavaScript is a port of FZF's main algorithm so it can be used in browser context.

Quick look

Install FZF for JavaScript using:

npm i fzf

Then you can use it like:

import { Fzf } from 'fzf'

const list = ['go', 'javascript', 'python', 'rust', 
              'swift', 'kotlin', 'elixir', 'java', 
              'lisp', 'v', 'zig', 'nim', 'rescript', 
              'd', 'haskell']

const fzf = new Fzf(list)
const entries = fzf.find('li')
console.log('ranking is:')
entries.forEach(entry => console.log(entry.item)) // lisp kotlin elixir

For more ways to use this library, visit documentation.

Motivation

Command palette is becoming ubiquitous – you can find it in code editors (Sublime Text, VS Code), design tools (Figma), project management apps (Height, Linear), source control tools (Fork, Sublime Merge). Web apps are becoming more prevalent as well. FZF has a great fuzzy finding mechanism which could be used outside of CLI and into these palettes.

There is a very good read about command palettes if you want to learn more.

Thanks