@mtes-mct/monitor-ui 6.3.0 → 6.3.1

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [6.3.0](https://github.com/MTES-MCT/monitor-ui/compare/v6.2.2...v6.3.0) (2023-05-24)
+
+
+### Bug Fixes
+
+* **fields:** fix multiple performance issues in Select & MultiSelect ([771e33e](https://github.com/MTES-MCT/monitor-ui/commit/771e33e9fcad59f2dbbea1aeb7ef9efeba85d840))
+
+
+### Features
+
+* **fields:** add customSearch prop to Select & MultiSelect ([217bd58](https://github.com/MTES-MCT/monitor-ui/commit/217bd58142898e8fff89fd7ea748ba3bf7d42144))
+* **libs:** add CustomSearch ([6dfe696](https://github.com/MTES-MCT/monitor-ui/commit/6dfe696d7b11b941ba257da20d59b7ceabb7a7be))
+* **libs:** add isStrict & threshold options to CustomSearch ([c059a57](https://github.com/MTES-MCT/monitor-ui/commit/c059a57ffbfa052bbf3fb7d83e145421dd2c5a57))
+
 ## [6.2.2](https://github.com/MTES-MCT/monitor-ui/compare/v6.2.1...v6.2.2) (2023-05-21)
 
 

package/index.js

@@ -24522,7 +24522,7 @@ class CustomSearch {
      * @returns     A list of matching items
      */
     find(query, limit) {
-        const normalizedQuery = this.#isDiacriticSensitive ? query : diacritics.remove(query);
+        const normalizedQuery = (this.#isDiacriticSensitive ? query : diacritics.remove(query)).trim();
         // Here we use Fuse.js `useExtendedSearch` option to avoid fuzziness
         // when `CustomSearch` `isStrict` option is set to `true`.
         // In that case we want each space-separated `query` keywords to be strict
@@ -24611,7 +24611,7 @@ function MultiSelect({ baseContainer, customSearch, disabled = false, error, isE
     // and we use the `customSearchLabelMatches` ref-stored results, in the form of option labels,
     // to check if the current option label is part of these results.
     // Note that options label are expected to be unique in order for this pattern to work.
-    boxRef.current && customSearchRef.current
+    customSearchRef.current
         ? (query, _label, item) => {
             if (!customSearchRef.current) {
                 throw new Error('`customSearchRef.current` is undefined.');
@@ -24621,6 +24621,7 @@ function MultiSelect({ baseContainer, customSearch, disabled = false, error, isE
             if (query !== previousSearchQueryRef.current) {
                 const nextCustomSearchLabelMatches = query.trim().length > 0 ? customSearchRef.current.find(query).map(option => option.label) : undefined;
                 customSearchLabelMatchesRef.current = nextCustomSearchLabelMatches;
+                previousSearchQueryRef.current = query;
             }
             return customSearchLabelMatchesRef.current ? customSearchLabelMatchesRef.current.includes(item.label) : true;
         }
@@ -24662,7 +24663,7 @@ function MultiSelect({ baseContainer, customSearch, disabled = false, error, isE
     useEffect(() => {
         forceUpdate();
     }, [forceUpdate]);
-    return (jsxs(Field$2, { className: "Field-MultiSelect", children: [jsx(Label, { disabled: disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(Box$4, { ref: boxRef, "$hasError": hasError, "$isActive": isOpen, "$isLight": isLight, onClick: toggle, children: boxRef.current && (jsx(TagPicker, { container: boxRef.current, data: rsuiteData, disabled: disabled, id: originalProps.name, onChange: handleChange, onClick: toggle, open: isOpen, renderMenuItem: renderMenuItem, searchable: searchable, searchBy: searchBy, value: selectedRsuiteValue, ...originalProps }, key)) }), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
+    return (jsxs(Field$2, { className: "Field-MultiSelect", children: [jsx(Label, { disabled: disabled, hasError: hasError, htmlFor: originalProps.name, isHidden: isLabelHidden, children: label }), jsx(Box$4, { ref: boxRef, "$hasError": hasError, "$isActive": isOpen, "$isLight": isLight, onClick: toggle, children: boxRef.current && (jsx(TagPicker, { container: boxRef.current, data: rsuiteData, disabled: disabled, id: originalProps.name, onChange: handleChange, onClick: toggle, open: isOpen, renderMenuItem: renderMenuItem, searchable: !!customSearch || searchable, searchBy: searchBy, value: selectedRsuiteValue, ...originalProps }, key)) }), !isErrorMessageHidden && hasError && jsx(FieldError, { children: controlledError })] }));
 }
 const Box$4 = styled.div `
   position: relative;
@@ -33873,7 +33874,7 @@ function Select({ baseContainer, customSearch, disabled = false, error, isCleana
     // and we use the `customSearchLabelMatches` ref-stored results, in the form of option labels,
     // to check if the current option label is part of these results.
     // Note that options label are expected to be unique in order for this pattern to work.
-    boxRef.current && customSearchRef.current
+    customSearchRef.current
         ? (query, _label, item) => {
             if (!customSearchRef.current) {
                 throw new Error('`customSearchRef.current` is undefined.');
@@ -33883,6 +33884,7 @@ function Select({ baseContainer, customSearch, disabled = false, error, isCleana
             if (query !== previousSearchQueryRef.current) {
                 const nextCustomSearchLabelMatches = query.trim().length > 0 ? customSearchRef.current.find(query).map(option => option.label) : undefined;
                 customSearchLabelMatchesRef.current = nextCustomSearchLabelMatches;
+                previousSearchQueryRef.current = query;
             }
             return customSearchLabelMatchesRef.current ? customSearchLabelMatchesRef.current.includes(item.label) : true;
         }