JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://react.zpao.com/builds/master/latest/react.js"></script>
<script src="http://react.zpao.com/builds/master/latest/JSXTransformer.js"></script>
<script src="http://fb.me/react-js-fiddle-integration.js"></script>

CSS

svg {
    border: 1px solid black;
}

JavaScript 1.7

/** @jsx React.DOM */

var A = React.createClass({
    render: function() {
        return (
            <div>asdasdffffasdasd</div>
        );
    }
});

var B = React.createClass({
    getInitialState: function() {
       return {collection:this.props.collection};
    },
    shuffle: function() {
        this.state.collection.set(["asdasd","jkjk"];)
    },
    
    render: function() {
        var createItem = function(itemText) {
          return <li>{itemText}</li>;
        };
        return (
            <ul onClick={this.shuffle}>{ this.state.collection.map(createItem)}</ul>
        );
    }
});



var Hello = React.createClass({
    getInitialState: function() {
       return {x:10, y:10, width:40, height:40};
    },
    handleClick: function(evt) {
        console.log(evt.clientX, evt.clientY);
        this.setState({x:evt.clientX, y:evt.clientY});
    },
    render: function() {
        var Q = B;
        var collection = ["jkjk","asdasd"];
        var props = { name: "2"}
        console.log("ioioi");
        var jsx = (
          <div>
           <div>test</div> 
           <Q collection={collection}></Q>
         </div>
        );
        console.log(jsx);
        return jsx;
    }
});
 
React.renderComponent(<Hello name="World" />, document.body);