import { _ as _slicedToArray } from '../_verture/slicedToArray-76060636.js';
import { useState, useEffect, createElement } from 'react';
import { jsxs, jsx } from 'react/jsx-runtime';
import { Checkbox } from '../Checkbox/index.js';
import Label from '../Label/index.js';
import HelperText from '../HelperText/index.js';
import { DeepClone } from '@iam-com/lib';
import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
import '../_verture/unsupportedIterableToArray-cb478f24.js';
import '../_verture/tslib.es6-55ed4bd2.js';
import '../Help/index.js';
import '../Tooltip/index.js';
import 'rc-tooltip';
import 'rc-tooltip/lib/placements';
import 'clsx';
import '@iam-com/icons/Help';

var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-checkbox-group {\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n  width: 100%;\n}\n.paraui-v3-checkbox-group > .checkbox-group-label {\n  margin-bottom: 4px;\n}\n.paraui-v3-checkbox-group > .checkbox-group-content {\n  line-height: 0;\n}\n.paraui-v3-checkbox-group > .checkbox-group-content > .paraui-v3-checkbox {\n  margin-top: 8px;\n  margin-bottom: 4px;\n}\n.paraui-v3-checkbox-group.paraui-v3-checkbox-group-column > .checkbox-group-content {\n  display: flex;\n  flex-direction: column;\n}";
styleInject(css_248z);

var CheckboxGroup = function CheckboxGroup(props) {
  var _props$label = props.label,
    label = _props$label === void 0 ? '' : _props$label,
    labelTooltip = props.labelTooltip,
    _props$spacing = props.spacing,
    spacing = _props$spacing === void 0 ? '28px' : _props$spacing,
    _props$size = props.size,
    size = _props$size === void 0 ? 'large' : _props$size,
    _props$row = props.row,
    row = _props$row === void 0 ? true : _props$row,
    _props$disabled = props.disabled,
    disabled = _props$disabled === void 0 ? false : _props$disabled,
    _props$required = props.required,
    required = _props$required === void 0 ? false : _props$required,
    _props$error = props.error,
    error = _props$error === void 0 ? false : _props$error,
    hideErrorDom = props.hideErrorDom,
    _props$helperText = props.helperText,
    helperText = _props$helperText === void 0 ? '' : _props$helperText,
    _props$id = props.id,
    id = _props$id === void 0 ? 'name' : _props$id,
    list = props.list,
    _props$className = props.className,
    className = _props$className === void 0 ? '' : _props$className,
    onChange = props.onChange,
    style = props.style;
  var _useState = useState([]),
    _useState2 = _slicedToArray(_useState, 2),
    valueCom = _useState2[0],
    setValueCom = _useState2[1];
  useEffect(function () {
    if (props.defaultValue !== undefined) setValueCom(props.defaultValue);
  }, []);
  useEffect(function () {
    if (props.value !== undefined) setValueCom(props.value);
  }, [props.value]);
  /**
   *
   * @param item 点击当前项数据
   * @event 点击元素
   * @checked 当前值
   */
  var onchangeCom = function onchangeCom(item) {
    return function (event, checked) {
      var name = item[id]; // 值
      var arr = DeepClone(valueCom);
      if (checked) {
        arr.push(name);
      } else {
        var index = arr.indexOf(name);
        arr.splice(index, 1);
      }
      if (props.value === undefined) setValueCom(arr);
      onChange && onChange(arr);
    };
  };
  var handLabel = function handLabel() {
    if (label || required) {
      var handLabelClass = function handLabelClass() {
        var str = 'checkbox-group-label';
        if (labelTooltip && labelTooltip.className) {
          str += ' ' + labelTooltip.className;
        }
        return str;
      };
      return jsx(Label, Object.assign({
        label: label,
        required: required
      }, labelTooltip, {
        className: handLabelClass()
      }));
    }
    return null;
  };
  /**
   * @description 处理单选框每一项样式
   * */
  var handStyleItem = function handStyleItem(item, index) {
    var obj = Object.assign({}, item.style);
    if (spacing && row && list.length !== index + 1) {
      obj.marginRight = spacing;
    }
    return obj;
  };
  // 处理class
  var handClass = function handClass() {
    var str = $prefixCls + '-checkbox-group';
    if (className) str += ' ' + className;
    if (size) str += " ".concat($prefixCls, "-checkbox-group-").concat(size);
    if (error) str += " ".concat($prefixCls, "-checkbox-group-error");
    if (disabled) str += " ".concat($prefixCls, "-checkbox-group-disabled");
    if (row) str += " ".concat($prefixCls, "-checkbox-group-row");else str += " ".concat($prefixCls, "-checkbox-group-column");
    return str;
  };
  return jsxs("div", Object.assign({
    className: handClass(),
    style: style
  }, {
    children: [handLabel(), jsx("div", Object.assign({
      className: "checkbox-group-content"
    }, {
      children: list.map(function (item, index) {
        return /*#__PURE__*/createElement(Checkbox, Object.assign({}, item, {
          style: handStyleItem(item, index),
          checked: valueCom.indexOf(item[id]) !== -1,
          size: size,
          disabled: Boolean(disabled || item.disabled),
          key: index,
          onChange: onchangeCom(item)
        }));
      })
    })), jsx(HelperText, {
      className: "checkbox-group-error-text",
      error: error,
      helperText: helperText,
      hideErrorDom: hideErrorDom
    })]
  }));
};

export { CheckboxGroup, CheckboxGroup as default };
