2.0.0 • Published 4 years ago
haystack-ui v2.0.0
Haystack UI
Overview
Haystack UI is a React component that allows you to easily insert a search field into your website. It's based on the functionality of fuzzy-search plugin Haystack, but with a built-in interface.
Installation
Using npm:
npm i haystack-uiImport Haystack UI component:
import { HaystackUI } from 'haystack-ui';Render component:
<HaystackUI <options> />Props
Haystack UI options
Required:
| Option | Default | Description |
|---|---|---|
source (array) | null | Pool of data to pull suggestions from |
Optional:
| Option | Default | Description |
|---|---|---|
theme (string) | light | Color scheme ("light", "dark", or "ghost") |
placeholder (string) | "Search" | Input placeholder text |
showSuggestions (boolean) | true | Whether or not to show suggestion drop-down |
inlineSuggestions (boolean) | false | Displays an autocompleted suggestion on the same line as input |
suggestionLimit (number) | 4 | Maximum number of suggestions shown in drop-down |
submitLocation (string) | "#" | URL of the file that will process GET method. Your search string will be received as "query" |
caseSensitive (boolean) | false | Whether or not search is case sensitive |
flexibility (number) | 1 | "Fuzziness" of suggestions. The lower the number, the more strict your suggestions will be |
stemming (boolean) | false | Reduces tokens in a query to their base words |
exclusions (string) | null | Add a string or regex to ignore in query |
ignoreStopWords boolean | false | Ignore common stop words such as the, a, in, etc. |