@mrshmllw/smores-react 9.4.1 → 9.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,8 +1,10 @@
|
|
1
|
+
import { IFuseOptions } from 'fuse.js';
|
1
2
|
import React, { FocusEvent, ReactNode } from 'react';
|
2
3
|
import { CommonFieldProps } from '../fields/commonFieldTypes';
|
3
4
|
export type SearchInputItem = {
|
4
5
|
label: string;
|
5
6
|
value: string;
|
7
|
+
tags?: any[];
|
6
8
|
};
|
7
9
|
export interface SearchInputProps extends CommonFieldProps {
|
8
10
|
/** Optional input className */
|
@@ -29,5 +31,9 @@ export interface SearchInputProps extends CommonFieldProps {
|
|
29
31
|
resultsBorder?: boolean;
|
30
32
|
/** optional boolean to enable fuzzy search via fuse.js */
|
31
33
|
enableFuzzySearch?: boolean;
|
34
|
+
/** optional config of fuzzy search
|
35
|
+
* passing a value to this prop, automatically enables fuzzy search
|
36
|
+
*/
|
37
|
+
fuzzySearchOptions?: IFuseOptions<SearchInputItem>;
|
32
38
|
}
|
33
39
|
export declare const SearchInput: React.ForwardRefExoticComponent<SearchInputProps & React.RefAttributes<HTMLInputElement>>;
|
@@ -1,3 +1,4 @@
|
|
1
|
+
import Fuse from 'fuse.js';
|
1
2
|
import React, { forwardRef, useMemo, useState, } from 'react';
|
2
3
|
import { Box } from '../Box';
|
3
4
|
import { Field } from '../fields/Field';
|
@@ -5,8 +6,15 @@ import { Input, StyledFrontIcon } from '../fields/components/CommonInput';
|
|
5
6
|
import { useUniqueId } from '../utils/id';
|
6
7
|
import { useControllableState } from '../utils/useControlledState';
|
7
8
|
import { SearchOptions } from './components/SearchOptions';
|
8
|
-
|
9
|
-
|
9
|
+
const defaultFuzzySearchOptions = {
|
10
|
+
keys: ['label', 'value'],
|
11
|
+
findAllMatches: true,
|
12
|
+
minMatchCharLength: 2,
|
13
|
+
location: 0,
|
14
|
+
threshold: 0.45,
|
15
|
+
distance: 55,
|
16
|
+
};
|
17
|
+
export const SearchInput = forwardRef(function SearchInput({ id: idProp, name = 'search_input', className = '', placeholder, searchList, showIcon = false, renderAsTitle = false, value, onBlur, onFound, onNotFound, notFoundComponent, fallbackStyle, resultsRelativePosition = false, resultsBorder = true, enableFuzzySearch = false, fuzzySearchOptions, ...otherProps }, ref) {
|
10
18
|
const id = useUniqueId(idProp);
|
11
19
|
const [showOptions, setShowOptions] = useState(false);
|
12
20
|
const [selectedValue, setSelectedValue] = useControllableState({
|
@@ -15,22 +23,20 @@ export const SearchInput = forwardRef(function SearchInput({ id: idProp, name =
|
|
15
23
|
});
|
16
24
|
const [searchQuery, setSearchQuery] = useState(null);
|
17
25
|
const fuse = useMemo(() => {
|
18
|
-
const searchKeys = ['label', 'value'];
|
19
26
|
return new Fuse(searchList, {
|
20
|
-
|
21
|
-
|
22
|
-
minMatchCharLength: 2,
|
27
|
+
...defaultFuzzySearchOptions,
|
28
|
+
...fuzzySearchOptions,
|
23
29
|
});
|
24
30
|
}, [searchList]);
|
25
31
|
const filteredList = useMemo(() => {
|
26
32
|
if (searchQuery === null || searchQuery === '') {
|
27
33
|
return searchList;
|
28
34
|
}
|
29
|
-
if (enableFuzzySearch) {
|
35
|
+
if (enableFuzzySearch || !!fuzzySearchOptions) {
|
30
36
|
return fuse.search(searchQuery).map(({ item }) => item);
|
31
37
|
}
|
32
38
|
return searchList.filter(({ label }) => label.toLowerCase().includes(searchQuery.toLocaleLowerCase()));
|
33
|
-
}, [searchQuery, enableFuzzySearch]);
|
39
|
+
}, [searchQuery, enableFuzzySearch, !!fuzzySearchOptions]);
|
34
40
|
const getDisplayedInputText = () => {
|
35
41
|
if (searchQuery !== null) {
|
36
42
|
return searchQuery;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../src/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAIZ,UAAU,EACV,OAAO,EACP,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,iBAAiB,CAAA;AAEvC,OAAO,EAAE,KAAK,EAAE,eAAe,EAAE,MAAM,kCAAkC,CAAA;AACzE,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AACzC,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;
|
1
|
+
{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../src/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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"}
|