JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://fb.me/react-with-addons-0.8.0.js"></script>
<script src="http://fb.me/JSXTransformer-0.8.0.js"></script>
<script src="http://fb.me/react-js-fiddle-integration.js"></script>
<!--
<script src="https://gist.github.com/tungd/8367229/raw/62ca39870cb3330129cbb6c3f4ba1034e3f13c95/react-catalyst.js"></script>
-->
<script>
    /**
 * react-catalyst.js
 *
 * LinkedState for Facebook's React UI Library. Add support for 
 * deep path state access.
 *
 * Author: Tung Dao <me@tungdao.com>
 *
 * Usage:
 *
 * var WithLink = React.createClass({
 *   mixins: [ReactCatalyst.LinkedStateMixin],
 *     getInitialState: function() {
 *       return { values: [{ text: 'Hello!' }] };
 *   },
 *   render: function() {
 *     return <input type="text" valueLink={this.linkState('values.0.text')} />;
 *   }
 * });
 */

window.ReactCatalyst = {}

!function(ReactCatalyst) {
  "use strict";

  function getIn(object, path) {
    var stack = path.split('.');
    while (stack.length > 1) {
      object = object[stack.shift()];
    }
    return object[stack.shift()];
  }

  function updateIn(object, path, value) {
    var current = object, stack = path.split('.');
    while (stack.length > 1) {
      current = current[stack.shift()];
    }
    current[stack.shift()] = value;
    return object;
  }

  function setPartialState(component, path, value) {
    component.setState(
      updateIn(component.state, path, value));
  }

  ReactCatalyst.LinkedStateMixin = {
    linkState: function(path) {
      return {
        value: getIn(this.state, path),
        requestChange: setPartialState.bind(null, this, path)
      }
    }
  }

}(window.ReactCatalyst);
    </script>

JavaScript 1.7

/** @jsx React.DOM */

var Hello = React.createClass({
    mixins: [ReactCatalyst.LinkedStateMixin],
    getInitialState: function() {
        return { values: [
            { type: "translateX", x: 10 },
            { type: "scaleX", x: 1.2 }
        ]}
    },
    render: function() {
        return <div>
            {this.state.values.map(function(item, i) {
                return <div>
                  <input valueLink={this.linkState('values.'+i+'.type')}/>
                  <input valueLink={this.linkState('values.'+i+'.x')}/>
                </div>
            }, this)}
            <pre>{JSON.stringify(this.state)}</pre>
        </div>;
    }
});
 
React.renderComponent(<Hello name="World" />, document.body);