diff --git a/src/HintedInput.react.js b/src/HintedInput.react.js index 1dd75fe9..91178415 100644 --- a/src/HintedInput.react.js +++ b/src/HintedInput.react.js @@ -12,8 +12,46 @@ const STYLES = { padding: 0, }; +// Shim around a standard input to normalize how props are applied. +class StandardInput extends React.Component { + render() { + const {inputClassName, inputStyle, ...otherProps} = this.props; + + return ( + this._input = input} + style={{ + ...STYLES, + ...inputStyle, + width: '100%', + }} + /> + ); + } + + // Mirror the AutosizeInput API for consistency. + getInput = () => { + return this._input; + } +} + class HintedInput extends React.Component { render() { + return ( +
+ {this._renderInput()} + {this._renderHint()} +
+ ); + } + + _renderInput = () => { const { className, hintText, @@ -23,21 +61,21 @@ class HintedInput extends React.Component { ...props } = this.props; + // Render a standard input in the single-select case to address #278. + const InputComponent = multiple ? AutosizeInput : StandardInput; + return ( -
- - {this._renderHint()} -
+ ); }