@ant-design/pro-components 3.1.0-0 → 3.1.1-1

package/lib/form/components/FieldSet/index.js

@@ -7,9 +7,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 exports.defaultGetValueFromEvent = defaultGetValueFromEvent;
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _util = require("@rc-component/util");
 var _antd = require("antd");
 var _react = _interopRequireWildcard(require("react"));
@@ -17,116 +14,111 @@ var _utils = require("../../../utils");
 var _helpers = require("../../helpers");
 var _warpField = _interopRequireDefault(require("../FormItem/warpField"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _ref3;
-var _excluded = ["children", "value", "valuePropName", "onChange", "fieldProps", "space", "type", "transform", "convertValue", "lightProps"],
-  _excluded2 = ["children", "space", "valuePropName"];
-var FieldSetType = {
+const FieldSetType = {
   space: _antd.Space,
   group: _antd.Space.Compact
 };
-function defaultGetValueFromEvent(valuePropName) {
-  var event = arguments.length <= 1 ? undefined : arguments[1];
+function defaultGetValueFromEvent(valuePropName, ...args) {
+  const event = args[0];
   if (event && event.target && valuePropName in event.target) {
     // @ts-ignore
     return event.target[valuePropName];
   }
   return event;
 }
-var FieldSet = function FieldSet(props) {
-  var children = props.children,
-    _props$value = props.value,
-    value = _props$value === void 0 ? [] : _props$value,
-    valuePropName = props.valuePropName,
-    onChange = props.onChange,
-    fieldProps = props.fieldProps,
-    space = props.space,
-    _props$type = props.type,
-    type = _props$type === void 0 ? 'space' : _props$type,
-    transform = props.transform,
-    convertValue = props.convertValue,
-    lightProps = props.lightProps,
-    rest = (0, _objectWithoutProperties2.default)(props, _excluded);
+const FieldSet = props => {
+  const {
+    children,
+    value = [],
+    valuePropName,
+    onChange,
+    fieldProps,
+    space,
+    type = 'space',
+    transform,
+    convertValue,
+    lightProps,
+    ...rest
+  } = props;
   /**
    * 使用方法的引用防止闭包
    *
    * @param fileValue
    * @param index
    */
-  var fieldSetOnChange = (0, _utils.useRefFunction)(function (fileValue, index) {
-    var _fieldProps$onChange;
-    var newValues = (0, _toConsumableArray2.default)(value);
+  const fieldSetOnChange = (0, _utils.useRefFunction)((fileValue, index) => {
+    const newValues = [...value];
     newValues[index] = defaultGetValueFromEvent(valuePropName || 'value', fileValue);
-    onChange === null || onChange === void 0 || onChange(newValues);
-    fieldProps === null || fieldProps === void 0 || (_fieldProps$onChange = fieldProps.onChange) === null || _fieldProps$onChange === void 0 || _fieldProps$onChange.call(fieldProps, newValues);
+    onChange?.(newValues);
+    fieldProps?.onChange?.(newValues);
   });
-  var itemIndex = -1;
-  var list = (0, _util.toArray)((0, _utils.runFunction)(children, value, props)).map(function (item) {
+  let itemIndex = -1;
+  const list = (0, _util.toArray)((0, _utils.runFunction)(children, value, props)).map(item => {
     if ( /*#__PURE__*/_react.default.isValidElement(item)) {
-      var _item$type, _item$props, _item$props2;
       itemIndex += 1;
-      var index = itemIndex;
-      var isProFromItem =
+      const index = itemIndex;
+      const isProFromItem =
       // @ts-ignore
-      (item === null || item === void 0 || (_item$type = item.type) === null || _item$type === void 0 ? void 0 : _item$type.displayName) === 'ProFormComponent' || (item === null || item === void 0 || (_item$props = item.props) === null || _item$props === void 0 ? void 0 : _item$props.readonly);
-      var forkProps = isProFromItem ? (0, _objectSpread2.default)((0, _objectSpread2.default)({
+      item?.type?.displayName === 'ProFormComponent' || item?.props?.readonly;
+      const forkProps = isProFromItem ? {
         key: index,
-        ignoreFormItem: true
-      }, item.props || {}), {}, {
+        ignoreFormItem: true,
+        ...(item.props || {}),
         // 如果不是我们自定义的组件 fieldProps 无法识别
-        fieldProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, item === null || item === void 0 || (_item$props2 = item.props) === null || _item$props2 === void 0 ? void 0 : _item$props2.fieldProps), {}, {
-          onChange: function onChange() {
-            fieldSetOnChange(arguments.length <= 0 ? undefined : arguments[0], index);
+        fieldProps: {
+          ...item?.props?.fieldProps,
+          onChange: (...restParams) => {
+            fieldSetOnChange(restParams[0], index);
           }
-        }),
-        value: value === null || value === void 0 ? void 0 : value[index],
+        },
+        value: value?.[index],
         onChange: undefined
-      }) : (0, _objectSpread2.default)((0, _objectSpread2.default)({
-        key: index
-      }, item.props || {}), {}, {
-        value: value === null || value === void 0 ? void 0 : value[index],
-        onChange: function onChange(itemValue) {
-          var _props$onChange, _props;
+      } : {
+        key: index,
+        ...(item.props || {}),
+        value: value?.[index],
+        onChange: itemValue => {
           fieldSetOnChange(itemValue, index);
-          (_props$onChange = (_props = item.props).onChange) === null || _props$onChange === void 0 || _props$onChange.call(_props, itemValue);
+          item.props.onChange?.(itemValue);
         }
-      });
+      };
       return /*#__PURE__*/_react.default.cloneElement(item, forkProps);
     }
     return item;
   });
-  var Components = FieldSetType[type];
-  var _useGridHelpers = (0, _helpers.useGridHelpers)(rest),
-    RowWrapper = _useGridHelpers.RowWrapper;
-  var Wrapper = (0, _react.useCallback)(function (_ref) {
-    var dom = _ref.children;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Components, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, space), {}, {
-      align: "start",
-      wrap: true,
-      children: dom
-    }));
-  }, [Components, space]);
+  const Components = FieldSetType[type];
+  const {
+    RowWrapper
+  } = (0, _helpers.useGridHelpers)(rest);
+  const Wrapper = (0, _react.useCallback)(({
+    children: dom
+  }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(Components, {
+    ...space,
+    align: "start",
+    wrap: true,
+    children: dom
+  }), [Components, space]);
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(RowWrapper, {
     Wrapper: Wrapper,
     children: list
   });
 };
-var BaseProFormFieldSet = /*#__PURE__*/_react.default.forwardRef(function (_ref2, ref) {
-  var children = _ref2.children,
-    space = _ref2.space,
-    valuePropName = _ref2.valuePropName,
-    rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded2);
-  (0, _react.useImperativeHandle)(ref, function () {
-    return {};
-  });
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(FieldSet, (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({
+const BaseProFormFieldSet = /*#__PURE__*/_react.default.forwardRef(({
+  children,
+  space,
+  valuePropName,
+  ...rest
+}, ref) => {
+  (0, _react.useImperativeHandle)(ref, () => ({}));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(FieldSet, {
     space: space,
-    valuePropName: valuePropName
-  }, rest.fieldProps), {}, {
+    valuePropName: valuePropName,
+    ...rest.fieldProps,
     // 把 fieldProps 里的重置掉
-    onChange: undefined
-  }, rest), {}, {
+    onChange: undefined,
+    ...rest,
     children: children
-  }));
+  });
 });
-var ProFormFieldSet = (_ref3 = _warpField.default) === null || _ref3 === void 0 ? void 0 : _ref3(BaseProFormFieldSet);
+const ProFormFieldSet = (0, _warpField.default)?.(BaseProFormFieldSet);
 var _default = exports.default = ProFormFieldSet;

package/lib/form/components/FormItem/FormItemRender/index.js

@@ -10,41 +10,45 @@ exports.pickControlProps = pickControlProps;
 exports.pickControlPropsWithId = pickControlPropsWithId;
 exports.useControlModel = useControlModel;
 exports.withFormItemRender = withFormItemRender;
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _objectSpread3 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _antd = require("antd");
 var _react = _interopRequireDefault(require("react"));
 var _index = _interopRequireDefault(require("../index"));
 var _jsxRuntime = require("react/jsx-runtime");
-var _excluded = ["children"],
-  _excluded2 = ["children"];
-function getControlConfigProps() {
-  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-  var valuePropName = props.valuePropName || 'value';
-  var trigger = props.trigger || 'onChange';
-  var name = props.name;
+function getControlConfigProps(props = {}) {
+  const valuePropName = props.valuePropName || 'value';
+  const trigger = props.trigger || 'onChange';
+  const name = props.name;
   return {
-    valuePropName: valuePropName,
-    trigger: trigger,
-    name: name
+    valuePropName,
+    trigger,
+    name
   };
 }
-function useControlModel(_ref, model) {
-  var value = _ref.value,
-    onChange = _ref.onChange;
+function useControlModel({
+  value,
+  onChange
+}, model) {
   if (!Array.isArray(model)) {
-    var p = getControlConfigProps(model);
-    return (0, _defineProperty2.default)((0, _defineProperty2.default)({}, p.valuePropName, value), p.trigger, function (e) {
-      onChange === null || onChange === void 0 || onChange(e !== null && e !== void 0 && e.target ? e.target[p.valuePropName] : e);
-    });
+    const p = getControlConfigProps(model);
+    return {
+      [p.valuePropName]: value,
+      [p.trigger]: e => {
+        onChange?.(e?.target ? e.target[p.valuePropName] : e);
+      }
+    };
   }
-  return model.reduce(function (acc, k) {
-    var p = getControlConfigProps(k);
-    var name = p.name || k;
-    acc[name] = (0, _defineProperty2.default)((0, _defineProperty2.default)({}, p.valuePropName, value === null || value === void 0 ? void 0 : value[name]), p.trigger, function (v) {
-      onChange === null || onChange === void 0 || onChange((0, _objectSpread3.default)((0, _objectSpread3.default)({}, value), {}, (0, _defineProperty2.default)({}, name, v !== null && v !== void 0 && v.target ? v.target[p.valuePropName] : v)));
-    });
+  return model.reduce((acc, k) => {
+    const p = getControlConfigProps(k);
+    const name = p.name || k;
+    acc[name] = {
+      [p.valuePropName]: value?.[name],
+      [p.trigger]: v => {
+        onChange?.({
+          ...value,
+          [name]: v?.target ? v.target[p.valuePropName] : v
+        });
+      }
+    };
     return acc;
   }, {});
 }
@@ -66,17 +70,21 @@ function useControlModel(_ref, model) {
  * ```
  */
 function FormControlRender(props) {
-  var children = props.children,
-    restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
-  var _Form$Item$useStatus = _antd.Form.Item.useStatus(),
-    status = _Form$Item$useStatus.status,
-    errors = _Form$Item$useStatus.errors,
-    warnings = _Form$Item$useStatus.warnings;
-  return children((0, _objectSpread3.default)({
-    status: status,
-    errors: errors,
-    warnings: warnings
-  }, restProps));
+  const {
+    children,
+    ...restProps
+  } = props;
+  const {
+    status,
+    errors,
+    warnings
+  } = _antd.Form.Item.useStatus();
+  return children({
+    status,
+    errors,
+    warnings,
+    ...restProps
+  });
 }
 
 /**
@@ -85,9 +93,7 @@ function FormControlRender(props) {
 function pickControlProps(props) {
   return {
     value: props.value,
-    onChange: function onChange(value) {
-      return props.onChange(value !== null && value !== void 0 && value.target ? value.target.value : value);
-    }
+    onChange: value => props.onChange(value?.target ? value.target.value : value)
   };
 }
 
@@ -95,9 +101,10 @@ function pickControlProps(props) {
  * 提取props中的 value、onChange 和 id 属性
  */
 function pickControlPropsWithId(props) {
-  return (0, _objectSpread3.default)((0, _objectSpread3.default)({}, pickControlProps(props)), {}, {
+  return {
+    ...pickControlProps(props),
     id: props.id
-  });
+  };
 }
 
 /**
@@ -119,13 +126,16 @@ function pickControlPropsWithId(props) {
  */
 function withFormItemRender(Comp) {
   return function (props) {
-    var children = props.children,
-      restProps = (0, _objectWithoutProperties2.default)(props, _excluded2);
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, (0, _objectSpread3.default)((0, _objectSpread3.default)({}, restProps), {}, {
+    const {
+      children,
+      ...restProps
+    } = props;
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(Comp, {
+      ...restProps,
       children: /*#__PURE__*/(0, _jsxRuntime.jsx)(FormControlRender, {
         children: children
       })
-    }));
+    });
   };
 }
 
@@ -145,7 +155,7 @@ function withFormItemRender(Comp) {
  *   </FormItemRender>
  * ```
  */
-var FormItemRender = exports.FormItemRender = withFormItemRender(_antd.Form.Item);
+const FormItemRender = exports.FormItemRender = withFormItemRender(_antd.Form.Item);
 
 /**
  * 用 withFormItemRender 加工 ProForm.Item，使其拥有render props能力，同时暴露出 status 属性方便自定义组件校验使用
@@ -162,4 +172,4 @@ var FormItemRender = exports.FormItemRender = withFormItemRender(_antd.Form.Item
  *   </ProFormItemRender>
  * ```
  */
-var ProFormItemRender = exports.ProFormItemRender = withFormItemRender(_index.default);
+const ProFormItemRender = exports.ProFormItemRender = withFormItemRender(_index.default);

package/lib/form/components/FormItem/Group/index.js

@@ -1,126 +1,128 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _icons = require("@ant-design/icons");
+var _util = require("@rc-component/util");
 var _antd = require("antd");
-var _classnames = _interopRequireDefault(require("classnames"));
+var _clsx = require("clsx");
 var _react = _interopRequireWildcard(require("react"));
 var _utils = require("../../../../utils");
 var _FieldContext = _interopRequireDefault(require("../../../FieldContext"));
 var _grid = require("../../../helpers/grid");
 var _style = require("./style");
 var _jsxRuntime = require("react/jsx-runtime");
-var Group = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  var _React$useContext = _react.default.useContext(_FieldContext.default),
-    groupProps = _React$useContext.groupProps;
-  var _groupProps$props = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, groupProps), props),
-    children = _groupProps$props.children,
-    collapsible = _groupProps$props.collapsible,
-    defaultCollapsed = _groupProps$props.defaultCollapsed,
-    style = _groupProps$props.style,
-    labelLayout = _groupProps$props.labelLayout,
-    _groupProps$props$tit = _groupProps$props.title,
-    title = _groupProps$props$tit === void 0 ? props.label : _groupProps$props$tit,
-    tooltip = _groupProps$props.tooltip,
-    _groupProps$props$ali = _groupProps$props.align,
-    align = _groupProps$props$ali === void 0 ? 'start' : _groupProps$props$ali,
-    direction = _groupProps$props.direction,
-    _groupProps$props$siz = _groupProps$props.size,
-    size = _groupProps$props$siz === void 0 ? 32 : _groupProps$props$siz,
-    titleStyle = _groupProps$props.titleStyle,
-    titleRender = _groupProps$props.titleRender,
-    spaceProps = _groupProps$props.spaceProps,
-    extra = _groupProps$props.extra,
-    autoFocus = _groupProps$props.autoFocus;
-  var _useMountMergeState = (0, _utils.useMountMergeState)(function () {
-      return defaultCollapsed || false;
-    }, {
-      value: props.collapsed,
-      onChange: props.onCollapse
-    }),
-    _useMountMergeState2 = (0, _slicedToArray2.default)(_useMountMergeState, 2),
-    collapsed = _useMountMergeState2[0],
-    setCollapsed = _useMountMergeState2[1];
-  var _useContext = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext),
-    getPrefixCls = _useContext.getPrefixCls;
-  var _useGridHelpers = (0, _grid.useGridHelpers)(props),
-    ColWrapper = _useGridHelpers.ColWrapper,
-    RowWrapper = _useGridHelpers.RowWrapper;
-  var className = getPrefixCls('pro-form-group');
-  var _useStyle = (0, _style.useStyle)(className),
-    wrapSSR = _useStyle.wrapSSR,
-    hashId = _useStyle.hashId;
-  var collapsibleButton = collapsible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.RightOutlined, {
+const Group = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+  const {
+    groupProps
+  } = _react.default.useContext(_FieldContext.default);
+  const {
+    children,
+    collapsible,
+    defaultCollapsed,
+    style,
+    labelLayout,
+    title = props.label,
+    tooltip,
+    align = 'start',
+    direction,
+    size = 32,
+    titleStyle,
+    titleRender,
+    spaceProps,
+    extra,
+    autoFocus
+  } = {
+    ...groupProps,
+    ...props
+  };
+  const [collapsed, setCollapsedInner] = (0, _util.useControlledState)(() => defaultCollapsed || false, props.collapsed);
+  const setCollapsed = (0, _react.useCallback)(updater => {
+    setCollapsedInner(prev => {
+      const next = typeof updater === 'function' ? updater(prev) : updater;
+      props.onCollapse?.(next);
+      return next;
+    });
+  }, [props.onCollapse]);
+  const {
+    getPrefixCls
+  } = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext);
+  const {
+    ColWrapper,
+    RowWrapper
+  } = (0, _grid.useGridHelpers)(props);
+  const className = getPrefixCls('pro-form-group');
+  const {
+    wrapSSR,
+    hashId
+  } = (0, _style.useStyle)(className);
+  const collapsibleButton = collapsible && /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.RightOutlined, {
     style: {
       marginInlineEnd: 8
     },
     rotate: !collapsed ? 90 : undefined
   });
-  var label = /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.LabelIconTip, {
+  const label = /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.LabelIconTip, {
     label: collapsibleButton ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
       children: [collapsibleButton, title]
     }) : title,
     tooltip: tooltip
   });
-  var Wrapper = (0, _react.useCallback)(function (_ref) {
-    var dom = _ref.children;
-    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Space, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, spaceProps), {}, {
-      className: (0, _classnames.default)("".concat(className, "-container ").concat(hashId), spaceProps === null || spaceProps === void 0 ? void 0 : spaceProps.className),
-      size: size,
-      align: align,
-      orientation: direction,
-      style: (0, _objectSpread2.default)({
-        rowGap: 0
-      }, spaceProps === null || spaceProps === void 0 ? void 0 : spaceProps.style),
-      children: dom
-    }));
-  }, [align, className, direction, hashId, size, spaceProps]);
-  var titleDom = titleRender ? titleRender(label, props) : label;
-  var _useMemo = (0, _react.useMemo)(function () {
-      var hiddenChildren = [];
-      var childrenList = _react.default.Children.toArray(children).map(function (element, index) {
-        var _element$props;
-        if ( /*#__PURE__*/_react.default.isValidElement(element) && element !== null && element !== void 0 && (_element$props = element.props) !== null && _element$props !== void 0 && _element$props.hidden) {
-          hiddenChildren.push(element);
-          return null;
-        }
-        if (index === 0 && /*#__PURE__*/_react.default.isValidElement(element) && autoFocus) {
-          return /*#__PURE__*/_react.default.cloneElement(element, (0, _objectSpread2.default)((0, _objectSpread2.default)({}, element.props), {}, {
-            autoFocus: autoFocus
-          }));
-        }
-        return element;
-      });
-      return [/*#__PURE__*/(0, _jsxRuntime.jsx)(RowWrapper, {
-        Wrapper: Wrapper,
-        children: childrenList
-      }, "children"), hiddenChildren.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        style: {
-          display: 'none'
-        },
-        children: hiddenChildren
-      }) : null];
-    }, [children, RowWrapper, Wrapper, autoFocus]),
-    _useMemo2 = (0, _slicedToArray2.default)(_useMemo, 2),
-    childrenDoms = _useMemo2[0],
-    hiddenDoms = _useMemo2[1];
+  const Wrapper = (0, _react.useCallback)(({
+    children: dom
+  }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Space, {
+    ...spaceProps,
+    className: (0, _clsx.clsx)(`${className}-container ${hashId}`, spaceProps?.className),
+    size: size,
+    align: align,
+    orientation: direction,
+    style: {
+      rowGap: 0,
+      ...spaceProps?.style
+    },
+    children: dom
+  }), [align, className, direction, hashId, size, spaceProps]);
+  const titleDom = titleRender ? titleRender(label, props) : label;
+  const [childrenDoms, hiddenDoms] = (0, _react.useMemo)(() => {
+    const hiddenChildren = [];
+    const childrenList = _react.default.Children.toArray(children).map((element, index) => {
+      if ( /*#__PURE__*/_react.default.isValidElement(element) && element?.props?.hidden) {
+        hiddenChildren.push(element);
+        return null;
+      }
+      if (index === 0 && /*#__PURE__*/_react.default.isValidElement(element) && autoFocus) {
+        return /*#__PURE__*/_react.default.cloneElement(element, {
+          ...element.props,
+          autoFocus
+        });
+      }
+      return element;
+    });
+    return [/*#__PURE__*/(0, _jsxRuntime.jsx)(RowWrapper, {
+      Wrapper: Wrapper,
+      children: childrenList
+    }, "children"), hiddenChildren.length > 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      style: {
+        display: 'none'
+      },
+      children: hiddenChildren
+    }) : null];
+  }, [children, RowWrapper, Wrapper, autoFocus]);
   return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsx)(ColWrapper, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: (0, _classnames.default)(className, hashId, (0, _defineProperty2.default)({}, "".concat(className, "-twoLine"), labelLayout === 'twoLine')),
+      className: (0, _clsx.clsx)(className, hashId, {
+        [`${className}-twoLine`]: labelLayout === 'twoLine'
+      }),
       style: style,
       ref: ref,
       children: [hiddenDoms, (title || tooltip || extra) && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: "".concat(className, "-title ").concat(hashId).trim(),
+        className: `${className}-title ${hashId}`.trim(),
         style: titleStyle,
-        onClick: function onClick() {
+        onClick: () => {
           setCollapsed(!collapsed);
         },
         children: extra ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
@@ -131,9 +133,7 @@ var Group = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
             justifyContent: 'space-between'
           },
           children: [titleDom, /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-            onClick: function onClick(e) {
-              return e.stopPropagation();
-            },
+            onClick: e => e.stopPropagation(),
             children: extra
           })]
         }) : titleDom