Gathering detailed insights and metrics for react-fuzzy
Gathering detailed insights and metrics for react-fuzzy
Gathering detailed insights and metrics for react-fuzzy
Gathering detailed insights and metrics for react-fuzzy
npm install react-fuzzy
79.7
Supply Chain
97.8
Quality
78.2
Maintenance
100
Vulnerability
100
License
Module System
Min. Node Version
Typescript Support
Node Version
NPM Version
76 Stars
81 Commits
31 Forks
7 Watching
9 Branches
11 Contributors
Updated on 07 Aug 2024
JavaScript (90.74%)
Shell (8.04%)
CSS (1.23%)
Cumulative downloads
Total Downloads
Last day
-39.5%
4,248
Compared to previous day
Last week
1.6%
46,589
Compared to previous week
Last month
47.2%
166,343
Compared to previous month
Last year
-16.2%
1,232,096
Compared to previous year
4
1
34
fuzzy search in React
1npm install --save react-fuzzy
1const list = [{ 2 id: 1, 3 title: 'The Great Gatsby', 4 author: 'F. Scott Fitzgerald' 5}, { 6 id: 2, 7 title: 'The DaVinci Code', 8 author: 'Dan Brown' 9}, { 10 id: 3, 11 title: 'Angels & Demons', 12 author: 'Dan Brown' 13}]; 14 15<FuzzySearch 16 list={list} 17 keys={['author', 'title']} 18 width={430} 19 onSelect={(newSelectedItem) => { 20 // Local state setter defined elsewhere 21 setSelectedItem(newSelectedItem) 22 }} 23 />
1<FuzzySearch 2 list={list} 3 keys={['author', 'title']} 4 width={430} 5 onSelect={(newSelectedItem) => { 6 // Local state setter defined elsewhere 7 setSelectedItem(newSelectedItem) 8 }} 9 resultsTemplate={(props, state, styles, clickHandler) => { 10 return state.results.map((val, i) => { 11 const style = state.selectedIndex === i ? styles.selectedResultStyle : styles.resultsStyle; 12 return ( 13 <div 14 key={i} 15 style={style} 16 onClick={() => clickHandler(i)} 17 > 18 {val.title} 19 <span style={{ float: 'right', opacity: 0.5 }}>by {val.author}</span> 20 </div> 21 ); 22 }); 23 }} 24/>
attribute | default | description |
---|---|---|
caseSensitive | false | Indicates whether comparisons should be case sensitive. |
className | null | give a custom class name to the root element |
inputProps | {} | Props passed directly to the input element. i.e. defaultValue , onChange , etc. |
inputStyle | {} | Styles passed directly to the input element. |
inputWrapperStyle | {} | Styles passed directly to the input wrapper div . |
isDropdown | false | Hide the result list on blur. |
listItemStyle | {} | Styles passed to each item in the dropdown list. |
listWrapperStyle | {} | Styles passed directly to the dropdown wrapper. |
selectedListItemStyle | {} | Styles passed directly to current 'active' item. |
width | 430 | width of the fuzzy searchbox |
distance | 100 | Determines how close the match must be to the fuzzy location (specified by location). An exact letter match which is distance characters away from the fuzzy location would score as a complete mismatch. A distance of 0 requires the match be at the exact location specified, a distance of 1000 would require a perfect match to be within 800 characters of the location to be found using a threshold of 0.8. |
id | null | The name of the identifier property. If specified, the returned result will be a list of the items' identifiers, otherwise it will be a list of the items. |
include | [] | An array of values that should be included from the searcher's output. When this array contains elements, each result in the list will be of the form { item: ..., include1: ..., include2: ... } . Values you can include are score, matches. Eg: { include: ['score', 'matches' ] } |
maxPatternLength | 32 | The maximum length of the pattern. The longer the pattern, the more intensive the search operation will be. Whenever the pattern exceeds the maxPatternLength, an error will be thrown. |
onSelect | noop | Function to be executed on selection of any result. |
keyForDisplayName | title | The key which should be used for list item text. |
keys | all[Array] | List of properties that will be searched. This also supports nested properties. |
list | null | Array of properties to be filtered. |
maxResults | 10 | Max number of results to show at once. |
placeholder | 'Search' | Placeholder of the searchbox |
resultsTemplate | Func | Template of the dropdown divs |
shouldShowDropdownAtStart | false | Allow the searchbox to act as a filter dropdown with initial values. Yields all results when the search value is blank. |
shouldSort | true | Whether to sort the result list, by score. |
sortFn | Array.prototype.sort | The function that is used for sorting the result list. |
threshold | 0.6 | At what point does the match algorithm give up. A threshold of 0.0 requires a perfect match (of both letters and location), a threshold of 1.0 would match anything. |
tokenize | false | When true, the search algorithm will search individual words and the full string, computing the final score as a function of both. Note that when tokenize is true, the threshold , distance , and location are inconsequential for individual tokens. |
verbose | false | Will print to the console. Useful for debugging. |
MIT @ Ritesh Kumar
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
license file detected
Details
Reason
Found 10/11 approved changesets -- score normalized to 9
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
Reason
project is not fuzzed
Details
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
Reason
98 existing vulnerabilities detected
Details
Score
Last Scanned on 2024-11-18
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More