@fonixtree/magic-design 2.0.216 → 2.0.221

package/lib/core/Designer/ToolBarModal/ToolBtn/components/BulletPicker/IconSelectPicker/index.less

@@ -0,0 +1,60 @@
+.align-select-picker-panel {
+  z-index: 999;
+  position: absolute;
+  top: 100%;
+  left: 0;
+
+  .panel-bg {
+    position: fixed;
+    z-index: 0;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+  }
+
+  .select-modal-content {
+    display: flex;
+    align-items: center;
+    padding: 5px;
+    background-color: #fff;
+    border: 1px solid #E7E9E8;
+    box-shadow: 0 8px 16px 4px hsla(0, 0%, 0%, 0.04);
+    color: #262626;
+    border-radius: 6px;
+    flex-direction: column;
+
+    .select-content-row {
+      display: flex;
+      align-items: center;
+    }
+
+    .select-item {
+      width: 26px;
+      height: 26px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
+      border-radius: 6px;
+      padding: 0;
+      border: none;
+      transition: .2s all linear;
+      position: relative;
+      margin: 0 5px;
+
+      &:hover {
+        background: #f8f8f8;
+      }
+
+      &.active {
+        background: #E7E9E8;
+      }
+
+      svg {
+        height: 18px;
+        height: 18px;
+      }
+    }
+  }
+}

package/lib/core/Designer/ToolBarModal/ToolBtn/components/BulletPicker/index.js

@@ -19,6 +19,8 @@ var _SquareSVG = _interopRequireDefault(require("./images/SquareSVG"));
 
 var _Iconfont = _interopRequireDefault(require("../../../../../../common/Iconfont"));
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {

package/lib/core/Designer/ToolBarModal/ToolBtn/components/BulletPicker/index.less

@@ -0,0 +1,10 @@
+.bullet-tool-btn-wrap {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 3px;
+
+  .btn_icon {
+    margin-left: 3px;
+  }
+}

package/lib/core/Designer/ToolBarModal/ToolBtn/components/ColorPickerBtn/UnderlineSelectPicker/index.js

@@ -9,6 +9,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _UnderlineSelect = _interopRequireDefault(require("../../../../../../../meta-comp/config-panels/TextConfig/UnderlineSelect"));
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {

package/lib/core/Designer/ToolBarModal/ToolBtn/components/ColorPickerBtn/UnderlineSelectPicker/index.less

@@ -0,0 +1,27 @@
+.align-select-picker-panel {
+  z-index: 999;
+  position: absolute;
+  top: 100%;
+  left: 0;
+
+  .panel-bg {
+    position: fixed;
+    z-index: 0;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+  }
+
+  .select-modal-content {
+    display: flex;
+    align-items: center;
+    padding: 5px;
+    background-color: #fff;
+    border: 1px solid #E7E9E8;
+    box-shadow: 0 8px 16px 4px hsla(0, 0%, 0%, 0.04);
+    color: #262626;
+    border-radius: 6px;
+    flex-direction: column;
+  }
+}

package/lib/core/Designer/ToolBarModal/ToolBtn/components/ColorPickerBtn/index.js

@@ -21,6 +21,8 @@ var _ColorPicker = _interopRequireDefault(require("../../../../../../common/Colo
 
 var _Iconfont = _interopRequireDefault(require("../../../../../../common/Iconfont"));
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {

package/lib/core/Designer/ToolBarModal/ToolBtn/components/ColorPickerBtn/index.less

@@ -0,0 +1,27 @@
+.color-picker-tool-btn-wrap {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  >div {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
+
+  &.padding {
+    padding: 0 5px;
+  }
+
+  .underlineWrap {
+    position: absolute;
+    left: 0;
+    top: 27px;
+    padding: 5px;
+    background-color: #fff;
+    // border: 1px solid #E7E9E8;
+    box-shadow: 0 8px 16px 4px hsla(0, 0%, 0%, 0.04);
+    color: #262626;
+    border-radius: 6px;
+  }
+}

package/lib/core/Designer/ToolBarModal/ToolBtn/components/LinkBtn/LinkInputPicker/index.js

@@ -11,6 +11,8 @@ var _common = require("../../../../../../../common");
 
 var _locale = require("../../../../../../../locale");
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {

package/lib/core/Designer/ToolBarModal/ToolBtn/components/LinkBtn/LinkInputPicker/index.less

@@ -0,0 +1,39 @@
+.link-input-picker-panel {
+  z-index: 999;
+  position: absolute;
+  top: calc(100% + 8px);
+  right: 0;
+
+  .panel-bg {
+    position: fixed;
+    z-index: 0;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+  }
+
+  .panel-content {
+    display: flex;
+    align-items: center;
+    padding: 16px;
+    border: 1px solid rgba(0, 0, 0, .04);
+    background-color: #fff;
+    border-radius: 8px;
+
+    .commit-btn {
+      margin-left: 12px;
+      background-color: #2e54eb;
+      padding: 5px 12px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: #fff;
+      border-radius: 8px;
+      white-space: nowrap;
+      font-size: 12px;
+      cursor: pointer;
+      position: relative;
+    }
+  }
+}

package/lib/core/Designer/ToolBarModal/ToolBtn/components/LinkBtn/index.js

@@ -13,6 +13,8 @@ var _LinkInputPicker = _interopRequireDefault(require("./LinkInputPicker"));
 
 var _LinkSVG = _interopRequireDefault(require("../../images/LinkSVG"));
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {

package/lib/core/Designer/ToolBarModal/ToolBtn/components/LinkBtn/index.less

@@ -0,0 +1,26 @@
+.tool-btn-wrap {
+  width: 26px;
+  height: 26px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  border-radius: 6px;
+  padding: 0;
+  border: none;
+  transition: .2s all linear;
+  position: relative;
+
+  &:hover {
+    background: #f8f8f8;
+  }
+
+  &.active {
+    background: #E7E9E8;
+  }
+
+  svg {
+    height: 18px;
+    height: 18px;
+  }
+}

package/lib/core/Designer/ToolBarModal/ToolBtn/components/OrderedPicker/IconSelectPicker/index.js

@@ -21,6 +21,8 @@ var _LowerRomanSVG = _interopRequireDefault(require("../images/LowerRomanSVG"));
 
 var _UpperRomanSVG = _interopRequireDefault(require("../images/UpperRomanSVG"));
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {

package/lib/core/Designer/ToolBarModal/ToolBtn/components/OrderedPicker/IconSelectPicker/index.less

@@ -0,0 +1,60 @@
+.align-select-picker-panel {
+  z-index: 999;
+  position: absolute;
+  top: 100%;
+  left: 0;
+
+  .panel-bg {
+    position: fixed;
+    z-index: 0;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+  }
+
+  .select-modal-content {
+    display: flex;
+    align-items: center;
+    padding: 5px;
+    background-color: #fff;
+    border: 1px solid #E7E9E8;
+    box-shadow: 0 8px 16px 4px hsla(0, 0%, 0%, 0.04);
+    color: #262626;
+    border-radius: 6px;
+    flex-direction: column;
+
+    .select-content-row{
+      display: flex;
+      align-items: center;
+    }
+
+    .select-item {
+      width: 26px;
+      height: 26px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
+      border-radius: 6px;
+      padding: 0;
+      border: none;
+      transition: .2s all linear;
+      position: relative;
+      margin: 0 5px;
+
+      &:hover {
+        background: #f8f8f8;
+      }
+
+      &.active {
+        background: #E7E9E8;
+      }
+
+      svg {
+        height: 18px;
+        height: 18px;
+      }
+    }
+  }
+}

package/lib/core/Designer/ToolBarModal/ToolBtn/components/OrderedPicker/index.js

@@ -25,6 +25,8 @@ var _UpperRomanSVG = _interopRequireDefault(require("./images/UpperRomanSVG"));
 
 var _Iconfont = _interopRequireDefault(require("../../../../../../common/Iconfont"));
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {

package/lib/core/Designer/ToolBarModal/ToolBtn/components/OrderedPicker/index.less

@@ -0,0 +1,10 @@
+.ordered-tool-btn-wrap {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0 3px;
+
+  .btn_icon {
+    margin-left: 3px;
+  }
+}

package/lib/core/Designer/ToolBarModal/ToolBtn/index.js

@@ -37,6 +37,8 @@ var _BulletPicker = _interopRequireDefault(require("./components/BulletPicker"))
 
 var _OrderedPicker = _interopRequireDefault(require("./components/OrderedPicker"));
 
+require("./index.less");
+
 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); }

package/lib/core/Designer/ToolBarModal/ToolBtn/index.less

@@ -0,0 +1,26 @@
+.tool-btn-wrap {
+  width: auto;
+  min-width: 26px;
+  height: 26px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  border-radius: 6px;
+  padding: 0;
+  border: none;
+  transition: .2s all linear;
+
+  &:hover {
+    background: #f8f8f8;
+  }
+
+  &.active {
+    background: #E7E9E8;
+  }
+
+  svg {
+    height: 18px;
+    height: 18px;
+  }
+}

package/lib/core/Designer/ToolBarModal/index.js

@@ -17,6 +17,8 @@ var _locale = require("../../../locale");
 
 var _constants = require("../../../constants");
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {

package/lib/core/Designer/ToolBarModal/index.less

@@ -0,0 +1,33 @@
+.toolbar-wrap {
+  display: flex;
+  border-bottom: 1px solid rgba(0, 0, 0, .04);
+  border-top: 1px solid rgba(0, 0, 0, .04);
+  position: absolute;
+  border-radius: 6px;
+  top: 0;
+  left: 0;
+  z-index: 999;
+  background: #fff;
+  transform: translateY(calc(-100% - 1px));
+  flex-direction: column;
+  padding: 3px 0;
+
+  .tool-item {
+    margin: 0 5px;
+    display: flex;
+  }
+
+  .tooll-line {
+    display: inline-flex;
+    width: 1px;
+    height: 16px;
+    background-color: #C1C9D7;
+    margin: 0 5px;
+  }
+
+  .toolbar-row {
+    display: flex;
+    align-items: center;
+    height: 35px;
+  }
+}

package/lib/core/Designer/ViewArea/index.js

@@ -23,6 +23,8 @@ var _coreUtil = require("../../../utils/coreUtil");
 
 var _locale = require("../../../locale");
 
+require("./index.less");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

package/lib/core/Designer/ViewArea/index.less

@@ -0,0 +1,89 @@
+.design-area-wrap {
+  width: calc(100vw - 354px);
+  flex: auto;
+  background: #F5F6F7;
+  display: flex;
+  flex-direction: column;
+  padding-left: 1px;
+  transition-property: all;
+  transition-duration: .3s;
+  transition-timing-function: ease;
+
+  .appointment_wrap {
+    flex-shrink: 0;
+    height: 44px;
+    background-color: #FFF8F0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    .appointment_tip {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 13px;
+      color: #FF8541;
+    }
+
+    .cancel_btn {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 13px;
+      margin-left: 10px;
+      display: flex;
+      align-items: center;
+      padding: 0 12px;
+      height: 22px;
+      background-color: #2F54EB;
+      border-radius: 4px;
+      color: #FFF;
+      cursor: pointer;
+    }
+  }
+
+  &.phone-edit {
+    margin-left: 355px;
+  }
+
+  .phone_view_area {
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 24px 0;
+
+    .device_border {
+      width: 375px;
+      max-height: 691px;
+      height: calc(100vh - 150px);
+      overflow: scroll;
+      overflow-x: hidden;
+      border: 10px solid #FFF;
+      background-color: #F2F2F2;
+      border-radius: 12px;
+      box-sizing: content-box;
+
+    }
+  }
+
+  .pc_view_area {
+    flex-grow: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 24px;
+
+    .device_border {
+      width: 100%;
+      padding: 1px;
+      min-height: 70vh;
+      border: 16px solid #FFF;
+      border-radius: 12px;
+      max-height: calc(100vh - 180px);
+      height: 100%;
+      overflow: scroll;
+      box-sizing: content-box;
+    }
+  }
+}

package/lib/core/Designer/index.js

@@ -49,6 +49,8 @@ var _storeUtil = require("../../utils/storeUtil");
 
 var _commonUtil = require("../../utils/commonUtil");
 
+require("./index.less");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

package/lib/core/Designer/index.less

@@ -0,0 +1,6 @@
+.designer-wrap {
+  display: flex;
+  width: 100%;
+  height: 100vh;
+  background-color: #F5F6F7;
+}

package/lib/decorator/compositeDecorator.js

@@ -87,7 +87,27 @@ function compositeDecorator(WrappedComponent) {
 
       _this.state = {
         clickedFloor: '',
-        hoveredFloor: ''
+        hoveredFloor: '',
+        hasContent: true
+      };
+      _this.wrapperRef = /*#__PURE__*/_react["default"].createRef();
+      _this.checkTimeout = null;
+
+      _this.checkContentAfterMount = function () {
+        // 延迟检查，确保子组件已经渲染
+        if (_this.checkTimeout) {
+          clearTimeout(_this.checkTimeout);
+        }
+
+        _this.checkTimeout = setTimeout(function () {
+          var hasContent = _this.checkComponentHasContent();
+
+          if (_this.state.hasContent !== hasContent) {
+            _this.setState({
+              hasContent: hasContent
+            });
+          }
+        }, 100);
       };
 
       _this.switchLanguage = function (value) {
@@ -134,6 +154,21 @@ function compositeDecorator(WrappedComponent) {
         window.document.dispatchEvent(evt);
       };
 
+      _this.checkComponentHasContent = function () {
+        var _a, _b, _c;
+
+        if (_this.wrapperRef.current) {
+          var wrapperElement = _this.wrapperRef.current; // console.log('....', wrapperElement.children[1]?.children[0])
+
+          var hasChildren = ((_c = (_b = (_a = wrapperElement.children[1]) === null || _a === void 0 ? void 0 : _a.children[0]) === null || _b === void 0 ? void 0 : _b.children) === null || _c === void 0 ? void 0 : _c.length) > 0;
+          ;
+          if (hasChildren) return true;
+        } // 默认返回false，表示没有数据（这样可以隐藏没有数据的组件）
+
+
+        return false;
+      };
+
       _this.getCompositeStyle = function () {
         var _a;
 
@@ -143,6 +178,10 @@ function compositeDecorator(WrappedComponent) {
         var _b = window.magicDesign,
             device = _b.device,
             compWidth = _b.compWidth;
+        var hasContent = _this.state.hasContent;
+        if (!hasContent) return {
+          display: 'none'
+        };
         var zIndex = '0';
         var position = 'relative';
 
@@ -295,7 +334,18 @@ function compositeDecorator(WrappedComponent) {
           hoveredFloor: _mobx.store.hoveredFloor
         });
       });
-      this.getOuterWrapStyle(); // if (browserVersion().isDelivistaApp) {
+      this.getOuterWrapStyle(); // 初始检查内容
+
+      var initialHasContent = this.checkComponentHasContent();
+
+      if (initialHasContent !== this.state.hasContent) {
+        this.setState({
+          hasContent: initialHasContent
+        });
+      } // 延迟再次检查，确保动态加载的数据也能被检测到
+
+
+      this.checkContentAfterMount(); // if (browserVersion().isDelivistaApp) {
 
       window['switchLanguage'] = this.switchLanguage;
       window['getUserAddress'] = this.getUserAddress; // switchLanguage();
@@ -303,8 +353,19 @@ function compositeDecorator(WrappedComponent) {
       // }
     };
 
+    Wrapper.prototype.componentDidUpdate = function (prevProps) {
+      // 只在props变化时检查内容
+      if (prevProps.nodeData !== this.props.nodeData) {
+        this.checkContentAfterMount();
+      }
+    };
+
     Wrapper.prototype.componentWillUnmount = function () {
       this.distroy();
+
+      if (this.checkTimeout) {
+        clearTimeout(this.checkTimeout);
+      }
     };
 
     Wrapper.prototype.render = function () {
@@ -313,6 +374,7 @@ function compositeDecorator(WrappedComponent) {
       var nodeData = this.props.nodeData;
       var clickedFloor = this.state.clickedFloor;
       return /*#__PURE__*/_react["default"].createElement("div", {
+        ref: this.wrapperRef,
         className: "composite_wrap",
         onClick: this.onCompositeCompClick,
         onMouseEnter: this.onMouseEnter,

package/lib/index.js

@@ -28,8 +28,14 @@ Object.defineProperty(exports, "clickUrl", {
   }
 });
 
+require("./assets/fonts/magic-box-iconfont.css");
+
 var _coreUtil = require("./utils/coreUtil");
 
+require("./assets/less/index.less");
+
+require("./assets/less/cylon-antd.less");
+
 var _Designer = _interopRequireDefault(require("./core/Designer"));
 
 var _Renderer = _interopRequireDefault(require("./core/Renderer"));

package/lib/meta-comp/components/Button/editable.js

@@ -9,6 +9,8 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
+require("./editable.less");
+
 var _coreUtil = require("../../../utils/coreUtil");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

package/lib/meta-comp/components/Button/editable.less

@@ -0,0 +1,6 @@
+.editable-item {
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}