Custom theme for search box decoration not applied.

[aelrahmanashraf]

I tried to make the search box look different in CountrySelectorNavigator, but it's not working. When I checked the code, it seems like the search box design settings are not reaching the PageNavigator, which might be why it's not working.

[cedvdb]

Need repro

[aelrahmanashraf]

After checking again, I can't add custom style to the searchBoxDecoration. The code is missing the part where the custom style is applied to the page. At the end, I forked the repo and applied the style myself here.

I had to assign the searchBoxDecoration and searchBoxTextStyle from the PageNavigator constructor.

[cedvdb]

Can't you do it by changing the Theme around phone form field ?

[aelrahmanashraf]

Doing this will just change the form field theme itself but not the search box inside the country selector page.

[aelrahmanashraf]

I have forked the repo and applied it anyway. You can take a look at the pull request.

[cedvdb]

So if I understand you correctly when wrapping the PhoneFormField with a Theme, the theme values are not applied to the country selection page search bar, right ?

If that the case a workaround to explore is to pass the local theme into the overlay similar to how the locale is passed currently. As it is done here https://github.com/cedvdb/phone_form_field/blob/main/lib/src/country_selector_navigator.dart#L235

This fix would not add things to the public api of phone_form_fields and would therefor be prefered.

So something like the pseudo code:

    return Localizations.override(
      context: inputContext,
      locale: Localizations.localeOf(inputContext),
      child: Theme(  // <== add this 
          data: Theme.of(inputContext),
          child: CountrySelector.page(
                // ...
           ),
         ),
       )

[cedvdb]

I believe this is fixed in v10 or I may have misunderstood the issue