TextInput's text cropped by its borders

[Vaskovskied]

Current behaviour

Text input's text is cropped by its borders as you can see on screenshots. It's seems like an unexpected behaviour because it also affect react-native-paper-dates library inputs. Problem only affects android version. Also you can see very tall margin bottom in text inputs.

Expected behaviour

Text input text is displaying properly.

How to reproduce?

<TextInput
ref={hoursInput}
mode="outlined"
placeholder="00"
maxLength={2}
keyboardType="number-pad"
style={styles.input}
/>

input: {
      fontSize: 56,
      textAlign: 'center',
      minWidth: 102,
},

I improved it someway by providing padding and to the input.

input: {
      fontSize: 56,
      textAlign: 'center',
      paddingTop: Platform.OS === 'ios' ? 0 : 8,
      minWidth: 102,
      height: 72,
},

As you can see on screenshot #2, it looks acceptable.
But I can't do the same to library's components, and it is also very inconvient.
Here's my theme config:

const {theme} = useMaterial3Theme({fallbackSourceColor: '#6750A4'});
  const {LightTheme, DarkTheme} = adaptNavigationTheme({
    reactNavigationLight: NavigationDefaultTheme,
    reactNavigationDark: NavigationDarkTheme,
  });

  const CombinedDefaultTheme = merge(LightTheme, {
    ...MD3LightTheme,
    colors: theme.light,
  });
  const CombinedDarkTheme = merge(DarkTheme, {
    ...MD3DarkTheme,
    colors: theme.dark,
  });

Preview

What have you tried so far?

I addition to styling input, i tried to change font settings of my app to Sans-serif and Roboto (it's seems like it's a default font on my phone). But it doesn't help too.

Your Environment

software	version
android	12
react-native	0.71.7
react-native-paper	^5.7.0
node	16.16.0
npm	8.11.0
expo sdk	^48.0.0

[lukewalczak]

Hey @Vaskovskied, please format provided code snippet or create a snack.