feat: add search field color

TestsExample/src/Test758.tsx

@@ -39,6 +39,7 @@ function First({navigation}: NativeStackScreenProps<ParamListBase>) {
 
   const searchBarOptions: SearchBarProps = {
     barTintColor: 'powderblue',
+    textColor: 'red',
     hideWhenScrolling: true,
     obscureBackground: false,
     hideNavigationBar: false,

createNativeStackNavigator/README.md

@@ -374,6 +374,10 @@ Text displayed when search field is empty.
 
 Defaults to an empty string.
 
+#### `textColor`
+
+The search field text color.
+
 ### Helpers
 
 The stack navigator adds the following methods to the navigation prop:

guides/GUIDE_FOR_LIBRARY_AUTHORS.md

@@ -171,6 +171,7 @@ To render a search bar use `ScreenStackHeaderSearchBarView` with `<SearchBar>` c
 - `onFocus` - A callback that gets called when search bar has received focus.
 - `onSearchButtonPress` - A callback that gets called when the search button is pressed. It receives the current text value of the search bar.
 - `placeholder` - Text displayed when search field is empty. Defaults to an empty string.
+- `textColor` - The search field text color.
 
 
 Below is a list of properties that can be set with `ScreenStackHeaderConfig` component:

ios/RNSSearchBar.m

@@ -10,6 +10,7 @@ @implementation RNSSearchBar
 {
   __weak RCTBridge *_bridge;
   UISearchController *_controller;
+  UIColor *_textColor;
 }
 
 @synthesize controller = _controller;
@@ -54,15 +55,40 @@ - (void)setPlaceholder:(NSString *)placeholder
 
 - (void)setBarTintColor:(UIColor *)barTintColor
 {
+#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \
+    __IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0
   if (@available(iOS 13.0, *)) {
     [_controller.searchBar.searchTextField setBackgroundColor:barTintColor];
   }
+#endif
+}
+
+- (void)setTextColor:(UIColor *)textColor
+{
+#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \
+    __IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0
+  _textColor = textColor;
+  if (@available(iOS 13.0, *)) {
+    [_controller.searchBar.searchTextField setTextColor:_textColor];
+  }
+#endif
 }
 
 #pragma mark delegate methods
 
 - (void)searchBarTextDidBeginEditing:(UISearchBar *)searchBar
 {
+#if defined(__IPHONE_OS_VERSION_MAX_ALLOWED) && defined(__IPHONE_13_0) && \
+    __IPHONE_OS_VERSION_MAX_ALLOWED >= __IPHONE_13_0
+  if (@available(iOS 13.0, *)) {
+    // for some reason, the color does not change when set at the beginning,
+    // so we apply it again here
+    if(_textColor != nil) {
+      [_controller.searchBar.searchTextField setTextColor:_textColor];
+    }
+  }
+#endif
+
   [_controller.searchBar setShowsCancelButton:YES animated:YES];
   [self becomeFirstResponder];
 
@@ -131,6 +157,7 @@ - (UIView *)view
 RCT_EXPORT_VIEW_PROPERTY(autoCapitalize, UITextAutocapitalizationType)
 RCT_EXPORT_VIEW_PROPERTY(placeholder, NSString)
 RCT_EXPORT_VIEW_PROPERTY(barTintColor, UIColor)
+RCT_EXPORT_VIEW_PROPERTY(textColor, UIColor)
 
 RCT_EXPORT_VIEW_PROPERTY(onChangeText, RCTBubblingEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onCancelButtonPress, RCTBubblingEventBlock)

native-stack/README.md

@@ -365,6 +365,10 @@ Text displayed when search field is empty.
 
 Defaults to an empty string.
 
+#### `textColor`
+
+The search field text color.
+
 ### Events
 
 The navigator can [emit events](https://reactnavigation.org/docs/navigation-events) on certain actions. Supported events are:

src/types.tsx

@@ -364,4 +364,8 @@ export interface SearchBarProps {
    * A callback that gets called when search bar has lost focus
    */
   onBlur?: (e: NativeSyntheticEvent<TargetedEvent>) => void;
+  /**
+   * The search field text color
+   */
+  textColor?: string;
 }