@fonixtree/magic-design 1.0.135 → 1.0.137

package/es/common/Video/index.js

@@ -334,7 +334,7 @@ var createAliVideo = function createAliVideo(domId, opts) {
       rePlay: false,
       playsinline: true,
       preload: true,
-      controlBarVisibility: 'hover',
+      controlBarVisibility: opts.controlBarHide ? 'never' : 'hover',
       useH5Prism: true,
       skinLayout: skinLayout
     }, _defineProperty(_window$Aliplayer, "autoplay", opts.autoplay), _defineProperty(_window$Aliplayer, "rePlay", opts.loop), _defineProperty(_window$Aliplayer, "components", [{

package/es/composite-comp/dito/components/GroupedCarousel/pc/index.js

@@ -128,14 +128,9 @@ function (_super) {
         }
       }, tab.groupName.open && (tabIndex === index ? /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
         data: tab.hover.groupName,
-        onTextInput: function onTextInput(text) {
-          tab.groupName.text = text;
-        }
+        iconHeight: 46
       }) : /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
-        data: tab.groupName,
-        onTextInput: function onTextInput(text) {
-          tab.hover.groupName.text = text;
-        }
+        data: tab.groupName
       })));
     })), /*#__PURE__*/_react["default"].createElement("div", {
       className: "tab-content"

package/es/composite-comp/dito/components/GroupedCarousel/pc/index.less

@@ -8,7 +8,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    height: 26px;
+    height: 46px;
     overflow: auto;
     position: relative;
     margin-top: 12px;

package/es/composite-comp/dito/components/SearchDITO/pc/components/VideoItem/index.js

@@ -123,7 +123,8 @@ function (_super) {
       },
       opts: __assign(__assign({}, data.video), {
         cover: (0, _coreUtil.getVideoCover)(data),
-        source: data.video.sourceUrl
+        source: data.video.sourceUrl,
+        controlBarHide: true
       }),
       play: (_a = this.videoRefMap[data.id]) === null || _a === void 0 ? void 0 : _a.playing,
       videoId: data.id

package/es/composite-comp/dito/components/SearchDITO/pc/index.js

@@ -524,9 +524,9 @@ function (_super) {
       },
       size: 24,
       type: "icon-ShoppingCartSimple1"
-    })), ((_q = (_p = data.content) === null || _p === void 0 ? void 0 : _p.login) === null || _q === void 0 ? void 0 : _q.open) && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
+    })), ((_q = (_p = data.content) === null || _p === void 0 ? void 0 : _p.login) === null || _q === void 0 ? void 0 : _q.open) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (0, _commonUtil.isLogin)() ? /*#__PURE__*/_react["default"].createElement("div", null) : /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
       data: (_r = data.content) === null || _r === void 0 ? void 0 : _r.login
-    }))), /*#__PURE__*/_react["default"].createElement(_antd.Carousel, {
+    })))), /*#__PURE__*/_react["default"].createElement(_antd.Carousel, {
       key: JSON.stringify(data.groupSource),
       ref: this.carouselRef,
       afterChange: function afterChange(n) {

package/es/composite-comp/dito/components/SlideImage/pc/components/CardItem/index.js

@@ -85,6 +85,7 @@ function (_super) {
     }, rest), /*#__PURE__*/_react["default"].createElement(_VideoItem["default"], {
       data: data
     }), data.groupName.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
+      className: "img-text",
       data: data.groupName
     })));
   };

package/es/composite-comp/dito/components/SlideImage/pc/components/CardItem/index.less

@@ -1,3 +1,7 @@
 .slide-image-card-item-wrap {
   cursor: pointer;
+
+  .img-text {
+    margin-top: 20px;
+  }
 }

package/es/composite-comp/dito/components/SlideImage/pc/components/VideoItem/index.js

@@ -7,7 +7,7 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _NewImg = _interopRequireDefault(require("../../../../../../../common/NewImg"));
+var _classnames = _interopRequireDefault(require("classnames"));
 
 require("./index.less");
 
@@ -53,6 +53,10 @@ function (_super) {
     _this.videoRef = /*#__PURE__*/_react["default"].createRef();
 
     _this.onMouseEnter = function () {
+      var _a;
+
+      if (!((_a = _this.props.data.video) === null || _a === void 0 ? void 0 : _a.sourceUrl)) return;
+
       _this.videoRef.current.play();
 
       _this.setState({
@@ -61,6 +65,10 @@ function (_super) {
     };
 
     _this.onMouseLeave = function () {
+      var _a;
+
+      if (!((_a = _this.props.data.video) === null || _a === void 0 ? void 0 : _a.sourceUrl)) return;
+
       _this.videoRef.current.pause();
 
       _this.setState({
@@ -72,7 +80,7 @@ function (_super) {
   }
 
   VideoItem.prototype.render = function () {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f;
 
     var data = this.props.data;
     var playing = this.state.playing;
@@ -88,10 +96,12 @@ function (_super) {
     }, /*#__PURE__*/_react["default"].createElement("source", {
       src: (_b = data.video) === null || _b === void 0 ? void 0 : _b.sourceUrl,
       type: "video/mp4"
-    })), ((_c = data.overilay) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement(_NewImg["default"], {
-      className: "video-cover-img",
-      lazy: true,
-      src: (_e = (_d = data.overilay) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.pcImgSrc,
+    })), ((_c = data.overilay) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement("img", {
+      alt: "",
+      className: (0, _classnames["default"])('video-img', {
+        cover: (_d = data.video) === null || _d === void 0 ? void 0 : _d.sourceUrl
+      }),
+      src: (_f = (_e = data.overilay) === null || _e === void 0 ? void 0 : _e.content) === null || _f === void 0 ? void 0 : _f.pcImgSrc,
       style: {
         visibility: playing ? 'hidden' : 'visible'
       }

package/es/composite-comp/dito/components/SlideImage/pc/components/VideoItem/index.less

@@ -6,15 +6,19 @@
     width: 100%;
   }
 
-  .video-cover-img {
-    position: absolute;
-    top: 0;
-    right: 0;
-    left: 0;
-    bottom: 0;
-    object-fit: cover;
+  .video-img {
     width: 100%;
-    height: 100%;
-    z-index: 0;
+
+    &.cover {
+      position: absolute;
+      top: 0;
+      right: 0;
+      left: 0;
+      bottom: 0;
+      object-fit: cover;
+      width: 100%;
+      height: 100%;
+      z-index: 0;
+    }
   }
 }

package/es/composite-comp/dito/second-config-panels/SlideImageSecondConfig/index.less

@@ -0,0 +1,71 @@
+.slide_image_second_conf_wrap {
+  .input-url {
+    width: 100%;
+    height: 40px;
+    background: #FFFFFF;
+    border: 1px solid #D2D9E5;
+    border-radius: 8px;
+    display: flex;
+    padding: 9px 14px;
+    display: flex;
+    align-items: center;
+
+    input {
+      border: none;
+      outline: none;
+      height: 24px;
+      flex-grow: 1;
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #232F46;
+    }
+
+    /* 使用webkit内核的浏览器 */
+    input::-webkit-input-placeholder {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8493AF;
+    }
+
+    /* Firefox版本4-18 */
+    input:-moz-placeholder {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8493AF;
+    }
+
+    /* Firefox版本19+ */
+    input::-moz-placeholder {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8493AF;
+    }
+
+    /* IE浏览器 */
+    input:-ms-input-placeholder {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8493AF;
+    }
+
+    .icon-btns {
+      display: flex;
+      align-items: center;
+
+      &>span {
+        margin-left: 12px;
+        cursor: pointer;
+      }
+    }
+  }
+}

package/es/core/Renderer/index.js

@@ -46,6 +46,7 @@ var setDesignConfig = function setDesignConfig(props) {
       device = props.device,
       isPreview = props.isPreview,
       projectCode = props.projectCode;
+  console.log('window.magicDesign', props);
   window.magicDesign = __assign(__assign({
     pageBackground: '#f2f2f2',
     mode: 'renderer',

package/es/decorator/compositeDecorator.js

@@ -144,7 +144,7 @@ function compositeDecorator(WrappedComponent) {
         var zIndex = '0';
         var position = 'relative';
 
-        if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY') {
+        if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY' || nodeData.type === 'SLIDE_IMAGE') {
           zIndex = '1';
         } // 解决pc导航hover上去，类目被下面组件遮罩的问题
 

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

@@ -104,7 +104,8 @@ function (_super) {
 
     var _b = this.props,
         data = _b.data,
-        className = _b.className;
+        className = _b.className,
+        iconHeight = _b.iconHeight;
     var hover = this.state.hover;
     this.preData = JSON.stringify(data);
     this.preDevice = window.magicDesign.device;
@@ -163,7 +164,10 @@ function (_super) {
     }, (iconLayout === 'right' || iconLayout === 'bottom') && /*#__PURE__*/_react["default"].createElement(_editable["default"], this.props), iconUrl && /*#__PURE__*/_react["default"].createElement("img", {
       alt: "",
       className: "icon",
-      src: iconUrl
+      src: iconUrl,
+      style: {
+        height: iconHeight + "px"
+      }
     }), (iconLayout === 'left' || iconLayout === 'top') && /*#__PURE__*/_react["default"].createElement(_editable["default"], this.props)));
   };
 
@@ -171,7 +175,8 @@ function (_super) {
     data: {},
     className: '',
     readonly: false,
-    onTextInput: function onTextInput() {}
+    onTextInput: function onTextInput() {},
+    iconHeight: 20
   };
 
   __decorate([(0, _decorator.shouldUpdate)()], Button.prototype, "shouldComponentUpdate", null);

package/es/utils/coreUtil.js

@@ -316,13 +316,12 @@ var clickUrl = function clickUrl(url, state) {
   }
 
   var _b = _typeof(url) === 'object' ? (0, _businessUtil.newParseUrl)(url) : (0, _businessUtil.parseUrl)(url),
-      link = _b.link,
+      _link = _b.link,
       data = _b.data;
 
+  var link = !isPc() ? "/web" + _link : _link;
   var _c = data.params,
-      params = _c === void 0 ? {} : _c; // console.log('clicked data:', data);
-  // console.log({ type: 'jumpBrowser', params: { url: params.link } });
-
+      params = _c === void 0 ? {} : _c;
   /** 锚点跳转 */
 
   if (params.type === 'ANCHOR') {

package/lib/common/Video/index.js

@@ -334,7 +334,7 @@ var createAliVideo = function createAliVideo(domId, opts) {
       rePlay: false,
       playsinline: true,
       preload: true,
-      controlBarVisibility: 'hover',
+      controlBarVisibility: opts.controlBarHide ? 'never' : 'hover',
       useH5Prism: true,
       skinLayout: skinLayout
     }, _defineProperty(_window$Aliplayer, "autoplay", opts.autoplay), _defineProperty(_window$Aliplayer, "rePlay", opts.loop), _defineProperty(_window$Aliplayer, "components", [{

package/lib/composite-comp/dito/components/GroupedCarousel/pc/index.js

@@ -128,14 +128,9 @@ function (_super) {
         }
       }, tab.groupName.open && (tabIndex === index ? /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
         data: tab.hover.groupName,
-        onTextInput: function onTextInput(text) {
-          tab.groupName.text = text;
-        }
+        iconHeight: 46
       }) : /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
-        data: tab.groupName,
-        onTextInput: function onTextInput(text) {
-          tab.hover.groupName.text = text;
-        }
+        data: tab.groupName
       })));
     })), /*#__PURE__*/_react["default"].createElement("div", {
       className: "tab-content"

package/lib/composite-comp/dito/components/GroupedCarousel/pc/index.less

@@ -8,7 +8,7 @@
     display: flex;
     align-items: center;
     justify-content: center;
-    height: 26px;
+    height: 46px;
     overflow: auto;
     position: relative;
     margin-top: 12px;

package/lib/composite-comp/dito/components/SearchDITO/pc/components/VideoItem/index.js

@@ -123,7 +123,8 @@ function (_super) {
       },
       opts: __assign(__assign({}, data.video), {
         cover: (0, _coreUtil.getVideoCover)(data),
-        source: data.video.sourceUrl
+        source: data.video.sourceUrl,
+        controlBarHide: true
       }),
       play: (_a = this.videoRefMap[data.id]) === null || _a === void 0 ? void 0 : _a.playing,
       videoId: data.id

package/lib/composite-comp/dito/components/SearchDITO/pc/index.js

@@ -524,9 +524,9 @@ function (_super) {
       },
       size: 24,
       type: "icon-ShoppingCartSimple1"
-    })), ((_q = (_p = data.content) === null || _p === void 0 ? void 0 : _p.login) === null || _q === void 0 ? void 0 : _q.open) && /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
+    })), ((_q = (_p = data.content) === null || _p === void 0 ? void 0 : _p.login) === null || _q === void 0 ? void 0 : _q.open) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, (0, _commonUtil.isLogin)() ? /*#__PURE__*/_react["default"].createElement("div", null) : /*#__PURE__*/_react["default"].createElement(_components.MetaButton, {
       data: (_r = data.content) === null || _r === void 0 ? void 0 : _r.login
-    }))), /*#__PURE__*/_react["default"].createElement(_antd.Carousel, {
+    })))), /*#__PURE__*/_react["default"].createElement(_antd.Carousel, {
       key: JSON.stringify(data.groupSource),
       ref: this.carouselRef,
       afterChange: function afterChange(n) {

package/lib/composite-comp/dito/components/SlideImage/pc/components/CardItem/index.js

@@ -85,6 +85,7 @@ function (_super) {
     }, rest), /*#__PURE__*/_react["default"].createElement(_VideoItem["default"], {
       data: data
     }), data.groupName.open && /*#__PURE__*/_react["default"].createElement(_components.MetaText, {
+      className: "img-text",
       data: data.groupName
     })));
   };

package/lib/composite-comp/dito/components/SlideImage/pc/components/CardItem/index.less

@@ -1,3 +1,7 @@
 .slide-image-card-item-wrap {
   cursor: pointer;
+
+  .img-text {
+    margin-top: 20px;
+  }
 }

package/lib/composite-comp/dito/components/SlideImage/pc/components/VideoItem/index.js

@@ -7,7 +7,7 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
-var _NewImg = _interopRequireDefault(require("../../../../../../../common/NewImg"));
+var _classnames = _interopRequireDefault(require("classnames"));
 
 require("./index.less");
 
@@ -53,6 +53,10 @@ function (_super) {
     _this.videoRef = /*#__PURE__*/_react["default"].createRef();
 
     _this.onMouseEnter = function () {
+      var _a;
+
+      if (!((_a = _this.props.data.video) === null || _a === void 0 ? void 0 : _a.sourceUrl)) return;
+
       _this.videoRef.current.play();
 
       _this.setState({
@@ -61,6 +65,10 @@ function (_super) {
     };
 
     _this.onMouseLeave = function () {
+      var _a;
+
+      if (!((_a = _this.props.data.video) === null || _a === void 0 ? void 0 : _a.sourceUrl)) return;
+
       _this.videoRef.current.pause();
 
       _this.setState({
@@ -72,7 +80,7 @@ function (_super) {
   }
 
   VideoItem.prototype.render = function () {
-    var _a, _b, _c, _d, _e;
+    var _a, _b, _c, _d, _e, _f;
 
     var data = this.props.data;
     var playing = this.state.playing;
@@ -88,10 +96,12 @@ function (_super) {
     }, /*#__PURE__*/_react["default"].createElement("source", {
       src: (_b = data.video) === null || _b === void 0 ? void 0 : _b.sourceUrl,
       type: "video/mp4"
-    })), ((_c = data.overilay) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement(_NewImg["default"], {
-      className: "video-cover-img",
-      lazy: true,
-      src: (_e = (_d = data.overilay) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.pcImgSrc,
+    })), ((_c = data.overilay) === null || _c === void 0 ? void 0 : _c.open) && /*#__PURE__*/_react["default"].createElement("img", {
+      alt: "",
+      className: (0, _classnames["default"])('video-img', {
+        cover: (_d = data.video) === null || _d === void 0 ? void 0 : _d.sourceUrl
+      }),
+      src: (_f = (_e = data.overilay) === null || _e === void 0 ? void 0 : _e.content) === null || _f === void 0 ? void 0 : _f.pcImgSrc,
       style: {
         visibility: playing ? 'hidden' : 'visible'
       }

package/lib/composite-comp/dito/components/SlideImage/pc/components/VideoItem/index.less

@@ -6,15 +6,19 @@
     width: 100%;
   }
 
-  .video-cover-img {
-    position: absolute;
-    top: 0;
-    right: 0;
-    left: 0;
-    bottom: 0;
-    object-fit: cover;
+  .video-img {
     width: 100%;
-    height: 100%;
-    z-index: 0;
+
+    &.cover {
+      position: absolute;
+      top: 0;
+      right: 0;
+      left: 0;
+      bottom: 0;
+      object-fit: cover;
+      width: 100%;
+      height: 100%;
+      z-index: 0;
+    }
   }
 }

package/lib/composite-comp/dito/second-config-panels/SlideImageSecondConfig/index.less

@@ -0,0 +1,71 @@
+.slide_image_second_conf_wrap {
+  .input-url {
+    width: 100%;
+    height: 40px;
+    background: #FFFFFF;
+    border: 1px solid #D2D9E5;
+    border-radius: 8px;
+    display: flex;
+    padding: 9px 14px;
+    display: flex;
+    align-items: center;
+
+    input {
+      border: none;
+      outline: none;
+      height: 24px;
+      flex-grow: 1;
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #232F46;
+    }
+
+    /* 使用webkit内核的浏览器 */
+    input::-webkit-input-placeholder {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8493AF;
+    }
+
+    /* Firefox版本4-18 */
+    input:-moz-placeholder {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8493AF;
+    }
+
+    /* Firefox版本19+ */
+    input::-moz-placeholder {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8493AF;
+    }
+
+    /* IE浏览器 */
+    input:-ms-input-placeholder {
+      font-family: 'Open Sans';
+      font-style: normal;
+      font-weight: 400;
+      font-size: 14px;
+      color: #8493AF;
+    }
+
+    .icon-btns {
+      display: flex;
+      align-items: center;
+
+      &>span {
+        margin-left: 12px;
+        cursor: pointer;
+      }
+    }
+  }
+}

package/lib/core/Renderer/index.js

@@ -46,6 +46,7 @@ var setDesignConfig = function setDesignConfig(props) {
       device = props.device,
       isPreview = props.isPreview,
       projectCode = props.projectCode;
+  console.log('window.magicDesign', props);
   window.magicDesign = __assign(__assign({
     pageBackground: '#f2f2f2',
     mode: 'renderer',

package/lib/decorator/compositeDecorator.js

@@ -144,7 +144,7 @@ function compositeDecorator(WrappedComponent) {
         var zIndex = '0';
         var position = 'relative';
 
-        if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY') {
+        if (nodeData.type === 'CAROUSEL' || nodeData.type === 'IMAGE_GALLERY' || nodeData.type === 'SLIDE_IMAGE') {
           zIndex = '1';
         } // 解决pc导航hover上去，类目被下面组件遮罩的问题
 

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

@@ -104,7 +104,8 @@ function (_super) {
 
     var _b = this.props,
         data = _b.data,
-        className = _b.className;
+        className = _b.className,
+        iconHeight = _b.iconHeight;
     var hover = this.state.hover;
     this.preData = JSON.stringify(data);
     this.preDevice = window.magicDesign.device;
@@ -163,7 +164,10 @@ function (_super) {
     }, (iconLayout === 'right' || iconLayout === 'bottom') && /*#__PURE__*/_react["default"].createElement(_editable["default"], this.props), iconUrl && /*#__PURE__*/_react["default"].createElement("img", {
       alt: "",
       className: "icon",
-      src: iconUrl
+      src: iconUrl,
+      style: {
+        height: iconHeight + "px"
+      }
     }), (iconLayout === 'left' || iconLayout === 'top') && /*#__PURE__*/_react["default"].createElement(_editable["default"], this.props)));
   };
 
@@ -171,7 +175,8 @@ function (_super) {
     data: {},
     className: '',
     readonly: false,
-    onTextInput: function onTextInput() {}
+    onTextInput: function onTextInput() {},
+    iconHeight: 20
   };
 
   __decorate([(0, _decorator.shouldUpdate)()], Button.prototype, "shouldComponentUpdate", null);

package/lib/utils/coreUtil.js

@@ -316,13 +316,12 @@ var clickUrl = function clickUrl(url, state) {
   }
 
   var _b = _typeof(url) === 'object' ? (0, _businessUtil.newParseUrl)(url) : (0, _businessUtil.parseUrl)(url),
-      link = _b.link,
+      _link = _b.link,
       data = _b.data;
 
+  var link = !isPc() ? "/web" + _link : _link;
   var _c = data.params,
-      params = _c === void 0 ? {} : _c; // console.log('clicked data:', data);
-  // console.log({ type: 'jumpBrowser', params: { url: params.link } });
-
+      params = _c === void 0 ? {} : _c;
   /** 锚点跳转 */
 
   if (params.type === 'ANCHOR') {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@fonixtree/magic-design",
   "author": "Cylon Team",
-  "version": "1.0.135",
+  "version": "1.0.137",
   "description": "Magic Design",
   "license": "MIT",
   "module": "es/index.js",