AdelRedaa97 / react-native-select-dropdown

react-native-select-dropdown is a highly customized dropdown | select | picker | menu for react native that works for andriod and iOS platforms.
MIT License
314 stars 134 forks source link

Make types generic #132

Open gbrvalerio opened 1 year ago

gbrvalerio commented 1 year ago

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch react-native-select-dropdown@3.3.2 for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-select-dropdown/index.d.ts b/node_modules/react-native-select-dropdown/index.d.ts
index c157192..e68c0b3 100644
--- a/node_modules/react-native-select-dropdown/index.d.ts
+++ b/node_modules/react-native-select-dropdown/index.d.ts
@@ -2,15 +2,15 @@ import type * as React from 'react';
 import {StyleProp, ViewStyle, TextStyle} from 'react-native';

 declare module 'react-native-select-dropdown' {
-  export type SelectDropdownProps = {
+  export type SelectDropdownProps<T> = {
     /**
      * array of data that will be represented in dropdown, can be array of objects
      */
-    data: Array<any>;
+    data: Array<T>;
     /**
      * function recieves selected item and its index in data array
      */
-    onSelect: (selectedItem: any, index: number) => void;
+    onSelect: (selectedItem: T, index: number) => void;
     /**
      * default button text when no item is selected
      */
@@ -18,7 +18,7 @@ declare module 'react-native-select-dropdown' {
     /**
      * default selected item in dropdown
      */
-    defaultValue?: any;
+    defaultValue?: T;
     /**
      * default selected item index
      */
@@ -54,7 +54,7 @@ declare module 'react-native-select-dropdown' {
     /**
      * function that should return a React component for dropdown icon
      */
-    renderDropdownIcon?: (selectedItem: any, index: number) => React.ReactNode;
+    renderDropdownIcon?: (selectedItem: T, index: number) => React.ReactNode;
     /**
      * dropdown icon position "left" || "right"
      */
@@ -122,23 +122,32 @@ declare module 'react-native-select-dropdown' {
     /**
      * function returns React component for search input icon
      */
-    renderSearchInputLeftIcon?: (selectedItem: any, index: number) => React.ReactNode;
+    renderSearchInputLeftIcon?: (
+      selectedItem: T,
+      index: number,
+    ) => React.ReactNode;
     /**
      * function returns React component for search input icon
      */
-    renderSearchInputRightIcon?: (selectedItem: any, index: number) => React.ReactNode;
+    renderSearchInputRightIcon?: (
+      selectedItem: T,
+      index: number,
+    ) => React.ReactNode;
   } & (
     | {
         /**
          * function recieves selected item and its index, this function should return a string that will be represented in button after item is selected
          */
-        buttonTextAfterSelection: (selectedItem: any, index: number) => string;
+        buttonTextAfterSelection: (selectedItem: T, index: number) => string;
       }
     | {
         /**
          * function recieves selected item and its index, this function should return a React component as a child for dropdown button buttonStyle should be used for parent button view style.
          */
-        renderCustomizedButtonChild?: (selectedItem: any, index: number) => React.ReactNode;
+        renderCustomizedButtonChild?: (
+          selectedItem: T,
+          index: number,
+        ) => React.ReactNode;
       }
   ) &
     (
@@ -146,17 +155,21 @@ declare module 'react-native-select-dropdown' {
           /**
            * function recieves item and index for each row in dropdown, this function shoud return a string that will be represented in each row in dropdown
            */
-          rowTextForSelection: (item: any, index: number) => string;
+          rowTextForSelection: (item: T, index: number) => string;
         }
       | {
           /**
            * function recieves item and its index, this function should return React component as a child for customized row rowStyle should be used for parent row view style.
            */
-          renderCustomizedRowChild?: (selectedItem: any, index: number, isSelected?: boolean) => React.ReactNode;
+          renderCustomizedRowChild?: (
+            selectedItem: T,
+            index: number,
+            isSelected?: boolean,
+          ) => React.ReactNode;
         }
     );

-  export default class SelectDropdown extends React.Component<SelectDropdownProps> {
+  export default class SelectDropdown<T> extends React.Component<SelectDropdownProps<T>> {
     /**
      * Remove selection & reset it to display defaultButtonText check
      */

This issue body was partially generated by patch-package.