JSFiddle - React, Tailwind, and code Playground

HTML

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

CSS

ul.flyout_options ul.navigation li ul {
    display: block;
    height:50px;
    width: 50px;
    color: #555;
}

JavaScript 1.7

/** @jsx React.DOM */

var Menu = React.createClass({
    getInitialState: function () {
      return {open: false};
    },

    onClick: React.autoBind(function() {
        this.setState({open: !this.state.open});
    }),

    render: function() {
        return <div class="flyout_menu">
          <span class="name" onClick={this.onClick}>{this.props.name}</span>
          {this.state.open &&
          <ul class="flyout_options">
            {this.props.children}
          </ul>
          }
        </div>;
    }
});
 
React.renderComponent(
  <Menu name="Color">
    <li>a</li>
  </Menu>,
  document.body
);