@fonixtree/magic-design 0.0.71 → 0.0.73

package/es/core/Designer/CompListPanel/index.js

@@ -1,133 +0,0 @@
-"use strict";
-
-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); }
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _classnames = _interopRequireDefault(require("classnames"));
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _CompCard = _interopRequireDefault(require("./CompCard"));
-
-var _Button = _interopRequireDefault(require("../../../common/Button"));
-
-require("./index.less");
-
-var _locale = require("../../../locale");
-
-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); }
-
-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 _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); }
-
-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 CompListPanel =
-/** @class */
-function (_super) {
-  __extends(CompListPanel, _super);
-
-  function CompListPanel() {
-    var _this = _super.call(this) || this;
-
-    _this.open = false;
-
-    _this.animation = function (type) {
-      document.getElementsByClassName('list_panel')[0].setAttribute('style', "animation-name:" + type + ";animation-duration: 0.3s;animation-fill-mode:both");
-    };
-
-    _this.onClose = function () {
-      _this.open = false;
-
-      _this.animation('onListClose');
-    };
-
-    _this.onOpen = function () {
-      _this.open = true;
-
-      _this.animation('onListOpen');
-    };
-
-    _this.onAddClick = function (data) {
-      var onAdd = _this.props.onAdd;
-
-      _this.onClose();
-
-      onAdd(data);
-    };
-
-    _this.open = false;
-    return _this;
-  }
-
-  CompListPanel.prototype.render = function () {
-    var _this = this;
-
-    var compSource = this.props.compSource;
-    return /*#__PURE__*/_react["default"].createElement("div", {
-      className: (0, _classnames["default"])('list_panel')
-    }, /*#__PURE__*/_react["default"].createElement("header", {
-      className: "header"
-    }, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-      icon: "icon-close",
-      onClick: this.onClose,
-      type: "icon"
-    })), /*#__PURE__*/_react["default"].createElement("h2", {
-      className: "title"
-    }, (0, _locale.i18n)('ADD_COMPONENT')), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "component-list"
-    }, Object.keys(compSource).map(function (compCat) {
-      return /*#__PURE__*/_react["default"].createElement("div", {
-        key: compCat,
-        className: "cat-list"
-      }, /*#__PURE__*/_react["default"].createElement("h5", {
-        className: "cat-name"
-      }, compCat, "(", "" + compSource[compCat].length, ")"), compSource[compCat].map(function (comp) {
-        return (0, _coreUtil.isActiveFloor)(comp.terminalType) ? /*#__PURE__*/_react["default"].createElement(_CompCard["default"], _extends({}, comp, {
-          key: comp.moduleId,
-          onAdd: function onAdd() {
-            return _this.onAddClick(comp);
-          }
-        })) : null;
-      }));
-    })));
-  };
-
-  return CompListPanel;
-}(_react.Component);
-
-var _default = CompListPanel;
-exports["default"] = _default;

package/es/core/Designer/CompListPanel/index.less

@@ -1,69 +0,0 @@
-.list_panel {
-  position: fixed;
-  left: -354px;
-  top: 0;
-  bottom: 0;
-  width: 354px;
-  background: #FFFFFF;
-  box-shadow: inset -1px 0px 0px #EDF0F4;
-  transition: all .3s ease;
-  z-index: 200;
-
-  .header {
-    height: 80px;
-    display: flex;
-    padding: 16px 24px;
-  }
-  .title {
-    padding: 12px 24px;
-    font-family: 'OpenSans-Bold';
-    font-size: 26px;
-    line-height: 32px;
-    color: #232F46;
-  }
-  .component-list {
-    height: calc(100vh - 136px);
-    overflow-y: auto;
-    padding: 0 24px;
-    &::-webkit-scrollbar {//滚动条的宽度
-      width:8px;
-    }
-    &::-webkit-scrollbar-thumb {//滚动条的设置
-      background-color:#C1C9D7;;
-      background-clip:padding-box;
-      border-radius: 100px;
-    }
-    .cat-list{
-      padding-bottom: 24px;
-      .cat-name{
-        font-family: 'Open Sans';
-        font-style: normal;
-        font-weight: 400;
-        font-size: 16px;
-        line-height: 24px;
-        color: #8493AF;
-      }
-      
-    }
-  }
-}
-
-@keyframes onListOpen {
-  from {
-    left: -354px;
-  }
-
-  to {
-    left: 0px;
-  }
-}
-
-@keyframes onListClose {
-  from {
-    left: 0px;
-  }
-
-  to {
-    left: -354px;
-  }
-}

package/es/core/Designer/ConfigPanel/TerminalSelect/index.js

@@ -1,73 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = TerminalSelect;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _common = require("../../../../common");
-
-require("./index.less");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function TerminalSelect(_a) {
-  var value = _a.value,
-      onChange = _a.onChange,
-      terminalType = _a.terminalType;
-  var isActiveMobile = !value || ['MOBILE', 'ALL'].includes(value);
-  var isActivePc = !value || ['PC', 'ALL'].includes(value);
-
-  var onTerminalClick = function onTerminalClick(terminal) {
-    // 至少选中一种终端
-    if (value === terminal) {
-      return;
-    }
-
-    if (!value || value === 'ALL') {
-      if (terminal === 'PC') {
-        onChange('MOBILE');
-      } else {
-        onChange('PC');
-      }
-    } else {
-      onChange('ALL');
-    }
-  };
-
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "terminal_wrap"
-  }, ['MOBILE', 'ALL', undefined, null].includes(terminalType) && /*#__PURE__*/_react["default"].createElement("div", {
-    className: "terminal_item",
-    onClick: function onClick() {
-      return onTerminalClick('MOBILE');
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
-    color: isActiveMobile ? '#2F54EB' : '#C4C4C4',
-    size: 20,
-    type: "icon-mobile"
-  }), /*#__PURE__*/_react["default"].createElement("span", {
-    className: "select"
-  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
-    color: isActiveMobile ? '#00AC5A' : '#A3AEC3',
-    size: 9,
-    type: "icon-select"
-  }))), ['PC', 'ALL', undefined, null].includes(terminalType) && /*#__PURE__*/_react["default"].createElement("div", {
-    className: "terminal_item",
-    onClick: function onClick() {
-      return onTerminalClick('PC');
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
-    color: isActivePc ? '#2F54EB' : '#C4C4C4',
-    size: 20,
-    type: "icon-pc"
-  }), /*#__PURE__*/_react["default"].createElement("span", {
-    className: "select"
-  }, /*#__PURE__*/_react["default"].createElement(_common.Iconfont, {
-    color: isActivePc ? '#00AC5A' : '#A3AEC3',
-    size: 9,
-    type: "icon-select"
-  }))));
-}

package/es/core/Designer/ConfigPanel/TerminalSelect/index.less

@@ -1,29 +0,0 @@
-.terminal_wrap {
-  display: flex;
-  .terminal_item {
-    position: relative;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 24px;
-    height: 24px;
-    background-color: #EDF0F4;
-    border-radius: 2px;
-    cursor: pointer;
-    .select {
-      position: absolute;
-      right: -4px;
-      top: -4px;
-      line-height: 0;
-    }
-  }
-  .terminal_item + .terminal_item {
-    margin-left: 16px;
-  }
-  .active {
-    background-color: #2F54EB;
-  }
-}
-.terminal_wrap+ span {
-  margin-left: 14px;
-}

package/es/core/Designer/ConfigPanel/index.js

@@ -1,349 +0,0 @@
-"use strict";
-
-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); }
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _react = _interopRequireWildcard(require("react"));
-
-var _TerminalSelect = _interopRequireDefault(require("./TerminalSelect"));
-
-var _coreUtil = require("../../../utils/coreUtil");
-
-var _commonUtil = require("../../../utils/commonUtil");
-
-var _Button = _interopRequireDefault(require("../../../common/Button"));
-
-var _constants = require("../../../constants");
-
-var _componentTypes = require("../../../constants/component-types");
-
-var _mobx = require("../../../mobx");
-
-require("./index.less");
-
-var _locale = require("../../../locale");
-
-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; }
-
-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 ConfigPanel =
-/** @class */
-function (_super) {
-  __extends(ConfigPanel, _super);
-
-  function ConfigPanel() {
-    var _this = _super !== null && _super.apply(this, arguments) || this;
-
-    _this.preClickedGroup = null; // 以及面板展开状态
-
-    _this.configOpen = false;
-    _this.state = {
-      selectedNode: {}
-    };
-
-    _this.resetState = function (propsData, clickedFloor) {
-      var pageData = propsData.pageData;
-      var selectedNode = pageData.find(function (floor) {
-        return floor.id === clickedFloor;
-      });
-
-      _this.setState({
-        clickedGroup: _mobx.store.clickedGroup,
-        selectedNode: selectedNode
-      }); // 展开一级面板
-
-
-      if (selectedNode) {
-        _this.openConfig();
-      } else {
-        _this.closeConfig();
-      } // 展开二级面板
-
-
-      if (!_mobx.store.clickedGroup && _this.preClickedGroup) {
-        _this.closeSecConfig();
-      } else if (Boolean(_mobx.store.clickedGroup) != Boolean(_this.preClickedGroup)) {
-        _this.openSecConfig();
-      }
-
-      _this.preClickedGroup = _mobx.store.clickedGroup;
-    };
-
-    _this.animation = function (type) {
-      document.getElementsByClassName('config_wrap')[0].setAttribute('style', "animation-name:" + type + ";animation-duration: 0.3s;animation-fill-mode:both");
-    };
-
-    _this.openPcConfig = function () {
-      _this.animation('openPcConfig');
-    };
-
-    _this.closePcConfig = function () {
-      _this.animation('closePcConfig');
-    };
-
-    _this.openMobileConfig = function () {
-      _this.animation('openMobileConfig');
-    };
-
-    _this.closeMobileConfig = function () {
-      _this.animation('closeMobileConfig');
-    };
-
-    _this.openConfig = function () {
-      if (_this.configOpen) {
-        return;
-      }
-
-      if (window.magicDesign.device === 'pc') {
-        _this.openPcConfig();
-      } else {
-        _this.openMobileConfig();
-      }
-
-      _this.configOpen = true;
-    };
-
-    _this.closeConfig = function () {
-      if (!_this.configOpen) {
-        return;
-      }
-
-      if (window.magicDesign.device === 'pc') {
-        _this.closePcConfig();
-      } else {
-        _this.closeMobileConfig();
-      }
-
-      _this.configOpen = false;
-    };
-
-    _this.openSecConfig = function () {
-      var _a;
-
-      (_a = document.getElementsByClassName('sec_config_wrap')[0]) === null || _a === void 0 ? void 0 : _a.setAttribute('style', 'animation-name:openSecConfig;animation-duration: 0.3s;animation-fill-mode:both');
-    };
-
-    _this.closeSecConfig = function () {
-      var _a;
-
-      (_a = document.getElementsByClassName('sec_config_wrap')[0]) === null || _a === void 0 ? void 0 : _a.setAttribute('style', 'animation-name:closeSecConfig;animation-duration: 0.3s;animation-fill-mode:both');
-
-      _mobx.store.setState({
-        clickedMeta: ''
-      });
-    };
-
-    _this.onDoneClick = function () {
-      var _a = _this.props,
-          device = _a.device,
-          onClose = _a.onClose;
-
-      if (device === _constants.deviceTypeMap.PC) {
-        _this.closePcConfig();
-      }
-
-      onClose();
-    };
-
-    _this.getConfigPanelInstance = function () {
-      var device = _this.props.device;
-      var selectedNode = _this.state.selectedNode;
-      var Clazz = _componentTypes.configPanelMap[selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.type];
-      var panelProps = {
-        data: selectedNode,
-        device: device
-      };
-      var instance = Clazz ? /*#__PURE__*/_react["default"].createElement(Clazz, panelProps) : null;
-
-      if (!instance) {
-        _mobx.store.setState({
-          clickedFloor: null
-        });
-      }
-
-      return instance;
-    };
-
-    _this.getSecondConfigInstance = function () {
-      var selectedNode = _this.state.selectedNode;
-      var Clazz = _componentTypes.secondConfigPanelMap[selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.type];
-      var panelProps = (0, _commonUtil.ensure)(function () {
-        return selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.groupSource.find(function (src) {
-          return src.id === _this.state.clickedGroup;
-        });
-      }, null);
-
-      if (panelProps) {
-        var instance = Clazz ? /*#__PURE__*/_react["default"].createElement(Clazz, {
-          panelProps: panelProps
-        }) : null;
-        return instance;
-      }
-
-      return null;
-    };
-
-    _this.getSecondConfigName = function () {
-      var _a, _b, _c, _d, _e, _f;
-
-      var selectedNode = _this.state.selectedNode;
-
-      if (!selectedNode || !selectedNode.groupSource) {
-        return;
-      }
-
-      var panelProps = selectedNode.groupSource.find(function (src) {
-        return src.id === _this.state.clickedGroup;
-      });
-
-      if (!panelProps) {
-        return;
-      }
-
-      var groupName = '';
-
-      switch (selectedNode.type) {
-        case 'BANNER':
-          groupName = (_a = panelProps.title) === null || _a === void 0 ? void 0 : _a.text;
-
-          if (!groupName) {
-            groupName = (0, _coreUtil.isPc)() ? (_c = (_b = panelProps.image) === null || _b === void 0 ? void 0 : _b.content) === null || _c === void 0 ? void 0 : _c.pcName : (_e = (_d = panelProps.image) === null || _d === void 0 ? void 0 : _d.content) === null || _e === void 0 ? void 0 : _e.h5Name;
-          }
-
-          break;
-
-        case 'MOBILE_NAVIGATION':
-        case 'PC_NAVIGATION':
-          groupName = ((_f = panelProps.groupName) === null || _f === void 0 ? void 0 : _f.title.text) || (0, _locale.i18n)('NAVIGATION_NAME');
-          break;
-
-        case 'RECOMMEND':
-          groupName = panelProps.groupName.text;
-
-        case 'TAG':
-          groupName = '';
-      }
-
-      return groupName || 'Group Name';
-    };
-
-    _this.onSecConfigBack = function () {
-      _mobx.store.setState({
-        clickedGroup: null
-      });
-
-      window.document.dispatchEvent(new Event(_constants.eventType.UPDATE_FIRST_CONFIG, {
-        bubbles: false
-      }));
-    };
-
-    _this.onTerminalChange = function (terminal) {
-      var selectedNode = _this.state.selectedNode;
-      selectedNode.activeTerminal = terminal;
-
-      _this.setState({
-        selectedNode: selectedNode
-      }); // 刷新页面组件列表 和 viewArea
-
-
-      (0, _coreUtil.renderPreview)();
-    };
-
-    return _this;
-  }
-
-  ConfigPanel.prototype.componentDidMount = function () {
-    var _this = this;
-
-    this.distroy = (0, _mobx.autorun)(function () {
-      _this.resetState(_this.props, _mobx.store.clickedFloor);
-    });
-  };
-
-  ConfigPanel.prototype.componentWillReceiveProps = function (nextProps) {
-    if (JSON.stringify(this.props) !== JSON.stringify(nextProps)) {
-      this.resetState(nextProps, _mobx.store.clickedFloor);
-    }
-  };
-
-  ConfigPanel.prototype.componentWillUnmount = function () {
-    this.distroy();
-  };
-
-  ConfigPanel.prototype.render = function () {
-    var _a, _b;
-
-    var device = this.props.device;
-    var selectedNode = this.state.selectedNode;
-    return /*#__PURE__*/_react["default"].createElement("div", {
-      className: "config_wrap"
-    }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "first_config_wrap"
-    }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "config_header"
-    }, /*#__PURE__*/_react["default"].createElement("span", {
-      className: "title",
-      title: (_a = _constants.compInfoMap[selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.type]) === null || _a === void 0 ? void 0 : _a.name
-    }, (_b = _constants.compInfoMap[selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.type]) === null || _b === void 0 ? void 0 : _b.name), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "right_wrap"
-    }, /*#__PURE__*/_react["default"].createElement(_TerminalSelect["default"], {
-      onChange: this.onTerminalChange,
-      terminalType: selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.terminalType,
-      value: selectedNode === null || selectedNode === void 0 ? void 0 : selectedNode.activeTerminal
-    }), device === _constants.deviceTypeMap.PC && /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-      onClick: this.onDoneClick,
-      size: "small",
-      type: "light"
-    }, (0, _locale.i18n)('DONE')))), this.getConfigPanelInstance()), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "sec_config_wrap"
-    }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "config_header"
-    }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "button_wrap"
-    }, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
-      icon: "icon-left",
-      onClick: this.onSecConfigBack,
-      type: "icon"
-    })), /*#__PURE__*/_react["default"].createElement("div", {
-      className: "title"
-    }, this.getSecondConfigName())), this.getSecondConfigInstance()));
-  };
-
-  return ConfigPanel;
-}(_react.Component);
-
-var _default = ConfigPanel;
-exports["default"] = _default;