JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://fb.me/JSXTransformer-0.10.0.js"></script>
<script src="http://fb.me/react-with-addons-0.10.0.js"></script>
<script src="http://fb.me/react-js-fiddle-integration.js"></script>

CSS

label{
    display: block;
    width: 100%;
}

textarea{
    width: 400px;
    height: 400px;
}

JavaScript 1.7

/** @jsx React.DOM */

var Range = React.createClass({
    getInitialState: function(){
        return {
            'Browserinput': 0,
            'Browserchange': 0,
            'Reactinput': 0,
            'Reactchange': 0,
            'Log': []
        };
    },
    
    /* Wrapper for React onChange, which is triggered by an input event*/
    onChange: function(event, reactId){
        this.onEvent(event, reactId, 'change');
    },
    
    /* Event handler: Generates log line and works out which state variable to update */
    onEvent: function(event, reactId, override) {
        var output = [],
            nativeEvent = event.nativeEvent || event;
        
        output.push((event.hasOwnProperty('nativeEvent'))? 'React' : 'Browser');
        
        if (typeof override === 'undefined'){
            output.push(nativeEvent.type);
            changedVariable = output[0] + nativeEvent.type;
        } else {
            output.push(override + ' (' + nativeEvent.type + ')');
            changedVariable = output[0] + override;
        }
        
        output.push(nativeEvent.target.value);

        this.updateState(changedVariable, nativeEvent.target.value, output.join(': '));
    },
    
    updateState: function(changedVariable, newValue, logLine){
        var newState = {},
            log = this.state.Log;

        log.unshift(logLine);

        newState[changedVariable] = newValue;
        newState.Log = log;
        
        this.setState(newState);
    },
    
    clearLog: function(){
        this.setState({Log: []});
    },
    
    /* Binds browser events to the input element */
    componentDidMount: function(){
        var input = document.getElementById('range');
        
        input.addEventListener('change', this.onEvent.bind(this));
        input.addEventListener('input', this.onEvent.bind(this));
    },   
    
    render: function() {
        return (
            <div>
                <input id="range" type="range" tabIndex="1"...