@rn-components-dropdown/dropdown 1.0.33 → 1.0.34

package/dist/components/dropdown/Dropdown.js

@@ -9,8 +9,8 @@ import { useDropdownStyle } from './DropdownStyle';
 import SearchInput from './component/input/TextInput';
 import { ArrowDown, ArrowUp, CheckIcon } from '../../assets/svg';
 const DropdownComponent = (props) => {
-    const { label, testID, iconStyle, renderItem, style = {}, subfixIcon, labelField, valueField, onChangeText, itemTextStyle, flatListProps, minHeight = 0, containerStyle, search = false, renderLeftIcon, checkIconColor, radioIconColor, multiSelectIcon, itemTestIDField, maxHeight = 300, inverted = true, renderRightIcon, placeholderStyle, inputSearchStyle, searchPlaceholder, selectedTextStyle, renderInputSearch, iconColor = 'gray', accessibilityLabel, itemContainerStyle, labelContainer = {}, labelTextStyle = {}, selectedTextProps = {}, chipContainerProps = {}, keyboardAvoiding = true, selectionType = 'single', activeColor = 'lightGray', dropdownPosition = 'auto', itemAccessibilityLabelField, placeholder = 'Please select', showsVerticalScrollIndicator = true, } = props;
-    const { chipColor, clearIcon, textColor, onClearPress: onClear, } = chipContainerProps;
+    const { label, testID, iconStyle, renderItem, style = {}, subfixIcon, labelField, valueField, onChangeText, itemTextStyle, flatListProps, minHeight = 0, containerStyle, search = false, renderLeftIcon, checkIconColor, radioIconColor, multiSelectIcon, itemTestIDField, maxHeight = 300, inverted = true, renderRightIcon, placeholderStyle, inputSearchStyle, searchPlaceholder, selectedTextStyle, renderInputSearch, iconColor = 'gray', accessibilityLabel, itemContainerStyle, labelContainer = {}, labelTextStyle = {}, selectedTextProps = {}, chipContainerProps = {}, keyboardAvoiding = true, selectionType = 'single', onClear: onChipClearPress, activeColor = 'lightGray', dropdownPosition = 'auto', itemAccessibilityLabelField, placeholder = 'Please select', showsVerticalScrollIndicator = true, } = props;
+    const { chipColor, clearIcon, textColor } = chipContainerProps;
     const { styles, colors } = useDropdownStyle({
         checkIconColor: checkIconColor,
         radioIconColor: radioIconColor,
@@ -42,8 +42,8 @@ const DropdownComponent = (props) => {
               <ScrollView showsVerticalScrollIndicator={false}>
                 <View style={styles.wraps}>
                   {currentValue?.map?.((i) => (<Chip chipColor={chipColor || 'red'} textColor={textColor || 'white'} clearIcon={clearIcon} key={i?.[valueField]} label={i?.[labelField]} onClearPress={() => {
-                        onClear?.();
                         onClearPress?.(i);
+                        onChipClearPress?.(i?.[valueField]);
                     }}/>))}
                 </View>
               </ScrollView>

package/dist/components/dropdown/hooks/useDropdown.js

@@ -230,7 +230,7 @@ const useDropdown = (props) => {
     }, [setCurrentValue, valueField, onChange, currentValue]);
     const onClearPress = useCallback((item) => {
         const updated = currentValue.filter((i) => i[valueField] !== item[valueField]);
-        const val = currentValue.map((i) => i[valueField]);
+        const val = updated.map((i) => i[valueField]);
         setCurrentValue(updated);
         onChange?.(item[valueField], val);
     }, [currentValue, valueField, onChange, setCurrentValue]);

package/dist/components/dropdown/interface/ChipInterface.d.ts

@@ -1,8 +1,8 @@
-import { ColorValue } from "react-native";
+import { ColorValue } from 'react-native';
 export interface ChipInterface {
     label?: string;
     chipColor?: ColorValue;
     textColor?: ColorValue;
-    onClearPress?: () => void;
     clearIcon?: React.JSX.Element;
+    onClearPress?: (item?: any) => void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rn-components-dropdown/dropdown",
-  "version": "1.0.33",
+  "version": "1.0.34",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "homepage": "https://www.npmjs.com/package/@rn-components-dropdown/dropdown",

package/src/components/dropdown/Dropdown.tsx

@@ -59,6 +59,7 @@ const DropdownComponent = <T, Mode extends SELECTIONS_TYPE>(
     chipContainerProps = {},
     keyboardAvoiding = true,
     selectionType = 'single',
+    onClear: onChipClearPress,
     activeColor = 'lightGray',
     dropdownPosition = 'auto',
     itemAccessibilityLabelField,
@@ -66,12 +67,7 @@ const DropdownComponent = <T, Mode extends SELECTIONS_TYPE>(
     showsVerticalScrollIndicator = true,
   } = props;
 
-  const {
-    chipColor,
-    clearIcon,
-    textColor,
-    onClearPress: onClear,
-  } = chipContainerProps;
+  const { chipColor, clearIcon, textColor } = chipContainerProps;
 
   const { styles, colors } = useDropdownStyle({
     checkIconColor: checkIconColor,
@@ -164,8 +160,8 @@ const DropdownComponent = <T, Mode extends SELECTIONS_TYPE>(
                       key={i?.[valueField]}
                       label={i?.[labelField]}
                       onClearPress={() => {
-                        onClear?.();
                         onClearPress?.(i);
+                        onChipClearPress?.(i?.[valueField]);
                       }}
                     />
                   ))}

package/src/components/dropdown/hooks/useDropdown.ts

@@ -337,7 +337,7 @@ const useDropdown = <T, Mode extends SELECTIONS_TYPE>(
       const updated = currentValue.filter(
         (i: any) => i[valueField] !== item[valueField],
       );
-      const val = currentValue.map((i: any) => i[valueField]);
+      const val = updated.map((i: any) => i[valueField]);
       setCurrentValue(updated);
       onChange?.(item[valueField] as keyof T, val);
     },

package/src/components/dropdown/interface/ChipInterface.ts

@@ -1,9 +1,9 @@
-import { ColorValue } from "react-native";
+import { ColorValue } from 'react-native';
 
 export interface ChipInterface {
   label?: string;
   chipColor?: ColorValue;
   textColor?: ColorValue;
-  onClearPress?: () => void;
   clearIcon?: React.JSX.Element;
+  onClearPress?: (item?: any) => void;
 }