diff --git a/src/MentionsTextInput.js b/src/MentionsTextInput.js index 8f46320..1350ffa 100644 --- a/src/MentionsTextInput.js +++ b/src/MentionsTextInput.js @@ -4,6 +4,7 @@ import { View, Animated, TextInput, + Platform, FlatList, ViewPropTypes } from 'react-native'; @@ -557,6 +558,20 @@ export default class MentionsTextInput extends Component { } } + onContentSizeChange(event) { + const singleLineThreshold = Platform.OS == 'android' ? 12 : 0; + const heightDifference = event.nativeEvent.contentSize.height - this.props.textInputMinHeight; + const newHeight = event.nativeEvent.contentSize.height + 10; + const height = heightDifference <= singleLineThreshold ? this.props.textInputMinHeight : newHeight; + + this.setState({ textInputHeight: height }); + + if (this.props.onContentSizeChange) { + event.nativeEvent.contentSize.height = height; + this.props.onContentSizeChange(event); + } + } + render() { return ( @@ -575,15 +590,7 @@ export default class MentionsTextInput extends Component { { - if (this.props.onContentSizeChange) { - this.props.onContentSizeChange(event); - } - - this.setState({ - textInputHeight: this.props.textInputMinHeight >= event.nativeEvent.contentSize.height ? this.props.textInputMinHeight : event.nativeEvent.contentSize.height + 10, - }); - }} + onContentSizeChange={this.onContentSizeChange.bind(this)} ref={component => this._textInput = component} accessibilityLabel={ 'chat_input_text' } onChangeText={this.onChangeText.bind(this)} @@ -621,6 +628,7 @@ MentionsTextInput.propTypes = { triggerLocation: PropTypes.oneOf(['new-word-only', 'anywhere']).isRequired, value: PropTypes.string.isRequired, onChangeText: PropTypes.func.isRequired, + placeholder: PropTypes.string, triggerCallback: PropTypes.func.isRequired, renderSuggestionsRow: PropTypes.oneOfType([ PropTypes.func,