Edit in JSFiddle

var Button = React.createClass({
    getDefaultProps: function() {
        return {
            actived: false,
            onClick: function() {}
        };
    },
    render: function() {
        className = "button"
        className += this.props.actived ? ' actived' : '';
        return <div className={className} onClick={this.props.onClick}></div>;
    }
});

var ButtonGroup = React.createClass({
    getDefaultProps: function() {
        return {
            status: [],
            onButtonClick: function() {}
        };
    },
    render: function() {
        var that = this;
        buttons = this.props.status.map(function(curr, i) {
            var onClick = function() { that.props.onButtonClick(i); };
            return <Button key={i} onClick={onClick} actived={that.props.status[i]}/>
        });
        return <div className="button-group">{buttons}</div>
    }
});

var App = React.createClass({
    getInitialState: function() {
        return {
            groups: [
                [false, false, false],
                [false, false, true, false]
            ]
        };
    },
    onButtonClick: function(i) {
        group = this.state.groups[0];
        for (j = 0; j < group.length; ++j) {
            if (j === i) {
                group[j] = !group[j];
            } else {
                group[j] = false;
            }
        }
        this.forceUpdate();
    },
    onButtonClick$: function(i) {
        this.state.groups[1][i] = !this.state.groups[1][i];
        this.forceUpdate();
    },
    render: function() {
        return <div>
            <ButtonGroup status={this.state.groups[0]} onButtonClick={this.onButtonClick}/>
            <ButtonGroup status={this.state.groups[1]} onButtonClick={this.onButtonClick$}/>
        </div>
    }
});

React.render(<App/>, document.body);

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

.button {
    display: inline-block;
    width:  3rem;
    height: 3rem;
    margin-right: 0.5rem;
    background-color: #000;
}

.button:last-child {
    margin-right: 0;
}

.actived {
    background-color: #f00;
}