Интерфейс реакт-миксина для работы с классами в стиле БЭМ

bemify-classname.js

/**
 * <div class="block">
 *  <div class="block__foo">
 *    <div class="block__bar block__bar_green">
 *      <div class="another-block__bar"></div>
 *    </div>
 *    <div class="block block_cool"></div>
 *  </div>
 * </div>
 */

React.createClass({
    mixins: [bemifyClassName],

    displayName: 'block',

    render() {
        return <div class="{this.b}">
            <div class="{this.b.e('foo')}">
                // элемент + его модификатор (помним, что модификатора без самого элемента не бывает по смыслу, иначе — это другой элемент)
                <div class="{this.b.e('bar').m('green')}">
                    // захотелось странного — сгенерировать класс от другого блока
                    <div class="{this.b('another-block').e('bar')}">
                </div>
                // текущий блок и его модификатор
                <div class="{this.b.m('cool')}"></div>
            </div>
        </div>;
    }
})