@fonixtree/magic-design 0.0.16 → 0.0.17

package/dist/src/components/common/RcCollapse/Collapse.js

@@ -0,0 +1,176 @@
+import { __extends, __spreadArray } from '../../../../my_my_node_modules/tslib/tslib.es6.js';
+import * as React from 'react';
+import classNames from '../../../../my_my_node_modules/classnames/index.js';
+import shallowequal from '../../../../my_my_node_modules/shallowequal/index.js';
+import _default from '../../../../my_my_node_modules/rc-util/lib/Children/toArray.js';
+import CollapsePanel from './Panel.js';
+import collapseMotion from './motionUtil.js';
+import './index.less.js';
+
+function getActiveKeysArray(activeKey) {
+  var currentActiveKey = activeKey;
+
+  if (!Array.isArray(currentActiveKey)) {
+    var activeKeyType = typeof currentActiveKey;
+    currentActiveKey = activeKeyType === 'number' || activeKeyType === 'string' ? [currentActiveKey] : [];
+  }
+
+  return currentActiveKey.map(function (key) {
+    return String(key);
+  });
+}
+
+var Collapse =
+/** @class */
+function (_super) {
+  __extends(Collapse, _super);
+
+  function Collapse(props) {
+    var _this = _super.call(this, props) || this;
+
+    _this.onClickItem = function (key) {
+      var activeKey = _this.state.activeKey;
+
+      if (_this.props.accordion) {
+        activeKey = activeKey[0] === key ? [] : [key];
+      } else {
+        activeKey = __spreadArray([], activeKey, true);
+        var index = activeKey.indexOf(key);
+        var isActive = index > -1;
+
+        if (isActive) {
+          // remove active state
+          activeKey.splice(index, 1);
+        } else {
+          activeKey.push(key);
+        }
+      }
+
+      _this.setActiveKey(activeKey);
+    };
+
+    _this.getNewChild = function (child, index) {
+      if (!child) return null;
+      var activeKey = _this.state.activeKey;
+      var _a = _this.props,
+          prefixCls = _a.prefixCls,
+          _b = _a.openMotion,
+          openMotion = _b === void 0 ? collapseMotion : _b,
+          accordion = _a.accordion,
+          rootDestroyInactivePanel = _a.destroyInactivePanel,
+          expandIcon = _a.expandIcon,
+          collapsible = _a.collapsible; // If there is no key provide, use the panel order as default key
+
+      var key = child.key || String(index);
+      var _c = child.props,
+          header = _c.header,
+          headerClass = _c.headerClass,
+          destroyInactivePanel = _c.destroyInactivePanel,
+          childCollapsible = _c.collapsible;
+      var isActive = false;
+
+      if (accordion) {
+        isActive = activeKey[0] === key;
+      } else {
+        isActive = activeKey.indexOf(key) > -1;
+      }
+
+      var mergeCollapsible = childCollapsible !== null && childCollapsible !== void 0 ? childCollapsible : collapsible;
+      var props = {
+        key: key,
+        panelKey: key,
+        header: header,
+        headerClass: headerClass,
+        isActive: isActive,
+        prefixCls: prefixCls,
+        destroyInactivePanel: destroyInactivePanel !== null && destroyInactivePanel !== void 0 ? destroyInactivePanel : rootDestroyInactivePanel,
+        openMotion: openMotion,
+        accordion: accordion,
+        children: child.props.children,
+        onItemClick: mergeCollapsible === 'disabled' ? null : _this.onClickItem,
+        expandIcon: expandIcon,
+        collapsible: mergeCollapsible
+      }; // https://github.com/ant-design/ant-design/issues/20479
+
+      if (typeof child.type === 'string') {
+        return child;
+      }
+
+      Object.keys(props).forEach(function (propName) {
+        if (typeof props[propName] === 'undefined') {
+          delete props[propName];
+        }
+      });
+      return /*#__PURE__*/React.cloneElement(child, props);
+    };
+
+    _this.getItems = function () {
+      var children = _this.props.children;
+      return _default(children).map(_this.getNewChild);
+    };
+
+    _this.setActiveKey = function (activeKey) {
+      if (!('activeKey' in _this.props)) {
+        _this.setState({
+          activeKey: activeKey
+        });
+      }
+
+      _this.props.onChange(_this.props.accordion ? activeKey[0] : activeKey);
+    };
+
+    var activeKey = props.activeKey,
+        defaultActiveKey = props.defaultActiveKey;
+    var currentActiveKey = defaultActiveKey;
+
+    if ('activeKey' in props) {
+      currentActiveKey = activeKey;
+    }
+
+    _this.state = {
+      activeKey: getActiveKeysArray(currentActiveKey)
+    };
+    return _this;
+  }
+
+  Collapse.prototype.shouldComponentUpdate = function (nextProps, nextState) {
+    return !shallowequal(this.props, nextProps) || !shallowequal(this.state, nextState);
+  };
+
+  Collapse.getDerivedStateFromProps = function (nextProps) {
+    var newState = {};
+
+    if ('activeKey' in nextProps) {
+      newState.activeKey = getActiveKeysArray(nextProps.activeKey);
+    }
+
+    return newState;
+  };
+
+  Collapse.prototype.render = function () {
+    var _a;
+
+    var _b = this.props,
+        prefixCls = _b.prefixCls,
+        className = _b.className,
+        style = _b.style,
+        accordion = _b.accordion;
+    var collapseClassName = classNames((_a = {}, _a[prefixCls] = true, _a[className] = !!className, _a));
+    return /*#__PURE__*/React.createElement("div", {
+      className: collapseClassName,
+      role: accordion ? 'tablist' : null,
+      style: style
+    }, this.getItems());
+  };
+
+  Collapse.defaultProps = {
+    prefixCls: 'rc-collapse',
+    onChange: function () {},
+    accordion: false,
+    destroyInactivePanel: false
+  };
+  Collapse.Panel = CollapsePanel;
+  return Collapse;
+}(React.Component);
+
+export { Collapse as default };

package/dist/src/components/common/RcCollapse/Panel.js

@@ -0,0 +1,146 @@
+import { extends as _extends } from '../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { __extends } from '../../../../my_my_node_modules/tslib/tslib.es6.js';
+import * as React from 'react';
+import classNames from '../../../../my_my_node_modules/classnames/index.js';
+import CSSMotion from '../../../../my_my_node_modules/rc-motion/es/CSSMotion.js';
+import '../../../../my_my_node_modules/rc-motion/es/util/motion.js';
+import shallowequal from '../../../../my_my_node_modules/shallowequal/index.js';
+import PanelContent from './PanelContent.js';
+
+var CollapsePanel =
+/** @class */
+function (_super) {
+  __extends(CollapsePanel, _super);
+
+  function CollapsePanel() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.onItemClick = function () {
+      var _a = _this.props,
+          onItemClick = _a.onItemClick,
+          panelKey = _a.panelKey;
+
+      if (typeof onItemClick === 'function') {
+        onItemClick(panelKey);
+      }
+    };
+
+    _this.handleKeyPress = function (e) {
+      if (e.key === 'Enter' || e.keyCode === 13 || e.which === 13) {
+        _this.onItemClick();
+      }
+    };
+
+    _this.renderIcon = function () {
+      var _a = _this.props,
+          showArrow = _a.showArrow,
+          expandIcon = _a.expandIcon,
+          prefixCls = _a.prefixCls,
+          collapsible = _a.collapsible;
+
+      if (!showArrow) {
+        return null;
+      }
+
+      var iconNode = typeof expandIcon === 'function' ? expandIcon(_this.props) : /*#__PURE__*/React.createElement("i", {
+        className: "arrow"
+      });
+      return iconNode && /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefixCls, "-expand-icon"),
+        onClick: collapsible === 'header' ? _this.onItemClick : null
+      }, iconNode);
+    };
+
+    _this.renderTitle = function () {
+      var _a = _this.props,
+          header = _a.header,
+          prefixCls = _a.prefixCls,
+          collapsible = _a.collapsible;
+      return /*#__PURE__*/React.createElement("span", {
+        className: "".concat(prefixCls, "-header-text"),
+        onClick: collapsible === 'header' ? _this.onItemClick : null
+      }, header);
+    };
+
+    return _this;
+  }
+
+  CollapsePanel.prototype.shouldComponentUpdate = function (nextProps) {
+    return !shallowequal(this.props, nextProps);
+  };
+
+  CollapsePanel.prototype.render = function () {
+    var _a, _b;
+
+    var _c = this.props,
+        className = _c.className,
+        id = _c.id,
+        style = _c.style,
+        prefixCls = _c.prefixCls,
+        headerClass = _c.headerClass,
+        children = _c.children,
+        isActive = _c.isActive,
+        destroyInactivePanel = _c.destroyInactivePanel,
+        accordion = _c.accordion,
+        forceRender = _c.forceRender,
+        openMotion = _c.openMotion,
+        extra = _c.extra,
+        collapsible = _c.collapsible;
+    var disabled = collapsible === 'disabled';
+    var collapsibleHeader = collapsible === 'header';
+    var itemCls = classNames((_a = {}, _a["".concat(prefixCls, "-item")] = true, _a["".concat(prefixCls, "-item-active")] = isActive, _a["".concat(prefixCls, "-item-disabled")] = disabled, _a), className);
+    var headerCls = classNames("".concat(prefixCls, "-header"), (_b = {}, _b[headerClass] = headerClass, _b["".concat(prefixCls, "-header-collapsible-only")] = collapsibleHeader, _b));
+    /** header 节点属性 */
+
+    var headerProps = {
+      className: headerCls,
+      'aria-expanded': isActive,
+      'aria-disabled': disabled,
+      onKeyPress: this.handleKeyPress
+    };
+
+    if (!collapsibleHeader) {
+      headerProps.onClick = this.onItemClick;
+      headerProps.role = accordion ? 'tab' : 'button';
+      headerProps.tabIndex = disabled ? -1 : 0;
+    }
+
+    var ifExtraExist = extra !== null && extra !== undefined && typeof extra !== 'boolean';
+    return /*#__PURE__*/React.createElement("div", {
+      className: itemCls,
+      id: id,
+      style: style
+    }, /*#__PURE__*/React.createElement("div", headerProps, this.renderIcon(), this.renderTitle(), ifExtraExist && /*#__PURE__*/React.createElement("div", {
+      className: "".concat(prefixCls, "-extra")
+    }, extra)), /*#__PURE__*/React.createElement(CSSMotion, _extends({
+      leavedClassName: "".concat(prefixCls, "-content-hidden"),
+      visible: isActive
+    }, openMotion, {
+      forceRender: forceRender,
+      removeOnLeave: destroyInactivePanel
+    }), function (_a, ref) {
+      var motionClassName = _a.className,
+          motionStyle = _a.style;
+      return /*#__PURE__*/React.createElement(PanelContent, {
+        ref: ref,
+        className: motionClassName,
+        forceRender: forceRender,
+        isActive: isActive,
+        prefixCls: prefixCls,
+        role: accordion ? 'tabpanel' : null,
+        style: motionStyle
+      }, children);
+    }));
+  };
+
+  CollapsePanel.defaultProps = {
+    showArrow: true,
+    isActive: false,
+    onItemClick: function () {},
+    headerClass: '',
+    forceRender: false
+  };
+  return CollapsePanel;
+}(React.Component);
+
+export { CollapsePanel as default };

package/dist/src/components/common/RcCollapse/PanelContent.js

@@ -0,0 +1,41 @@
+import * as React from 'react';
+import classNames from '../../../../my_my_node_modules/classnames/index.js';
+
+/* eslint-disable no-underscore-dangle */
+var PanelContent = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var _a;
+
+  var prefixCls = props.prefixCls,
+      forceRender = props.forceRender,
+      className = props.className,
+      style = props.style,
+      children = props.children,
+      isActive = props.isActive,
+      role = props.role;
+
+  var _b = React.useState(isActive || forceRender),
+      rendered = _b[0],
+      setRendered = _b[1];
+
+  React.useEffect(function () {
+    if (forceRender || isActive) {
+      setRendered(true);
+    }
+  }, [forceRender, isActive]);
+
+  if (!rendered) {
+    return null;
+  }
+
+  return /*#__PURE__*/React.createElement("div", {
+    ref: ref,
+    className: classNames("".concat(prefixCls, "-content"), (_a = {}, _a["".concat(prefixCls, "-content-active")] = isActive, _a["".concat(prefixCls, "-content-inactive")] = !isActive, _a), className),
+    role: role,
+    style: style
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-content-box")
+  }, children));
+});
+PanelContent.displayName = 'PanelContent';
+
+export { PanelContent as default };

package/dist/src/components/common/RcCollapse/index.js

@@ -0,0 +1,6 @@
+import Collapse from './Collapse.js';
+export { default } from './Collapse.js';
+
+var Panel = Collapse.Panel;
+
+export { Panel };

package/dist/src/components/common/RcCollapse/index.less.js

@@ -0,0 +1,4 @@
+import styleInject from '../../../../my_my_node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index_rc-collapse-motion__lsK6p {\n  transition: height 0.3s, opacity 0.3s;\n  overflow: hidden;\n}\n.index_rc-collapse-content-hidden__4zwkg {\n  display: none;\n}\n.index_rc-collapse__I7hnO {\n  border-radius: 3px;\n}\n.index_rc-collapse__I7hnO > .index_rc-collapse-item__16-jp:first-child {\n  border-top: none;\n}\n.index_rc-collapse__I7hnO > .index_rc-collapse-item__16-jp > .index_rc-collapse-header__lxAi2 {\n  display: flex;\n  align-items: center;\n  line-height: 22px;\n  padding: 10px 0;\n  color: #666;\n  cursor: pointer;\n}\n.index_rc-collapse__I7hnO > .index_rc-collapse-item__16-jp > .index_rc-collapse-header__lxAi2 .index_arrow__-qPEp {\n  display: inline-block;\n  content: '\\20';\n  width: 0;\n  height: 0;\n  font-size: 0;\n  line-height: 0;\n  border-top: 3px solid transparent;\n  border-bottom: 3px solid transparent;\n  border-left: 4px solid #666;\n  vertical-align: middle;\n  margin-right: 8px;\n}\n.index_rc-collapse__I7hnO > .index_rc-collapse-item__16-jp > .index_rc-collapse-header__lxAi2 .index_rc-collapse-extra__-n4Wn {\n  margin: 0 0 0 auto;\n}\n.index_rc-collapse__I7hnO > .index_rc-collapse-item__16-jp .index_rc-collapse-header-collapsible-only__IMgg9 {\n  cursor: default;\n}\n.index_rc-collapse__I7hnO > .index_rc-collapse-item__16-jp .index_rc-collapse-header-collapsible-only__IMgg9 .index_rc-collapse-header-text__lvb2z {\n  cursor: pointer;\n}\n.index_rc-collapse__I7hnO > .index_rc-collapse-item-disabled__d6qvi > .index_rc-collapse-header__lxAi2 {\n  cursor: not-allowed;\n  color: #999;\n}\n.index_rc-collapse-content__mC-Ba {\n  color: #666;\n}\n.index_rc-collapse-content__mC-Ba > .index_rc-collapse-content-box__MvWT2 {\n  margin-bottom: 16px;\n}\n.index_rc-collapse-item__16-jp:last-child > .index_rc-collapse-content__mC-Ba {\n  border-radius: 0 0 3px 3px;\n}\n.index_rc-collapse__I7hnO > .index_rc-collapse-item-active__x9o2c > .index_rc-collapse-header__lxAi2 .index_arrow__-qPEp {\n  position: relative;\n  top: 2px;\n  border-left: 3px solid transparent;\n  border-right: 3px solid transparent;\n  border-top: 4px solid #666;\n  margin-right: 6px;\n}\n";
+styleInject(css_248z);

package/dist/src/components/common/RcCollapse/motionUtil.js

@@ -0,0 +1,37 @@
+var getCollapsedHeight = function () {
+  return {
+    height: 0,
+    opacity: 0
+  };
+};
+
+var getRealHeight = function (node) {
+  return {
+    height: node.scrollHeight,
+    opacity: 1
+  };
+};
+
+var getCurrentHeight = function (node) {
+  return {
+    height: node === null || node === void 0 ? void 0 : node.offsetHeight
+  };
+};
+
+var skipOpacityTransition = function (_, event) {
+  return event.propertyName === 'height';
+};
+
+var collapseMotion = {
+  motionName: 'rc-collapse-motion',
+  onEnterStart: getCollapsedHeight,
+  onEnterActive: getRealHeight,
+  onLeaveStart: getCurrentHeight,
+  onLeaveActive: getCollapsedHeight,
+  onEnterEnd: skipOpacityTransition,
+  onLeaveEnd: skipOpacityTransition,
+  motionDeadline: 500,
+  leavedClassName: 'rc-collapse-content-hidden'
+};
+
+export { collapseMotion as default };

package/dist/src/components/common/Slider/index.js

@@ -0,0 +1,95 @@
+import { __extends, __assign } from '../../../../my_my_node_modules/tslib/tslib.es6.js';
+import React__default from 'react';
+import classNames from '../../../../my_my_node_modules/classnames/index.js';
+import { Slider } from 'antd';
+import './index.less.js';
+import NewInputNumber from '../InputNumber/index.js';
+import ColorPickerInput from '../ColorPickerInput/index.js';
+
+var SliderInput =
+/** @class */
+function (_super) {
+  __extends(SliderInput, _super);
+
+  function SliderInput() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.state = {};
+    _this.colorRef = /*#__PURE__*/React__default.createRef();
+    _this.colorPickerRef = /*#__PURE__*/React__default.createRef();
+    return _this;
+  }
+
+  SliderInput.prototype.render = function () {
+    var _a = this.props,
+        value = _a.value,
+        minVal = _a.minVal,
+        onChange = _a.onChange,
+        maxVal = _a.maxVal,
+        needColor = _a.needColor,
+        inputType = _a.inputType,
+        step = _a.step,
+        unit = _a.unit; // 在step 未传的情况下： 若类型为 int or percent 则step默认为1； 类型为float，则step默认为0.1
+
+    var _step = step || 1;
+
+    if (inputType == 'float') {
+      _step = step || 0.1;
+    }
+
+    var _unit = unit || (inputType === 'percent' ? '%' : '');
+
+    return /*#__PURE__*/React__default.createElement("div", {
+      className: "m-slider-input"
+    }, /*#__PURE__*/React__default.createElement(Slider, {
+      className: classNames('slider', {
+        colorAndSlider: needColor
+      }),
+      max: maxVal,
+      min: minVal,
+      onChange: function (v) {
+        return onChange(__assign(__assign({}, value), {
+          count: v
+        }));
+      },
+      step: _step,
+      value: value.count
+    }), /*#__PURE__*/React__default.createElement(NewInputNumber, {
+      max: maxVal,
+      min: minVal,
+      onChange: function (v) {
+        return onChange(__assign(__assign({}, value), {
+          count: v
+        }));
+      },
+      step: _step,
+      unit: _unit,
+      value: value.count
+    }), needColor && /*#__PURE__*/React__default.createElement(ColorPickerInput, {
+      colorType: "rgba",
+      onChange: function (color) {
+        onChange(__assign(__assign({}, value), {
+          color: color
+        }));
+      },
+      placement: "bottomLeft",
+      type: "dot",
+      value: value.color
+    }));
+  };
+
+  SliderInput.defaultProps = {
+    value: {
+      count: 1
+    },
+    onChange: function () {},
+    minVal: 1,
+    maxVal: 100,
+    needColor: false,
+    inputType: 'int',
+    unit: ''
+  };
+  return SliderInput;
+}(React__default.Component);
+
+export { SliderInput as default };

package/dist/src/components/common/Slider/index.less.js

@@ -0,0 +1,4 @@
+import styleInject from '../../../../my_my_node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index_m-slider-input__UC6EZ {\n  display: flex;\n  width: 100%;\n  align-items: center;\n  justify-content: flex-start;\n  position: relative;\n}\n.index_m-slider-input__UC6EZ .index_slider__rm1zz {\n  border-radius: 100px;\n  flex: 1;\n  margin-right: 20px;\n}\n.index_m-slider-input__UC6EZ .index_sketchWrap__8x3IJ {\n  border: 1px solid #EDF0F4;\n  border-radius: 8px;\n  width: 34px;\n  cursor: pointer;\n  height: 34px;\n  margin-left: 10px;\n  flex-shrink: 0;\n}\n.index_m-slider-input__UC6EZ .index_colorWrap__slKxO {\n  position: absolute;\n  right: 2px;\n  top: 40px;\n  z-index: 2;\n}\n.index_m-slider-input__UC6EZ .index_m-color-picker-input__jZXB7 .index_input-color__LxUZe {\n  height: auto !important;\n  padding: 0 0 0 12px !important;\n}\n";
+styleInject(css_248z);

package/dist/src/components/common/SwitchCollapse/index.js

@@ -0,0 +1,162 @@
+import { __extends, __spreadArray } from '../../../../my_my_node_modules/tslib/tslib.es6.js';
+import React__default from 'react';
+import { Collapse, Switch, Checkbox } from 'antd';
+import './index.less.js';
+
+var Panel = Collapse.Panel;
+
+/** @class */
+(function (_super) {
+  __extends(SwitchCollapse, _super);
+
+  function SwitchCollapse() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.state = {
+      activeKey: []
+    }; // switch 模式展开第一个open状态，checkbox模式展开所有open状态
+
+    _this.openSwitch = function (source) {
+      var type = _this.props.type;
+      var activeSource = [];
+
+      if (source.length === 0) {
+        return;
+      }
+
+      if (type === 'checkout') {
+        activeSource = source.filter(function (src) {
+          return src.metaOption.open;
+        }).map(function (src) {
+          return src.key;
+        });
+      } else {
+        var openMeta = source.find(function (meta) {
+          return meta.metaOption.open;
+        });
+
+        if (openMeta) {
+          activeSource.push(openMeta.key);
+        }
+      }
+
+      _this.setState({
+        activeKey: activeSource
+      });
+    };
+
+    _this.onSwitchChange = function (checked, panelInfo) {
+      panelInfo.metaOption.open = checked;
+
+      if (checked) {
+        _this.setState({
+          activeKey: panelInfo.key
+        });
+      } else {
+        _this.setState({
+          activeKey: null
+        });
+      }
+
+      _this.props.onRefresh();
+    };
+
+    _this.onCheckBoxChange = function (e, panelInfo) {
+      var checked = e.target.checked;
+      panelInfo.metaOption.open = checked;
+      var activeKey = _this.state.activeKey;
+
+      if (checked) {
+        _this.setState({
+          activeKey: activeKey ? __spreadArray(__spreadArray([], activeKey, true), [panelInfo.key], false) : [panelInfo.key]
+        });
+      } else {
+        _this.setState({
+          activeKey: activeKey.find(function (key) {
+            return key !== panelInfo.key;
+          })
+        });
+      }
+
+      _this.props.onRefresh();
+    };
+
+    _this.getSwitchButton = function (panelInfo) {
+      var type = _this.props.type;
+
+      if (type === 'switch') {
+        return /*#__PURE__*/React__default.createElement(Switch, {
+          checked: panelInfo.metaOption.open,
+          onChange: function (checked) {
+            return _this.onSwitchChange(checked, panelInfo);
+          },
+          size: "small"
+        });
+      } else {
+        return /*#__PURE__*/React__default.createElement(Checkbox, {
+          checked: panelInfo.metaOption.open,
+          onChange: function (e) {
+            return _this.onCheckBoxChange(e, panelInfo);
+          }
+        });
+      }
+    };
+
+    _this.getHeader = function (name, index) {
+      return /*#__PURE__*/React__default.createElement("div", {
+        className: "header_wrap"
+      }, index !== 0 && /*#__PURE__*/React__default.createElement("div", {
+        className: "meta_header_divider"
+      }), /*#__PURE__*/React__default.createElement("span", {
+        className: "switchcollapse_header_name"
+      }, name));
+    };
+
+    return _this;
+  }
+
+  SwitchCollapse.prototype.componentWillMount = function () {
+    this.openSwitch(this.props.source);
+  };
+
+  SwitchCollapse.prototype.componentWillReceiveProps = function (nextProps) {
+    this.openSwitch(nextProps.source);
+  };
+
+  SwitchCollapse.prototype.render = function () {
+    var _this = this;
+
+    var _a = this.props,
+        source = _a.source,
+        accordion = _a.accordion,
+        type = _a.type;
+    var activeKey = this.state.activeKey;
+    return /*#__PURE__*/React__default.createElement("div", {
+      className: "".concat(type, "_collapse_wrap")
+    }, /*#__PURE__*/React__default.createElement(Collapse, {
+      accordion: accordion,
+      activeKey: activeKey,
+      ghost: true,
+      onChange: function (value) {
+        return _this.setState({
+          activeKey: value
+        });
+      }
+    }, source.map(function (panelInfo, index) {
+      return /*#__PURE__*/React__default.createElement(Panel, {
+        key: panelInfo.key,
+        collapsible: panelInfo.metaOption.open ? 'header' : 'disabled',
+        extra: _this.getSwitchButton(panelInfo),
+        header: _this.getHeader(panelInfo.name, index),
+        showArrow: false
+      }, panelInfo.value);
+    })));
+  };
+
+  SwitchCollapse.defaultProps = {
+    source: [],
+    accordion: true,
+    type: 'switch'
+  };
+  return SwitchCollapse;
+})(React__default.Component);

package/dist/src/components/common/SwitchCollapse/index.less.js

@@ -0,0 +1,4 @@
+import styleInject from '../../../../my_my_node_modules/style-inject/dist/style-inject.es.js';
+
+var css_248z = ".index_switch_collapse_wrap__2jdH7 .index_ant-collapse__hnRpG .index_ant-collapse-item__sHsbw {\n  padding-bottom: 1px !important;\n}\n.index_switch_collapse_wrap__2jdH7 .index_ant-collapse__hnRpG .index_header_wrap__WrzsP {\n  position: relative;\n}\n.index_switch_collapse_wrap__2jdH7 .index_ant-collapse__hnRpG .index_header_wrap__WrzsP .index_switchcollapse_header_name__bWKqK {\n  font-family: 'Open Sans' !important;\n  font-style: normal !important;\n  font-weight: 700 !important;\n  font-size: 16px;\n  line-height: 24px !important;\n  color: #232F46 !important;\n  height: 24px;\n}\n.index_switch_collapse_wrap__2jdH7 .index_ant-collapse__hnRpG .index_header_wrap__WrzsP .index_meta_header_divider__pjJ9- {\n  position: absolute;\n  height: 1px;\n  width: 306px;\n  border-bottom: 1px solid #D2D9E5;\n  top: -20px;\n}\n.index_checkbox_collapse_wrap__At1nE .index_switchcollapse_header_name__bWKqK {\n  font-size: 14px !important;\n}\n";
+styleInject(css_248z);