UNPKG

@alilc/lowcode-plugin-designer

Version:

alibaba lowcode editor designer plugin

167 lines (166 loc) 7.56 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); exports.__esModule = true; exports["default"] = void 0; var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator")); var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator")); var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose")); var _react = _interopRequireWildcard(require("react")); var _lowcodeEditorCore = require("@alilc/lowcode-editor-core"); var _lowcodeDesigner = require("@alilc/lowcode-designer"); var _lowcodeUtils = require("@alilc/lowcode-utils"); require("./index.scss"); function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); } function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; } var logger = (0, _lowcodeUtils.getLogger)({ level: 'warn', bizName: 'plugin:plugin-designer' }); var DesignerPlugin = exports["default"] = /*#__PURE__*/function (_PureComponent) { function DesignerPlugin(props) { var _this; _this = _PureComponent.call(this, props) || this; _this.state = { componentMetadatas: null, library: null, extraEnvironment: null, renderEnv: 'default', device: 'default', locale: '', designMode: 'live', deviceClassName: '', simulatorUrl: null, requestHandlersMap: null }; _this._mounted = true; _this.handleDesignerMount = function (designer) { var editor = _this.props.engineEditor; editor.set('designer', designer); editor.eventBus.emit('designer.ready', designer); editor.onGot('schema', function (schema) { designer.project.open(schema); }); }; _this.setupAssets(); return _this; } (0, _inheritsLoose2["default"])(DesignerPlugin, _PureComponent); var _proto = DesignerPlugin.prototype; _proto.setupAssets = /*#__PURE__*/function () { var _setupAssets = (0, _asyncToGenerator2["default"])(/*#__PURE__*/_regenerator["default"].mark(function _callee() { var _this2 = this; var editor, assets, renderEnv, device, locale, designMode, deviceClassName, simulatorUrl, requestHandlersMap, components, packages, extraEnvironment, utils, state; return _regenerator["default"].wrap(function _callee$(_context) { while (1) switch (_context.prev = _context.next) { case 0: editor = this.props.engineEditor; _context.prev = 1; _context.next = 4; return editor.onceGot('assets'); case 4: assets = _context.sent; renderEnv = _lowcodeEditorCore.engineConfig.get('renderEnv') || editor.get('renderEnv'); device = _lowcodeEditorCore.engineConfig.get('device') || editor.get('device'); locale = _lowcodeEditorCore.engineConfig.get('locale') || editor.get('locale'); designMode = _lowcodeEditorCore.engineConfig.get('designMode') || editor.get('designMode'); deviceClassName = _lowcodeEditorCore.engineConfig.get('deviceClassName') || editor.get('deviceClassName'); simulatorUrl = _lowcodeEditorCore.engineConfig.get('simulatorUrl') || editor.get('simulatorUrl'); // @TODO setupAssets 里设置 requestHandlersMap 不太合适 requestHandlersMap = _lowcodeEditorCore.engineConfig.get('requestHandlersMap') || editor.get('requestHandlersMap'); if (this._mounted) { _context.next = 14; break; } return _context.abrupt("return"); case 14: _lowcodeEditorCore.engineConfig.onGot('locale', function (locale) { _this2.setState({ locale: locale }); }); _lowcodeEditorCore.engineConfig.onGot('requestHandlersMap', function (requestHandlersMap) { _this2.setState({ requestHandlersMap: requestHandlersMap }); }); _lowcodeEditorCore.engineConfig.onGot('device', function (device) { _this2.setState({ device: device }); }); components = assets.components, packages = assets.packages, extraEnvironment = assets.extraEnvironment, utils = assets.utils; state = { componentMetadatas: components || [], library: packages || [], utilsMetadata: utils || [], extraEnvironment: extraEnvironment, renderEnv: renderEnv, device: device, designMode: designMode, deviceClassName: deviceClassName, simulatorUrl: simulatorUrl, requestHandlersMap: requestHandlersMap, locale: locale }; this.setState(state); _context.next = 25; break; case 22: _context.prev = 22; _context.t0 = _context["catch"](1); logger.error(_context.t0); case 25: case "end": return _context.stop(); } }, _callee, this, [[1, 22]]); })); function setupAssets() { return _setupAssets.apply(this, arguments); } return setupAssets; }(); _proto.componentWillUnmount = function componentWillUnmount() { this._mounted = false; }; _proto.render = function render() { var editor = this.props.engineEditor; var _this$state = this.state, componentMetadatas = _this$state.componentMetadatas, utilsMetadata = _this$state.utilsMetadata, library = _this$state.library, extraEnvironment = _this$state.extraEnvironment, renderEnv = _this$state.renderEnv, device = _this$state.device, designMode = _this$state.designMode, deviceClassName = _this$state.deviceClassName, simulatorUrl = _this$state.simulatorUrl, requestHandlersMap = _this$state.requestHandlersMap, locale = _this$state.locale; if (!library || !componentMetadatas) { // TODO: use a Loading return null; } return /*#__PURE__*/_react["default"].createElement(_lowcodeDesigner.DesignerView, { onMount: this.handleDesignerMount, className: "lowcode-plugin-designer", editor: editor, name: editor.viewName, designer: editor.get('designer'), componentMetadatas: componentMetadatas, simulatorProps: { library: library, utilsMetadata: utilsMetadata, extraEnvironment: extraEnvironment, renderEnv: renderEnv, device: device, locale: locale, designMode: designMode, deviceClassName: deviceClassName, simulatorUrl: simulatorUrl, requestHandlersMap: requestHandlersMap } }); }; return DesignerPlugin; }(_react.PureComponent); DesignerPlugin.displayName = void 0;