ze-react-component-library/es/components/CheckboxGroup/index.js

ZeroETP React Component Library

import "antd/es/checkbox/style";
import _Checkbox from "antd/es/checkbox";

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

import React, { useState } from "react";

var CheckboxGroup = function CheckboxGroup(_a) {
  var _b = _a.value,
      value = _b === void 0 ? [] : _b,
      _onChange = _a.onChange,
      _c = _a.options,
      _options = _c === void 0 ? [] : _c;

  var options = _options.map(function (o) {
    if (_typeof(o) === "object") {
      return o;
    }

    return {
      value: o,
      label: o
    };
  });

  var _d = useState(value.length > 0 && value.length < options.length),
      indeterminate = _d[0],
      setIndeterminate = _d[1];

  var _e = useState(options.length > 0 && value.length === options.length),
      checkAll = _e[0],
      setCheckAll = _e[1];

  var onChange = function onChange(list) {
    _onChange === null || _onChange === void 0 ? void 0 : _onChange(list);
    setIndeterminate(!!list.length && list.length < options.length);
    setCheckAll(list.length === options.length);
  };

  var onCheckAllChange = function onCheckAllChange(e) {
    console.log(options);
    _onChange === null || _onChange === void 0 ? void 0 : _onChange(e.target.checked ? options.map(function (o) {
      return o.value;
    }) : []);
    setIndeterminate(false);
    setCheckAll(e.target.checked);
  };

  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_Checkbox, {
    indeterminate: indeterminate,
    onChange: onCheckAllChange,
    checked: checkAll
  }, "\u5168\u9009"), /*#__PURE__*/React.createElement(_Checkbox.Group, {
    options: options,
    value: value,
    onChange: onChange
  }));
};

export default CheckboxGroup;