JSFiddle - React, Tailwind, and code Playground

by ifandelse

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>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css">
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<script src="http://fb.me/react-js-fiddle-integration.js"></script>

CSS

body {
    font-family: Helvetica, Arial;
}

JavaScript 1.7

/** @jsx React.DOM */

var TreeView = React.createClass({
    render: function() {
        return <div></div>;
    },
    componentDidMount: function() {
        $(this.getDOMNode()).kendoTreeView({
            dataSource: this.props.dataSource
        });
    }
});

var dataSource = [
    {
        text: "LeanKit",
        items: [
            { text: "Jim Cowart" },
            { text: "Chris Gunderson" },
            { text: "Shawn Hartsell" },
            { text: "Hunter Heitzman" },
            { text: "John Mathis" },
            { text: "David Neal" },
            { text: "Alex Robson" },
            { text: "Scott Walters" },
            { text: "Austin Young" }
        ]
    }
];
 
React.renderComponent(
    <TreeView dataSource={ dataSource } />,
    document.body
);