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

React components that implement Google's Material Design.

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";

/**
 * @ignore - do not document.
 */
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import withStyles from '../styles/withStyles';
import CheckboxGroupStandalone from './CheckboxGroupStandalone';
import FormHelperText from '../FormHelperText';
import FormControl from '../FormControl';
import FormLabel from '../FormLabel';
import { withFormsy, propTypes } from 'formsy-react';
import { compose } from 'recompose';
import withFormItem from '../Form/withFormItem';
import withForm from '../Form/withForm';
import omit from '../utils/omit';

const style = theme => ({
  formHelpTextContainer: {
    marginTop: '-8px',
    minHeight: '12px'
  },
  formHelperTextRoot: {
    marginTop: 0
  }
});

class CheckboxGroup extends Component {
  constructor(...args) {
    super(...args);

    this.onChange = (event, value) => {
      // setValue() will set the value of the component, which in
      // turn will validate it and the rest of the form
      // Important: Don't skip this step. This pattern is required
      // for Formsy to work.
      this.props.setValue(value);
      const {
        onChange
      } = this.props;
      onChange && onChange(event, value);
    };
  }

  renderFormComponent() {
    const _this$props = this.props,
          {
      classes,
      getErrorMessage,
      getValue,
      isFormDisabled,
      isValid,
      isPristine,
      children,
      formInputRef
    } = _this$props,
          rest = _objectWithoutPropertiesLoose(_this$props, ["classes", "getErrorMessage", "getErrorMessages", "getValue", "hasValue", "isFormDisabled", "isValid", "isPristine", "isFormSubmitted", "isRequired", "isValidValue", "resetValue", "setValidations", "setValue", "showRequired", "showError", "validationError", "validationErrors", "validations", "innerRef", "value", "onChange", "children", "formInputRef"]);

    let error = false;
    let helperText = null;
    const isDisabled = isFormDisabled();

    if (!isDisabled) {
      if (!isPristine()) {
        helperText = getErrorMessage();
        error = !isValid();
      }
    }

    const helpTextClasses = {
      root: classes.formHelperTextRoot
    };
    const restClasses = omit(classes, ['formHelpTextContainer', 'formHelperTextRoot']);
    return React.createElement(FormControl, {
      component: "fieldset",
      required: this.props.required,
      error: error
    }, this.props.label && React.createElement(FormLabel, {
      component: "legend"
    }, this.props.label), React.createElement(CheckboxGroupStandalone, _extends({
      classes: restClasses,
      value: getValue(),
      disabled: isDisabled,
      onChange: this.onChange,
      ref: formInputRef
    }, rest), children), React.createElement("div", {
      className: classes.formHelpTextContainer
    }, error && React.createElement(FormHelperText, {
      classes: helpTextClasses,
      error: true
    }, helperText)));
  }

  render() {
    return this.renderFormComponent();
  }

}

CheckboxGroup.displayName = 'CheckboxGroup';
process.env.NODE_ENV !== "production" ? CheckboxGroup.propTypes = _extends({
  classes: PropTypes.object.isRequired
}, propTypes) : void 0;
CheckboxGroup.defaultProps = {
  formInputRef: React.createRef()
};
const FormComponent = compose(withFormsy, withFormItem, withStyles(style, {
  name: 'RMCheckboxGroup'
}))(CheckboxGroup);
export default compose(withForm)(FormComponent, CheckboxGroupStandalone);