diff --git a/packages/react-native/Libraries/Components/TextInput/TextInput.js b/packages/react-native/Libraries/Components/TextInput/TextInput.js index 57eebf7c751..f9474401dbc 100644 --- a/packages/react-native/Libraries/Components/TextInput/TextInput.js +++ b/packages/react-native/Libraries/Components/TextInput/TextInput.js @@ -1455,8 +1455,7 @@ function InternalTextInput(props: Props): React.Node { }; } - // $FlowFixMe[underconstrained-implicit-instantiation] - let style = flattenStyle(props.style); + const style = flattenStyle(props.style); if (Platform.OS === 'ios') { const RCTTextInputView = @@ -1464,7 +1463,12 @@ function InternalTextInput(props: Props): React.Node { ? RCTMultilineTextInputView : RCTSinglelineTextInputView; - style = props.multiline === true ? [styles.multilineInput, style] : style; + const useMultilineDefaultStyle = + props.multiline === true && + (style == null || + (style.padding == null && + style.paddingVertical == null && + style.paddingTop == null)); const useOnChangeSync = (props.unstable_onChangeSync || props.unstable_onChangeTextSync) && @@ -1494,7 +1498,10 @@ function InternalTextInput(props: Props): React.Node { onSelectionChange={_onSelectionChange} onSelectionChangeShouldSetResponder={emptyFunctionThatReturnsTrue} selection={selection} - style={style} + style={StyleSheet.compose( + useMultilineDefaultStyle ? styles.multilineDefault : null, + style, + )} text={text} /> ); @@ -1771,7 +1778,7 @@ export type TextInputComponentStatics = $ReadOnly<{| |}>; const styles = StyleSheet.create({ - multilineInput: { + multilineDefault: { // This default top inset makes RCTMultilineTextInputView seem as close as possible // to single-line RCTSinglelineTextInputView defaults, using the system defaults // of font size 17 and a height of 31 points.