@next-core/brick-kit 2.158.2 → 2.159.0

package/dist/index.esm.js

@@ -3,7 +3,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import _asyncToGenerator$3 from '@babel/runtime/helpers/asyncToGenerator';
 import _defineProperty$1 from '@babel/runtime/helpers/defineProperty';
-import React, { useState, useEffect, useRef, useCallback, useMemo, forwardRef, useImperativeHandle, useContext, createContext, useReducer } from 'react';
+import React, { useState, useEffect, useRef, useMemo, useCallback, forwardRef, useImperativeHandle, useContext, createContext, useReducer } from 'react';
 import { JsonStorage, toPath, computeRealRoutePath, hasOwnProperty, isObject, isEvaluable, transformAndInject, transform, trackContext, trackState, trackFormState, scanPermissionActionsInStoryboard, precookFunction, cook, resolveContextConcurrently, syncResolveContextConcurrently, trackUsedState, trackUsedContext, shouldAllowRecursiveEvaluations, preevaluate, inject, matchPath, deepFreeze, createProviderClass, removeDeadConditionsInTpl, getTemplateDepsOfStoryboard, getDllAndDepsOfStoryboard, asyncProcessStoryboard, getDllAndDepsByResource, scanRouteAliasInStoryboard, prefetchScript, scanBricksInBrickConf, scanProcessorsInAny, loadScript, scanAppGetMenuInAny, asyncProcessBrick, scanInstalledAppsInStoryboard, removeDeadConditions, restoreDynamicTemplates, scanStoryboard, mapCustomApisToNameAndNamespace } from '@next-core/brick-utils';
 import _, { set, get, difference, identity, uniqueId, cloneDeep, clamp, isNil, isEmpty, sortBy, orderBy, merge, isObject as isObject$1, uniq, pick, omit, findLastIndex, noop, isString as isString$1 } from 'lodash';
 import { http, HttpResponseError, HttpAbortError, HttpFetchError } from '@next-core/brick-http';
@@ -9300,9 +9300,9 @@ function getDefaultProperties(_name, fields) {
     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);
@@ -9350,7 +9350,7 @@ function getStoryboard(datasource, result, fields, isPreview, formContextId) {
     });
     result[i] = resultItem;
   };
-  for (var i = 0; i < datasource.length; i++) {
+  for (var i = 0; i < dataSource.length; i++) {
     _loop(i);
   }
   return result;
@@ -11515,8 +11515,7 @@ function useLocation() {
   return location;
 }
 
-var expandTemplateInUseBrick = (useBrick, tplTagName, brick) => {
-  var template;
+function expandTemplateInUseBrick(useBrick, tplTagName, brick, requireSuspense) {
   if (tplTagName) {
     // 如果是模板, 需要展开解析模板, 并遍历模板中的slots, 再给slots的brick绑定值给自身
     // 为后续ProxyRefs获取brick做值缓存
@@ -11527,12 +11526,11 @@ var expandTemplateInUseBrick = (useBrick, tplTagName, brick) => {
       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];
@@ -11574,7 +11572,7 @@ var getCurrentRunTimeBrick = (useBrick, tplTagName, data) => {
  * @param props - 属性。
  */
 var SingleBrickAsComponent = /*#__PURE__*/React.memo(function SingleBrickAsComponent(_ref) {
-  var _internalApiGetCurren, _templateRef$current$, _templateRef$current2;
+  var _internalApiGetCurren, _brick, _ref8;
   var {
     useBrick,
     data,
@@ -11584,10 +11582,10 @@ var SingleBrickAsComponent = /*#__PURE__*/React.memo(function SingleBrickAsCompo
   var firstRunRef = useRef(true);
   var innerRefCallbackRef = useRef();
   var elementRef = useRef();
-  var templateRef = useRef();
-  var formRef = useRef();
+  var expandedBrickConfRef = useRef();
+  var [expandedBrickConf, setExpandedBrickConf] = useState(null);
   var tplTagName = getTagNameOfCustomTemplate(useBrick.brick, (_internalApiGetCurren = _internalApiGetCurrentContext().app) === null || _internalApiGetCurren === void 0 ? void 0 : _internalApiGetCurren.id);
-  var isBrickAvailable = React.useMemo(() => {
+  var isBrickAvailable = useMemo(() => {
     if (isObject(useBrick.if) && !isPreEvaluated(useBrick.if)) {
       // eslint-disable-next-line
       console.warn("Currently resolvable-if in `useBrick` is not supported.");
@@ -11600,7 +11598,17 @@ var SingleBrickAsComponent = /*#__PURE__*/React.memo(function SingleBrickAsCompo
     }
     return true;
   }, [useBrick, data]);
-  var runtimeBrick = React.useMemo( /*#__PURE__*/_asyncToGenerator$3(function* () {
+  var requireSuspense = 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] = useState(false);
+  var runtimeBrick = useMemo( /*#__PURE__*/_asyncToGenerator$3(function* () {
     if (!isBrickAvailable) {
       return null;
     }
@@ -11611,11 +11619,14 @@ var SingleBrickAsComponent = /*#__PURE__*/React.memo(function SingleBrickAsCompo
     }
     _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
@@ -11638,7 +11649,7 @@ var SingleBrickAsComponent = /*#__PURE__*/React.memo(function SingleBrickAsCompo
       }));
     }
     return brick;
-  }), [useBrick, data, isBrickAvailable, tplTagName]);
+  }), [useBrick, data, isBrickAvailable, tplTagName, requireSuspense]);
   var dispatchLifeCycleEvent = /*#__PURE__*/function () {
     var _ref4 = _asyncToGenerator$3(function* (event, handlers, brick) {
       for (var handler of [].concat(handlers)) {
@@ -11735,13 +11746,13 @@ var SingleBrickAsComponent = /*#__PURE__*/React.memo(function SingleBrickAsCompo
     innerRefCallbackRef.current(element);
   }, []);
   var childConfs = 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.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.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.createElement(SingleBrickAsComponent, {
     key: index,
@@ -11768,11 +11779,11 @@ var SingleBrickAsComponent = /*#__PURE__*/React.memo(function SingleBrickAsCompo
  *
  * @param props - 属性。
  */
-function BrickAsComponent(_ref8) {
+function BrickAsComponent(_ref9) {
   var {
     useBrick,
     data
-  } = _ref8;
+  } = _ref9;
   if (Array.isArray(useBrick)) {
     return /*#__PURE__*/React.createElement(React.Fragment, null, useBrick.map((item, index) => /*#__PURE__*/React.createElement(SingleBrickAsComponent, {
       key: index,
@@ -11789,8 +11800,8 @@ function slotsToChildren(slots) {
   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(_objectSpread({}, child), {}, {
       properties: _objectSpread(_objectSpread({}, child.properties), {}, {
         slot
@@ -11808,19 +11819,19 @@ function transformEvents(data, events) {
 
 /* istanbul ignore next */
 // eslint-disable-next-line react/display-name
-var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/forwardRef(function LegacySingleBrickAsComponent(_ref10, ref) {
-  var _internalApiGetCurren2, _templateRef$current$2, _templateRef$current4;
+var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/forwardRef(function LegacySingleBrickAsComponent(_ref11, ref) {
+  var _internalApiGetCurren2, _brick2, _ref18;
   var {
     useBrick,
     data,
     refCallback
-  } = _ref10;
+  } = _ref11;
   var firstRunRef = useRef(true);
   var innerRefCallbackRef = useRef();
   var elementRef = useRef();
-  var templateRef = useRef();
+  var expandedBrickConfRef = useRef();
+  var [expandedBrickConf, setExpandedBrickConf] = useState(null);
   var tplTagName = getTagNameOfCustomTemplate(useBrick.brick, (_internalApiGetCurren2 = _internalApiGetCurrentContext().app) === null || _internalApiGetCurren2 === void 0 ? void 0 : _internalApiGetCurren2.id);
-  var formRef = useRef();
   var isBrickAvailable = React.useMemo(() => {
     if (isObject(useBrick.if) && !isPreEvaluated(useBrick.if)) {
       // eslint-disable-next-line
@@ -11834,6 +11845,16 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/for
     }
     return true;
   }, [useBrick, data]);
+  var requireSuspense = 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] = useState(false);
 
   /* istanbul ignore next (never reach in test) */
   useImperativeHandle(ref, () => {
@@ -11850,10 +11871,12 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/for
     }
     _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.
@@ -11863,8 +11886,8 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/for
 
     // 设置 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);
       });
     }
@@ -11878,9 +11901,9 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/for
       }));
     }
     return brick;
-  }), [useBrick, data, isBrickAvailable, tplTagName]);
+  }), [useBrick, data, isBrickAvailable, tplTagName, requireSuspense]);
   var dispatchLifeCycleEvent = /*#__PURE__*/function () {
-    var _ref13 = _asyncToGenerator$3(function* (event, handlers, brick) {
+    var _ref14 = _asyncToGenerator$3(function* (event, handlers, brick) {
       for (var handler of [].concat(handlers)) {
         listenerFactory(handler, _objectSpread(_objectSpread({}, _internalApiGetCurrentContext()), {}, {
           tplContextId: useBrick[symbolForTplContextId]
@@ -11888,7 +11911,7 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/for
       }
     });
     return function dispatchLifeCycleEvent(_x5, _x6, _x7) {
-      return _ref13.apply(this, arguments);
+      return _ref14.apply(this, arguments);
     };
   }();
   var updateBrick = useCallback((brick, element) => {
@@ -11939,7 +11962,7 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/for
     })();
   }, [runtimeBrick, updateBrick]);
   innerRefCallbackRef.current = /*#__PURE__*/function () {
-    var _ref15 = _asyncToGenerator$3(function* (element) {
+    var _ref16 = _asyncToGenerator$3(function* (element) {
       elementRef.current = element;
       var brick;
       try {
@@ -11965,7 +11988,7 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/for
       refCallback === null || refCallback === void 0 ? void 0 : refCallback(element);
     });
     return function (_x8) {
-      return _ref15.apply(this, arguments);
+      return _ref16.apply(this, arguments);
     };
   }();
 
@@ -11974,13 +11997,13 @@ var ForwardRefSingleBrickAsComponent = /*#__PURE__*/React.memo( /*#__PURE__*/for
     innerRefCallbackRef.current(element);
   }, []);
   var childConfs = 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.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.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.createElement(SingleBrickAsComponent, {
     key: index,