@6thquake/react-material/es/CheckboxGroup/CheckboxGroupStandalone.js

React components that implement Google's Material Design.

import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import withStyles from '../styles/withStyles';
import FormGroup from '../FormGroup';

const style = theme => ({});

class CheckboxGroupStandalone extends Component {
  constructor(...args) {
    super(...args);
    this.checkboxs = [];

    this.onChange = (event, checked) => {
      const value = event.target.value;
      const v = this.props.value;
      let values = v ? v.split(',') : [];

      if (checked) {
        values.push(value);
      } else {
        values = values.filter(v => v !== value);
      }

      this.props.onChange(event, values.join(','));
    };
  }

  render() {
    const _this$props = this.props,
          {
      value,
      name,
      children
    } = _this$props,
          rest = _objectWithoutPropertiesLoose(_this$props, ["classes", "value", "name", "children", "onChange"]);

    this.checkboxs = [];
    return React.createElement(FormGroup, rest, React.Children.map(children, (child, index) => {
      if (!React.isValidElement(child)) {
        return null;
      }

      const v = value ? value.split(',') : [];
      return React.cloneElement(child, {
        key: index,
        name,
        inputRef: node => {
          if (node) {
            this.checkboxs.push(node);
          }
        },
        checked: v.includes(child.props.value),
        onChange: this.onChange
      });
    }));
  }

}

process.env.NODE_ENV !== "production" ? CheckboxGroupStandalone.propTypes = {
  classes: PropTypes.object.isRequired
} : void 0;
CheckboxGroupStandalone.defaultProps = {};
export default withStyles(style, {
  name: 'RMCheckboxGroupStandalone'
})(CheckboxGroupStandalone);