cuz/lib/components/CheckboxGroup/index.js

Front-end modular development kit.

'use strict';

var _interopRequireDefault = require('babel-runtime/helpers/interop-require-default')['default'];

exports.__esModule = true;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _reactBootstrap = require('react-bootstrap');

function getDataFromChild(children) {
  var data = [];
  _reactBootstrap.utils.ValidComponentChildren.forEach(children, function (child) {
    if (child.props.checked === true) {
      data.push(child.props.value);
    }
  });
  return { data: data };
}

var CheckboxGroup = _react2['default'].createClass({
  displayName: 'CheckboxGroup',

  propTypes: {
    max: _react2['default'].PropTypes.number,
    onSelect: _react2['default'].PropTypes.func,
    children: _react2['default'].PropTypes.any
  },

  getDefaultProps: function getDefaultProps() {
    return {
      data: []
    };
  },

  getInitialState: function getInitialState() {
    return getDataFromChild(this.props.children);
  },

  onSelect: function onSelect(event, value) {
    var onSelect = this.props.onSelect;

    var checked = event.target.checked;
    var data = this.state.data.concat();
    var index = data.indexOf(value);
    if (checked && index === -1) {
      data.push(value);
    }
    if (!checked && index !== -1) {
      data.splice(index, 1);
    }
    this.setState({
      data: data
    });
    if (onSelect) onSelect(data);
  },

  renderCheckbox: function renderCheckbox(child) {
    return _react.cloneElement(child, {
      onSelect: this.onSelect
    });
  },

  render: function render() {
    return _react2['default'].createElement(
      'div',
      { className: 'form-inline' },
      _reactBootstrap.utils.ValidComponentChildren.map(this.props.children, this.renderCheckbox)
    );
  }
});

exports['default'] = CheckboxGroup;
module.exports = exports['default'];