@fonixtree/magic-design 0.0.1 → 0.0.4

package/es/composite-comp/bol/components/Button/defaultJSON.js

@@ -51,6 +51,10 @@ var getDefaultMetaButtonJson = function getDefaultMetaButtonJson() {
       iconUrl: '',
       layout: 'right'
     },
+    spacing: {
+      pc: {},
+      mobile: {}
+    },
     text: 'Button',
     hover: null
   };

package/es/composite-comp/bol/components/Carousel/defaultJSON.js

@@ -11,9 +11,10 @@ var _defaultImg = _interopRequireDefault(require("./imgs/defaultImg.png"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var imagesGroupSourceJSON = function imagesGroupSourceJSON() {
+var imagesGroupSourceJSON = function imagesGroupSourceJSON(compId) {
   var groupId = (0, _uuid.v4)();
   return {
+    compId: compId,
     id: groupId,
     image: {
       parentId: groupId,
@@ -233,10 +234,11 @@ var imagesGroupSourceJSON = function imagesGroupSourceJSON() {
 exports.imagesGroupSourceJSON = imagesGroupSourceJSON;
 
 var getDefaultJSON = function getDefaultJSON() {
+  var compId = (0, _uuid.v4)();
   return {
-    id: (0, _uuid.v4)(),
+    id: compId,
     type: 'CAROUSEL',
-    groupSource: [imagesGroupSourceJSON()],
+    groupSource: [imagesGroupSourceJSON(compId)],
     setting: {
       // 自动轮播
       autoplay: {
@@ -277,7 +279,7 @@ var getDefaultJSON = function getDefaultJSON() {
       align: 'left',
       rowNum: 1,
       pcRowNum: 1,
-      mobileMaxRowNum: 4,
+      mobileMaxRowNum: 5,
       pcMaxRowNum: 6
     },
     background: {

package/es/composite-comp/bol/components/Carousel/mobile/index.js

@@ -23,8 +23,6 @@ require("slick-carousel/slick/slick.css");
 
 require("slick-carousel/slick/slick-theme.css");
 
-var _mobx = require("../../../../../mobx");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -57,7 +55,7 @@ var __extends = void 0 && (void 0).__extends || function () {
 
 var MOBILE_IMG_SIZE = [{
   w: 282,
-  h: 150
+  h: 212
 }, {
   w: 125,
   h: 102
@@ -67,6 +65,9 @@ var MOBILE_IMG_SIZE = [{
 }, {
   w: 60,
   h: 45
+}, {
+  w: 50,
+  h: 50
 }];
 
 var CarouselMobile =
@@ -113,6 +114,10 @@ function (_super) {
     return _this;
   }
 
+  CarouselMobile.prototype.componentDidMount = function () {// this.props.store.setState({ CarouselStore: { id: this.props.data.id, layout: this.props.data.customize.layout } });
+    // console.log('...', this.props);
+  };
+
   CarouselMobile.prototype.componentWillReceiveProps = function (nextProps) {
     if (nextProps.data.setting.autoplay.open) {
       this.sliderRef.slickPlay();
@@ -124,11 +129,9 @@ function (_super) {
   CarouselMobile.prototype.render = function () {
     var _this = this;
 
-    var _a;
-
     var data = this.props.data;
     var sliderIndex = this.state.sliderIndex;
-    var showText = ((_a = _mobx.store.CarouselStore) === null || _a === void 0 ? void 0 : _a.layout) === 'layout2';
+    var showText = data.customize.layout === 'layout2';
     var colNum = showText ? 1 : Math.min(data.customize.rowNum, data.groupSource.length);
     var bgStyle = {};
 

package/es/composite-comp/bol/components/Carousel/pc/index.js

@@ -23,8 +23,6 @@ require("slick-carousel/slick/slick.css");
 
 require("slick-carousel/slick/slick-theme.css");
 
-var _mobx = require("../../../../../mobx");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -130,11 +128,9 @@ function (_super) {
   CarouselPc.prototype.render = function () {
     var _this = this;
 
-    var _a;
-
     var data = this.props.data;
     var sliderIndex = this.state.sliderIndex;
-    var showText = ((_a = _mobx.store.CarouselStore) === null || _a === void 0 ? void 0 : _a.layout) === 'layout2';
+    var showText = data.customize.layout === 'layout2';
     var colNum = showText ? 1 : Math.min(data.customize.pcRowNum, data.groupSource.length);
     var bgStyle = {};
 

package/es/composite-comp/bol/components/ImageText/mobile/index.less

@@ -189,34 +189,34 @@
       transform: translateX(-50%);
     }
     .one-card {
-      width: 50%;
+      width: calc((100% - 1px)/2);
       position: relative;
       padding: 0 14px 16px;
-      &::before, &::after {
+      &::before {
         content: '';
         position: absolute;
         border-radius: 50%;
         background: #2F54EB;
-      }
-      &::before {
-        opacity: 0.2;
         width: 10px;
         height: 10px;
+        z-index: 10;
+        border: 2px solid #CCE3FF;
       }
-      &::after {
-        width: 6px;
-        height: 6px;
-      }
+      // &::before {
+      //   opacity: 0.2;
+      //   width: 10px;
+      //   height: 10px;
+      // }
       &:nth-of-type(2n-1) {
         left: 0;
         &::before {
           right: -5px;
           top: 5px;
         }
-        &::after {
-          right: -3px;
-          top: 7px;
-        }
+        // &::after {
+        //   right: -3px;
+        //   top: 7px;
+        // }
         .card-content-wrap {
           display: flex;
           flex-direction: column;
@@ -248,10 +248,10 @@
           left: -5px;
           top: 5px;
         }
-        &::after {
-          left: -3px;
-          top: 7px;
-        }
+        // &::after {
+        //   left: -3px;
+        //   top: 7px;
+        // }
         .card-content-wrap {
           .card-title, .card-text {
             text-align: left !important;
@@ -269,9 +269,13 @@
         }
       }
       .card-content-wrap {
+        .card-title {
+          margin-bottom: 10px;
+        }
         .image-subtext-wrap {
           display: flex;
           margin-bottom: 20px;
+          align-items: center;
         }
         .card-btn-wrap {
           .card-second-btn {

package/es/composite-comp/bol/components/Text/index.less

@@ -11,6 +11,7 @@
   .sub-title {
     font-size: 15px;
     color: #b7b7b7;
+    margin-top: 10px;
   }
 
   .group-content-wrap {

package/es/composite-comp/bol/config-panels/CarouselConfig/index.js

@@ -3,14 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = CarouselConfig;
+exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
+var _mobxReact = require("mobx-react");
+
 var _CarouselConfigImageGroup = _interopRequireDefault(require("./CarouselConfigImageGroup"));
 
 var _CarouselConfigSetting = _interopRequireDefault(require("./CarouselConfigSetting"));
 
+var _BaseConfig = _interopRequireDefault(require("../../../../meta-comp/config-panels/BaseConfig"));
+
 var _Collapse = _interopRequireDefault(require("../../../../common/Collapse"));
 
 var _SpacingConfig = _interopRequireDefault(require("../../../common/config-panels/SpacingConfig"));
@@ -23,45 +27,110 @@ var _layout = require("../../../../constants/layout");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function CarouselConfig(props) {
-  var data = props.data;
-  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
-    divider: "bold",
-    headerSize: "large",
-    source: [{
-      key: '1',
-      name: 'Image',
-      value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigImageGroup["default"], {
-        source: data.groupSource
-      })
-    }, {
-      key: '2',
-      name: 'Setting',
-      value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigSetting["default"], {
-        setting: data.setting
-      })
-    }, {
-      key: '3',
-      name: 'Spacing',
-      value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
-        data: data.spacing
-      })
-    }, {
-      key: '4',
-      name: 'Customize',
-      value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
-        component: "carousel",
-        data: data.customize,
-        isHideAlign: true,
-        layoutSource: _layout.carouselLayout
-      })
-    }, {
-      key: '5',
-      name: 'Background',
-      value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
-        data: data.background
-      })
-    }],
-    type: "triangle"
-  }));
-}
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+var __extends = void 0 && (void 0).__extends || function () {
+  var _extendStatics = function extendStatics(d, b) {
+    _extendStatics = Object.setPrototypeOf || {
+      __proto__: []
+    } instanceof Array && function (d, b) {
+      d.__proto__ = b;
+    } || function (d, b) {
+      for (var p in b) {
+        if (b.hasOwnProperty(p)) d[p] = b[p];
+      }
+    };
+
+    return _extendStatics(d, b);
+  };
+
+  return function (d, b) {
+    _extendStatics(d, b);
+
+    function __() {
+      this.constructor = d;
+    }
+
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+  };
+}();
+
+var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+  if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) {
+    if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  }
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+
+var CarouselConfig =
+/** @class */
+function (_super) {
+  __extends(CarouselConfig, _super);
+
+  function CarouselConfig() {
+    return _super !== null && _super.apply(this, arguments) || this;
+  }
+
+  CarouselConfig.prototype.componentDidMount = function () {
+    this.props.store.setState({
+      CarouselStore: {
+        id: this.props.data.id,
+        layout: this.props.data.customize.layout
+      }
+    });
+    this.selfRender();
+  };
+
+  CarouselConfig.prototype.render = function () {
+    var data = this.props.data;
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
+      divider: "bold",
+      headerSize: "large",
+      source: [{
+        key: '1',
+        name: 'Image',
+        value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigImageGroup["default"], {
+          source: data.groupSource
+        })
+      }, {
+        key: '2',
+        name: 'Setting',
+        value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigSetting["default"], {
+          setting: data.setting
+        })
+      }, {
+        key: '3',
+        name: 'Spacing',
+        value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
+          data: data.spacing
+        })
+      }, {
+        key: '4',
+        name: 'Customize',
+        value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
+          component: "carousel",
+          data: data.customize,
+          id: data.id,
+          isHideAlign: true,
+          layoutSource: _layout.carouselLayout
+        })
+      }, {
+        key: '5',
+        name: 'Background',
+        value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
+          data: data.background
+        })
+      }],
+      type: "triangle"
+    }));
+  };
+
+  CarouselConfig = __decorate([(0, _mobxReact.inject)('store'), _mobxReact.observer], CarouselConfig);
+  return CarouselConfig;
+}(_BaseConfig["default"]);
+
+var _default = CarouselConfig;
+exports["default"] = _default;

package/es/composite-comp/bol/second-config-panels/CarouselSecondConfig/index.js

@@ -76,7 +76,7 @@ function (_super) {
   }
 
   CarouselSecondConfig.prototype.render = function () {
-    var _a;
+    var _a, _b;
 
     var panelProps = this.props.panelProps;
     var textSource = [{
@@ -121,7 +121,7 @@ function (_super) {
       toggleType: 'switch'
     }];
 
-    var _textSource = ((_a = _mobx.store.CarouselStore) === null || _a === void 0 ? void 0 : _a.layout) === 'layout2' ? textSource : [];
+    var _textSource = ((_a = _mobx.store.CarouselStore) === null || _a === void 0 ? void 0 : _a.id) === panelProps.compId && ((_b = _mobx.store.CarouselStore) === null || _b === void 0 ? void 0 : _b.layout) === 'layout2' ? textSource : [];
 
     var getConfig = function getConfig() {
       return /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {

package/es/composite-comp/common/config-panels/CustomizeConfig/index.js

@@ -75,7 +75,8 @@ function (_super) {
       var _a = _this.props,
           selectedLayoutFun = _a.selectedLayoutFun,
           data = _a.data,
-          component = _a.component;
+          component = _a.component,
+          id = _a.id;
 
       if (selectedLayoutFun) {
         selectedLayoutFun(v);
@@ -99,6 +100,7 @@ function (_super) {
 
         _this.props.store.setState({
           CarouselStore: {
+            id: id,
             layout: v
           }
         });

package/es/decorator/compositeDecorator.js

@@ -79,7 +79,8 @@ function compositeDecorator(WrappedComponent) {
         }; // 处理复合组件的选中状态
 
         if (window.magicDesign.mode === 'designer') {
-          style.border = '1px solid transparent';
+          // style.border = '1px solid transparent';
+          style.border = 'none';
 
           if (_this.props.nodeData.id === _this.state.clickedFloor) {
             style.border = '1px dashed red';

package/es/meta-comp/components/Text/index.js

@@ -441,6 +441,9 @@ function (_super) {
       onInput: function onInput(e) {
         var text = e.target.textContent;
         data.text = text;
+        /** 毁灭吧 累了 */
+
+        data.specialContent = [];
         /** 主动更新历史数据避免render */
 
         _this.preData = JSON.stringify(__assign(__assign({}, JSON.parse(_this.preData)), {

package/es/meta-comp/config-panels/ButtonConfig/index.js

@@ -337,6 +337,10 @@ function (_super) {
         iconUrl: '',
         layout: 'right'
       },
+      spacing: {
+        pc: {},
+        mobile: {}
+      },
       id: '',
       text: 'Button',
       hover: null

package/lib/composite-comp/bol/components/Button/defaultJSON.js

@@ -51,6 +51,10 @@ var getDefaultMetaButtonJson = function getDefaultMetaButtonJson() {
       iconUrl: '',
       layout: 'right'
     },
+    spacing: {
+      pc: {},
+      mobile: {}
+    },
     text: 'Button',
     hover: null
   };

package/lib/composite-comp/bol/components/Carousel/defaultJSON.js

@@ -11,9 +11,10 @@ var _defaultImg = _interopRequireDefault(require("./imgs/defaultImg.png"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-var imagesGroupSourceJSON = function imagesGroupSourceJSON() {
+var imagesGroupSourceJSON = function imagesGroupSourceJSON(compId) {
   var groupId = (0, _uuid.v4)();
   return {
+    compId: compId,
     id: groupId,
     image: {
       parentId: groupId,
@@ -233,10 +234,11 @@ var imagesGroupSourceJSON = function imagesGroupSourceJSON() {
 exports.imagesGroupSourceJSON = imagesGroupSourceJSON;
 
 var getDefaultJSON = function getDefaultJSON() {
+  var compId = (0, _uuid.v4)();
   return {
-    id: (0, _uuid.v4)(),
+    id: compId,
     type: 'CAROUSEL',
-    groupSource: [imagesGroupSourceJSON()],
+    groupSource: [imagesGroupSourceJSON(compId)],
     setting: {
       // 自动轮播
       autoplay: {
@@ -277,7 +279,7 @@ var getDefaultJSON = function getDefaultJSON() {
       align: 'left',
       rowNum: 1,
       pcRowNum: 1,
-      mobileMaxRowNum: 4,
+      mobileMaxRowNum: 5,
       pcMaxRowNum: 6
     },
     background: {

package/lib/composite-comp/bol/components/Carousel/mobile/index.js

@@ -23,8 +23,6 @@ require("slick-carousel/slick/slick.css");
 
 require("slick-carousel/slick/slick-theme.css");
 
-var _mobx = require("../../../../../mobx");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -57,7 +55,7 @@ var __extends = void 0 && (void 0).__extends || function () {
 
 var MOBILE_IMG_SIZE = [{
   w: 282,
-  h: 150
+  h: 212
 }, {
   w: 125,
   h: 102
@@ -67,6 +65,9 @@ var MOBILE_IMG_SIZE = [{
 }, {
   w: 60,
   h: 45
+}, {
+  w: 50,
+  h: 50
 }];
 
 var CarouselMobile =
@@ -113,6 +114,10 @@ function (_super) {
     return _this;
   }
 
+  CarouselMobile.prototype.componentDidMount = function () {// this.props.store.setState({ CarouselStore: { id: this.props.data.id, layout: this.props.data.customize.layout } });
+    // console.log('...', this.props);
+  };
+
   CarouselMobile.prototype.componentWillReceiveProps = function (nextProps) {
     if (nextProps.data.setting.autoplay.open) {
       this.sliderRef.slickPlay();
@@ -124,11 +129,9 @@ function (_super) {
   CarouselMobile.prototype.render = function () {
     var _this = this;
 
-    var _a;
-
     var data = this.props.data;
     var sliderIndex = this.state.sliderIndex;
-    var showText = ((_a = _mobx.store.CarouselStore) === null || _a === void 0 ? void 0 : _a.layout) === 'layout2';
+    var showText = data.customize.layout === 'layout2';
     var colNum = showText ? 1 : Math.min(data.customize.rowNum, data.groupSource.length);
     var bgStyle = {};
 

package/lib/composite-comp/bol/components/Carousel/pc/index.js

@@ -23,8 +23,6 @@ require("slick-carousel/slick/slick.css");
 
 require("slick-carousel/slick/slick-theme.css");
 
-var _mobx = require("../../../../../mobx");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -130,11 +128,9 @@ function (_super) {
   CarouselPc.prototype.render = function () {
     var _this = this;
 
-    var _a;
-
     var data = this.props.data;
     var sliderIndex = this.state.sliderIndex;
-    var showText = ((_a = _mobx.store.CarouselStore) === null || _a === void 0 ? void 0 : _a.layout) === 'layout2';
+    var showText = data.customize.layout === 'layout2';
     var colNum = showText ? 1 : Math.min(data.customize.pcRowNum, data.groupSource.length);
     var bgStyle = {};
 

package/lib/composite-comp/bol/components/ImageText/mobile/index.less

@@ -189,34 +189,34 @@
       transform: translateX(-50%);
     }
     .one-card {
-      width: 50%;
+      width: calc((100% - 1px)/2);
       position: relative;
       padding: 0 14px 16px;
-      &::before, &::after {
+      &::before {
         content: '';
         position: absolute;
         border-radius: 50%;
         background: #2F54EB;
-      }
-      &::before {
-        opacity: 0.2;
         width: 10px;
         height: 10px;
+        z-index: 10;
+        border: 2px solid #CCE3FF;
       }
-      &::after {
-        width: 6px;
-        height: 6px;
-      }
+      // &::before {
+      //   opacity: 0.2;
+      //   width: 10px;
+      //   height: 10px;
+      // }
       &:nth-of-type(2n-1) {
         left: 0;
         &::before {
           right: -5px;
           top: 5px;
         }
-        &::after {
-          right: -3px;
-          top: 7px;
-        }
+        // &::after {
+        //   right: -3px;
+        //   top: 7px;
+        // }
         .card-content-wrap {
           display: flex;
           flex-direction: column;
@@ -248,10 +248,10 @@
           left: -5px;
           top: 5px;
         }
-        &::after {
-          left: -3px;
-          top: 7px;
-        }
+        // &::after {
+        //   left: -3px;
+        //   top: 7px;
+        // }
         .card-content-wrap {
           .card-title, .card-text {
             text-align: left !important;
@@ -269,9 +269,13 @@
         }
       }
       .card-content-wrap {
+        .card-title {
+          margin-bottom: 10px;
+        }
         .image-subtext-wrap {
           display: flex;
           margin-bottom: 20px;
+          align-items: center;
         }
         .card-btn-wrap {
           .card-second-btn {

package/lib/composite-comp/bol/components/Text/index.less

@@ -11,6 +11,7 @@
   .sub-title {
     font-size: 15px;
     color: #b7b7b7;
+    margin-top: 10px;
   }
 
   .group-content-wrap {

package/lib/composite-comp/bol/config-panels/CarouselConfig/index.js

@@ -3,14 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = CarouselConfig;
+exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
+var _mobxReact = require("mobx-react");
+
 var _CarouselConfigImageGroup = _interopRequireDefault(require("./CarouselConfigImageGroup"));
 
 var _CarouselConfigSetting = _interopRequireDefault(require("./CarouselConfigSetting"));
 
+var _BaseConfig = _interopRequireDefault(require("../../../../meta-comp/config-panels/BaseConfig"));
+
 var _Collapse = _interopRequireDefault(require("../../../../common/Collapse"));
 
 var _SpacingConfig = _interopRequireDefault(require("../../../common/config-panels/SpacingConfig"));
@@ -23,45 +27,110 @@ var _layout = require("../../../../constants/layout");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function CarouselConfig(props) {
-  var data = props.data;
-  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
-    divider: "bold",
-    headerSize: "large",
-    source: [{
-      key: '1',
-      name: 'Image',
-      value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigImageGroup["default"], {
-        source: data.groupSource
-      })
-    }, {
-      key: '2',
-      name: 'Setting',
-      value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigSetting["default"], {
-        setting: data.setting
-      })
-    }, {
-      key: '3',
-      name: 'Spacing',
-      value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
-        data: data.spacing
-      })
-    }, {
-      key: '4',
-      name: 'Customize',
-      value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
-        component: "carousel",
-        data: data.customize,
-        isHideAlign: true,
-        layoutSource: _layout.carouselLayout
-      })
-    }, {
-      key: '5',
-      name: 'Background',
-      value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
-        data: data.background
-      })
-    }],
-    type: "triangle"
-  }));
-}
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+
+var __extends = void 0 && (void 0).__extends || function () {
+  var _extendStatics = function extendStatics(d, b) {
+    _extendStatics = Object.setPrototypeOf || {
+      __proto__: []
+    } instanceof Array && function (d, b) {
+      d.__proto__ = b;
+    } || function (d, b) {
+      for (var p in b) {
+        if (b.hasOwnProperty(p)) d[p] = b[p];
+      }
+    };
+
+    return _extendStatics(d, b);
+  };
+
+  return function (d, b) {
+    _extendStatics(d, b);
+
+    function __() {
+      this.constructor = d;
+    }
+
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+  };
+}();
+
+var __decorate = void 0 && (void 0).__decorate || function (decorators, target, key, desc) {
+  var c = arguments.length,
+      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
+      d;
+  if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) {
+    if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  }
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+
+var CarouselConfig =
+/** @class */
+function (_super) {
+  __extends(CarouselConfig, _super);
+
+  function CarouselConfig() {
+    return _super !== null && _super.apply(this, arguments) || this;
+  }
+
+  CarouselConfig.prototype.componentDidMount = function () {
+    this.props.store.setState({
+      CarouselStore: {
+        id: this.props.data.id,
+        layout: this.props.data.customize.layout
+      }
+    });
+    this.selfRender();
+  };
+
+  CarouselConfig.prototype.render = function () {
+    var data = this.props.data;
+    return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
+      divider: "bold",
+      headerSize: "large",
+      source: [{
+        key: '1',
+        name: 'Image',
+        value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigImageGroup["default"], {
+          source: data.groupSource
+        })
+      }, {
+        key: '2',
+        name: 'Setting',
+        value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigSetting["default"], {
+          setting: data.setting
+        })
+      }, {
+        key: '3',
+        name: 'Spacing',
+        value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
+          data: data.spacing
+        })
+      }, {
+        key: '4',
+        name: 'Customize',
+        value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
+          component: "carousel",
+          data: data.customize,
+          id: data.id,
+          isHideAlign: true,
+          layoutSource: _layout.carouselLayout
+        })
+      }, {
+        key: '5',
+        name: 'Background',
+        value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
+          data: data.background
+        })
+      }],
+      type: "triangle"
+    }));
+  };
+
+  CarouselConfig = __decorate([(0, _mobxReact.inject)('store'), _mobxReact.observer], CarouselConfig);
+  return CarouselConfig;
+}(_BaseConfig["default"]);
+
+var _default = CarouselConfig;
+exports["default"] = _default;

package/lib/composite-comp/bol/second-config-panels/CarouselSecondConfig/index.js

@@ -76,7 +76,7 @@ function (_super) {
   }
 
   CarouselSecondConfig.prototype.render = function () {
-    var _a;
+    var _a, _b;
 
     var panelProps = this.props.panelProps;
     var textSource = [{
@@ -121,7 +121,7 @@ function (_super) {
       toggleType: 'switch'
     }];
 
-    var _textSource = ((_a = _mobx.store.CarouselStore) === null || _a === void 0 ? void 0 : _a.layout) === 'layout2' ? textSource : [];
+    var _textSource = ((_a = _mobx.store.CarouselStore) === null || _a === void 0 ? void 0 : _a.id) === panelProps.compId && ((_b = _mobx.store.CarouselStore) === null || _b === void 0 ? void 0 : _b.layout) === 'layout2' ? textSource : [];
 
     var getConfig = function getConfig() {
       return /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {

package/lib/composite-comp/common/config-panels/CustomizeConfig/index.js

@@ -75,7 +75,8 @@ function (_super) {
       var _a = _this.props,
           selectedLayoutFun = _a.selectedLayoutFun,
           data = _a.data,
-          component = _a.component;
+          component = _a.component,
+          id = _a.id;
 
       if (selectedLayoutFun) {
         selectedLayoutFun(v);
@@ -99,6 +100,7 @@ function (_super) {
 
         _this.props.store.setState({
           CarouselStore: {
+            id: id,
             layout: v
           }
         });

package/lib/decorator/compositeDecorator.js

@@ -79,7 +79,8 @@ function compositeDecorator(WrappedComponent) {
         }; // 处理复合组件的选中状态
 
         if (window.magicDesign.mode === 'designer') {
-          style.border = '1px solid transparent';
+          // style.border = '1px solid transparent';
+          style.border = 'none';
 
           if (_this.props.nodeData.id === _this.state.clickedFloor) {
             style.border = '1px dashed red';

package/lib/meta-comp/components/Text/index.js

@@ -441,6 +441,9 @@ function (_super) {
       onInput: function onInput(e) {
         var text = e.target.textContent;
         data.text = text;
+        /** 毁灭吧 累了 */
+
+        data.specialContent = [];
         /** 主动更新历史数据避免render */
 
         _this.preData = JSON.stringify(__assign(__assign({}, JSON.parse(_this.preData)), {

package/lib/meta-comp/config-panels/ButtonConfig/index.js

@@ -337,6 +337,10 @@ function (_super) {
         iconUrl: '',
         layout: 'right'
       },
+      spacing: {
+        pc: {},
+        mobile: {}
+      },
       id: '',
       text: 'Button',
       hover: null

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fonixtree/magic-design",
   "author": "Cylon Team",
-  "version": "0.0.1",
+  "version": "0.0.4",
   "description": "Magic Design",
   "license": "MIT",
   "module": "es/index.js",
@@ -14,8 +14,8 @@
     "iconfont": "node ./bin/iconfont.js update",
     "export": "rm -rf dist && npx rollup --config ./config/rollup.config.js",
     "compile": "rc-tools run compile --src=src/components --babel-runtime && cp -r ./src/components/assets/fonts ./es/assets&& cp -r ./src/components/assets/fonts ./lib/assets",
-    "push:h5": "cp -r ./pub-dist/es ../eshoph5_pto/node_modules/@whalecloud/magic-design/",
-    "push:biz": "cp -r ./pub-dist/es ../bizme_pto/node_modules/@whalecloud/magic-design/"
+    "push:h5": "cp -r ./pub-dist/es ../eshoph5_pto/node_modules/@fonixtree/magic-design/",
+    "push:biz": "cp -r ./pub-dist/es ../bizme_pto/node_modules/@fonixtree/magic-design/"
   },
   "dependencies": {
     "antd": "4.20.6",