@next-core/brick-kit 2.158.1 → 2.159.0

package/dist/index.bundle.js

@@ -9299,9 +9299,9 @@
       return defaultValue;
     } else return {};
   }
-  function getStoryboard(datasource, result, fields, isPreview, formContextId) {
+  function getStoryboard(dataSource, result, fields, isPreview, formContextId) {
     var _loop = function (i) {
-      var dataItem = datasource[i];
+      var dataItem = dataSource[i];
       var resultItem = {};
       //数据初始化：根据id,字段类型获取默认属性
       var defaultProperties = getDefaultProperties(dataItem.id, fields);
@@ -9349,7 +9349,7 @@
       });
       result[i] = resultItem;
     };
-    for (var i = 0; i < datasource.length; i++) {
+    for (var i = 0; i < dataSource.length; i++) {
       _loop(i);
     }
     return result;
@@ -9801,7 +9801,7 @@
           }
           tplStack.set(tplTagName, tplCount + 1);
         }
-        if (brickConf.brick === formRenderer) {
+        if (brickConf.brick === formRenderer && typeof brickConf.properties.formData === "object") {
           brickConf.properties.formData = JSON.stringify(brickConf.properties.formData);
         }
         var brick = {};
@@ -9856,7 +9856,7 @@
           yield _this7.kernel.loadDynamicBricksInBrickConf(expandedBrickConf);
         }
         if (brick.type === formRenderer) {
-          var formData = JSON.parse(brick.properties.formData);
+          var formData = typeof brick.properties.formData === "string" ? JSON.parse(brick.properties.formData) : brick.properties.formData;
           expandedBrickConf = yield AsyncExpandCustomForm(formData, brickConf, brick.properties.isPreview, context);
           yield _this7.kernel.loadDynamicBricksInBrickConf(expandedBrickConf);
         }
@@ -11514,8 +11514,7 @@
     return location;
   }
 
-  var expandTemplateInUseBrick = (useBrick, tplTagName, brick) => {
-    var template;
+  function expandTemplateInUseBrick(useBrick, tplTagName, brick, requireSuspense) {
     if (tplTagName) {
       // 如果是模板, 需要展开解析模板, 并遍历模板中的slots, 再给slots的brick绑定值给自身
       // 为后续ProxyRefs获取brick做值缓存
@@ -11526,12 +11525,11 @@
         lifeCycle: useBrick.lifeCycle,
         slots: useBrick.slots
       };
-      template = expandCustomTemplate(tplConf, brick, _internalApiGetCurrentContext());
+      return (requireSuspense ? asyncExpandCustomTemplate : expandCustomTemplate)(tplConf, brick, _internalApiGetCurrentContext());
     } else if (useBrick[symbolForRefForProxy]) {
       useBrick[symbolForRefForProxy].brick = brick;
     }
-    return template;
-  };
+  }
   var getCurrentRunTimeBrick = (useBrick, tplTagName, data) => {
     var trackingContextList = [];
     var tplContextId = useBrick[symbolForTplContextId];
@@ -11573,7 +11571,7 @@
    * @param props - 属性。
    */
   var SingleBrickAsComponent = /*#__PURE__*/React__default["default"].memo(function SingleBrickAsComponent(_ref) {
-    var _internalApiGetCurren, _templateRef$current$, _templateRef$current2;
+    var _internalApiGetCurren, _brick, _ref8;
     var {
       useBrick,
       data,
@@ -11583,10 +11581,10 @@
     var firstRunRef = React.useRef(true);
     var innerRefCallbackRef = React.useRef();
     var elementRef = React.useRef();
-    var templateRef = React.useRef();
-    var formRef = React.useRef();
+    var expandedBrickConfRef = React.useRef();
+    var [expandedBrickConf, setExpandedBrickConf] = React.useState(null);
     var tplTagName = getTagNameOfCustomTemplate(useBrick.brick, (_internalApiGetCurren = _internalApiGetCurrentContext().app) === null || _internalApiGetCurren === void 0 ? void 0 : _internalApiGetCurren.id);
-    var isBrickAvailable = React__default["default"].useMemo(() => {
+    var isBrickAvailable = React.useMemo(() => {
       if (brickUtils.isObject(useBrick.if) && !isPreEvaluated(useBrick.if)) {
         // eslint-disable-next-line
         console.warn("Currently resolvable-if in `useBrick` is not supported.");
@@ -11599,7 +11597,17 @@
       }
       return true;
     }, [useBrick, data]);
-    var runtimeBrick = React__default["default"].useMemo( /*#__PURE__*/_asyncToGenerator__default["default"](function* () {
+    var requireSuspense = React.useMemo(() => {
+      var context;
+      if (useBrick.brick === formRenderer) {
+        context = useBrick.properties.formData.context;
+      } else if (tplTagName) {
+        context = customTemplateRegistry.get(tplTagName).state;
+      }
+      return Array.isArray(context) && context.some(ctx => !!ctx.resolve);
+    }, [tplTagName, useBrick]);
+    var [suspenseReady, setSuspenseReady] = React.useState(false);
+    var runtimeBrick = React.useMemo( /*#__PURE__*/_asyncToGenerator__default["default"](function* () {
       if (!isBrickAvailable) {
         return null;
       }
@@ -11610,11 +11618,14 @@
       }
       _internalApiLoadDynamicBricksInBrickConf(useBrick).catch(handleHttpError);
       var brick = getCurrentRunTimeBrick(useBrick, tplTagName, data);
-      templateRef.current = expandTemplateInUseBrick(useBrick, tplTagName, brick);
-      if (useBrick.brick === formRenderer) {
-        var _useBrick$properties;
-        formRef.current = ExpandCustomForm((_useBrick$properties = useBrick.properties) === null || _useBrick$properties === void 0 ? void 0 : _useBrick$properties.formData, useBrick, false);
+      var expanded = useBrick.brick === formRenderer ? (requireSuspense ? AsyncExpandCustomForm : ExpandCustomForm)(useBrick.properties.formData, useBrick, false) : expandTemplateInUseBrick(useBrick, tplTagName, brick, requireSuspense);
+      if (requireSuspense) {
+        setExpandedBrickConf(yield expanded);
+        setSuspenseReady(true);
+      } else {
+        expandedBrickConfRef.current = expanded;
       }
+
       // Let `transform` works still.
       transformProperties(brick.properties, data, useBrick.transform, useBrick.transformFrom, undefined, {
         allowInject: true
@@ -11637,7 +11648,7 @@
         }));
       }
       return brick;
-    }), [useBrick, data, isBrickAvailable, tplTagName]);
+    }), [useBrick, data, isBrickAvailable, tplTagName, requireSuspense]);
     var dispatchLifeCycleEvent = /*#__PURE__*/function () {
       var _ref4 = _asyncToGenerator__default["default"](function* (event, handlers, brick) {
         for (var handler of [].concat(handlers)) {
@@ -11734,13 +11745,13 @@
       innerRefCallbackRef.current(element);
     }, []);
     var childConfs = React.useMemo(() => {
-      var _ref7, _templateRef$current;
-      return slotsToChildren(((_ref7 = (_templateRef$current = templateRef.current) !== null && _templateRef$current !== void 0 ? _templateRef$current : formRef.current) !== null && _ref7 !== void 0 ? _ref7 : useBrick).slots);
-    }, [templateRef.current, formRef.current, useBrick]);
-    if (!isBrickAvailable) {
+      var _ref7;
+      return slotsToChildren(((_ref7 = requireSuspense ? expandedBrickConf : expandedBrickConfRef.current) !== null && _ref7 !== void 0 ? _ref7 : useBrick).slots);
+    }, [expandedBrickConf, expandedBrickConfRef.current, useBrick, requireSuspense]);
+    if (!isBrickAvailable || requireSuspense && !suspenseReady) {
       return null;
     }
-    return /*#__PURE__*/React__default["default"].createElement((_templateRef$current$ = (_templateRef$current2 = templateRef.current) === null || _templateRef$current2 === void 0 ? void 0 : _templateRef$current2.brick) !== null && _templateRef$current$ !== void 0 ? _templateRef$current$ : tplTagName || useBrick.brick, {
+    return /*#__PURE__*/React__default["default"].createElement((_brick = (_ref8 = requireSuspense ? expandedBrickConf : expandedBrickConfRef.current) === null || _ref8 === void 0 ? void 0 : _ref8.brick) !== null && _brick !== void 0 ? _brick : tplTagName || useBrick.brick, {
       ref: innerRefCallback
     }, ...childConfs.map((item, index) => /*#__PURE__*/React__default["default"].createElement(SingleBrickAsComponent, {
       key: index,
@@ -11767,11 +11778,11 @@
    *
    * @param props - 属性。
    */
-  function BrickAsComponent(_ref8) {
+  function BrickAsComponent(_ref9) {
     var {
       useBrick,
       data
-    } = _ref8;
+    } = _ref9;
     if (Array.isArray(useBrick)) {
       return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, useBrick.map((item, index) => /*#__PURE__*/React__default["default"].createElement(SingleBrickAsComponent, {
         key: index,
@@ -11788,8 +11799,8 @@
     if (!slots) {
       return [];
     }
-    return Object.entries(slots).flatMap(_ref9 => {
-      var [slot, slotConf] = _ref9;
+    return Object.entries(slots).flatMap(_ref10 => {
+      var [slot, slotConf] = _ref10;
       return Array.isArray(slotConf.bricks) ? slotConf.bricks.map(child => _objectSpread__default["default"](_objectSpread__default["default"]({}, child), {}, {
         properties: _objectSpread__default["default"](_objectSpread__default["default"]({}, child.properties), {}, {
           slot
@@ -11807,19 +11818,19 @@
 
   /* istanbul ignore next */
   // eslint-disable-next-line react/display-name
-  var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React__default["default"].memo( /*#__PURE__*/React.forwardRef(function LegacySingleBrickAsComponent(_ref10, ref) {
-    var _internalApiGetCurren2, _templateRef$current$2, _templateRef$current4;
+  var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React__default["default"].memo( /*#__PURE__*/React.forwardRef(function LegacySingleBrickAsComponent(_ref11, ref) {
+    var _internalApiGetCurren2, _brick2, _ref18;
     var {
       useBrick,
       data,
       refCallback
-    } = _ref10;
+    } = _ref11;
     var firstRunRef = React.useRef(true);
     var innerRefCallbackRef = React.useRef();
     var elementRef = React.useRef();
-    var templateRef = React.useRef();
+    var expandedBrickConfRef = React.useRef();
+    var [expandedBrickConf, setExpandedBrickConf] = React.useState(null);
     var tplTagName = getTagNameOfCustomTemplate(useBrick.brick, (_internalApiGetCurren2 = _internalApiGetCurrentContext().app) === null || _internalApiGetCurren2 === void 0 ? void 0 : _internalApiGetCurren2.id);
-    var formRef = React.useRef();
     var isBrickAvailable = React__default["default"].useMemo(() => {
       if (brickUtils.isObject(useBrick.if) && !isPreEvaluated(useBrick.if)) {
         // eslint-disable-next-line
@@ -11833,6 +11844,16 @@
       }
       return true;
     }, [useBrick, data]);
+    var requireSuspense = React.useMemo(() => {
+      var context;
+      if (useBrick.brick === formRenderer) {
+        context = useBrick.properties.formData.context;
+      } else if (tplTagName) {
+        context = customTemplateRegistry.get(tplTagName).state;
+      }
+      return Array.isArray(context) && context.some(ctx => !!ctx.resolve);
+    }, [tplTagName, useBrick]);
+    var [suspenseReady, setSuspenseReady] = React.useState(false);
 
     /* istanbul ignore next (never reach in test) */
     React.useImperativeHandle(ref, () => {
@@ -11849,10 +11870,12 @@
       }
       _internalApiLoadDynamicBricksInBrickConf(useBrick).catch(handleHttpError);
       var brick = getCurrentRunTimeBrick(useBrick, tplTagName, data);
-      templateRef.current = expandTemplateInUseBrick(useBrick, tplTagName, brick);
-      if (useBrick.brick === formRenderer) {
-        var _useBrick$properties2;
-        formRef.current = ExpandCustomForm((_useBrick$properties2 = useBrick.properties) === null || _useBrick$properties2 === void 0 ? void 0 : _useBrick$properties2.formData, useBrick, false);
+      var expanded = useBrick.brick === formRenderer ? (requireSuspense ? AsyncExpandCustomForm : ExpandCustomForm)(useBrick.properties.formData, useBrick, false) : expandTemplateInUseBrick(useBrick, tplTagName, brick, requireSuspense);
+      if (requireSuspense) {
+        setExpandedBrickConf(yield expanded);
+        setSuspenseReady(true);
+      } else {
+        expandedBrickConfRef.current = expanded;
       }
 
       // Let `transform` works still.
@@ -11862,8 +11885,8 @@
 
       // 设置 properties refProperty值
       if (useBrick[symbolForComputedPropsFromProxy]) {
-        Object.entries(useBrick[symbolForComputedPropsFromProxy]).forEach(_ref12 => {
-          var [propName, propValue] = _ref12;
+        Object.entries(useBrick[symbolForComputedPropsFromProxy]).forEach(_ref13 => {
+          var [propName, propValue] = _ref13;
           _.set(brick.properties, propName, propValue);
         });
       }
@@ -11877,9 +11900,9 @@
         }));
       }
       return brick;
-    }), [useBrick, data, isBrickAvailable, tplTagName]);
+    }), [useBrick, data, isBrickAvailable, tplTagName, requireSuspense]);
     var dispatchLifeCycleEvent = /*#__PURE__*/function () {
-      var _ref13 = _asyncToGenerator__default["default"](function* (event, handlers, brick) {
+      var _ref14 = _asyncToGenerator__default["default"](function* (event, handlers, brick) {
         for (var handler of [].concat(handlers)) {
           listenerFactory(handler, _objectSpread__default["default"](_objectSpread__default["default"]({}, _internalApiGetCurrentContext()), {}, {
             tplContextId: useBrick[symbolForTplContextId]
@@ -11887,7 +11910,7 @@
         }
       });
       return function dispatchLifeCycleEvent(_x5, _x6, _x7) {
-        return _ref13.apply(this, arguments);
+        return _ref14.apply(this, arguments);
       };
     }();
     var updateBrick = React.useCallback((brick, element) => {
@@ -11938,7 +11961,7 @@
       })();
     }, [runtimeBrick, updateBrick]);
     innerRefCallbackRef.current = /*#__PURE__*/function () {
-      var _ref15 = _asyncToGenerator__default["default"](function* (element) {
+      var _ref16 = _asyncToGenerator__default["default"](function* (element) {
         elementRef.current = element;
         var brick;
         try {
@@ -11964,7 +11987,7 @@
         refCallback === null || refCallback === void 0 ? void 0 : refCallback(element);
       });
       return function (_x8) {
-        return _ref15.apply(this, arguments);
+        return _ref16.apply(this, arguments);
       };
     }();
 
@@ -11973,13 +11996,13 @@
       innerRefCallbackRef.current(element);
     }, []);
     var childConfs = React.useMemo(() => {
-      var _ref16, _templateRef$current3;
-      return slotsToChildren(((_ref16 = (_templateRef$current3 = templateRef.current) !== null && _templateRef$current3 !== void 0 ? _templateRef$current3 : formRef.current) !== null && _ref16 !== void 0 ? _ref16 : useBrick).slots);
-    }, [templateRef.current, formRef.current, useBrick]);
-    if (!isBrickAvailable) {
+      var _ref17;
+      return slotsToChildren(((_ref17 = requireSuspense ? expandedBrickConf : expandedBrickConfRef.current) !== null && _ref17 !== void 0 ? _ref17 : useBrick).slots);
+    }, [expandedBrickConf, expandedBrickConfRef.current, useBrick, requireSuspense]);
+    if (!isBrickAvailable || requireSuspense && !suspenseReady) {
       return null;
     }
-    return /*#__PURE__*/React__default["default"].createElement((_templateRef$current$2 = (_templateRef$current4 = templateRef.current) === null || _templateRef$current4 === void 0 ? void 0 : _templateRef$current4.brick) !== null && _templateRef$current$2 !== void 0 ? _templateRef$current$2 : tplTagName || useBrick.brick, {
+    return /*#__PURE__*/React__default["default"].createElement((_brick2 = (_ref18 = requireSuspense ? expandedBrickConf : expandedBrickConfRef.current) === null || _ref18 === void 0 ? void 0 : _ref18.brick) !== null && _brick2 !== void 0 ? _brick2 : tplTagName || useBrick.brick, {
       ref: innerRefCallback
     }, ...childConfs.map((item, index) => /*#__PURE__*/React__default["default"].createElement(SingleBrickAsComponent, {
       key: index,