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>

CSS

body {
	background: #CCC;
}

#toolbar {
	background: #AAA;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 36px;
	vertical-align: middle;
}

#canvas {
	position: absolute;
	top: 36px;
	left: 0;
	right: 0;
	bottom: 0;
}

.point {
	position: absolute;
	width: 32px;
	height: 32px;
	margin-left: -16px;
	margin-top: -16px;
	background: black;
	border-radius: 16px;
}

JavaScript 1.7

/**
 * @jsx React.DOM
 */
var EditorCanvas = React.createClass({
    getInitialState: function() {
        return {
            points: [
                {
                    x: 50,
                    y: 100
                },
                {
                    x: 200,
                    y: 50
                }
            ],
            selected: null
        };
    },

    render: function() {
        return <div>
            <Toolbar point={this.state.selected}
                onXChange={this.setSelectedX}
                onYChange={this.setSelectedY}/>
            <div id="canvas">
                {this.state.points.map(this.renderPoint)}
            </div>
        </div>;
    },

    renderPoint: function(point) {
        return <Point point={point} onClick={this.selectPoint.bind(this, point)}/>
    },

    selectPoint: function(point) {
        this.setState({selected: point});
    },

    setSelectedX: function(event) {
        var point = this.state.selected;
        point.x = event.target.value;
        this.forceUpdate();
    },

    setSelectedY: function(event) {
        var point = this.state.selected;
        point.y = event.target.value;
        this.forceUpdate();
    }
});

var Toolbar = React.createClass({
    render: function() {
        var point = this.props.point;
        if (!point) {
            return <div id="toolbar"/>;
        }
        return <div id="toolbar">
            x:<input type="number" value={point.x} onInput={this.props.onXChange}/>
            &middot;
            y:<input type="number" value={point.y} onInput={this.props.onYChange}/>
        </div>;
    }
});

var Point = React.createClass({
    render: function() {
        var style = {
            left: this.props.point.x + 'px',
             top: this.props.point.y + 'px'
        };
        return <div style={style} className="point" onClick={this.props.onClick}/>
    }
});

React.renderComponent(
	<EditorCanvas/>,
	document.body
);