diff --git a/src/components/TextInput/BaseTextInput.js b/src/components/TextInput/BaseTextInput.js
index c7a3daeb9b2c..1a6eec10fb7d 100644
--- a/src/components/TextInput/BaseTextInput.js
+++ b/src/components/TextInput/BaseTextInput.js
@@ -380,7 +380,12 @@ class BaseTextInput extends Component {
                 {(this.props.autoGrow || this.props.autoGrowHeight) && (
                     // Add +2 to width so that the first digit of amount do not cut off on mWeb - https://github.com/Expensify/App/issues/8158.
                     <Text
-                        style={[...this.props.inputStyle, this.props.autoGrowHeight ? {maxWidth: this.state.width} : {}, styles.hiddenElementOutsideOfWindow, styles.visibilityHidden]}
+                        style={[
+                            ...this.props.inputStyle,
+                            this.props.autoGrowHeight && styles.autoGrowHeightHiddenInput(this.state.width, maxHeight),
+                            styles.hiddenElementOutsideOfWindow,
+                            styles.visibilityHidden,
+                        ]}
                         onLayout={(e) => this.setState({textInputWidth: e.nativeEvent.layout.width + 2, textInputHeight: e.nativeEvent.layout.height})}
                     >
                         {this.state.value || this.props.placeholder}
diff --git a/src/styles/styles.js b/src/styles/styles.js
index 253d0b1e9dd8..8deb2a98013a 100644
--- a/src/styles/styles.js
+++ b/src/styles/styles.js
@@ -813,6 +813,12 @@ const styles = {
         minHeight: variables.componentSizeLarge,
     }),
 
+    autoGrowHeightHiddenInput: (maxWidth, maxHeight) => ({
+        maxWidth,
+        maxHeight: maxHeight && maxHeight + 1,
+        overflow: 'hidden',
+    }),
+
     textInputContainer: {
         flex: 1,
         justifyContent: 'center',