From 03e5d8c11c3b6d02e06fbcb530a3580cc5314a73 Mon Sep 17 00:00:00 2001 From: Mohamed Samara <45723974+mohamedsamara@users.noreply.github.com> Date: Wed, 29 Nov 2023 18:33:35 -0800 Subject: [PATCH 1/2] feat: add search placeholder color prop --- src/components/Dropdown/index.tsx | 4 +++- src/components/Dropdown/model.ts | 1 + src/components/MultiSelect/index.tsx | 4 +++- src/components/MultiSelect/model.ts | 1 + 4 files changed, 8 insertions(+), 2 deletions(-) diff --git a/src/components/Dropdown/index.tsx b/src/components/Dropdown/index.tsx index 01c0168..7957165 100644 --- a/src/components/Dropdown/index.tsx +++ b/src/components/Dropdown/index.tsx @@ -62,6 +62,7 @@ const DropdownComponent: ( activeColor = '#F6F7F8', fontFamily, iconColor = 'gray', + searchPlaceholderTextColor = 'gray', searchPlaceholder, placeholder = 'Select item', search = false, @@ -488,7 +489,7 @@ const DropdownComponent: ( } onSearch(e); }} - placeholderTextColor="gray" + placeholderTextColor={searchPlaceholderTextColor} iconStyle={[{ tintColor: iconColor }, iconStyle]} /> ); @@ -499,6 +500,7 @@ const DropdownComponent: ( accessibilityLabel, font, iconColor, + searchPlaceholderTextColor, iconStyle, inputSearchStyle, onChangeText, diff --git a/src/components/Dropdown/model.ts b/src/components/Dropdown/model.ts index 378c617..7ed6221 100644 --- a/src/components/Dropdown/model.ts +++ b/src/components/Dropdown/model.ts @@ -33,6 +33,7 @@ export interface DropdownProps { minHeight?: number; fontFamily?: string; iconColor?: string; + searchPlaceholderTextColor?: string; activeColor?: string; data: T[]; value?: T | string | null | undefined; diff --git a/src/components/MultiSelect/index.tsx b/src/components/MultiSelect/index.tsx index 0f018bb..cc4daf4 100644 --- a/src/components/MultiSelect/index.tsx +++ b/src/components/MultiSelect/index.tsx @@ -61,6 +61,7 @@ const MultiSelectComponent: ( fontFamily, placeholderStyle, iconColor = 'gray', + searchPlaceholderTextColor = 'gray', inputSearchStyle, searchPlaceholder, placeholder = 'Select item', @@ -487,7 +488,7 @@ const MultiSelectComponent: ( } onSearch(e); }} - placeholderTextColor="gray" + placeholderTextColor={searchPlaceholderTextColor} iconStyle={[{ tintColor: iconColor }, iconStyle]} /> ); @@ -498,6 +499,7 @@ const MultiSelectComponent: ( accessibilityLabel, font, iconColor, + searchPlaceholderTextColor, iconStyle, inputSearchStyle, onChangeText, diff --git a/src/components/MultiSelect/model.ts b/src/components/MultiSelect/model.ts index c4f018f..adae6b9 100644 --- a/src/components/MultiSelect/model.ts +++ b/src/components/MultiSelect/model.ts @@ -33,6 +33,7 @@ export interface MultiSelectProps { maxSelect?: number; fontFamily?: string; iconColor?: string; + searchPlaceholderTextColor?: string; activeColor?: string; data: T[]; value?: string[] | null | undefined; From 88cdc217b776fcba5c85a9d77ec8235ed42b0080 Mon Sep 17 00:00:00 2001 From: Mohamed Samara <45723974+mohamedsamara@users.noreply.github.com> Date: Wed, 29 Nov 2023 18:50:37 -0800 Subject: [PATCH 2/2] docs: add search placeholder color prop --- README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/README.md b/README.md index 4669c71..ed51eca 100644 --- a/README.md +++ b/README.md @@ -64,6 +64,7 @@ yarn add react-native-element-dropdown | search | Boolean | No | Show or hide input search | | searchQuery | (keyword: string, labelValue: string) => Boolean| No | Callback used to filter the list of items | | inputSearchStyle | ViewStyle | No | Styling for input search | +| searchPlaceholderTextColor | String | No | Search placeholder color | | searchPlaceholder | String | No | The string that will be rendered before text input has been entered | | renderInputSearch | (onSearch: (text:string) => void) => JSX.Element| No | Customize TextInput search | | disable | Boolean | No | Specifies the disabled state of the Dropdown | @@ -120,6 +121,7 @@ yarn add react-native-element-dropdown | search | Boolean | No | Show or hide input search | | searchQuery | (keyword: string, labelValue: string) => Boolean | No | Callback used to filter the list of items | | inputSearchStyle | ViewStyle | No | Styling for input search | +| searchPlaceholderTextColor | String | No | Search placeholder color | | searchPlaceholder | String | No | The string that will be rendered before text input has been entered | | renderInputSearch | (onSearch: (text:string) => void) => JSX.Element | No | Customize TextInput search | | disable | Boolean | No | Specifies the disabled state of the Dropdown |