@next-core/brick-kit 2.122.3 → 2.122.6

package/dist/index.bundle.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@babel/runtime/helpers/asyncToGenerator'), require('@babel/runtime/helpers/defineProperty'), require('@babel/runtime/helpers/objectSpread2'), require('antd'), require('@next-core/easyops-analytics'), require('react'), require('@next-core/brick-http'), require('@ant-design/icons'), require('i18next'), require('history'), require('@babel/runtime/helpers/objectWithoutProperties'), require('@next-core/brick-utils'), require('lodash'), require('moment'), require('@next-core/pipes'), require('js-yaml'), require('react-i18next'), require('@babel/runtime/helpers/esm/extends'), require('@next-core/illustrations'), require('@babel/runtime/helpers/decorate')) :
   typeof define === 'function' && define.amd ? define(['exports', '@babel/runtime/helpers/asyncToGenerator', '@babel/runtime/helpers/defineProperty', '@babel/runtime/helpers/objectSpread2', 'antd', '@next-core/easyops-analytics', 'react', '@next-core/brick-http', '@ant-design/icons', 'i18next', 'history', '@babel/runtime/helpers/objectWithoutProperties', '@next-core/brick-utils', 'lodash', 'moment', '@next-core/pipes', 'js-yaml', 'react-i18next', '@babel/runtime/helpers/esm/extends', '@next-core/illustrations', '@babel/runtime/helpers/decorate'], factory) :
-  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.BrickKit = {}, global._asyncToGenerator$4, global._defineProperty$1, global._objectSpread, global.antd, global.easyopsAnalytics, global.React, global.brickHttp, global.icons, global.i18next, global.history$1, global._objectWithoutProperties, global.brickUtils, global.lodash, global.moment, global.pipes, global.yaml, global.reactI18next, global._extends, global.illustrations, global._decorate));
-})(this, (function (exports, _asyncToGenerator$4, _defineProperty$1, _objectSpread, antd, easyopsAnalytics, React, brickHttp, icons, i18next, history$1, _objectWithoutProperties, brickUtils, lodash, moment, pipes, yaml, reactI18next, _extends, illustrations, _decorate) { 'use strict';
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.BrickKit = {}, global._asyncToGenerator$4, global._defineProperty$1, global._objectSpread, global.antd, global.easyopsAnalytics, global.React, global.brickHttp, global.icons, global.i18next, global.history$1, global._objectWithoutProperties, global.brickUtils, global._, global.moment, global.pipes, global.yaml, global.reactI18next, global._extends, global.illustrations, global._decorate));
+})(this, (function (exports, _asyncToGenerator$4, _defineProperty$1, _objectSpread, antd, easyopsAnalytics, React, brickHttp, icons, i18next, history$1, _objectWithoutProperties, brickUtils, _, moment, pipes, yaml, reactI18next, _extends, illustrations, _decorate) { 'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -12,7 +12,7 @@
   var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
   var i18next__default = /*#__PURE__*/_interopDefaultLegacy(i18next);
   var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-  var lodash__default = /*#__PURE__*/_interopDefaultLegacy(lodash);
+  var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
   var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
   var yaml__default = /*#__PURE__*/_interopDefaultLegacy(yaml);
   var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
@@ -563,24 +563,6 @@
       return _ref.apply(this, arguments);
     };
   }();
-  /**
-   * @description 搜索实例V3 (支持多属性排序)
-   * @endpoint POST /v3/object/:objectId/instance/_search
-   */
-
-
-  var InstanceApi_postSearchV3 = /*#__PURE__*/function () {
-    var _ref = _asyncToGenerator$3(function* (objectId, data, options) {
-      return (
-        /**! @contract easyops.api.cmdb.instance.PostSearchV3 */
-        (yield brickHttp.http.post("api/gateway/cmdb.instance.PostSearchV3/v3/object/".concat(objectId, "/instance/_search"), data, options)).data
-      );
-    });
-
-    return function InstanceApi_postSearchV3(_x, _x2, _x3) {
-      return _ref.apply(this, arguments);
-    };
-  }();
 
   function supply(attemptToVisitGlobals, providedGlobalVariables, mock) {
     var globalVariables = _objectSpread__default["default"]({}, providedGlobalVariables); // Allow limited browser builtin values.
@@ -625,7 +607,7 @@
         return delegateMethods(Object, ["entries", "fromEntries", "keys", "values"]);
 
       case "_":
-        return Object.fromEntries(Object.entries(lodash__default["default"]).filter(entry => !shouldOmitInLodash.has(entry[0])).concat(mock ? [["uniqueId", prefix => "".concat(prefix !== null && prefix !== void 0 ? prefix : "", "42")]] : []));
+        return Object.fromEntries(Object.entries(___default["default"]).filter(entry => !shouldOmitInLodash.has(entry[0])).concat(mock ? [["uniqueId", prefix => "".concat(prefix !== null && prefix !== void 0 ? prefix : "", "42")]] : []));
 
       case "moment":
         return Object.assign(function () {
@@ -954,7 +936,7 @@
     var result = preprocessTransformProperties(data, to, from, mapArray, options);
 
     for (var [propName, propValue] of Object.entries(result)) {
-      lodash.set(props, propName, propValue);
+      _.set(props, propName, propValue);
     }
 
     return props;
@@ -1055,7 +1037,7 @@
 
   function preprocessTransformProperties(data, to, from, mapArray, options) {
     var props = {};
-    var processedData = from ? lodash.get(data, from) : data;
+    var processedData = from ? _.get(data, from) : data;
 
     if (Array.isArray(to)) {
       for (var item of to) {
@@ -1098,7 +1080,7 @@
       return;
     }
 
-    var fromData = from ? lodash.get(data, from) : data;
+    var fromData = from ? _.get(data, from) : data;
     var isArray = Array.isArray(fromData);
 
     if (!isArray && mapArray === true) {
@@ -1126,7 +1108,7 @@
 
 
   function transformIntermediateData(data, to, from, mapArray) {
-    var intermediateData = from ? lodash.get(data, from) : data;
+    var intermediateData = from ? _.get(data, from) : data;
 
     if (!to) {
       return intermediateData;
@@ -1436,7 +1418,7 @@
   function _validatePermissions() {
     _validatePermissions = _asyncToGenerator__default["default"](function* (usedActions) {
       // Do not request known actions.
-      var actions = lodash.difference(usedActions, Array.from(permissionMap.keys()));
+      var actions = _.difference(usedActions, Array.from(permissionMap.keys()));
 
       if (actions.length === 0) {
         return;
@@ -1571,7 +1553,7 @@
         return collectCoverage ? fakeImageFactory() : widgetId ? widgetImagesFactory(widgetId) : imagesFactory(app.id, app.isBuildPush);
 
       case "I18N":
-        return collectCoverage ? lodash.identity : widgetId ? widgetI18nFactory(widgetId) : i18next.getFixedT(null, getI18nNamespace("app", app.id));
+        return collectCoverage ? _.identity : widgetId ? widgetI18nFactory(widgetId) : i18next.getFixedT(null, getI18nNamespace("app", app.id));
 
       case "I18N_TEXT":
         return collectCoverage ? fakeI18nText : i18nText;
@@ -2150,7 +2132,7 @@
 
       _defineProperty__default["default"](this, "state", void 0);
 
-      _defineProperty__default["default"](this, "id", lodash.uniqueId("tpl-ctx-"));
+      _defineProperty__default["default"](this, "id", _.uniqueId("tpl-ctx-"));
 
       this.brick = brick;
       tplContextMap.set(this.id, this);
@@ -2382,7 +2364,7 @@
           return hash ? hash.substr(1) : null;
 
         case "APP":
-          return _objectSpread__default["default"](_objectSpread__default["default"]({}, lodash.cloneDeep(app)), {}, {
+          return _objectSpread__default["default"](_objectSpread__default["default"]({}, _.cloneDeep(app)), {}, {
             getMenu
           });
 
@@ -2576,7 +2558,7 @@
   }
 
   function propertyMergeAllOfArray(_ref, object) {
-    var _, _proxy$mergeArgs;
+    var _$1, _proxy$mergeArgs;
 
     var {
       baseValue,
@@ -2610,14 +2592,14 @@
 
         case "insertAt":
           // Defaults to `-1`.
-          position = (_ = (_proxy$mergeArgs = proxy.mergeArgs) === null || _proxy$mergeArgs === void 0 ? void 0 : _proxy$mergeArgs[0]) !== null && _ !== void 0 ? _ : -1;
+          position = (_$1 = (_proxy$mergeArgs = proxy.mergeArgs) === null || _proxy$mergeArgs === void 0 ? void 0 : _proxy$mergeArgs[0]) !== null && _$1 !== void 0 ? _$1 : -1;
 
           if (position < 0) {
             // It's counted from the end if position is negative.
             position += quasis.length;
           }
 
-          position = lodash.clamp(position, 0, computedBaseValue.length);
+          position = _.clamp(position, 0, computedBaseValue.length);
           break;
         // istanbul ignore next: should never reach
 
@@ -2722,7 +2704,7 @@
 
           var expandableSlot = quasisMap.get(item.refSlot);
           var refPosition = (_item$refPosition = item.refPosition) !== null && _item$refPosition !== void 0 ? _item$refPosition : -1;
-          expandableSlot[lodash.clamp(refPosition < 0 ? expandableSlot.length + refPosition : refPosition, 0, expandableSlot.length - 1)].push(...((_externalSlots$item$$ = externalSlots === null || externalSlots === void 0 ? void 0 : (_externalSlots$item$$2 = externalSlots[item.$$reversedRef]) === null || _externalSlots$item$$2 === void 0 ? void 0 : _externalSlots$item$$2.bricks) !== null && _externalSlots$item$$ !== void 0 ? _externalSlots$item$$ : []));
+          expandableSlot[_.clamp(refPosition < 0 ? expandableSlot.length + refPosition : refPosition, 0, expandableSlot.length - 1)].push(...((_externalSlots$item$$ = externalSlots === null || externalSlots === void 0 ? void 0 : (_externalSlots$item$$2 = externalSlots[item.$$reversedRef]) === null || _externalSlots$item$$2 === void 0 ? void 0 : _externalSlots$item$$2.bricks) !== null && _externalSlots$item$$ !== void 0 ? _externalSlots$item$$ : []));
         }
       }
 
@@ -2877,7 +2859,7 @@
         brick.textContent = propValue;
       } else {
         if (extractProps) {
-          lodash.set(brick, propName, propValue);
+          _.set(brick, propName, propValue);
         } else {
           brick[propName] = propValue;
         }
@@ -2948,7 +2930,7 @@
         var defaultCollapsed = (_menuBar$menu = menuBar.menu) === null || _menuBar$menu === void 0 ? void 0 : _menuBar$menu.defaultCollapsed;
         var menu = yield processMenu(menuBar.menuId, context, kernel, hasSubMenu);
 
-        if (!lodash.isNil(defaultCollapsed)) {
+        if (!_.isNil(defaultCollapsed)) {
           menu.defaultCollapsed = defaultCollapsed;
         }
 
@@ -3220,7 +3202,7 @@
   }
 
   function sortMenuItems(list) {
-    return lodash.sortBy(list, item => {
+    return _.sortBy(list, item => {
       var _item$sort;
 
       return (_item$sort = item.sort) !== null && _item$sort !== void 0 ? _item$sort : -Infinity;
@@ -3401,6 +3383,11 @@
   function _dev_only_updateSnippetPreviewSettings(appId, snippetData) {
     kernel._dev_only_updateSnippetPreviewSettings(appId, snippetData);
   }
+  /* istanbul ignore next */
+
+  function _dev_only_updateFormPreviewSettings(appId, formId, settings) {
+    kernel._dev_only_updateFormPreviewSettings(appId, formId, settings);
+  }
   class Runtime {
     constructor() {
       _defineProperty__default["default"](this, "registerBrickTemplate", registerBrickTemplate);
@@ -5841,51 +5828,6 @@
     };
   }();
 
-  var mocks = {
-    mockId: null,
-    mockList: []
-  };
-  function registerMock(useMocks) {
-    var _useMocks$mockList;
-
-    if (useMocks) mocks = _objectSpread__default["default"](_objectSpread__default["default"]({}, useMocks), {}, {
-      mockList: (_useMocks$mockList = useMocks.mockList) === null || _useMocks$mockList === void 0 ? void 0 : _useMocks$mockList.map(item => {
-        var isFlowAPi = isCustomApiProvider(item.provider);
-        return _objectSpread__default["default"](_objectSpread__default["default"]({}, item), {}, {
-          uri: "".concat(isFlowAPi ? item.uri.replace(/(.+?)\/(.+)/, (_match, p1, p2) => {
-            return "/".concat(p1, "(@\\d+\\.\\d+\\.\\d+)?/").concat(p2, "$");
-          }) : "/".concat(item.uri.split(".").slice(2).join("."), "$")).replace(/:\w+/g, "([^/]+)")
-        });
-      })
-    });
-  }
-  function getMockList() {
-    return mocks.mockList;
-  }
-  var getMockInfo = (requestUrl, method) => {
-    var transformGetMethod = method => {
-      if (method.toUpperCase() === "LIST") {
-        return "GET";
-      }
-
-      return method === null || method === void 0 ? void 0 : method.toUpperCase();
-    };
-
-    var item = mocks.mockList.find(item => new RegExp(item.uri).test(requestUrl) && transformGetMethod(item.method) === (method === null || method === void 0 ? void 0 : method.toUpperCase()));
-
-    if (item) {
-      return {
-        url: requestUrl.replace(/(api\/gateway\/.+?)(@\d+\.\d+\.\d+)?\/(.+)/, (_match, p1, _p2, p3) => {
-          // 忽略版本
-          return "".concat(p1, "/").concat(p3);
-        }).replace(/(api\/gateway)/, "api/gateway/mock_server.proxy.".concat(mocks.mockId)),
-        mockId: mocks.mockId
-      };
-    }
-
-    return;
-  };
-
   var contractsMap = new Map();
   function collectContract(contracts) {
     contracts === null || contracts === void 0 ? void 0 : contracts.forEach(contract => {
@@ -6022,75 +5964,40 @@
     _fetchFlowApiDefinition2 = _asyncToGenerator__default["default"](function* (provider) {
       var [namespaceName, nameWithVersion] = provider.split("@");
       var [name, version] = nameWithVersion.split(":");
-      var isUseMock = getMockList().find(item => item.provider === "".concat(namespaceName, "@").concat(name));
-
-      if (isUseMock) {
-        var _list$;
+      var contract;
 
-        var {
-          list
-        } = yield InstanceApi_postSearchV3("FLOW_BUILDER_API_CONTRACT@EASYOPS", {
-          fields: ["name", "namespaceId", "endpoint", "response", "version", "serviceName"],
-          query: {
-            namespaceId: {
-              $eq: namespaceName
-            },
-            name: {
-              $eq: name
-            }
+      if (contract = getContract("".concat(namespaceName, ".").concat(name))) {
+        return {
+          name: contract.name,
+          namespace: contract.namespaceId,
+          serviceName: contract.serviceName,
+          version: contract.version,
+          contract: {
+            endpoint: contract.endpoint,
+            response: contract.response
           }
-        });
-
-        if ((_list$ = list[0]) !== null && _list$ !== void 0 && _list$.instanceId) {
-          var _list$2, _list$3;
-
-          return {
-            name: list[0].name,
-            namespace: (_list$2 = list[0]) === null || _list$2 === void 0 ? void 0 : _list$2.namespaceId,
-            serviceName: (_list$3 = list[0]) === null || _list$3 === void 0 ? void 0 : _list$3.serviceName,
-            version: list[0].version,
-            contract: {
-              endpoint: list[0].endpoint,
-              response: list[0].response
-            }
-          };
-        }
+        };
       } else {
-        var contract;
+        var {
+          contractData
+        } = yield ContractApi_searchSingleContract({
+          contractName: "".concat(namespaceName, ".").concat(name),
+          version
+        }); // return undefined if don't found contract
+
+        if (contractData) {
+          var _contractData$namespa, _contractData$namespa2;
 
-        if (contract = getContract("".concat(namespaceName, ".").concat(name))) {
           return {
-            name: contract.name,
-            namespace: contract.namespaceId,
-            serviceName: contract.serviceName,
-            version: contract.version,
+            name: contractData.name,
+            namespace: (_contractData$namespa = contractData.namespace) === null || _contractData$namespa === void 0 ? void 0 : (_contractData$namespa2 = _contractData$namespa[0]) === null || _contractData$namespa2 === void 0 ? void 0 : _contractData$namespa2.name,
+            serviceName: contractData.serviceName,
+            version: contractData.version,
             contract: {
-              endpoint: contract.endpoint,
-              response: contract.response
+              endpoint: contractData.endpoint,
+              response: contractData.response
             }
           };
-        } else {
-          var {
-            contractData
-          } = yield ContractApi_searchSingleContract({
-            contractName: "".concat(namespaceName, ".").concat(name),
-            version
-          }); // return undefined if don't found contract
-
-          if (contractData) {
-            var _contractData$namespa, _contractData$namespa2;
-
-            return {
-              name: contractData.name,
-              namespace: (_contractData$namespa = contractData.namespace) === null || _contractData$namespa === void 0 ? void 0 : (_contractData$namespa2 = _contractData$namespa[0]) === null || _contractData$namespa2 === void 0 ? void 0 : _contractData$namespa2.name,
-              serviceName: contractData.serviceName,
-              version: contractData.version,
-              contract: {
-                endpoint: contractData.endpoint,
-                response: contractData.response
-              }
-            };
-          }
         }
       }
     });
@@ -6940,7 +6847,7 @@
       var app = storyboard.app;
 
       if (app) {
-        app.config = brickUtils.deepFreeze(lodash.merge({}, app.defaultConfig, app.userConfig));
+        app.config = brickUtils.deepFreeze(_.merge({}, app.defaultConfig, app.userConfig));
 
         if (app.locales) {
           (function () {
@@ -8046,6 +7953,9 @@
     }
   }
 
+  var formRenderer = "form-renderer.form-renderer";
+  var filterProperties = ["brick", "slots", "properties", "events", "if", "context", "bricks", "mountPoint"];
+
   class Kernel {
     constructor() {
       var _this = this;
@@ -8378,7 +8288,7 @@
         path: previewPath,
         bricks: [_objectSpread__default["default"]({
           brick: templateId
-        }, lodash.pick(settings, "properties", "events", "lifeCycle", "context"))],
+        }, _.pick(settings, "properties", "events", "lifeCycle", "context"))],
         menu: false,
         exact: true
       };
@@ -8414,6 +8324,31 @@
       }
     }
 
+    _dev_only_updateFormPreviewSettings(appId, formId, formData) {
+      var {
+        routes
+      } = this.bootstrapData.storyboards.find(item => item.app.id === appId);
+      var previewPath = "${APP.homepage}/_dev_only_/form-preview/".concat(formId);
+      var previewRouteIndex = routes.findIndex(route => route.path === previewPath);
+      var newPreviewRoute = {
+        path: previewPath,
+        bricks: [{
+          brick: formRenderer,
+          properties: {
+            formData: formData
+          }
+        }],
+        menu: false,
+        exact: true
+      };
+
+      if (previewRouteIndex === -1) {
+        routes.unshift(newPreviewRoute);
+      } else {
+        routes.splice(previewRouteIndex, 1, newPreviewRoute);
+      }
+    }
+
     loadDepsOfStoryboard(storyboard) {
       return this.gracefullyLoadDeps(this._loadDepsOfStoryboard, storyboard);
     }
@@ -8709,7 +8644,7 @@
           return [];
         }
 
-        return lodash.sortBy(allRelatedApps.filter(item => item.objectId === thisApp.objectId), ["order"]);
+        return _.sortBy(allRelatedApps.filter(item => item.objectId === thisApp.objectId), ["order"]);
       })();
     }
 
@@ -8778,7 +8713,7 @@
 
       var currentAppId = this.currentApp.id;
       var currentStoryboard = this.bootstrapData.storyboards.find(storyboard => storyboard.app.id === currentAppId);
-      return ((_cloneDeep = lodash.cloneDeep((_currentStoryboard$me = currentStoryboard.meta) === null || _currentStoryboard$me === void 0 ? void 0 : _currentStoryboard$me.menus)) !== null && _cloneDeep !== void 0 ? _cloneDeep : []).filter(menu => menu.menuId === menuId).map(menu => _objectSpread__default["default"](_objectSpread__default["default"]({}, menu), {}, {
+      return ((_cloneDeep = _.cloneDeep((_currentStoryboard$me = currentStoryboard.meta) === null || _currentStoryboard$me === void 0 ? void 0 : _currentStoryboard$me.menus)) !== null && _cloneDeep !== void 0 ? _cloneDeep : []).filter(menu => menu.menuId === menuId).map(menu => _objectSpread__default["default"](_objectSpread__default["default"]({}, menu), {}, {
         app: [{
           appId: currentAppId
         }]
@@ -9114,6 +9049,299 @@
     }
   }
 
+  function ExpandCustomForm(formData, brickConf) {
+    var errorBrick = {
+      brick: "presentational-bricks.brick-illustration",
+      properties: {
+        category: "default",
+        header: {
+          title: "参数错误"
+        },
+        mode: "guide",
+        name: "search-empty"
+      }
+    };
+
+    try {
+      var formStoryboard = getStoryboard([formData.formSchema], [], formData.fields);
+      formStoryboard[0] = ___default["default"].isEmpty(formStoryboard[0]) ? errorBrick : formStoryboard[0];
+      return _objectSpread__default["default"](_objectSpread__default["default"]({}, brickConf), {}, {
+        brick: "div",
+        slots: {
+          "": {
+            bricks: formStoryboard,
+            type: "bricks"
+          }
+        }
+      });
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.warn(error.message);
+      return {
+        brick: "div",
+        slots: {
+          "": {
+            bricks: [errorBrick],
+            type: "bricks"
+          }
+        }
+      };
+    }
+  }
+  function getDefaultProperties(_name, fields) {
+    var field = fields.filter(item => item.id === _name)[0];
+    var defaultValue = {};
+
+    if (field) {
+      switch (field.type) {
+        case "STRING":
+          defaultValue = {
+            brick: "forms.general-input",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              placeholder: field.description
+            }
+          };
+          break;
+
+        case "INT":
+          defaultValue = {
+            brick: "forms.general-input-number",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              placeholder: field.description,
+              precision: 0,
+              inputBoxStyle: {
+                width: "100%"
+              }
+            }
+          };
+          break;
+
+        case "BOOLEAN":
+          defaultValue = {
+            brick: "forms.general-switch",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required")
+            }
+          };
+          break;
+
+        case "FLOAT":
+          defaultValue = {
+            brick: "forms.general-input-number",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              placeholder: field.description,
+              inputBoxStyle: {
+                width: "100%"
+              }
+            }
+          };
+          break;
+
+        case "ENUMERATED_SINGLE_OPTION":
+          defaultValue = {
+            brick: "forms.general-select",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              options: [{
+                label: "选项一",
+                value: 1
+              }, {
+                label: "选项二",
+                value: 2
+              }],
+              placeholder: field.description,
+              inputBoxStyle: {
+                width: "100%"
+              }
+            }
+          };
+          break;
+
+        case "SELECT_MULTIPLE_ENUMERATED_TYPE":
+          defaultValue = {
+            brick: "forms.general-select",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              mode: "multiple",
+              options: [{
+                label: "选项一",
+                value: 1
+              }, {
+                label: "选项二",
+                value: 2
+              }],
+              placeholder: field.description,
+              inputBoxStyle: {
+                width: "100%"
+              }
+            }
+          };
+          break;
+
+        case "DATE":
+          defaultValue = {
+            brick: "forms.general-date-picker",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              placeholder: field.description
+            }
+          };
+          break;
+
+        case "TIME":
+          defaultValue = {
+            brick: "forms.general-date-picker",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              placeholder: field.description
+            }
+          };
+          break;
+
+        case "IP":
+          defaultValue = {
+            brick: "forms.general-input",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              placeholder: field.description,
+              pattern: /((^\s*((([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]))\s*$)|(^\s*((([0-9A-Fa-f]{1,4}:){7}([0-9A-Fa-f]{1,4}|:))|(([0-9A-Fa-f]{1,4}:){6}(:[0-9A-Fa-f]{1,4}|((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3})|:))|(([0-9A-Fa-f]{1,4}:){5}(((:[0-9A-Fa-f]{1,4}){1,2})|:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3})|:))|(([0-9A-Fa-f]{1,4}:){4}(((:[0-9A-Fa-f]{1,4}){1,3})|((:[0-9A-Fa-f]{1,4})?:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){3}(((:[0-9A-Fa-f]{1,4}){1,4})|((:[0-9A-Fa-f]{1,4}){0,2}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){2}(((:[0-9A-Fa-f]{1,4}){1,5})|((:[0-9A-Fa-f]{1,4}){0,3}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(([0-9A-Fa-f]{1,4}:){1}(((:[0-9A-Fa-f]{1,4}){1,6})|((:[0-9A-Fa-f]{1,4}){0,4}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:))|(:(((:[0-9A-Fa-f]{1,4}){1,7})|((:[0-9A-Fa-f]{1,4}){0,5}:((25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)(\.(25[0-5]|2[0-4]\d|1\d\d|[1-9]?\d)){3}))|:)))(%.+)?\s*$))/
+            }
+          };
+          break;
+
+        case "JSON":
+          defaultValue = {};
+          break;
+
+        case "ARRAY":
+          defaultValue = {};
+          break;
+
+        case "STRUCTURE":
+          defaultValue = {
+            brick: "forms.cmdb-instance-select-panel",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required")
+            }
+          };
+          break;
+
+        case "STRUCTURE_ARRAY":
+          defaultValue = {
+            brick: "forms.cmdb-instance-select-panel",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required")
+            }
+          };
+          break;
+
+        default:
+          defaultValue = {
+            brick: "forms.general-input",
+            properties: {
+              id: field.id,
+              name: field.id,
+              label: field.name,
+              readOnly: field.limit.includes("readOnly"),
+              required: field.limit.includes("required"),
+              placeholder: field.description
+            }
+          };
+          break;
+      }
+    }
+
+    return defaultValue;
+  }
+  function getStoryboard(datasource, result, fields) {
+    var _loop = function (i) {
+      var dataItem = datasource[i];
+      var resultItem = {}; //数据初始化：根据id,字段类型获取默认属性
+
+      var defaultProperties = getDefaultProperties(dataItem.id, fields); //数据初始化：与默认属性进行合并
+
+      Object.keys(defaultProperties).forEach(item => {
+        if (!dataItem[item]) {
+          dataItem[item] = defaultProperties[item];
+        } else if (dataItem[item] && typeof dataItem[item] === "object") {
+          dataItem[item] = _objectSpread__default["default"](_objectSpread__default["default"]({}, defaultProperties[item]), dataItem[item]);
+        }
+      });
+      Object.keys(dataItem).forEach(item => {
+        if (filterProperties.includes(item)) {
+          resultItem[item] = dataItem[item];
+        }
+      });
+
+      if (Array.isArray(dataItem.bricks)) {
+        var _Object$keys;
+
+        resultItem["slots"] = ___default["default"].groupBy(getStoryboard(dataItem.bricks, [], fields), "mountPoint");
+        (_Object$keys = Object.keys(resultItem["slots"])) === null || _Object$keys === void 0 ? void 0 : _Object$keys.forEach(item => {
+          resultItem.slots[item] = {
+            bricks: resultItem.slots[item],
+            type: "bricks"
+          };
+        });
+      }
+
+      result[i] = resultItem;
+    };
+
+    for (var i = 0; i < datasource.length; i++) {
+      _loop(i);
+    }
+
+    return result;
+  }
+
   class LocationContext {
     constructor(kernel, location) {
       _defineProperty__default["default"](this, "query", void 0);
@@ -9230,7 +9458,7 @@
       // This enables two apps with relationship of parent-child of homepage.
 
 
-      var sortedStoryboards = lodash.orderBy(storyboards, storyboard => {
+      var sortedStoryboards = _.orderBy(storyboards, storyboard => {
         var _storyboard$app$homep, _storyboard$app, _storyboard$app$homep2;
 
         return (_storyboard$app$homep = (_storyboard$app = storyboard.app) === null || _storyboard$app === void 0 ? void 0 : (_storyboard$app$homep2 = _storyboard$app.homepage) === null || _storyboard$app$homep2 === void 0 ? void 0 : _storyboard$app$homep2.length) !== null && _storyboard$app$homep !== void 0 ? _storyboard$app$homep : 0;
@@ -9398,7 +9626,7 @@
         } // 静态菜单配置，仅在有值时才设置，这样可以让菜单设置也具有按路由层级覆盖的能力。
 
 
-        var otherMenuConf = lodash.omit(menuConf, ["injectDeep", "type"]);
+        var otherMenuConf = _.omit(menuConf, ["injectDeep", "type"]);
         var injectedMenuConf = injectDeep !== false ? computeRealValue(otherMenuConf, context, true) : otherMenuConf;
         var {
           sidebarMenu,
@@ -9576,7 +9804,7 @@
         if (brickConf[symbolForComputedPropsFromProxy]) {
           Object.entries(brickConf[symbolForComputedPropsFromProxy]).forEach(_ref2 => {
             var [propName, propValue] = _ref2;
-            lodash.set(brick.properties, propName, propValue);
+            _.set(brick.properties, propName, propValue);
           });
         }
 
@@ -9610,6 +9838,12 @@
           yield _this6.kernel.loadDynamicBricksInBrickConf(expandedBrickConf);
         }
 
+        if (brick.type === formRenderer) {
+          var formData = brick.properties.formData;
+          expandedBrickConf = ExpandCustomForm(formData, brickConf);
+          yield _this6.kernel.loadDynamicBricksInBrickConf(expandedBrickConf);
+        }
+
         if (expandedBrickConf.exports) {
           for (var [prop, ctxName] of Object.entries(expandedBrickConf.exports)) {
             if (typeof ctxName === "string" && ctxName.startsWith("CTX.")) {
@@ -9999,7 +10233,7 @@
                     function _fetchData() {
                       _fetchData = _asyncToGenerator__default["default"](function* () {
                         var value = yield promise;
-                        data = field === null || field === undefined ? value : lodash.get(value, field); // The fetched data and its inner objects should never be *injected* again.
+                        data = field === null || field === undefined ? value : _.get(value, field); // The fetched data and its inner objects should never be *injected* again.
 
                         recursiveMarkAsInjected(data);
                       });
@@ -10240,7 +10474,7 @@
         function _fetchData() {
           _fetchData = _asyncToGenerator__default["default"](function* () {
             var value = yield promise;
-            data = field === null || field === undefined ? value : lodash.get(value, field); // The fetched data and its inner objects should never be *injected* again.
+            data = field === null || field === undefined ? value : _.get(value, field); // The fetched data and its inner objects should never be *injected* again.
 
             recursiveMarkAsInjected(data);
           });
@@ -10338,6 +10572,57 @@
     return defaultCollapsed || defaultCollapsedBreakpoint && document.documentElement.clientWidth < defaultCollapsedBreakpoint;
   }
 
+  var mocks = {
+    mockId: null,
+    mockList: []
+  };
+  function registerMock(useMocks) {
+    var _useMocks$mockList;
+
+    if (useMocks) mocks = _objectSpread__default["default"](_objectSpread__default["default"]({}, useMocks), {}, {
+      mockList: (_useMocks$mockList = useMocks.mockList) === null || _useMocks$mockList === void 0 ? void 0 : _useMocks$mockList.map(item => {
+        var isFlowAPi = isCustomApiProvider(item.provider);
+        return _objectSpread__default["default"](_objectSpread__default["default"]({}, item), {}, {
+          uri: "".concat(isFlowAPi ? item.uri.replace(/(.+?)\/(.+)/, (_match, p1, p2) => {
+            return "/".concat(p1, "(@\\d+\\.\\d+\\.\\d+)?/").concat(p2, "$");
+          }) : "/".concat(item.uri.split(".").slice(2).join("."), "$")).replace(/:\w+/g, "([^/]+)")
+        });
+      })
+    });
+  }
+  var getMockInfo = (requestUrl, method) => {
+    var transformGetMethod = method => {
+      if (method.toUpperCase() === "LIST") {
+        return "GET";
+      }
+
+      return method === null || method === void 0 ? void 0 : method.toUpperCase();
+    };
+
+    var item = mocks.mockList.find(item => new RegExp(item.uri).test(requestUrl) && transformGetMethod(item.method) === (method === null || method === void 0 ? void 0 : method.toUpperCase()));
+
+    if (item) {
+      return {
+        url: requestUrl.replace(/(api\/gateway\/.+?)(@\d+\.\d+\.\d+)?\/(.+)/, (_match, p1, _p2, p3) => {
+          // 忽略版本
+          return "".concat(p1, "/").concat(p3);
+        }).replace(/(api\/gateway)/, "api/gateway/mock_server.proxy.".concat(mocks.mockId)),
+        mockId: mocks.mockId
+      };
+    }
+
+    return;
+  };
+
+  function registerFormRenderer() {
+    customElements.get(formRenderer) || customElements.define(formRenderer, class FormElement extends HTMLElement {
+      get $$typeof() {
+        return "formRenderer";
+      }
+
+    });
+  }
+
   class Router {
     constructor(kernel) {
       _defineProperty__default["default"](this, "defaultCollapsed", false);
@@ -10510,7 +10795,7 @@
         var _apiAnalyzer$getInsta, _getLocalAppsTheme;
 
         _this3.state = "initial";
-        _this3.renderId = lodash.uniqueId("render-id-");
+        _this3.renderId = _.uniqueId("render-id-");
         resetAllInjected();
         clearPollTimeout();
 
@@ -10546,6 +10831,7 @@
 
           registerStoryboardFunctions((_storyboard$meta = storyboard.meta) === null || _storyboard$meta === void 0 ? void 0 : _storyboard$meta.functions, storyboard.app);
           registerMock((_storyboard$meta2 = storyboard.meta) === null || _storyboard$meta2 === void 0 ? void 0 : _storyboard$meta2.mocks);
+          registerFormRenderer();
           collectContract((_storyboard$meta3 = storyboard.meta) === null || _storyboard$meta3 === void 0 ? void 0 : _storyboard$meta3.contracts);
         }
 
@@ -10605,23 +10891,8 @@
           };
 
           try {
-            var specificTemplatePreviewIndex = lodash.findLastIndex(storyboard.routes, route => route.path.startsWith("${APP.homepage}/_dev_only_/template-preview/"));
-            var specificSnippetPreviewIndex = lodash.findLastIndex(storyboard.routes, route => route.path.startsWith("${APP.homepage}/_dev_only_/snippet-preview/"));
-            var mergedRoutes = [...storyboard.routes.slice(0, specificTemplatePreviewIndex + 1), ...storyboard.routes.slice(0, specificSnippetPreviewIndex + 1), {
-              path: "${APP.homepage}/_dev_only_/template-preview/:templateId",
-              bricks: [{
-                brick: "span"
-              }],
-              menu: false,
-              exact: true
-            }, {
-              path: "${APP.homepage}/_dev_only_/snippet-preview/:snippetId",
-              bricks: [{
-                brick: "span"
-              }],
-              menu: false,
-              exact: true
-            }, ...storyboard.routes.slice(specificTemplatePreviewIndex + 1)];
+            var mergedRoutes = _this3.MergePreviewRouter(storyboard.routes);
+
             yield locationContext.mountRoutes(mergedRoutes, undefined, mountRoutesResult);
           } catch (error) {
             // eslint-disable-next-line no-console
@@ -10831,6 +11102,50 @@
         subMenu: mountResult.menuBar.subMenu
       };
     }
+
+    MergePreviewRouter(router) {
+      var mergedRoutes = router;
+      var specificTemplatePreviewIndex = _.findLastIndex(mergedRoutes, route => route.path.startsWith("${APP.homepage}/_dev_only_/template-preview/"));
+
+      if (specificTemplatePreviewIndex > -1) {
+        mergedRoutes = [...mergedRoutes.slice(0, specificTemplatePreviewIndex + 1), {
+          path: "${APP.homepage}/_dev_only_/template-preview/:templateId",
+          bricks: [{
+            brick: "span"
+          }],
+          menu: false,
+          exact: true
+        }, ...mergedRoutes.slice(specificTemplatePreviewIndex + 1)];
+      }
+
+      var specificSnippetPreviewIndex = _.findLastIndex(mergedRoutes, route => route.path.startsWith("${APP.homepage}/_dev_only_/snippet-preview/"));
+
+      if (specificSnippetPreviewIndex > -1) {
+        mergedRoutes = [...mergedRoutes.slice(0, specificSnippetPreviewIndex + 1), {
+          path: "${APP.homepage}/_dev_only_/snippet-preview/:snippetId",
+          bricks: [{
+            brick: "span"
+          }],
+          menu: false,
+          exact: true
+        }, ...mergedRoutes.slice(specificSnippetPreviewIndex + 1)];
+      }
+
+      var specificFormPreviewIndex = _.findLastIndex(mergedRoutes, route => route.path.startsWith("${APP.homepage}/_dev_only_/form-preview/"));
+
+      if (specificFormPreviewIndex > -1) {
+        mergedRoutes = [...mergedRoutes.slice(0, specificFormPreviewIndex + 1), {
+          path: "${APP.homepage}/_dev_only_/form-preview/:FormId",
+          bricks: [{
+            brick: "span"
+          }],
+          menu: false,
+          exact: true
+        }, ...mergedRoutes.slice(specificFormPreviewIndex + 1)];
+      }
+
+      return mergedRoutes;
+    }
     /* istanbul ignore next */
 
 
@@ -11830,7 +12145,7 @@
       if (useBrick[symbolForComputedPropsFromProxy]) {
         Object.entries(useBrick[symbolForComputedPropsFromProxy]).forEach(_ref3 => {
           var [propName, propValue] = _ref3;
-          lodash.set(brick.properties, propName, propValue);
+          _.set(brick.properties, propName, propValue);
         });
       }
 
@@ -12032,7 +12347,7 @@
       if (useBrick[symbolForComputedPropsFromProxy]) {
         Object.entries(useBrick[symbolForComputedPropsFromProxy]).forEach(_ref9 => {
           var [propName, propValue] = _ref9;
-          lodash.set(brick.properties, propName, propValue);
+          _.set(brick.properties, propName, propValue);
         });
       }
 
@@ -12506,7 +12821,7 @@
       isBig
     } = props;
     var theme = useCurrentTheme();
-    var prefix = lodash.uniqueId();
+    var prefix = _.uniqueId();
 
     var createNewId = id => {
       return prefix + id;
@@ -13248,10 +13563,11 @@
     getFakeKernel: _dev_only_getFakeKernel,
 
     /** @deprecated Keep it for backward-compatibility. */
-    checkoutTplContext: lodash.noop,
+    checkoutTplContext: _.noop,
     updateStoryboard: _dev_only_updateStoryboard,
     updateTemplatePreviewSettings: _dev_only_updateTemplatePreviewSettings,
-    updateSnippetPreviewSettings: _dev_only_updateSnippetPreviewSettings
+    updateSnippetPreviewSettings: _dev_only_updateSnippetPreviewSettings,
+    updateFormPreviewSettings: _dev_only_updateFormPreviewSettings
   };
 
   var _excluded$2 = ["type"];
@@ -13586,9 +13902,9 @@
           return e => {
             if (e) {
               if (typeof e.detail === "object" && !Array.isArray(e.detail)) {
-                lodash.merge(this, e.detail);
+                _.merge(this, e.detail);
               } else {
-                lodash.merge(this, {
+                _.merge(this, {
                   detail: e.detail
                 });
               }
@@ -13649,9 +13965,9 @@
     var options = React.useMemo(() => {
       var localOptions = {};
 
-      if (lodash.isObject(providerOrParamsOrGlobalOptions)) {
+      if (_.isObject(providerOrParamsOrGlobalOptions)) {
         localOptions = providerOrParamsOrGlobalOptions;
-      } else if (lodash.isObject(gloabalOptionsOrDeps)) {
+      } else if (_.isObject(gloabalOptionsOrDeps)) {
         localOptions = gloabalOptionsOrDeps;
       }
 
@@ -13819,13 +14135,13 @@
         var providerStr = provider;
         var providerArgs = [];
 
-        if (lodash.isString(providerOrBody)) {
+        if (_.isString(providerOrBody)) {
           providerStr = providerOrBody;
         }
 
-        if (lodash.isObject(providerOrBody)) {
+        if (_.isObject(providerOrBody)) {
           providerArgs = providerOrBody;
-        } else if (lodash.isObject(args)) {
+        } else if (_.isObject(args)) {
           providerArgs = args;
         }