feat: remove title with search bar

[Gregoirevda]

Description

When using a search bar in react navigation, there's currently no option to have a search bar without title. Specifying a blank title leaves a blank area

Fixes https://github.com/react-navigation/react-navigation/issues/11257

Changes

Added removeTitle property, which will place the search bar in the title

Screenshots / GIFs

Before

After

Test code and steps to reproduce

  <Stack.Navigator>
     <Stack.Screen name="SearchScreen" component={SearchView} 
        options={{
          title: 'Search',
          headerSearchBarOptions: {
            placeholder: 'Search',
            removeTitle: true,
          },
        }}
      />
  </Stack.Navigator>

[Gregoirevda]

3. I've tried many alternatives, the only one who was getting close was [navitem setPreferredSearchBarPlacement:UINavigationItemSearchBarPlacementInline]; (iOS 16+ and next to title)

[Gregoirevda]

I've re-applied hidesNavigationBarDuringPresentation = false back as clicking on the searchBar would then hide the searchBar, cannot see a use case for that :D

[hamdij0maa]

this is amazing, when will be released plz ?

[Gregoirevda]

@kkafar animations are working properly both on iPhone and iPad (mainly cancel button appearing)

[hamdij0maa]

any idea on when this change will be released please @kkafar @Gregoirevda ?

[kkafar]

@hamdij0maa, I've not fount time to review it yet, but I'll try in incoming days & I did not plan releasing 3.21.0 earlier than few weeks from now. However we'll see whether we can release it sooner.

[hamdij0maa]

@hamdij0maa, I've not fount time to review it yet, but I'll try in incoming days & I did not plan releasing 3.21.0 earlier than few weeks from now. However we'll see whether we can release it sooner.

thank you <3

[FNG-2002]

How is the behavior with headerButtons? For example if I want to have a headerRight with a Button. Will it dissapear and be replaced with the cancel buttom from the searchbar?

[Gregoirevda]

@kkafar Could we get this merged?