Just noticed that since we switched to Babel, compile error is ugly if you make a mistake on https://facebook.github.io/react/ interactive examples:

<img width="339" alt="screen shot 2017-04-21 at 4 53 33 pm" src="https://cloud.githubusercontent.com/assets/810438/25285719/23c3a592-26b3-11e7-976f-1f0b8ead7ed3.png">

We should fix it to preserve the newlines. It should be an easy fix.

You’d need to follow the instructions in the `docs` folder to get them running, then figure out a fix and send a PR. Please comment here if you plan to work on this so that two people don’t work on the same thing.

---

## Update: @tsriram is looking at this.
{editor}
      </div>
    );
  },
});
var selfCleaningTimeout = {
  componentDidUpdate: function() {
    clearTimeout(this.timeoutID);
  },
  setTimeout: function() {
    clearTimeout(this.timeoutID);
    this.timeoutID = setTimeout.apply(null, arguments);
  },
};
var ReactPlayground = React.createClass({
  mixins: [selfCleaningTimeout],
  MODES: {JSX: 'JSX', JS: 'JS'}, 
  propTypes: {
    codeText: React.PropTypes.string.isRequired,
    transformer: React.PropTypes.func,
    renderCode: React.PropTypes.bool,
    showCompiledJSTab: React.PropTypes.bool,
    showLineNumbers: React.PropTypes.bool,
    editorTabTitle: React.PropTypes.string,
  },
  getDefaultProps: function() {
    return {
      transformer: function(code, options) {
        var presets = ['react'];
        if (!options || !options.skipES2015Transform) {