const bemmer = require('bemmer');
 
const builder = bemmer.createBuilder('todoList', 'externalClassName');
 
builder('__items');
// => "todoList__items externalClassName__items"
 
builder('__items__item', { finished: true });
// => "todoList__items__item todoList__items__item--finished" +
//    "externalClassName__items__item externalClassName__items__item--finished"

// ES2015 imports
import bemmer from 'bemmer';
 
// ES5 require
const bemmer = require('bemmer');

const builder = bemmer.createBuilder('todoList');
 
// can plural arguments, use with React
const builder = bemmer.createBuilder('todoList', this.props.className);
 
// parse a BEM-like full classname
const builder = bemmer.createBuilder('todoList__item--finished');

const builder = bemmer.createBuilder('todoList', 'main__todoList');
 
builder('__item', { odd: true });
// => "todoList__item todoList__item--odd main__todoList__item main__todoList__item--odd"

const TodoList = React.createClass({
  render() {
    const b = bemmer.createBuilder('todoList', this.props.className);
    const listItems = this.props.listItems.map((listItem, i) => {
      return (
        <li className={b('item', { odd: i % 2 === 1 })}>
          <span className={b('item__title')}>
            {listItem.title}
          </span>
 
          <span className={b('item__createdAt')}>
            {listItem.createdAt}
          </span>
        </li>
      );
    });
 
    return (
      <ul className={b()}>
        {listItems}
      </ul>
    );
  },
});