gistfile1.js

// this works fine

  render: function() {
    var content = [];
    if (this.state.showResults && this.props.results.length) {
      content.push(<ResultList results={this.props.results} onResultSelectAction={this.onResultSelectAction} />);
    }

    return (
      <div className="searchbox-wrapper">
        <input className="searchbox" type="text" onFocus={this.onFocusAction} onKeyPress={this.props.onTypeAction} placeholder="Search here..." />
          <ReactCSSTransitionGroup transitionName="resultlist" component={React.DOM.div}>
            {content}
          </ReactCSSTransitionGroup>
      </div>
    );
  }
  
// this will work when entering, but will throw an error when the component is re-rendered without the ResultList component

  render: function() {
    var content;
    if (this.state.showResults && this.props.results.length) {
      content = <ResultList results={this.props.results} onResultSelectAction={this.onResultSelectAction} />;
    }

    return (
      <div className="searchbox-wrapper">
        <input className="searchbox" type="text" onFocus={this.onFocusAction} onKeyPress={this.props.onTypeAction} placeholder="Search here..." />
          <ReactCSSTransitionGroup transitionName="resultlist" component={React.DOM.div}>
            {content}
          </ReactCSSTransitionGroup>
      </div>
    );
  }