Данные Child в Parent undefined

Пытаюсь извлечь данные из компонента ColorChild при помощи функции setNewColor которую передаю в props

class Color extends React.Component {
    constructor(props) {
        super(props);
        this.state={
            currentColor: null
        }
        this.setNewColor = this.setNewColor.bind(this, true)
    }

    renderColors(color, index) {
        return (
            //ПЕРЕДАЮ ФУНКЦИЮ setNewColor В КОМПОНЕНТ ColorChild
            <ColorChild key={index} color={color} setNewColor={this.setNewColor} />
        )
    }
    setNewColor(color){
        console.log('setNewColor', color.name);
    }

    render() {
        const {color} = this.props
        return (
            <div className="product-item__block">
                <span className="product-item__title">Color</span>
                <div className="product-set">
                    {color.map((color, index) => this.renderColors(color, index))}
                </div>
            </div>
        );
    }
}

class ColorChild extends React.Component {
    constructor(props) {
        super(props);
        this.sendColor = this.sendColor.bind(this)
    }
    sendColor(color){
        //ПЕРЕДАЮ ДАННЫЕ В РОДИТЕЛЯ
        this.props.setNewColor(color)
    }

    render() {
        const {color} = this.props
        return (
            <span onClick={() => this.sendColor(color)}
                  style={{backgroundColor : color.color}}
                  className={`product-set__item color ${(color.active ? 'active': '')}`}/>

        );
    }
}

В компоненте ColorChild использую функцию, она выполняется, но входной параметр undefined.

P.S делаю по аналогии http://jsbin.com/tipixiy/edit?js,output