diff --git a/src/components/InlineErrorText.js b/src/components/InlineErrorText.js index d77a5c4aacee..8f6f705329f4 100644 --- a/src/components/InlineErrorText.js +++ b/src/components/InlineErrorText.js @@ -6,14 +6,13 @@ import Text from './Text'; const propTypes = { /** Text to display */ - children: PropTypes.string, + children: PropTypes.string.isRequired, /** Styling for inline error text */ styles: PropTypes.arrayOf(PropTypes.object), }; const defaultProps = { - children: 'Error', styles: [], }; diff --git a/src/components/TextInput/BaseTextInput.js b/src/components/TextInput/BaseTextInput.js index 87dae0aff7da..9e2693f2d333 100644 --- a/src/components/TextInput/BaseTextInput.js +++ b/src/components/TextInput/BaseTextInput.js @@ -11,6 +11,7 @@ import themeColors from '../../styles/themes/default'; import styles from '../../styles/styles'; import Icon from '../Icon'; import * as Expensicons from '../Icon/Expensicons'; +import InlineErrorText from '../InlineErrorText'; import Text from '../Text'; import * as styleConst from './styleConst'; import * as StyleUtils from '../../styles/StyleUtils'; @@ -187,8 +188,6 @@ class BaseTextInput extends Component { // eslint-disable-next-line react/forbid-foreign-prop-types const inputProps = _.omit(this.props, _.keys(baseTextInputPropTypes.propTypes)); const hasLabel = Boolean(this.props.label.length); - const inputHelpText = this.props.errorText || this.props.hint; - const formHelpStyles = this.props.errorText ? styles.formError : styles.formHelp; const placeholder = (this.props.prefixCharacter || this.state.isFocused || !hasLabel || (hasLabel && this.props.forceActiveLabel)) ? this.props.placeholder : null; const textInputContainerStyles = _.reduce([ styles.textInputContainer, @@ -287,27 +286,9 @@ class BaseTextInput extends Component { - {(!_.isEmpty(inputHelpText) || !_.isNull(this.props.maxLength)) && ( - - {!_.isEmpty(inputHelpText) && ( - {inputHelpText} - )} - {!_.isNull(this.props.maxLength) && ( - - {this.state.value.length} - / - {this.props.maxLength} - - )} - - )} + + {this.props.errorText} + {/* Text input component doesn't support auto grow by default.