@clicoh/orion-library 1.0.8 → 1.0.10
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 +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,+
|
|
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,+BAmK7B"}
|
|
@@ -33,22 +33,43 @@ import { debounce } from '../../../utils';
|
|
|
33
33
|
*/
|
|
34
34
|
export function Autocomplete({ options, onSelect, onChange, onDebouncedChange, debounceDelay = 200, onHandleKeyDown, disabled, label, helperText, error, value = '', }) {
|
|
35
35
|
const [query, setQuery] = useState(value);
|
|
36
|
-
const [filteredOptions, setFilteredOptions] = useState(
|
|
36
|
+
const [filteredOptions, setFilteredOptions] = useState([]);
|
|
37
37
|
const [isOpen, setIsOpen] = useState(false);
|
|
38
38
|
const containerRef = useRef(null);
|
|
39
39
|
const justSelectedRef = useRef(false);
|
|
40
40
|
const onDebouncedChangeRef = useRef(onDebouncedChange);
|
|
41
|
+
const latestQueryRef = useRef(query);
|
|
41
42
|
onDebouncedChangeRef.current = onDebouncedChange;
|
|
42
43
|
const debouncedCallback = useMemo(() => debounce(async (q) => {
|
|
44
|
+
if (!q.trim()) {
|
|
45
|
+
setFilteredOptions([]);
|
|
46
|
+
setIsOpen(false);
|
|
47
|
+
return;
|
|
48
|
+
}
|
|
43
49
|
const result = await onDebouncedChangeRef.current?.(q);
|
|
50
|
+
if (latestQueryRef.current !== q) {
|
|
51
|
+
return;
|
|
52
|
+
}
|
|
44
53
|
if (Array.isArray(result)) {
|
|
45
54
|
setFilteredOptions(result);
|
|
55
|
+
setIsOpen(true);
|
|
46
56
|
}
|
|
47
57
|
}, debounceDelay), [debounceDelay]);
|
|
48
58
|
const handleChange = (e) => {
|
|
49
59
|
const newQuery = e.target.value;
|
|
60
|
+
latestQueryRef.current = newQuery;
|
|
50
61
|
setQuery(newQuery);
|
|
62
|
+
const trimmedQuery = newQuery.trim();
|
|
63
|
+
if (!trimmedQuery) {
|
|
64
|
+
setFilteredOptions([]);
|
|
65
|
+
setIsOpen(false);
|
|
66
|
+
onSelect?.(undefined);
|
|
67
|
+
onChange?.(newQuery);
|
|
68
|
+
debouncedCallback(newQuery);
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
51
71
|
setFilteredOptions(options.filter((option) => option.label.toLowerCase().includes(newQuery.toLowerCase())));
|
|
72
|
+
setIsOpen(true);
|
|
52
73
|
onChange?.(newQuery);
|
|
53
74
|
debouncedCallback(newQuery);
|
|
54
75
|
};
|
|
@@ -60,6 +81,11 @@ export function Autocomplete({ options, onSelect, onChange, onDebouncedChange, d
|
|
|
60
81
|
onSelect?.(option);
|
|
61
82
|
};
|
|
62
83
|
const handleFocus = () => {
|
|
84
|
+
if (!query.trim()) {
|
|
85
|
+
setFilteredOptions([]);
|
|
86
|
+
setIsOpen(false);
|
|
87
|
+
return;
|
|
88
|
+
}
|
|
63
89
|
setIsOpen(true);
|
|
64
90
|
setFilteredOptions(options.filter((option) => option.label.toLowerCase().includes(query.toLowerCase())));
|
|
65
91
|
};
|
|
@@ -74,6 +100,7 @@ export function Autocomplete({ options, onSelect, onChange, onDebouncedChange, d
|
|
|
74
100
|
onHandleKeyDown();
|
|
75
101
|
}
|
|
76
102
|
};
|
|
103
|
+
const hasSearchQuery = query.trim().length > 0;
|
|
77
104
|
useEffect(() => {
|
|
78
105
|
if (justSelectedRef.current) {
|
|
79
106
|
justSelectedRef.current = false;
|
|
@@ -87,10 +114,14 @@ export function Autocomplete({ options, onSelect, onChange, onDebouncedChange, d
|
|
|
87
114
|
}
|
|
88
115
|
const matchedOption = options.find((opt) => String(opt.value) === value);
|
|
89
116
|
setQuery(matchedOption ? matchedOption.label : value);
|
|
90
|
-
}, [value]);
|
|
117
|
+
}, [options, value]);
|
|
91
118
|
useEffect(() => {
|
|
92
|
-
|
|
93
|
-
|
|
119
|
+
if (!query.trim()) {
|
|
120
|
+
setFilteredOptions([]);
|
|
121
|
+
return;
|
|
122
|
+
}
|
|
123
|
+
setFilteredOptions(options.filter((option) => option.label.toLowerCase().includes(query.toLowerCase())));
|
|
124
|
+
}, [options, query]);
|
|
94
125
|
return (<div className="relative w-full" ref={containerRef}>
|
|
95
126
|
<Input label={label} input={{
|
|
96
127
|
type: 'text',
|
|
@@ -104,7 +135,7 @@ export function Autocomplete({ options, onSelect, onChange, onDebouncedChange, d
|
|
|
104
135
|
{!!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
136
|
{filteredOptions?.length > 0 ? (filteredOptions.map((option) => (<button key={option.value} onClick={() => handleOptionClick(option)} className="cursor-pointer py-0.5 text-left">
|
|
106
137
|
{option.label}
|
|
107
|
-
</button>))) : (<li className="autocomplete-option no-options">No hay opciones</li>)}
|
|
138
|
+
</button>))) : hasSearchQuery ? (<li className="autocomplete-option no-options">No hay opciones</li>) : null}
|
|
108
139
|
</ul>)}
|
|
109
140
|
</div>);
|
|
110
141
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Autocomplete.jsx","sourceRoot":"","sources":["../../../../src/components/02-molecules/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAGL,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAmB1C;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,MAAM,UAAU,YAAY,CAAC,EAC3B,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,iBAAiB,EACjB,aAAa,GAAG,GAAG,EACnB,eAAe,EACf,QAAQ,EACR,KAAK,EACL,UAAU,EACV,KAAK,EACL,KAAK,GAAG,EAAE,GACkB;IAC5B,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAS,KAAK,CAAC,CAAC;IAClD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAe,
|
|
1
|
+
{"version":3,"file":"Autocomplete.jsx","sourceRoot":"","sources":["../../../../src/components/02-molecules/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"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"}
|