@alilc/lowcode-editor-skeleton
Version:
alibaba lowcode editor skeleton
67 lines (66 loc) • 3.15 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.Workbench = void 0;
var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));
var _react = require("react");
var _lowcodeEditorCore = require("@alilc/lowcode-editor-core");
var _classnames = _interopRequireDefault(require("classnames"));
var _topArea = _interopRequireDefault(require("./top-area"));
var _leftArea = _interopRequireDefault(require("./left-area"));
var _leftFixedPane = _interopRequireDefault(require("./left-fixed-pane"));
var _leftFloatPane = _interopRequireDefault(require("./left-float-pane"));
var _toolbar = _interopRequireDefault(require("./toolbar"));
var _mainArea = _interopRequireDefault(require("./main-area"));
var _bottomArea = _interopRequireDefault(require("./bottom-area"));
var _rightArea = _interopRequireDefault(require("./right-area"));
require("./workbench.less");
var _context = require("../context");
var _class;
var Workbench = exports.Workbench = (0, _lowcodeEditorCore.observer)(_class = /*#__PURE__*/function (_Component) {
function Workbench(props) {
var _this;
_this = _Component.call(this, props) || this;
var _this$props = _this.props,
config = _this$props.config,
components = _this$props.components,
skeleton = _this$props.skeleton;
skeleton.buildFromConfig(config, components);
return _this;
}
(0, _inheritsLoose2["default"])(Workbench, _Component);
var _proto = Workbench.prototype;
_proto.render = function render() {
var _this$props2 = this.props,
skeleton = _this$props2.skeleton,
className = _this$props2.className,
topAreaItemClassName = _this$props2.topAreaItemClassName;
return /*#__PURE__*/React.createElement("div", {
className: (0, _classnames["default"])('lc-workbench', className)
}, /*#__PURE__*/React.createElement(_context.SkeletonContext.Provider, {
value: this.props.skeleton
}, /*#__PURE__*/React.createElement(_topArea["default"], {
area: skeleton.topArea,
itemClassName: topAreaItemClassName
}), /*#__PURE__*/React.createElement("div", {
className: "lc-workbench-body"
}, /*#__PURE__*/React.createElement(_leftArea["default"], {
area: skeleton.leftArea
}), /*#__PURE__*/React.createElement(_leftFloatPane["default"], {
area: skeleton.leftFloatArea
}), /*#__PURE__*/React.createElement(_leftFixedPane["default"], {
area: skeleton.leftFixedArea
}), /*#__PURE__*/React.createElement("div", {
className: "lc-workbench-center"
}, /*#__PURE__*/React.createElement(_toolbar["default"], {
area: skeleton.toolbar
}), /*#__PURE__*/React.createElement(_mainArea["default"], {
area: skeleton.mainArea
}), /*#__PURE__*/React.createElement(_bottomArea["default"], {
area: skeleton.bottomArea
})), /*#__PURE__*/React.createElement(_rightArea["default"], {
area: skeleton.rightArea
})), /*#__PURE__*/React.createElement(_lowcodeEditorCore.TipContainer, null)));
};
return Workbench;
}(_react.Component)) || _class;