@luck-design-biz/luckda 1.0.0-alpha → 1.0.1

package/lib/lowcode/engine/tools/useCombinedRefs.js

@@ -5,9 +5,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = require("react");
+var _ahooks = require("ahooks");
 var useCombinedRefs = function useCombinedRefs(forwardedRef) {
   var innerRef = (0, _react.useRef)(null);
-  (0, _react.useEffect)(function () {
+  (0, _ahooks.useCreation)(function () {
     if (!forwardedRef) return;
     if (typeof forwardedRef === 'function') {
       forwardedRef(innerRef.current);

package/lib/lowcode/painter/DesignOperator.js

@@ -121,6 +121,15 @@ var DesignOperator = function DesignOperator(_ref) {
     var _last;
     return operatorId.detector && (0, _lodash.isString)(operatorId.detector) ? (_last = (0, _lodash.last)(context.componentMap.get(operatorId.detector).api.getLevelNodes())) === null || _last === void 0 ? void 0 : _last.name : void 0;
   }, [operatorId.detector]);
+  (0, _ahooks.useKeyPress)('backspace', function () {
+    if (operatorId.selector && operatorId.deletable) {
+      handleDelete({
+        id: operatorId.selector
+      });
+    }
+  }, {
+    target: canvas
+  });
   (0, _ahooks.useEventListener)('mousemove', function (event) {
     var elem = event.target;
     var targetFormItem = elem.closest("[".concat(_constants.LC_COMPONENT_UNIT_KEY, "=\"").concat(_constants.LC_FORMITEM_UNIT, "\"]"));

package/lib/lowcode/painter/Panel.js

@@ -198,9 +198,9 @@ var Panel = function Panel() {
   }, /*#__PURE__*/_react.default.createElement("ul", {
     className: _panel.default.headerList
   }, (0, _lodash.reduce)(_TAB_LIST_, function (ret, item) {
-    if (item.key === 'css' && !!(meta !== null && meta !== void 0 && meta.css)) {
+    if (item.key === 'css' && !(0, _lodash.isNil)(meta === null || meta === void 0 ? void 0 : meta.css)) {
       ret.push(item);
-    } else if (item.key === 'advance' && !!(meta !== null && meta !== void 0 && meta.advance)) {
+    } else if (item.key === 'advance' && !(0, _lodash.isNil)(meta === null || meta === void 0 ? void 0 : meta.advance)) {
       ret.push(item);
     } else if (item.key === 'attrs') {
       ret.push(item);

package/lib/lowcode/painter/components/AdvancePanel.js

@@ -18,9 +18,9 @@ var _lodash = require("lodash");
 var _ContextProvider = require("../../engine/provider/ContextProvider");
 var _utils = require("@luck-design-biz/base/utils");
 var _Collapse = _interopRequireDefault(require("./Collapse"));
-var _PopConfirm = _interopRequireDefault(require("../components/PopConfirm"));
-var _FullScreenEditor = _interopRequireDefault(require("../components/code-editor/FullScreenEditor"));
-var _JSEditor = _interopRequireDefault(require("../components/code-editor/JSEditor"));
+var _PopConfirm = _interopRequireDefault(require("./PopConfirm"));
+var _FullScreenEditor = _interopRequireDefault(require("./code-editor/FullScreenEditor"));
+var _JSEditor = _interopRequireDefault(require("./code-editor/JSEditor"));
 var _ActionBindModal = _interopRequireDefault(require("./ActionBindModal"));
 var _constants = require("../../constants");
 var _excluded = ["events"],

package/lib/lowcode/painter/components/Collapse.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = _default;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _ahooks = require("ahooks");
@@ -101,8 +102,10 @@ function _default(_ref) {
     type: "right"
   }) : /*#__PURE__*/_react.default.createElement(_antd.Icon, {
     type: collapsed ? 'down' : 'up'
-  })))), !collapsed && /*#__PURE__*/_react.default.createElement("div", {
+  })))), /*#__PURE__*/_react.default.createElement("div", {
     className: _collapse.default['body'],
-    style: bodyStyle
+    style: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, bodyStyle), {}, {
+      display: collapsed ? 'none' : 'block'
+    })
   }, children));
 }

package/lib/lowcode/painter/components/TipIcon.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _antd = require("luck-design/antd");
+var _excluded = ["title", "type"];
+var TipIcon = function TipIcon(_ref) {
+  var title = _ref.title,
+    type = _ref.type,
+    rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
+    title: title
+  }, /*#__PURE__*/_react.default.createElement(_antd.Icon, (0, _extends2.default)({
+    type: type
+  }, rest)));
+};
+var _default = exports.default = TipIcon;

package/lib/lowcode/painter/components/VarEditor.js

@@ -0,0 +1,463 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireDefault(require("react"));
+var _ahooks = require("ahooks");
+var _antd = require("luck-design/antd");
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+var _lodash = require("lodash");
+var _utils = require("@luck-design-biz/base/utils");
+var _VisionEditor = _interopRequireDefault(require("./code-editor/VisionEditor"));
+var _JSEditor = _interopRequireDefault(require("./code-editor/JSEditor"));
+var _TipIcon = _interopRequireDefault(require("./TipIcon"));
+var _I18N_PREFIX_ = 'luckda.lowcode.painter.pageVars';
+var StyledForm = (0, _styledComponents.default)(_antd.Form).withConfig({
+  displayName: "StyledForm",
+  componentId: "luckda-6530__sc-iq6k7e-0"
+})(["font-size:12px;.ant-form-item{font-size:12px;margin-bottom:0;}label{font-size:12px;}"]);
+var StyledSegmented = (0, _styledComponents.default)(_antd.Segmented).withConfig({
+  displayName: "StyledSegmented",
+  componentId: "luckda-6530__sc-iq6k7e-1"
+})(["width:100%;"]);
+var EditorWrapper = _styledComponents.default.div.withConfig({
+  displayName: "EditorWrapper",
+  componentId: "luckda-6530__sc-iq6k7e-2"
+})(["width:100%;height:80px;border:1px solid #d9d9d9;border-radius:4px;margin:8px 0;"]);
+var LabelLine = _styledComponents.default.div.withConfig({
+  displayName: "LabelLine",
+  componentId: "luckda-6530__sc-iq6k7e-3"
+})(["height:28px;background:rgba(31,56,88,0.04);border-top:1px solid rgba(31,56,88,0.1);border-bottom:1px solid rgba(31,56,88,0.1);margin:8px 0;line-height:26px;padding:0 12px;", ""], function (props) {
+  return props.$flex ? {
+    display: 'flex',
+    'align-items': 'center',
+    'justify-content': 'space-between'
+  } : null;
+});
+var _EDITOR_OPTIONS = {
+  minimap: {
+    enabled: false
+  },
+  lineNumbers: 'off'
+};
+var _TASK_TYPE_OPTIONS = [{
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".taskType.serial"),
+    label: '串行'
+  }),
+  value: 'serial'
+}, {
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".taskType.parallel"),
+    label: '并行'
+  }),
+  value: 'parallel'
+}];
+var _METHOD_OPTIONS = [{
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".method.jsonp"),
+    label: 'JSONP'
+  }),
+  value: 'jsonp'
+}, {
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".method.get"),
+    label: 'GET'
+  }),
+  value: 'get'
+}, {
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".taskType.post"),
+    label: 'POST'
+  }),
+  value: 'post'
+}, {
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".taskType.put"),
+    label: 'PUT'
+  }),
+  value: 'put'
+}, {
+  label: (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".taskType.delete"),
+    label: 'DELETE'
+  }),
+  value: 'delete'
+}];
+var _DEFAULT_PROCESS_ = {
+  willFetch: {
+    code: 'function willFetch(vars, config){\n\t\n}',
+    title: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".willFetch"),
+      label: "\u8BF7\u6C42\u53D1\u9001\u524D\u5904\u7406\u51FD\u6570(willFetch)"
+    })
+  },
+  didFetch: {
+    code: 'function didFetch(content){\n\t\n}',
+    title: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".didFetch"),
+      label: "\u8BF7\u6C42\u53D1\u9001\u524D\u5904\u7406\u51FD\u6570(didFetch)"
+    })
+  },
+  onError: {
+    code: 'function onError(error){\n\t\n}',
+    title: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".onError"),
+      label: "\u8BF7\u6C42\u53D1\u9001\u524D\u5904\u7406\u51FD\u6570(onError)"
+    })
+  }
+};
+var getBasicFormItem = function getBasicFormItem(form, item) {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".name"),
+      label: '名称'
+    })
+  }, form.getFieldDecorator('name', {
+    initialValue: item.name,
+    rules: [{
+      required: true,
+      message: (0, _utils.formatMessage)({
+        id: "".concat(_I18N_PREFIX_, ".messag.name"),
+        label: '请输入变量名'
+      })
+    }]
+  })( /*#__PURE__*/_react.default.createElement(_antd.Input, {
+    size: "small"
+  }))), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".desc"),
+      label: '描述'
+    })
+  }, form.getFieldDecorator('desc', {
+    initialValue: item.desc
+  })( /*#__PURE__*/_react.default.createElement(_antd.Input, {
+    size: "small",
+    placeholder: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".placeholder"),
+      label: '请输入'
+    })
+  }))));
+};
+var VarForm = _antd.Form.create({
+  name: 'var_form',
+  onValuesChange: function onValuesChange(_ref, values) {
+    var dispatch = _ref.dispatch,
+      item = _ref.item;
+    dispatch({
+      type: 'edit',
+      payload: {
+        id: item.id,
+        data: values
+      }
+    });
+  }
+})(function (_ref2) {
+  var form = _ref2.form,
+    item = _ref2.item,
+    dispatch = _ref2.dispatch;
+  var _useDebounceFn = (0, _ahooks.useDebounceFn)(function (code) {
+      dispatch({
+        type: 'edit',
+        payload: {
+          id: item.id,
+          data: {
+            data: code
+          }
+        }
+      });
+    }, {
+      wait: 500
+    }),
+    handleEditorValueChange = _useDebounceFn.run;
+  return /*#__PURE__*/_react.default.createElement(StyledForm, {
+    layout: "horizontal",
+    labelCol: {
+      span: 6
+    },
+    wrapperCol: {
+      span: 17
+    },
+    hideRequiredMark: true
+  }, getBasicFormItem(form, item), /*#__PURE__*/_react.default.createElement(LabelLine, null, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".data"),
+    label: '数据'
+  }), /*#__PURE__*/_react.default.createElement(_TipIcon.default, {
+    type: "question-circle",
+    style: {
+      marginLeft: 4
+    },
+    title: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".tip.data"),
+      label: "\u8F93\u5165\u6846\u5185\u652F\u6301\u8F93\u5165JS\u7684\u57FA\u672C\u7C7B\u578B\u53D8\u91CF\uFF0C\u5982\u5B57\u7B26\u4E32:\"string\"\uFF0C\u6570\u5B57:123\uFF0C\u5E03\u5C14\u503C:true/false\uFF0C\u6570\u7EC4:[1,2,3]\uFF0C\u5BF9\u8C61:{\"name\": \"test\"}\uFF0C\u7A7A\u503C:null"
+    })
+  })), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      width: '100%',
+      height: 300
+    }
+  }, /*#__PURE__*/_react.default.createElement(_VisionEditor.default, {
+    onChange: handleEditorValueChange
+  }, item.data)));
+});
+var ApiForm = _antd.Form.create({
+  name: 'api_form',
+  onValuesChange: function onValuesChange(_ref3, values, all) {
+    var dispatch = _ref3.dispatch,
+      item = _ref3.item;
+    var auto = (0, _lodash.get)(values, 'data.auto');
+    if (auto) {
+      (0, _lodash.set)(all, 'data.taskType', 'parallel');
+    } else if (auto === false) {
+      (0, _lodash.unset)(all, 'data.taskType');
+    }
+    dispatch({
+      type: 'edit',
+      payload: {
+        id: item.id,
+        data: all
+      }
+    });
+  }
+})(function (_ref4) {
+  var _item$data, _item$data2, _item$data3, _item$data4, _item$data5, _item$data6, _item$data7, _item$data8, _item$data9, _item$data10, _item$data11;
+  var form = _ref4.form,
+    item = _ref4.item,
+    dispatch = _ref4.dispatch;
+  var _useSet = (0, _ahooks.useSet)((0, _lodash.intersection)(['willFetch', 'didFetch', 'onError'], (0, _lodash.keys)(item))),
+    _useSet2 = (0, _slicedToArray2.default)(_useSet, 2),
+    processSet = _useSet2[0],
+    _useSet2$ = _useSet2[1],
+    add = _useSet2$.add,
+    remove = _useSet2$.remove;
+  var _useDebounceFn2 = (0, _ahooks.useDebounceFn)(function (field, code) {
+      var obj = {};
+      (0, _lodash.set)(obj, field, code);
+      form.setFieldsValue(obj);
+    }, {
+      wait: 500
+    }),
+    handleEditorValueChange = _useDebounceFn2.run;
+  var handleAddProcessFun = (0, _ahooks.useMemoizedFn)(function (_ref5) {
+    var key = _ref5.key;
+    if (!processSet.has(key)) {
+      add(key);
+      dispatch({
+        type: 'edit',
+        payload: {
+          id: item.id,
+          data: (0, _defineProperty2.default)({}, key, _DEFAULT_PROCESS_[key].code)
+        }
+      });
+    }
+  });
+  var handleDelProcessFun = (0, _ahooks.useMemoizedFn)(function (_ref6) {
+    var key = _ref6.key;
+    remove(key);
+    dispatch({
+      type: 'edit',
+      payload: {
+        id: item.id,
+        data: (0, _defineProperty2.default)({}, key, void 0)
+      }
+    });
+  });
+  var renderProcess = (0, _ahooks.useMemoizedFn)(function (processKey) {
+    return processSet.has(processKey) ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(LabelLine, {
+      $flex: true
+    }, _DEFAULT_PROCESS_[processKey].title, /*#__PURE__*/_react.default.createElement(_TipIcon.default, {
+      type: "delete",
+      onClick: function onClick() {
+        return handleDelProcessFun(processKey);
+      }
+    })), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+      wrapperCol: {
+        span: 24
+      }
+    }, form.getFieldDecorator(processKey, {
+      initialValue: item[processKey] || _DEFAULT_PROCESS_[processKey].code
+    })( /*#__PURE__*/_react.default.createElement(EditorWrapper, {
+      style: {
+        margin: '4px 18px',
+        width: 'calc(100% - 36px)'
+      }
+    }, /*#__PURE__*/_react.default.createElement(_JSEditor.default, {
+      options: _EDITOR_OPTIONS,
+      onChange: function onChange(code) {
+        return handleEditorValueChange(processKey, code);
+      }
+    }, item[processKey] || _DEFAULT_PROCESS_[processKey].code))))) : null;
+  });
+  var menu = (0, _ahooks.useCreation)(function () {
+    return /*#__PURE__*/_react.default.createElement(_antd.Menu, {
+      onClick: handleAddProcessFun
+    }, /*#__PURE__*/_react.default.createElement(_antd.Menu.Item, {
+      key: "willFetch"
+    }, _DEFAULT_PROCESS_.willFetch.title), /*#__PURE__*/_react.default.createElement(_antd.Menu.Item, {
+      key: "didFetch"
+    }, _DEFAULT_PROCESS_.didFetch.title), /*#__PURE__*/_react.default.createElement(_antd.Menu.Item, {
+      key: "onError"
+    }, _DEFAULT_PROCESS_.onError.title));
+  }, []);
+  return /*#__PURE__*/_react.default.createElement(StyledForm, {
+    layout: "horizontal",
+    labelCol: {
+      span: 6
+    },
+    wrapperCol: {
+      span: 17
+    },
+    hideRequiredMark: true
+  }, getBasicFormItem(form, item), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".auto"),
+      label: '自动加载'
+    })
+  }, form.getFieldDecorator('data.auto', {
+    valuePropName: 'checked',
+    initialValue: Boolean((_item$data = item.data) === null || _item$data === void 0 ? void 0 : _item$data.auto)
+  })( /*#__PURE__*/_react.default.createElement(_antd.Switch, {
+    size: "small"
+  }))), form.getFieldValue('data.auto') ? /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".taskType"),
+      label: '加载方式'
+    })
+  }, form.getFieldDecorator('data.taskType', {
+    initialValue: ((_item$data2 = item.data) === null || _item$data2 === void 0 ? void 0 : _item$data2.taskType) || 'parallel'
+  })( /*#__PURE__*/_react.default.createElement(StyledSegmented, {
+    size: "small",
+    options: _TASK_TYPE_OPTIONS
+  }))) : null, /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".url"),
+      label: '请求地址'
+    })
+  }, form.getFieldDecorator('data.url', {
+    initialValue: ((_item$data3 = item.data) === null || _item$data3 === void 0 ? void 0 : _item$data3.url) || ''
+  })( /*#__PURE__*/_react.default.createElement(EditorWrapper, null, /*#__PURE__*/_react.default.createElement(_VisionEditor.default, {
+    options: _EDITOR_OPTIONS,
+    onChange: function onChange(code) {
+      return handleEditorValueChange('data.url', code);
+    }
+  }, ((_item$data4 = item.data) === null || _item$data4 === void 0 ? void 0 : _item$data4.url) || '')))), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    label: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".method"),
+      label: '请求方式'
+    })
+  }, form.getFieldDecorator('data.method', {
+    initialValue: ((_item$data5 = item.data) === null || _item$data5 === void 0 ? void 0 : _item$data5.method) || 'get'
+  })( /*#__PURE__*/_react.default.createElement(StyledSegmented, {
+    size: "small",
+    options: _METHOD_OPTIONS
+  }))), /*#__PURE__*/_react.default.createElement(LabelLine, null, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".urlParams"),
+    label: '请求参数'
+  }), /*#__PURE__*/_react.default.createElement(_TipIcon.default, {
+    type: "question-circle",
+    style: {
+      marginLeft: 4
+    },
+    title: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".tip.urlParams"),
+      label: 'URL 请求参数，格式为 {key1:value1,key2:value2} ，等价于 ?key1=value1&key2=value2'
+    })
+  })), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    wrapperCol: {
+      span: 24
+    }
+  }, form.getFieldDecorator('data.params', {
+    initialValue: ((_item$data6 = item.data) === null || _item$data6 === void 0 ? void 0 : _item$data6.params) || ''
+  })( /*#__PURE__*/_react.default.createElement(EditorWrapper, {
+    style: {
+      margin: '4px 18px',
+      width: 'calc(100% - 36px)'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_VisionEditor.default, {
+    options: _EDITOR_OPTIONS,
+    onChange: function onChange(code) {
+      return handleEditorValueChange('data.params', code);
+    }
+  }, ((_item$data7 = item.data) === null || _item$data7 === void 0 ? void 0 : _item$data7.params) || '')))), /*#__PURE__*/_react.default.createElement(LabelLine, null, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".body"),
+    label: '请求体'
+  }), /*#__PURE__*/_react.default.createElement(_TipIcon.default, {
+    type: "question-circle",
+    style: {
+      marginLeft: 4
+    },
+    title: (0, _utils.formatMessage)({
+      id: "".concat(_I18N_PREFIX_, ".tip.body"),
+      label: '接口请求体(body)，格式为 {key1:value1,key2:value2}'
+    })
+  })), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    wrapperCol: {
+      span: 24
+    }
+  }, form.getFieldDecorator('data.body', {
+    initialValue: ((_item$data8 = item.data) === null || _item$data8 === void 0 ? void 0 : _item$data8.body) || ''
+  })( /*#__PURE__*/_react.default.createElement(EditorWrapper, {
+    style: {
+      margin: '4px 18px',
+      width: 'calc(100% - 36px)'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_VisionEditor.default, {
+    options: _EDITOR_OPTIONS,
+    onChange: function onChange(code) {
+      return handleEditorValueChange('data.body', code);
+    }
+  }, ((_item$data9 = item.data) === null || _item$data9 === void 0 ? void 0 : _item$data9.body) || '')))), /*#__PURE__*/_react.default.createElement(LabelLine, {
+    $flex: true
+  }, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".process"),
+    label: '数据处理'
+  }), /*#__PURE__*/_react.default.createElement(_antd.Dropdown, {
+    overlay: menu,
+    trigger: ['click'],
+    getPopupContainer: function getPopupContainer() {
+      return document.getElementById('lc-design-workspace');
+    }
+  }, /*#__PURE__*/_react.default.createElement(_TipIcon.default, {
+    type: "plus"
+  }))), /*#__PURE__*/_react.default.createElement("div", {
+    style: {
+      padding: '0 12px'
+    }
+  }, renderProcess('willFetch'), renderProcess('didFetch'), renderProcess('onError')), /*#__PURE__*/_react.default.createElement(LabelLine, null, (0, _utils.formatMessage)({
+    id: "".concat(_I18N_PREFIX_, ".defaultValue"),
+    label: '默认数据'
+  })), /*#__PURE__*/_react.default.createElement(_antd.Form.Item, {
+    wrapperCol: {
+      span: 24
+    }
+  }, form.getFieldDecorator('data.defaultValue', {
+    initialValue: (_item$data10 = item.data) === null || _item$data10 === void 0 ? void 0 : _item$data10.defaultValue
+  })( /*#__PURE__*/_react.default.createElement(EditorWrapper, {
+    style: {
+      margin: '4px 18px',
+      width: 'calc(100% - 36px)'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_VisionEditor.default, {
+    options: _EDITOR_OPTIONS,
+    onChange: function onChange(code) {
+      return handleEditorValueChange('data.defaultValue', code);
+    }
+  }, ((_item$data11 = item.data) === null || _item$data11 === void 0 ? void 0 : _item$data11.defaultValue) || '')))));
+});
+var VarEditor = function VarEditor(_ref7) {
+  var item = _ref7.item,
+    dispatch = _ref7.dispatch;
+  return item.type === 'var' ? /*#__PURE__*/_react.default.createElement(VarForm, {
+    item: item,
+    dispatch: dispatch
+  }) : /*#__PURE__*/_react.default.createElement(ApiForm, {
+    item: item,
+    dispatch: dispatch
+  });
+};
+var _default = exports.default = VarEditor;

package/lib/lowcode/painter/components/code-editor/FullScreenEditor.js

@@ -84,8 +84,8 @@ var FullScreenEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref)
       },
       overviewRulerLanes: 0,
       scrollbar: {
-        vertical: 'hidden',
-        horizontal: 'hidden',
+        vertical: 'auto',
+        horizontal: 'auto',
         handleMouseWheel: false
       }
     }

package/lib/lowcode/painter/components/code-editor/JSEditor.js

@@ -18,6 +18,7 @@ var monaco = _interopRequireWildcard3(require("monaco-editor"));
 var _lodash = require("lodash");
 var _standalone = _interopRequireDefault(require("prettier/standalone"));
 var _parserBabel = _interopRequireDefault(require("prettier/parser-babel"));
+var _useCombinedRefs = _interopRequireDefault(require("../../../engine/tools/useCombinedRefs"));
 var _BaseEditor = _interopRequireDefault(require("./BaseEditor"));
 var _excluded = ["children", "keywords"];
 function capitalizeFirstLetter(string) {
@@ -136,10 +137,11 @@ var prettierFormetter = function prettierFormetter(unformattedCode) {
  *
  * @returns {ReactElement} 返回一个 React 元素，其中包含了一个具有自动完成功能的 JavaScript 编辑器实例。
  */
-var JSEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, ref) {
+var JSEditor = /*#__PURE__*/(0, _react.forwardRef)(function (_ref2, outRef) {
   var children = _ref2.children,
     keywords = _ref2.keywords,
     rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+  var ref = (0, _useCombinedRefs.default)(outRef);
   (0, _react.useEffect)(function () {
     var originalGetValue = ref.current.editor.getValue.bind(ref.current.editor);
     ref.current.editor.getValue = function () {