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="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js "></script>
<script src="https://rawgithub.com/kendo-labs/bower-kendo-ui/master/js/kendo.web.min.js"></script>
<link rel="stylesheet" href="https://rawgithub.com/kendo-labs/bower-kendo-ui/master/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://rawgithub.com/kendo-labs/bower-kendo-ui/master/styles/kendo.default.min.css">
<script src="https://rawgithub.com/wingspan/wingspan-forms/dist/dist/wingspan-forms-quickstart.js"></script>
<link rel="stylesheet" href="https://rawgithub.com/wingspan/wingspan-forms/dist/dist/wingspan-forms.css">
<script src="http://fb.me/react-js-fiddle-integration.js"></script>

CSS

.App{display:table;padding:10px}.App>.AutoForm{display:table-cell;width:50%;padding:10px}.App>pre{display:table-cell;vertical-align:top;padding:10px}

JavaScript 1.7

/** @jsx React.DOM */
'use strict';


var App = React.createClass({
    mixins: [WingspanForms.TopStateMixin],

    getInitialState: function () {
        return {
            formValue: {
                "firstName": "Dustin",
                "lastName": "Getz",
                "phoneNumber": "415-555-1212",
                "email": "[email protected]",
                "contactGroup": "friend",
                "id": "90ce52a4-7e69-11e3-b4b1-bec9a24410d2",
                "revision": 1
            }
        };
    },

    render: function () {
        return (
            <div className="App">
                <AutoForm
                    model={ContactModel}
                    value={this.state.formValue}
                    onChange={_.partial(this.onChange, 'formValue')} />
                <pre>{JSON.stringify(this.state, undefined, 2)}</pre>
            </div>
        );
    }
});


/**
 * Abstraction to dynamically render a form based on a JSON 'model' describing the form.
 */
var AutoForm = React.createClass({

    getDefaultProps: function () {
        return {
            model: undefined,
            value: undefined,
            onChange: undefined
        };
    },

    componentWillMount: function () {
        // Initialize datastores for widgets that require one
        _.each(this.props.model.properties, function (fieldInfo) {
            if (fieldInfo.options) {
                fieldInfo.options.dataSource = new kendo.data.DataSource(fieldInfo.options);
            }
        }.bind(this));
    },

    render: function () {
        var controls = _.map(this.props.model.properties, function (fieldInfo) {
            return (
                <AutoField
                    fieldInfo={fieldInfo}
                    value={this.props.value[fieldInfo.name]}
                    onChange={_.partial(this.props.onChange, fieldInfo.name)} />
                );
        }.bind(this));

        return (
            <div className="AutoForm" >
               ...