Merge pull request #445 from hossein-zare/dev-5.x

Bugfix: schemaless item props.

Author: hossein-zare

index.d.ts

@@ -107,6 +107,8 @@ declare module "react-native-dropdown-picker" {
       selectedItemLabelStyle: StyleProp<TextStyle>;
       disabledItemContainerStyle: StyleProp<ViewStyle>;
       disabledItemLabelStyle: StyleProp<TextStyle>;
+      containerStyle: StyleProp<ViewStyle>;
+      labelStyle: StyleProp<TextStyle>;
       categorySelectable: boolean;
       onPress: () => void;
       setPosition: (value: ValueType, y: number) => void;
@@ -238,20 +240,13 @@ declare module "react-native-dropdown-picker" {
       rtl?: boolean;
     };
 
-    type GetSelectedItemOutputType = ItemType | undefined | null;
-    type GetSelectedItemsOutputType = ItemType[] | undefined;
-
     interface DropDownPickerInterface {
       MODE: ModeInterface;
       LIST_MODE: ListModeInterface;
       DROPDOWN_DIRECTION: DropDownDirectionType;
       SCHEMA: SchemaInterface;
       LANGUAGE: LanguageType;
       THEMES: ThemeNameType;
-      HELPER: {
-        GET_SELECTED_ITEM: (items: ItemType[], value: string | number | null, key?: string) => GetSelectedItemOutputType;
-        GET_SELECTED_ITEMS: (items: ItemType[], values: string[] | number[] | null, key?: string) => GetSelectedItemsOutputType;
-      };
       setMode: (mode: string) => void;
       setListMode: (mode: string) => void;
       setDropDownDirection: (direction: DropDownDirectionType) => void;

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-dropdown-picker",
-  "version": "5.2.2",
+  "version": "5.2.3",
   "description": "A single / multiple, categorizable, customizable, localizable and searchable item picker (drop-down) component for react native which supports both Android & iOS.",
   "keywords": [
     "picker",

src/components/Picker.js

@@ -1329,9 +1329,9 @@ function Picker({
                 item={item}
                 label={item[_schema.label]}
                 value={item[_schema.value]}
-                parent={item[_schema.parent] ?? null}
-                selectable={item[_schema.selectable] ?? null}
-                disabled={item[_schema.disabled] ?? false}
+                parent={item?.[_schema.parent] ?? null}
+                selectable={item?.[_schema.selectable] ?? null}
+                disabled={item?.[_schema.disabled] ?? false}
                 custom={item.custom ?? false}
                 props={itemProps}
                 isSelected={isSelected}
@@ -1349,6 +1349,8 @@ function Picker({
                 selectedItemLabelStyle={_selectedItemLabelStyle}
                 disabledItemContainerStyle={_disabledItemContainerStyle}
                 disabledItemLabelStyle={_disabledItemLabelStyle}
+                labelStyle={item?.[_schema.labelStyle] ?? {}}
+                containerStyle={item?.[_schema.containerStyle] ?? {}}
                 categorySelectable={categorySelectable}
                 onPress={onPressItem}
                 setPosition={setItemPosition}

src/components/RenderListItem.js

@@ -36,6 +36,8 @@ function RenderListItem({
     selectedItemLabelStyle,
     disabledItemContainerStyle,
     disabledItemLabelStyle,
+    containerStyle,
+    labelStyle,
     categorySelectable,
     onPress,
     setPosition,
@@ -89,11 +91,11 @@ function RenderListItem({
     const _listItemContainerStyle = useMemo(() => ([
         ...[listItemContainerStyle].flat(),
         ...[_listParentChildContainerStyle].flat(),
-        ...[item?.containerStyle ?? {}].flat(),
+        ...[containerStyle].flat(),
         ...[_selectedItemContainerStyle].flat(),
         ...[_customItemContainerStyle].flat(),
         ...[_disabledItemContainerStyle].flat(),
-    ]), [listItemContainerStyle, _listParentChildContainerStyle, _selectedItemContainerStyle, _customItemContainerStyle, _disabledItemContainerStyle]);
+    ]), [listItemContainerStyle, _listParentChildContainerStyle, _selectedItemContainerStyle, _customItemContainerStyle, _disabledItemContainerStyle, containerStyle]);
 
     /**
      * The list category label style.
@@ -135,11 +137,11 @@ function RenderListItem({
     const _listItemLabelStyle = useMemo(() => ([
         ...[listItemLabelStyle].flat(),
         ...[_listParentChildLabelStyle].flat(),
-        ...[item?.labelStyle ?? {}].flat(),
+        ...[labelStyle].flat(),
         ...[_selectedItemLabelStyle].flat(),
         ...[_customItemLabelStyle].flat(),
         ...[_disabledItemLabelStyle].flat(),
-    ]), [listItemLabelStyle, _listParentChildLabelStyle, _selectedItemLabelStyle, _customItemLabelStyle, _disabledItemLabelStyle]);
+    ]), [listItemLabelStyle, _listParentChildLabelStyle, _selectedItemLabelStyle, _customItemLabelStyle, _disabledItemLabelStyle, labelStyle]);
 
     /**
      * onPress.