@campxdev/react-blueprint 1.3.2 → 1.3.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@campxdev/react-blueprint",
-  "version": "1.3.2",
+  "version": "1.3.4",
   "main": "./export.ts",
   "private": false,
   "dependencies": {

package/src/components/Input/SingleSelect/SingleSelect.tsx

@@ -42,6 +42,8 @@ export type SingleSelectProps = {
   dbValueProps?: {
     valueKey: string;
     isObjectId?: boolean;
+    isInt?: boolean;
+    isFloat?: boolean;
   };
   dbLabelProps?: { labelKey: string; subLabelKey?: string };
   onChange: (value: any) => void;
@@ -103,7 +105,11 @@ const singleSelectReducer = (
       return { ...state, open: true };
     }
     case SingleSelectActionsTypes.CLOSE: {
-      return { ...state, open: false, loadingInternalOptions: false };
+      return {
+        ...state,
+        open: false,
+        loadingInternalOptions: false,
+      };
     }
     case SingleSelectActionsTypes.LOAD_INTERNAL_OPTIONS_START: {
       return { ...state, loadingInternalOptions: true };
@@ -121,15 +127,19 @@ const singleSelectReducer = (
       return { ...state, ...stateChanges };
     }
     case SingleSelectActionsTypes.SET_SEARCH: {
-      return { ...state, search: stateChanges.search, hasMore: true };
+      return {
+        ...state,
+        search: stateChanges.search,
+        hasMore: true,
+      };
     }
     case SingleSelectActionsTypes.CLEAR_SEARCH: {
       return {
         ...state,
         search: null,
         offset: 0,
-        internalOptions: [],
-        internalOptionsMap: {},
+        internalOptions: stateChanges.internalOptions,
+        internalOptionsMap: stateChanges.internalOptionsMap,
       };
     }
     case SingleSelectActionsTypes.SET_INTERNAL_OPTIONS: {
@@ -180,6 +190,8 @@ export const SingleSelect = ({
   dbValueProps = {
     valueKey: 'id',
     isObjectId: false,
+    isInt: false,
+    isFloat: false,
   },
   dbLabelProps,
   onOpen,
@@ -285,6 +297,16 @@ export const SingleSelect = ({
     if (optionsApiEndPoint) {
       dispatch({
         actionType: SingleSelectActionsTypes.CLEAR_SEARCH,
+        stateChanges: {
+          internalOptions: internalOptions.filter((o: any) =>
+            reason != 'selectOption' ? o.value == value : o.value != value,
+          ),
+          internalOptionsMap: generateOptionsMap(
+            internalOptions.filter((o: any) =>
+              reason != 'selectOption' ? o.value == value : o.value != value,
+            ),
+          ),
+        },
       });
     }
     if (onClose) {
@@ -308,13 +330,18 @@ export const SingleSelect = ({
           params: {
             limit: limit,
             offset: offset + 10,
-            search: search,
+
             dbValueProps: {
-              ...dbValueProps,
+              valueKey: dbValueProps.valueKey,
               ...(dbValueProps.isObjectId && { isObjectId: true }),
+              ...(dbValueProps.isInt && { isInt: true }),
+              ...(dbValueProps.isFloat && { isFloat: true }),
               selectedValueData: value,
             },
-            dbLabelProps,
+            dbLabelProps: {
+              search: search,
+              ...dbLabelProps,
+            },
             ...optionsApiEndpointParams,
           },
         })
@@ -345,6 +372,12 @@ export const SingleSelect = ({
     if (!searchValue || searchValue.trim() === '') {
       dispatch({
         actionType: SingleSelectActionsTypes.CLEAR_SEARCH,
+        stateChanges: {
+          internalOptions: internalOptions.filter((o: any) => o.value == value),
+          internalOptionsMap: generateOptionsMap(
+            internalOptions.filter((o: any) => o.value == value),
+          ),
+        },
       });
     }
     if (optionsApiEndPoint) {
@@ -358,12 +391,16 @@ export const SingleSelect = ({
               limit,
               offset: 0,
               dbValueProps: {
-                ...dbValueProps,
+                valueKey: dbValueProps.valueKey,
                 ...(dbValueProps.isObjectId && { isObjectId: true }),
+                ...(dbValueProps.isInt && { isInt: true }),
+                ...(dbValueProps.isFloat && { isFloat: true }),
                 selectedValueData: value,
               },
-              dbLabelProps,
-              search: searchValue,
+              dbLabelProps: {
+                search: searchValue,
+                ...dbLabelProps,
+              },
               ...optionsApiEndpointParams,
             },
           })
@@ -373,8 +410,14 @@ export const SingleSelect = ({
         dispatch({
           actionType: SingleSelectActionsTypes.SET_INTERNAL_OPTIONS,
           stateChanges: {
-            internalOptions: options,
-            internalOptionsMap: generateOptionsMap(options),
+            internalOptions: [
+              ...options,
+              ...internalOptions.filter((o: any) => o.value == value),
+            ],
+            internalOptionsMap: generateOptionsMap([
+              ...options,
+              ...internalOptions.filter((o: any) => o.value == value),
+            ]),
           },
         });
       } catch (e) {
@@ -397,11 +440,11 @@ export const SingleSelect = ({
     }, 300);
   }, [searchDb]);
 
-  const handleSearch = async (
-    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
-  ) => {
-    const searchValue = e.target.value;
-    debouncedSendRequest(searchValue);
+  const handleSearch = async (e: any) => {
+    if (e) {
+      const searchValue = e.target.value;
+      debouncedSendRequest(searchValue);
+    }
   };
 
   const loadSelectedOptions = async () => {
@@ -414,8 +457,10 @@ export const SingleSelect = ({
           limit,
           offset,
           dbValueProps: {
-            ...dbValueProps,
+            valueKey: dbValueProps.valueKey,
             ...(dbValueProps.isObjectId && { isObjectId: true }),
+            ...(dbValueProps.isInt && { isInt: true }),
+            ...(dbValueProps.isFloat && { isFloat: true }),
             selectedValueData: value,
             filterBySelectedValues: true,
           },
@@ -468,6 +513,7 @@ export const SingleSelect = ({
       onChange={(e, value) => {
         onChange(getValue ? getValue(value) : value?.value);
       }}
+      onInputCapture={handleSearch}
       open={open}
       autoFocus={true}
       filterOptions={(options, state) => {
@@ -511,7 +557,6 @@ export const SingleSelect = ({
           label={label}
           required={required}
           name={name}
-          onChange={handleSearch}
           error={error}
           helperText={helperText}
         />