@beisen-phoenix/checkbox/cjs/Checkbox.js

"use strict";

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var React = _interopRequireWildcard(require("react"));

var _tooltip = _interopRequireDefault(require("@beisen-phoenix/tooltip"));

require("./style.css");

var _commonUtils = _interopRequireDefault(require("@beisen-phoenix/common-utils"));

var Checkbox =
/*#__PURE__*/
function (_React$PureComponent) {
  (0, _inherits2.default)(Checkbox, _React$PureComponent);

  function Checkbox(props) {
    var _this;

    (0, _classCallCheck2.default)(this, Checkbox);
    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(Checkbox).call(this, props));
    _this.inputRef = React.createRef();
    _this.txtRef = React.createRef();
    _this.containerRef = React.createRef();

    _this.onChange = function (event) {
      var checked = _this.state.checked;
      var _this$props = _this.props,
          onChange = _this$props.onChange,
          disabled = _this$props.disabled,
          restProps = (0, _objectWithoutProperties2.default)(_this$props, ["onChange", "disabled"]);
      if (disabled) return;

      if (!_this.props.partialChecked) {
        _this.setState({
          checked: !checked
        });

        restProps.checked = !checked;
      }

      onChange && onChange(restProps, event);
      event.stopPropagation && event.stopPropagation();
    };

    var _checked = 'checked' in props ? props.checked : props.defaultChecked;

    _this.state = {
      checked: _checked
    };
    return _this;
  }

  (0, _createClass2.default)(Checkbox, [{
    key: "componentWillReceiveProps",
    value: function componentWillReceiveProps(nextProps) {
      'checked' in nextProps && this.setState({
        checked: nextProps.checked
      });
    }
  }, {
    key: "render",
    value: function render() {
      var _this$props2 = this.props,
          disabled = _this$props2.disabled,
          _this$props2$label = _this$props2.label,
          label = _this$props2$label === void 0 ? '' : _this$props2$label,
          partialChecked = _this$props2.partialChecked,
          value = _this$props2.value,
          tipsType = _this$props2.tipsType,
          fontSize = _this$props2.fontSize,
          textColor = _this$props2.textColor;
      var checked = this.state.checked;
      var onChange = this.onChange;
      var inputProps = {
        value: value,
        onChange: onChange
      }; // 生成符合BEM规范的className

      var classes = _commonUtils.default.BEMClass('checkbox');

      var labelCls = classes({
        modifiers: {
          disabled: disabled
        },
        extra: this.props.extraCls
      });
      var boxCls = classes({
        element: 'box',
        modifiers: {
          partialChecked: partialChecked
        }
      });
      var inputCls = classes({
        element: 'input',
        modifiers: {
          disabled: disabled
        }
      });
      var realCls = classes({
        element: 'realInput',
        modifiers: {
          checked: checked,
          disabled: disabled,
          partialChecked: partialChecked,
          disabledChecked: disabled && checked
        }
      });
      var tipCls = classes({
        element: 'tooltip',
        extra: this.props.extraCls
      });
      var txtCls = classes({
        element: 'text',
        modifiers: {
          disabled: disabled,
          fontMiddle: fontSize === 'middle'
        },
        extra: "color-".concat(textColor)
      });
      return React.createElement("label", {
        className: labelCls,
        ref: this.containerRef
      }, React.createElement("span", {
        className: boxCls
      }, React.createElement("input", (0, _extends2.default)({
        type: "checkbox",
        ref: this.inputRef
      }, inputProps, {
        className: inputCls
      })), React.createElement("span", {
        className: realCls
      })), label ? tipsType === 'animate' ? React.createElement(_tooltip.default, {
        extraCls: tipCls,
        showOverflowTooltip: true,
        title: label
      }, React.createElement("span", {
        className: txtCls,
        ref: this.txtRef
      }, label)) : React.createElement("span", {
        className: txtCls,
        title: label,
        ref: this.txtRef
      }, label) : null);
    }
  }]);
  return Checkbox;
}(React.PureComponent);

exports.default = Checkbox;
Checkbox.defaultProps = {
  disabled: false,
  defaultChecked: false,
  label: '',
  tipsType: 'animate',
  fontSize: 'normal',
  textColor: 'M1'
};