title: Nesting React.js Components
body: <p>I'd like to call the render of a nested component within the render of a parent. This is what I've tried so far. Is there a pattern for this? Thanks.</p>
  
  <pre><code>var nest = React.createClass({
    render: function() {
      return React.DOM.div({
        className: 'boop' 
      }, 'hello')
    }
  })
  
  var comp = React.createClass({
    render: function() {
      return React.DOM.div({
        className: 'beep', 
        children: React.renderComponent(nest(this.props))
      })
    }
  })
  
  React.renderComponent(comp(props), document.body)
  </code></pre>
  
  <p>Expected: </p>
  
  <pre><code>  &lt;body&gt;
      &lt;div class='beep'&gt;
        &lt;div class='boop'&gt;
          hello
        &lt;/div&gt;
      &lt;/div&gt;
    &lt;/body&gt;
  </code></pre>