@clicoh/orion-library 1.0.1 → 1.0.2
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.
- package/dist/components/02-molecules/Autocomplete/Autocomplete.d.ts +46 -0
- package/dist/components/02-molecules/Autocomplete/Autocomplete.d.ts.map +1 -0
- package/dist/components/02-molecules/Autocomplete/Autocomplete.jsx +111 -0
- package/dist/components/02-molecules/Autocomplete/Autocomplete.jsx.map +1 -0
- package/dist/components/02-molecules/Autocomplete/index.d.ts +2 -0
- package/dist/components/02-molecules/Autocomplete/index.d.ts.map +1 -0
- package/dist/components/02-molecules/Autocomplete/index.js +2 -0
- package/dist/components/02-molecules/Autocomplete/index.js.map +1 -0
- package/dist/components/02-molecules/Filter/Filter.d.ts +8 -1
- package/dist/components/02-molecules/Filter/Filter.d.ts.map +1 -1
- package/dist/components/02-molecules/Filter/Filter.jsx +40 -2
- package/dist/components/02-molecules/Filter/Filter.jsx.map +1 -1
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +1 -0
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/timing.d.ts +14 -0
- package/dist/utils/timing.d.ts.map +1 -0
- package/dist/utils/timing.js +37 -0
- package/dist/utils/timing.js.map +1 -0
- package/package.json +1 -1
- package/tailwind.config.ts +2 -0
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { OptionType } from '../../01-atoms';
|
|
2
|
+
type AutocompleteInput = {
|
|
3
|
+
options: OptionType[];
|
|
4
|
+
onChange?: (query: string) => void;
|
|
5
|
+
onChangeValue?: (value: string) => void;
|
|
6
|
+
onHandleKeyDown?: () => void;
|
|
7
|
+
onDebouncedChange?: (query: string) => void | OptionType[] | Promise<void | OptionType[]>;
|
|
8
|
+
debounceDelay?: number;
|
|
9
|
+
label: string;
|
|
10
|
+
onSelect?: (selectedOption: OptionType | undefined) => void;
|
|
11
|
+
disabled?: boolean;
|
|
12
|
+
helperText?: string;
|
|
13
|
+
error?: string;
|
|
14
|
+
value?: string;
|
|
15
|
+
};
|
|
16
|
+
/**
|
|
17
|
+
* Autocomplete component that provides a filterable dropdown list of options.
|
|
18
|
+
*
|
|
19
|
+
* @component
|
|
20
|
+
* @example
|
|
21
|
+
* // Example usage of Autocomplete component
|
|
22
|
+
* <Autocomplete
|
|
23
|
+
* label="Search"
|
|
24
|
+
* options={[{ label: 'Option 1', value: '1' }, { label: 'Option 2', value: '2' }]}
|
|
25
|
+
* onSelect={(option) => console.log('Selected:', option)}
|
|
26
|
+
* onChange={(query) => console.log('Query:', query)}
|
|
27
|
+
* />
|
|
28
|
+
*
|
|
29
|
+
* @param {Object} props - The properties of the Autocomplete component.
|
|
30
|
+
* @param {OptionType[]} props.options - The list of available options to display.
|
|
31
|
+
* @param {Function} [props.onSelect] - Callback fired when an option is selected.
|
|
32
|
+
* @param {Function} [props.onChange] - Callback fired when the input query changes.
|
|
33
|
+
* @param {Function} [props.onDebouncedChange] - Callback fired after the user stops typing, debounced by the specified delay.
|
|
34
|
+
* @param {number} [props.debounceDelay=300] - Delay in milliseconds for the debounced callback.
|
|
35
|
+
* @param {Function} [props.onHandleKeyDown] - Callback fired when the Enter key is pressed.
|
|
36
|
+
* @param {boolean} [props.disabled] - Whether the input is disabled.
|
|
37
|
+
* @param {string} props.label - The label text for the input field.
|
|
38
|
+
* @param {string} [props.helperText] - Helper text displayed below the input.
|
|
39
|
+
* @param {string} [props.error] - Error message displayed below the input.
|
|
40
|
+
* @param {string} [props.value=''] - The controlled value of the input.
|
|
41
|
+
*
|
|
42
|
+
* @returns {ReactNode} The rendered Autocomplete component.
|
|
43
|
+
*/
|
|
44
|
+
export declare function Autocomplete({ options, onSelect, onChange, onDebouncedChange, debounceDelay, onHandleKeyDown, disabled, label, helperText, error, value, }: Readonly<AutocompleteInput>): import("react").JSX.Element;
|
|
45
|
+
export {};
|
|
46
|
+
//# sourceMappingURL=Autocomplete.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../../src/components/02-molecules/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAI5C,KAAK,iBAAiB,GAAG;IACvB,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,iBAAiB,CAAC,EAAE,CAClB,KAAK,EAAE,MAAM,KACV,IAAI,GAAG,UAAU,EAAE,GAAG,OAAO,CAAC,IAAI,GAAG,UAAU,EAAE,CAAC,CAAC;IACxD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,cAAc,EAAE,UAAU,GAAG,SAAS,KAAK,IAAI,CAAC;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,YAAY,CAAC,EAC3B,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,aAAmB,EACnB,eAAe,EACf,QAAQ,EACR,KAAK,EACL,UAAU,EACV,KAAK,EACL,KAAU,GACX,EAAE,QAAQ,CAAC,iBAAiB,CAAC,+BA+H7B"}
|
|
@@ -0,0 +1,111 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { useEffect, useMemo, useRef, useState, } from 'react';
|
|
3
|
+
import { FaSortDown } from 'react-icons/fa';
|
|
4
|
+
import { Input } from '../../01-atoms';
|
|
5
|
+
import { debounce } from '../../../utils';
|
|
6
|
+
/**
|
|
7
|
+
* Autocomplete component that provides a filterable dropdown list of options.
|
|
8
|
+
*
|
|
9
|
+
* @component
|
|
10
|
+
* @example
|
|
11
|
+
* // Example usage of Autocomplete component
|
|
12
|
+
* <Autocomplete
|
|
13
|
+
* label="Search"
|
|
14
|
+
* options={[{ label: 'Option 1', value: '1' }, { label: 'Option 2', value: '2' }]}
|
|
15
|
+
* onSelect={(option) => console.log('Selected:', option)}
|
|
16
|
+
* onChange={(query) => console.log('Query:', query)}
|
|
17
|
+
* />
|
|
18
|
+
*
|
|
19
|
+
* @param {Object} props - The properties of the Autocomplete component.
|
|
20
|
+
* @param {OptionType[]} props.options - The list of available options to display.
|
|
21
|
+
* @param {Function} [props.onSelect] - Callback fired when an option is selected.
|
|
22
|
+
* @param {Function} [props.onChange] - Callback fired when the input query changes.
|
|
23
|
+
* @param {Function} [props.onDebouncedChange] - Callback fired after the user stops typing, debounced by the specified delay.
|
|
24
|
+
* @param {number} [props.debounceDelay=300] - Delay in milliseconds for the debounced callback.
|
|
25
|
+
* @param {Function} [props.onHandleKeyDown] - Callback fired when the Enter key is pressed.
|
|
26
|
+
* @param {boolean} [props.disabled] - Whether the input is disabled.
|
|
27
|
+
* @param {string} props.label - The label text for the input field.
|
|
28
|
+
* @param {string} [props.helperText] - Helper text displayed below the input.
|
|
29
|
+
* @param {string} [props.error] - Error message displayed below the input.
|
|
30
|
+
* @param {string} [props.value=''] - The controlled value of the input.
|
|
31
|
+
*
|
|
32
|
+
* @returns {ReactNode} The rendered Autocomplete component.
|
|
33
|
+
*/
|
|
34
|
+
export function Autocomplete({ options, onSelect, onChange, onDebouncedChange, debounceDelay = 200, onHandleKeyDown, disabled, label, helperText, error, value = '', }) {
|
|
35
|
+
const [query, setQuery] = useState(value);
|
|
36
|
+
const [filteredOptions, setFilteredOptions] = useState(options);
|
|
37
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
38
|
+
const containerRef = useRef(null);
|
|
39
|
+
const justSelectedRef = useRef(false);
|
|
40
|
+
const onDebouncedChangeRef = useRef(onDebouncedChange);
|
|
41
|
+
onDebouncedChangeRef.current = onDebouncedChange;
|
|
42
|
+
const debouncedCallback = useMemo(() => debounce(async (q) => {
|
|
43
|
+
const result = await onDebouncedChangeRef.current?.(q);
|
|
44
|
+
if (Array.isArray(result)) {
|
|
45
|
+
setFilteredOptions(result);
|
|
46
|
+
}
|
|
47
|
+
}, debounceDelay), [debounceDelay]);
|
|
48
|
+
const handleChange = (e) => {
|
|
49
|
+
const newQuery = e.target.value;
|
|
50
|
+
setQuery(newQuery);
|
|
51
|
+
setFilteredOptions(options.filter((option) => option.label.toLowerCase().includes(newQuery.toLowerCase())));
|
|
52
|
+
onChange?.(newQuery);
|
|
53
|
+
debouncedCallback(newQuery);
|
|
54
|
+
};
|
|
55
|
+
const handleOptionClick = (option) => {
|
|
56
|
+
justSelectedRef.current = true;
|
|
57
|
+
setQuery(option.label);
|
|
58
|
+
setFilteredOptions([]);
|
|
59
|
+
setIsOpen(false);
|
|
60
|
+
onSelect?.(option);
|
|
61
|
+
};
|
|
62
|
+
const handleFocus = () => {
|
|
63
|
+
setIsOpen(true);
|
|
64
|
+
setFilteredOptions(options.filter((option) => option.label.toLowerCase().includes(query.toLowerCase())));
|
|
65
|
+
};
|
|
66
|
+
const handleBlur = () => {
|
|
67
|
+
setTimeout(() => {
|
|
68
|
+
setIsOpen(false);
|
|
69
|
+
}, 200);
|
|
70
|
+
};
|
|
71
|
+
const handleIcon = () => (<FaSortDown className="absolute -top-1 right-2" onClick={() => setIsOpen(!isOpen)}/>);
|
|
72
|
+
const handleKeyDown = (e) => {
|
|
73
|
+
if (e.key === 'Enter' && onHandleKeyDown) {
|
|
74
|
+
onHandleKeyDown();
|
|
75
|
+
}
|
|
76
|
+
};
|
|
77
|
+
useEffect(() => {
|
|
78
|
+
if (justSelectedRef.current) {
|
|
79
|
+
justSelectedRef.current = false;
|
|
80
|
+
return;
|
|
81
|
+
}
|
|
82
|
+
if (!value) {
|
|
83
|
+
setQuery('');
|
|
84
|
+
setFilteredOptions([]);
|
|
85
|
+
setIsOpen(false);
|
|
86
|
+
return;
|
|
87
|
+
}
|
|
88
|
+
const matchedOption = options.find((opt) => String(opt.value) === value);
|
|
89
|
+
setQuery(matchedOption ? matchedOption.label : value);
|
|
90
|
+
}, [value]);
|
|
91
|
+
useEffect(() => {
|
|
92
|
+
setFilteredOptions(options);
|
|
93
|
+
}, [options]);
|
|
94
|
+
return (<div className="relative w-full" ref={containerRef}>
|
|
95
|
+
<Input label={label} input={{
|
|
96
|
+
type: 'text',
|
|
97
|
+
value: query,
|
|
98
|
+
onChange: handleChange,
|
|
99
|
+
onFocus: handleFocus,
|
|
100
|
+
onBlur: handleBlur,
|
|
101
|
+
onKeyDown: handleKeyDown,
|
|
102
|
+
disabled,
|
|
103
|
+
}} iconR={handleIcon()} helperText={helperText} error={error}/>
|
|
104
|
+
{isOpen && (<ul className="absolute z-40 flex max-h-28 w-full flex-col gap-y-4 overflow-y-auto rounded-md bg-white px-3 py-2 shadow-lg">
|
|
105
|
+
{filteredOptions?.length > 0 ? (filteredOptions.map((option) => (<button key={option.value} onClick={() => handleOptionClick(option)} className="cursor-pointer py-0.5 text-left">
|
|
106
|
+
{option.label}
|
|
107
|
+
</button>))) : (<li className="autocomplete-option no-options">No hay opciones</li>)}
|
|
108
|
+
</ul>)}
|
|
109
|
+
</div>);
|
|
110
|
+
}
|
|
111
|
+
//# sourceMappingURL=Autocomplete.jsx.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Autocomplete.jsx","sourceRoot":"","sources":["../../../../src/components/02-molecules/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/02-molecules/Autocomplete/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/02-molecules/Autocomplete/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -13,7 +13,7 @@ type TFilterProps = {
|
|
|
13
13
|
};
|
|
14
14
|
inputs: Record<string, {
|
|
15
15
|
title: string;
|
|
16
|
-
config: Array<TInputRegular | TInputRadio | TInputSelect | TInputMultiSelect>;
|
|
16
|
+
config: Array<TInputRegular | TInputRadio | TInputSelect | TInputMultiSelect | TInputAutocomplete>;
|
|
17
17
|
}>;
|
|
18
18
|
};
|
|
19
19
|
type TFilterValues = string | boolean | OptionType[];
|
|
@@ -22,6 +22,8 @@ type TInputBase = {
|
|
|
22
22
|
value?: TFilterValues;
|
|
23
23
|
minDate?: string;
|
|
24
24
|
maxDate?: string;
|
|
25
|
+
onDebouncedChange?: (query: string) => void | OptionType[] | Promise<void | OptionType[]>;
|
|
26
|
+
debounceDelay?: number;
|
|
25
27
|
};
|
|
26
28
|
type TInputRegular = TInputBase & {
|
|
27
29
|
type: DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>['type'];
|
|
@@ -43,6 +45,11 @@ type TInputMultiSelect = TInputBase & {
|
|
|
43
45
|
options: OptionType[];
|
|
44
46
|
placeholder?: never;
|
|
45
47
|
};
|
|
48
|
+
type TInputAutocomplete = TInputBase & {
|
|
49
|
+
type: 'autocomplete';
|
|
50
|
+
options: OptionType[];
|
|
51
|
+
placeholder?: never;
|
|
52
|
+
};
|
|
46
53
|
/**
|
|
47
54
|
* Filter component for managing a set of filters with various input types.
|
|
48
55
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../../../src/components/02-molecules/Filter/Filter.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,iBAAiB,EAEtB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAIf,OAAO,EAML,UAAU,EAIX,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Filter.d.ts","sourceRoot":"","sources":["../../../../src/components/02-molecules/Filter/Filter.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,KAAK,iBAAiB,EAEtB,KAAK,mBAAmB,EACxB,KAAK,SAAS,EAGf,MAAM,OAAO,CAAC;AAIf,OAAO,EAML,UAAU,EAIX,MAAM,gBAAgB,CAAC;AAGxB,KAAK,YAAY,GAAG;IAClB,eAAe,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,KAAK,IAAI,CAAC;IAChE,kBAAkB,EAAE,MAAM,CAAC;IAC3B,WAAW,EAAE;QACX,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,MAAM,IAAI,CAAC;KACtB,CAAC;IACF,YAAY,EAAE;QACZ,IAAI,EAAE,MAAM,CAAC;QACb,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,KAAK,IAAI,CAAC;KACzD,CAAC;IACF,MAAM,EAAE,MAAM,CACZ,MAAM,EACN;QACE,KAAK,EAAE,MAAM,CAAC;QACd,MAAM,EAAE,KAAK,CACT,aAAa,GACb,WAAW,GACX,YAAY,GACZ,iBAAiB,GACjB,kBAAkB,CACrB,CAAC;KACH,CACF,CAAC;CACH,CAAC;AAEF,KAAK,aAAa,GAAG,MAAM,GAAG,OAAO,GAAG,UAAU,EAAE,CAAC;AAErD,KAAK,UAAU,GAAG;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,iBAAiB,CAAC,EAAE,CAClB,KAAK,EAAE,MAAM,KACV,IAAI,GAAG,UAAU,EAAE,GAAG,OAAO,CAAC,IAAI,GAAG,UAAU,EAAE,CAAC,CAAC;IACxD,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,KAAK,aAAa,GAAG,UAAU,GAAG;IAChC,IAAI,EAAE,iBAAiB,CACrB,mBAAmB,CAAC,gBAAgB,CAAC,EACrC,gBAAgB,CACjB,CAAC,MAAM,CAAC,CAAC;IACV,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,KAAK,WAAW,GAAG,UAAU,GAAG;IAC9B,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,KAAK,YAAY,GAAG,UAAU,GAAG;IAC/B,IAAI,EAAE,QAAQ,CAAC;IACf,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB,CAAC;AAEF,KAAK,iBAAiB,GAAG,UAAU,GAAG;IACpC,IAAI,EAAE,aAAa,CAAC;IACpB,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF,KAAK,kBAAkB,GAAG,UAAU,GAAG;IACrC,IAAI,EAAE,cAAc,CAAC;IACrB,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,WAAW,CAAC,EAAE,KAAK,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,wBAAgB,MAAM,CAAC,EACrB,kBAAkB,EAClB,YAAY,EACZ,WAAW,EACX,MAAM,EACN,eAAe,GAChB,EAAE,YAAY,GAAG,SAAS,CAkU1B"}
|
|
@@ -4,6 +4,7 @@ import { FiArrowRight } from 'react-icons/fi';
|
|
|
4
4
|
import { MdClose } from 'react-icons/md';
|
|
5
5
|
import { Each, Show } from '../../00-base';
|
|
6
6
|
import { Button, Checkbox, Input, List, MultiSelect, Paragraph, Radio, Select, } from '../../01-atoms';
|
|
7
|
+
import { Autocomplete } from '../Autocomplete';
|
|
7
8
|
/**
|
|
8
9
|
* Filter component for managing a set of filters with various input types.
|
|
9
10
|
*
|
|
@@ -67,10 +68,12 @@ export function Filter({ filtersEnabledText, submitButton, resetButton, inputs,
|
|
|
67
68
|
}
|
|
68
69
|
return previousValue;
|
|
69
70
|
}, {}));
|
|
71
|
+
const [autocompleteOptions, setAutocompleteOptions] = useState({});
|
|
70
72
|
const handlerChange = (name, value) => {
|
|
71
73
|
setFilters((prevValues) => {
|
|
72
74
|
if (!value || (Array.isArray(value) && !value.length)) {
|
|
73
75
|
delete prevValues[name];
|
|
76
|
+
clearAutocompleteOptions(name);
|
|
74
77
|
return { ...prevValues };
|
|
75
78
|
}
|
|
76
79
|
return { ...prevValues, [name]: value };
|
|
@@ -80,6 +83,7 @@ export function Filter({ filtersEnabledText, submitButton, resetButton, inputs,
|
|
|
80
83
|
setFilters((prevValues) => {
|
|
81
84
|
delete prevValues[name];
|
|
82
85
|
const newValues = { ...prevValues };
|
|
86
|
+
clearAutocompleteOptions(name);
|
|
83
87
|
setTimeout(() => {
|
|
84
88
|
submitButton.callback(newValues);
|
|
85
89
|
}, 50);
|
|
@@ -92,8 +96,18 @@ export function Filter({ filtersEnabledText, submitButton, resetButton, inputs,
|
|
|
92
96
|
};
|
|
93
97
|
const handlerReset = () => {
|
|
94
98
|
setFilters({});
|
|
99
|
+
setAutocompleteOptions({});
|
|
95
100
|
resetButton.callback();
|
|
96
101
|
};
|
|
102
|
+
const clearAutocompleteOptions = (key) => {
|
|
103
|
+
setAutocompleteOptions((prev) => {
|
|
104
|
+
if (!(key in prev))
|
|
105
|
+
return prev;
|
|
106
|
+
const next = { ...prev };
|
|
107
|
+
delete next[key];
|
|
108
|
+
return next;
|
|
109
|
+
});
|
|
110
|
+
};
|
|
97
111
|
useEffect(() => {
|
|
98
112
|
if (filters && getValuesFilter) {
|
|
99
113
|
getValuesFilter(filters);
|
|
@@ -118,7 +132,13 @@ export function Filter({ filtersEnabledText, submitButton, resetButton, inputs,
|
|
|
118
132
|
}
|
|
119
133
|
const { label, type, options } = currentConfig;
|
|
120
134
|
let labelValue;
|
|
121
|
-
if (
|
|
135
|
+
if (type === 'autocomplete') {
|
|
136
|
+
const allOptions = autocompleteOptions[key] || options;
|
|
137
|
+
labelValue =
|
|
138
|
+
allOptions?.find((o) => String(o.value) === filters[key])
|
|
139
|
+
?.label || filters[key];
|
|
140
|
+
}
|
|
141
|
+
else if (Array.isArray(options)) {
|
|
122
142
|
labelValue = filters[key]
|
|
123
143
|
.map((option) => option.label)
|
|
124
144
|
.join(', ');
|
|
@@ -160,7 +180,8 @@ export function Filter({ filtersEnabledText, submitButton, resetButton, inputs,
|
|
|
160
180
|
{title}
|
|
161
181
|
</Paragraph>
|
|
162
182
|
<div className="grid gap-4">
|
|
163
|
-
<Each of={config} render={(
|
|
183
|
+
<Each of={config} render={(inputConfig, index) => {
|
|
184
|
+
const { type, label, options, minDate, maxDate, placeholder, onDebouncedChange, debounceDelay, } = inputConfig;
|
|
164
185
|
const filterKey = config.length > 1 ? `${name}__${index}` : name;
|
|
165
186
|
return (<Show key={label}>
|
|
166
187
|
<Show.When isTrue={type === 'select'}>
|
|
@@ -196,6 +217,23 @@ export function Filter({ filtersEnabledText, submitButton, resetButton, inputs,
|
|
|
196
217
|
<Show.When isTrue={type === 'multiselect'}>
|
|
197
218
|
<MultiSelect label={label} options={options} value={filters[filterKey]} onChange={(selectedOptions) => handlerChange(filterKey, selectedOptions)}/>
|
|
198
219
|
</Show.When>
|
|
220
|
+
<Show.When isTrue={type === 'autocomplete'}>
|
|
221
|
+
<Autocomplete label={label} options={autocompleteOptions[filterKey] ||
|
|
222
|
+
options} value={filters[filterKey] || ''} onSelect={(option) => {
|
|
223
|
+
handlerChange(filterKey, String(option?.value ?? ''));
|
|
224
|
+
}} onDebouncedChange={onDebouncedChange
|
|
225
|
+
? async (query) => {
|
|
226
|
+
const result = await onDebouncedChange(query);
|
|
227
|
+
if (Array.isArray(result)) {
|
|
228
|
+
setAutocompleteOptions((prev) => ({
|
|
229
|
+
...prev,
|
|
230
|
+
[filterKey]: result,
|
|
231
|
+
}));
|
|
232
|
+
}
|
|
233
|
+
return result;
|
|
234
|
+
}
|
|
235
|
+
: undefined} debounceDelay={debounceDelay}/>
|
|
236
|
+
</Show.When>
|
|
199
237
|
<Show.Else>
|
|
200
238
|
<Input label={label} input={{
|
|
201
239
|
type: type,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Filter.jsx","sourceRoot":"","sources":["../../../../src/components/02-molecules/Filter/Filter.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAKL,SAAS,EACT,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAC3C,OAAO,EACL,MAAM,EACN,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,WAAW,EAEX,SAAS,EACT,KAAK,EACL,MAAM,GACP,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Filter.jsx","sourceRoot":"","sources":["../../../../src/components/02-molecules/Filter/Filter.tsx"],"names":[],"mappings":"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"}
|
package/dist/utils/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}
|
package/dist/utils/index.js
CHANGED
package/dist/utils/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
type DebounceFn = <T extends (...args: never[]) => void>(callback: T, delay: number) => (...args: Parameters<T>) => void;
|
|
2
|
+
type ThrottleFn = <T extends (...args: never[]) => void>(callback: T, delay: number) => (...args: Parameters<T>) => void;
|
|
3
|
+
/**
|
|
4
|
+
* Debounce function: delays the execution of the callback until after
|
|
5
|
+
* the specified delay has elapsed since the last invocation.
|
|
6
|
+
*/
|
|
7
|
+
export declare const debounce: DebounceFn;
|
|
8
|
+
/**
|
|
9
|
+
* Throttle function: ensures the callback is executed at most once
|
|
10
|
+
* during the specified delay period.
|
|
11
|
+
*/
|
|
12
|
+
export declare const throttle: ThrottleFn;
|
|
13
|
+
export {};
|
|
14
|
+
//# sourceMappingURL=timing.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timing.d.ts","sourceRoot":"","sources":["../../src/utils/timing.ts"],"names":[],"mappings":"AAAA,KAAK,UAAU,GAAG,CAAC,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,IAAI,EACrD,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE,MAAM,KACV,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;AAEtC,KAAK,UAAU,GAAG,CAAC,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,KAAK,EAAE,KAAK,IAAI,EACrD,QAAQ,EAAE,CAAC,EACX,KAAK,EAAE,MAAM,KACV,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;AAEtC;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,UAStB,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,UAqBtB,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Debounce function: delays the execution of the callback until after
|
|
3
|
+
* the specified delay has elapsed since the last invocation.
|
|
4
|
+
*/
|
|
5
|
+
export const debounce = (callback, delay) => {
|
|
6
|
+
let timer = null;
|
|
7
|
+
return (...args) => {
|
|
8
|
+
if (timer) {
|
|
9
|
+
clearTimeout(timer);
|
|
10
|
+
}
|
|
11
|
+
timer = setTimeout(() => callback(...args), delay);
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
/**
|
|
15
|
+
* Throttle function: ensures the callback is executed at most once
|
|
16
|
+
* during the specified delay period.
|
|
17
|
+
*/
|
|
18
|
+
export const throttle = (callback, delay) => {
|
|
19
|
+
let isThrottling = false;
|
|
20
|
+
let lastArgs = null;
|
|
21
|
+
return (...args) => {
|
|
22
|
+
if (isThrottling) {
|
|
23
|
+
lastArgs = args;
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
callback(...args);
|
|
27
|
+
isThrottling = true;
|
|
28
|
+
setTimeout(() => {
|
|
29
|
+
isThrottling = false;
|
|
30
|
+
if (lastArgs) {
|
|
31
|
+
callback(...lastArgs);
|
|
32
|
+
lastArgs = null;
|
|
33
|
+
}
|
|
34
|
+
}, delay);
|
|
35
|
+
};
|
|
36
|
+
};
|
|
37
|
+
//# sourceMappingURL=timing.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"timing.js","sourceRoot":"","sources":["../../src/utils/timing.ts"],"names":[],"mappings":"AAUA;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAe,CAAC,QAAQ,EAAE,KAAK,EAAE,EAAE;IACtD,IAAI,KAAK,GAAyC,IAAI,CAAC;IAEvD,OAAO,CAAC,GAAG,IAAI,EAAE,EAAE;QACjB,IAAI,KAAK,EAAE,CAAC;YACV,YAAY,CAAC,KAAK,CAAC,CAAC;QACtB,CAAC;QACD,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,EAAE,KAAK,CAAC,CAAC;IACrD,CAAC,CAAC;AACJ,CAAC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAe,CAAC,QAAQ,EAAE,KAAK,EAAE,EAAE;IACtD,IAAI,YAAY,GAAG,KAAK,CAAC;IACzB,IAAI,QAAQ,GAAuC,IAAI,CAAC;IAExD,OAAO,CAAC,GAAG,IAAI,EAAE,EAAE;QACjB,IAAI,YAAY,EAAE,CAAC;YACjB,QAAQ,GAAG,IAAI,CAAC;YAChB,OAAO;QACT,CAAC;QAED,QAAQ,CAAC,GAAG,IAAI,CAAC,CAAC;QAClB,YAAY,GAAG,IAAI,CAAC;QAEpB,UAAU,CAAC,GAAG,EAAE;YACd,YAAY,GAAG,KAAK,CAAC;YACrB,IAAI,QAAQ,EAAE,CAAC;gBACb,QAAQ,CAAC,GAAG,QAAQ,CAAC,CAAC;gBACtB,QAAQ,GAAG,IAAI,CAAC;YAClB,CAAC;QACH,CAAC,EAAE,KAAK,CAAC,CAAC;IACZ,CAAC,CAAC;AACJ,CAAC,CAAC"}
|
package/package.json
CHANGED
package/tailwind.config.ts
CHANGED
|
@@ -57,6 +57,7 @@ const config: Config = {
|
|
|
57
57
|
1: '#E9F2FF',
|
|
58
58
|
dark: '#5498FF',
|
|
59
59
|
'dark-1': '#233554',
|
|
60
|
+
'dark-2': '#DBEAFE',
|
|
60
61
|
},
|
|
61
62
|
teal: {
|
|
62
63
|
DEFAULT: '#25DEC8',
|
|
@@ -75,6 +76,7 @@ const config: Config = {
|
|
|
75
76
|
1: '#FEECFB',
|
|
76
77
|
dark: '#F144D6',
|
|
77
78
|
'dark-1': '#222329',
|
|
79
|
+
light: '#FCDDEC',
|
|
78
80
|
},
|
|
79
81
|
violet: {
|
|
80
82
|
DEFAULT: '#C854E4',
|