@fonixtree/magic-design 2.0.162 → 2.0.163

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

@@ -0,0 +1,124 @@
+.m-recommend-pc {
+  display: flex;
+  flex-direction: column;
+  position: relative;
+
+  .cylon-tabs-nav-operations {
+    display: none !important;
+  }
+
+  // ::-webkit-scrollbar {
+  //   width: 0;
+  //   height: 0;
+  //   display: none;
+  // }
+
+  .tab-select-wrap {
+    display: flex;
+    align-items: center;
+    height: 50px;
+    background: rgb(255 255 255);
+    overflow: auto;
+    position: relative;
+    margin-bottom: 15px;
+
+    .tabTitle {
+      display: flex;
+      align-items: center;
+      text-align: center;
+      padding: 0 24px;
+      width: fit-content;
+      height: 100%;
+      justify-content: center;
+      white-space: nowrap;
+      flex-direction: column;
+      cursor: pointer;
+
+      img {
+        height: 24px;
+        width: 24px;
+        margin-bottom: 2px;
+      }
+    }
+
+    .active-line {
+      position: absolute;
+      bottom: 0;
+      width: 200px;
+      height: 3px;
+      background-color: #fff;
+      transition: .2s all linear;
+      border-radius: 1.5px;
+    }
+  }
+
+  .tab-content {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+
+    .tab-list {
+      width: 100%;
+    }
+  }
+
+  .arrow-icon {
+    display: block;
+    width: 36px;
+    height: 36px;
+    line-height: 42px;
+    text-align: center;
+    background: #FFFFFF;
+    box-shadow: -1px -1px 4px rgba(45, 48, 64, 0.08), 1px 1px 4px rgba(45, 48, 64, 0.08);
+    border-radius: 100px;
+    cursor: pointer;
+
+    &.left {
+      margin-right: 15px;
+    }
+
+    &.right {
+      margin-left: 15px;
+    }
+  }
+
+  .macyContainer {
+    display: flex;
+    margin: 0;
+  }
+
+  .scrollContainer {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    flex: 1;
+    margin: 0;
+    overflow-x: auto;
+    padding-bottom: 15px;
+
+    &.pl_100 {
+      padding-left: 100px;
+    }
+
+    .scrollProductList {
+      display: flex;
+      flex-direction: row;
+      align-items: flex-start;
+
+      .productCard {
+        margin-right: 20px;
+      }
+    }
+  }
+
+  .btnSeeAll {
+    display: block;
+    width: fit-content;
+    min-width: 80px;
+    flex: none;
+
+    &.line {
+      margin: 0 auto 10px auto;
+    }
+  }
+}

package/lib/composite-comp/dito/components/SearchBar/defaultJSON.js

@@ -0,0 +1,110 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getDefaultJSON = void 0;
+
+var _uuid = require("uuid");
+
+var getDefaultJSON = function getDefaultJSON() {
+  return {
+    id: (0, _uuid.v4)(),
+    type: 'SEARCH',
+    content: {
+      logo: {
+        id: (0, _uuid.v4)(),
+        open: true,
+        type: 'IMAGE',
+        content: {
+          h5Name: 'name2',
+          pcName: 'name2',
+          h5ImgSrc: '',
+          pcImgSrc: '',
+          clickUrl: ''
+        },
+        hover: {
+          open: false,
+          backgroundType: 'enlarge',
+          magnification: 1.5,
+          pcImgHoverUrl: '',
+          h5ImgHoverUrl: ''
+        }
+      },
+      box: {
+        id: (0, _uuid.v4)(),
+        open: true,
+        color: {
+          pc: '#D92929',
+          mobile: '#D2D9E5'
+        },
+        backgroundColor: {
+          pc: '#fff',
+          mobile: '#fff'
+        }
+      },
+      keyword: {
+        id: (0, _uuid.v4)(),
+        open: true,
+        type: 'InputField',
+        placeholder: 'Tshirt Woman',
+        content: {
+          sizeType: 'Customize font styles',
+          fontFamily: 'Open Sans',
+          fontWeight: 600,
+          fontSize: 12,
+          pcFontSize: 14,
+          color: '#CE1126'
+        }
+      },
+      placeholder: {
+        id: (0, _uuid.v4)(),
+        open: true,
+        text: 'Search product, store, or brand'
+      },
+      icon: {
+        id: (0, _uuid.v4)(),
+        open: true,
+        color: {
+          pc: '#D92929',
+          mobile: '#232F46'
+        },
+        cartIcon: {
+          pc: true,
+          mobile: true
+        },
+        messageIcon: {
+          pc: false,
+          mobile: true
+        }
+      }
+    },
+    spacing: {
+      pc: {
+        paddingTop: 20,
+        paddingBottom: 30,
+        marginBottom: window.magicDesign.compSpacing * 1.5,
+        fillUp: false
+      },
+      mobile: {
+        paddingTop: 8,
+        paddingBottom: 8,
+        paddingLeft: 15,
+        paddingRight: 15,
+        marginBottom: window.magicDesign.compSpacing
+      }
+    },
+    customize: {
+      layout: 'left',
+      align: 'left'
+    },
+    background: {
+      opacity: 100,
+      color: '#fff',
+      image: '',
+      bgType: 'color'
+    }
+  };
+};
+
+exports.getDefaultJSON = getDefaultJSON;

package/lib/composite-comp/dito/components/SearchBar/imgs/dito-logo.svg

@@ -0,0 +1,6 @@
+<svg width="69" height="20" viewBox="0 0 69 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M11.459 0.0166016H5.12022C3.76042 0.0194901 2.45736 0.562029 1.49731 1.52504C0.53725 2.48804 -0.00128482 3.79276 2.3019e-06 5.15257V19.5672C-0.000156996 19.6234 0.0107454 19.679 0.0320869 19.7309C0.0534285 19.7829 0.0847912 19.8301 0.124385 19.8699C0.163978 19.9097 0.211026 19.9414 0.262844 19.963C0.314661 19.9846 0.370232 19.9958 0.426385 19.996H11.5535C13.7819 19.9912 15.9171 19.1014 17.4895 17.5224C19.0619 15.9435 19.9427 13.8045 19.9382 11.5762V8.52608C19.9414 6.27348 19.0501 4.11179 17.4601 2.51612C15.8701 0.92046 13.7116 0.0214159 11.459 0.0166016ZM15.1681 11.4429C15.17 12.4235 14.7824 13.3647 14.0905 14.0596C13.3986 14.7545 12.459 15.1461 11.4784 15.1483H6.81001L3.03555 16.9193L4.83678 14.1526V5.19739C4.83645 5.08419 4.88103 4.97549 4.96073 4.89511C5.04043 4.81472 5.14875 4.76923 5.26195 4.76858H11.6662C12.5955 4.77211 13.4856 5.14376 14.1415 5.80216C14.7974 6.46056 15.1657 7.35204 15.1656 8.28139L15.1681 11.4429Z" fill="#CE1126"/>
+<path d="M27.3733 2.39582C27.3733 1.07858 26.3055 0.0107422 24.9882 0.0107422C23.671 0.0107422 22.6031 1.07858 22.6031 2.39582V17.6148C22.6031 18.932 23.671 19.9998 24.9882 19.9998C26.3055 19.9998 27.3733 18.932 27.3733 17.6148V2.39582Z" fill="#CE1126"/>
+<path d="M46.8076 0H30.4646C30.4083 -2.25721e-07 30.3526 0.0110998 30.3007 0.0326641C30.2487 0.0542284 30.2015 0.0858331 30.1618 0.125667C30.1221 0.165501 30.0906 0.212782 30.0692 0.2648C30.0478 0.316818 30.0368 0.372551 30.037 0.428805V4.29774C30.0368 4.35399 30.0478 4.40973 30.0692 4.46175C30.0906 4.51376 30.1221 4.56104 30.1618 4.60088C30.2015 4.64071 30.2487 4.67232 30.3007 4.69388C30.3526 4.71545 30.4083 4.72655 30.4646 4.72655H35.8138C35.8699 4.7267 35.9255 4.73792 35.9773 4.75956C36.0291 4.78119 36.0762 4.81282 36.1158 4.85264C36.1554 4.89246 36.1867 4.93969 36.208 4.99162C36.2294 5.04356 36.2403 5.0992 36.2401 5.15535V19.57C36.24 19.6262 36.2509 19.682 36.2723 19.734C36.2937 19.786 36.3252 19.8333 36.365 19.8731C36.4047 19.913 36.4519 19.9446 36.5038 19.9661C36.5558 19.9877 36.6115 19.9988 36.6677 19.9988H40.6105C40.6667 19.9986 40.7223 19.9874 40.7741 19.9658C40.8259 19.9441 40.873 19.9125 40.9126 19.8727C40.9522 19.8329 40.9835 19.7856 41.0049 19.7337C41.0262 19.6818 41.0371 19.6261 41.037 19.57V5.15535C41.036 5.04236 41.0798 4.93358 41.1588 4.85277C41.2377 4.77197 41.3455 4.72572 41.4585 4.72412H46.8076C46.8638 4.72396 46.9193 4.71275 46.9712 4.69111C47.023 4.66948 47.07 4.63785 47.1096 4.59803C47.1492 4.55821 47.1806 4.51098 47.2019 4.45904C47.2233 4.4071 47.2342 4.35147 47.234 4.29532V0.428805C47.2342 0.372653 47.2233 0.317019 47.2019 0.26508C47.1806 0.21314 47.1492 0.165914 47.1096 0.126095C47.07 0.0862771 47.023 0.0546472 46.9712 0.0330117C46.9193 0.0113762 46.8638 0.000158847 46.8076 0V0Z" fill="#CE1126"/>
+<path d="M58.3829 0.0107422H58.2508C55.6058 0.0165188 53.0714 1.07272 51.205 2.94703C49.3387 4.82134 48.2933 7.36024 48.2987 10.0053V17.4355C48.2974 18.1141 48.5657 18.7654 49.0445 19.2463C49.5234 19.7272 50.1736 19.9982 50.8522 19.9998H58.3817C61.0261 19.9931 63.5596 18.9365 65.4252 17.0623C67.2907 15.1881 68.3357 12.6497 68.3302 10.0053C68.3357 7.36108 67.2909 4.82291 65.4256 2.94874C63.5603 1.07457 61.0271 0.0178015 58.3829 0.0107422ZM63.4329 9.94351C63.4309 11.1388 63.017 12.2968 62.2607 13.2224C61.5044 14.1479 60.4522 14.7844 59.2813 15.0246C58.1104 15.2647 56.8925 15.0937 55.833 14.5406C54.7735 13.9874 53.9371 13.0858 53.4649 11.9878C52.9927 10.8898 52.9135 9.66252 53.2407 8.51294C53.5679 7.36335 54.2814 6.36174 55.2611 5.67697C56.2407 4.99221 57.4265 4.66616 58.6185 4.75382C59.8106 4.84147 60.9359 5.33746 61.8049 6.15816L65.2425 4.80633L62.9096 7.66382C63.2544 8.37299 63.4333 9.15132 63.4329 9.93988V9.94351Z" fill="#CE1126"/>
+</svg>

package/lib/composite-comp/dito/components/SearchBar/index.js

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _defaultJSON = require("./defaultJSON");
+
+var _index = _interopRequireDefault(require("./mobile/index"));
+
+var _index2 = _interopRequireDefault(require("./pc/index"));
+
+var _coreUtil = require("../../../../utils/coreUtil");
+
+var _compositeDecorator = _interopRequireDefault(require("../../../../decorator/compositeDecorator"));
+
+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); }
+
+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; }
+
+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 SearchBar =
+/** @class */
+function (_super) {
+  __extends(SearchBar, _super);
+
+  function SearchBar() {
+    return _super !== null && _super.apply(this, arguments) || this;
+  }
+
+  SearchBar.prototype.render = function () {
+    var nodeData = this.props.nodeData; // console.log('search nodeData', nodeData);
+
+    return /*#__PURE__*/_react["default"].createElement("div", null, (0, _coreUtil.isPc)() ? /*#__PURE__*/_react["default"].createElement(_index2["default"], {
+      data: nodeData
+    }) : /*#__PURE__*/_react["default"].createElement(_index["default"], {
+      data: nodeData
+    }));
+  };
+
+  SearchBar.defaultProps = {};
+  SearchBar.type = 'SEARCH';
+  SearchBar.getDefaultJSON = _defaultJSON.getDefaultJSON;
+  SearchBar = __decorate([_compositeDecorator["default"]], SearchBar);
+  return SearchBar;
+}(_react.Component);
+
+var _default = SearchBar;
+exports["default"] = _default;