@modern-js/plugin-garfish 2.68.19-alpha.1 → 2.68.19-alpha.3

package/dist/cjs/runtime/utils/apps.js

@@ -96,8 +96,10 @@ function getAppInstance(options, appInfo, manifest) {
     const previousPropsRef = (0, import_react.useRef)(props);
     const propsUpdateCounterRef = (0, import_react.useRef)(0);
     const domId = (0, import_util.generateSubAppContainerKey)(appInfo);
-    const [{ component: SubModuleComponent }, setSubModuleComponent] = (0, import_react.useState)({
-      component: null
+    const componentRef = (0, import_react.useRef)(null);
+    const [{ component: SubModuleComponent, isFromJupiter }, setSubModuleComponent] = (0, import_react.useState)({
+      component: null,
+      isFromJupiter: false
     });
     const [propsUpdateKey, setPropsUpdateKey] = (0, import_react.useState)(0);
     const context = (0, import_react.useContext)(import_runtime.RuntimeReactContext);
@@ -184,19 +186,10 @@ or directly pass the "basename":
         }
       });
       if (!deepEqualExcludeFunctions(prevPropsForCompare, currentPropsForCompare)) {
-        var _appRef_current;
         previousPropsRef.current = props;
         propsRef.current = props;
         propsUpdateCounterRef.current += 1;
         setPropsUpdateKey((prev) => prev + 1);
-        if ((_appRef_current = appRef.current) === null || _appRef_current === void 0 ? void 0 : _appRef_current.mounted) {
-          window.dispatchEvent(new CustomEvent("garfishPropsUpdated", {
-            detail: {
-              appName: appInfo.name,
-              props
-            }
-          }));
-        }
       }
     }, [
       props,
@@ -221,13 +214,16 @@ or directly pass the "basename":
         customLoader: (provider) => {
           const { render, destroy, SubModuleComponent: SubModuleComponent2, jupiter_submodule_app_key } = provider;
           const SubComponent = SubModuleComponent2 || jupiter_submodule_app_key;
+          const isFromJupiter2 = !SubModuleComponent2 && !!jupiter_submodule_app_key;
           const componetRenderMode = manifest === null || manifest === void 0 ? void 0 : manifest.componentRender;
           return {
             mount: (...props2) => {
               if (componetRenderMode && SubComponent) {
                 if (componentSetterRegistry.current) {
+                  componentRef.current = SubComponent;
                   componentSetterRegistry.current({
-                    component: SubComponent
+                    component: SubComponent,
+                    isFromJupiter: isFromJupiter2
                   });
                 } else {
                   (0, import_util.logger)(`[Garfish] MicroApp for "${appInfo.name}" tried to mount, but no active component setter was found.`);
@@ -321,18 +317,54 @@ or directly pass the "basename":
       propsUpdateKey,
       props
     ]);
+    (0, import_react.useEffect)(() => {
+      var _appRef_current;
+      const componetRenderMode = manifest === null || manifest === void 0 ? void 0 : manifest.componentRender;
+      if (componetRenderMode && ((_appRef_current = appRef.current) === null || _appRef_current === void 0 ? void 0 : _appRef_current.mounted)) {
+        const componentToUse = SubModuleComponent || componentRef.current;
+        if (componentToUse) {
+          const currentComponent = componentToUse;
+          const currentIsFromJupiter = isFromJupiter;
+          setSubModuleComponent({
+            component: null,
+            isFromJupiter: false
+          });
+          setTimeout(() => {
+            setSubModuleComponent({
+              component: currentComponent,
+              isFromJupiter: currentIsFromJupiter
+            });
+          }, 50);
+        } else {
+          var _appRef_current1;
+          if ((_appRef_current1 = appRef.current) === null || _appRef_current1 === void 0 ? void 0 : _appRef_current1.mounted) {
+            var _appRef_current2;
+            (_appRef_current2 = appRef.current) === null || _appRef_current2 === void 0 ? void 0 : _appRef_current2.hide();
+            setTimeout(() => {
+              var _appRef_current3;
+              (_appRef_current3 = appRef.current) === null || _appRef_current3 === void 0 ? void 0 : _appRef_current3.show();
+            }, 10);
+          }
+        }
+      }
+    }, [
+      propsUpdateKey
+    ]);
     const { setLoadingState, ...renderProps } = props;
     const finalRenderProps = {
       ...renderProps,
       _garfishPropsUpdateKey: propsUpdateKey
     };
-    const componentKey = `${appInfo.name}-${propsUpdateKey}`;
+    const componentKey = isFromJupiter ? void 0 : `${appInfo.name}-${propsUpdateKey}`;
     return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {
       children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
         id: domId,
         children: SubModuleComponent && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubModuleComponent, {
+          ...componentKey ? {
+            key: componentKey
+          } : {},
           ...finalRenderProps
-        }, componentKey)
+        })
       })
     });
   }

package/dist/esm/runtime/utils/apps.js

@@ -94,9 +94,11 @@ function getAppInstance(options, appInfo, manifest) {
     var previousPropsRef = useRef(props);
     var propsUpdateCounterRef = useRef(0);
     var domId = generateSubAppContainerKey(appInfo);
+    var componentRef = useRef(null);
     var _useState = _sliced_to_array(useState({
-      component: null
-    }), 2), _useState_ = _useState[0], SubModuleComponent = _useState_.component, setSubModuleComponent = _useState[1];
+      component: null,
+      isFromJupiter: false
+    }), 2), _useState_ = _useState[0], SubModuleComponent = _useState_.component, isFromJupiter = _useState_.isFromJupiter, setSubModuleComponent = _useState[1];
     var _useState1 = _sliced_to_array(useState(0), 2), propsUpdateKey = _useState1[0], setPropsUpdateKey = _useState1[1];
     var context = useContext(RuntimeReactContext);
     var _props_useRouteMatch;
@@ -176,21 +178,12 @@ or directly pass the "basename":
         }
       });
       if (!deepEqualExcludeFunctions(prevPropsForCompare, currentPropsForCompare)) {
-        var _appRef_current;
         previousPropsRef.current = props;
         propsRef.current = props;
         propsUpdateCounterRef.current += 1;
         setPropsUpdateKey(function(prev) {
           return prev + 1;
         });
-        if ((_appRef_current = appRef.current) === null || _appRef_current === void 0 ? void 0 : _appRef_current.mounted) {
-          window.dispatchEvent(new CustomEvent("garfishPropsUpdated", {
-            detail: {
-              appName: appInfo.name,
-              props
-            }
-          }));
-        }
       }
     }, [
       props,
@@ -216,6 +209,7 @@ or directly pass the "basename":
         customLoader: function(provider) {
           var render = provider.render, destroy = provider.destroy, SubModuleComponent2 = provider.SubModuleComponent, jupiter_submodule_app_key = provider.jupiter_submodule_app_key;
           var SubComponent = SubModuleComponent2 || jupiter_submodule_app_key;
+          var isFromJupiter2 = !SubModuleComponent2 && !!jupiter_submodule_app_key;
           var componetRenderMode = manifest === null || manifest === void 0 ? void 0 : manifest.componentRender;
           return {
             mount: function() {
@@ -224,8 +218,10 @@ or directly pass the "basename":
               }
               if (componetRenderMode && SubComponent) {
                 if (componentSetterRegistry.current) {
+                  componentRef.current = SubComponent;
                   componentSetterRegistry.current({
-                    component: SubComponent
+                    component: SubComponent,
+                    isFromJupiter: isFromJupiter2
                   });
                 } else {
                   logger('[Garfish] MicroApp for "'.concat(appInfo.name, '" tried to mount, but no active component setter was found.'));
@@ -372,17 +368,52 @@ or directly pass the "basename":
       propsUpdateKey,
       props
     ]);
+    useEffect(function() {
+      var _appRef_current;
+      var componetRenderMode = manifest === null || manifest === void 0 ? void 0 : manifest.componentRender;
+      if (componetRenderMode && ((_appRef_current = appRef.current) === null || _appRef_current === void 0 ? void 0 : _appRef_current.mounted)) {
+        var componentToUse = SubModuleComponent || componentRef.current;
+        if (componentToUse) {
+          var currentComponent = componentToUse;
+          var currentIsFromJupiter = isFromJupiter;
+          setSubModuleComponent({
+            component: null,
+            isFromJupiter: false
+          });
+          setTimeout(function() {
+            setSubModuleComponent({
+              component: currentComponent,
+              isFromJupiter: currentIsFromJupiter
+            });
+          }, 50);
+        } else {
+          var _appRef_current1;
+          if ((_appRef_current1 = appRef.current) === null || _appRef_current1 === void 0 ? void 0 : _appRef_current1.mounted) {
+            var _appRef_current2;
+            (_appRef_current2 = appRef.current) === null || _appRef_current2 === void 0 ? void 0 : _appRef_current2.hide();
+            setTimeout(function() {
+              var _appRef_current3;
+              (_appRef_current3 = appRef.current) === null || _appRef_current3 === void 0 ? void 0 : _appRef_current3.show();
+            }, 10);
+          }
+        }
+      }
+    }, [
+      propsUpdateKey
+    ]);
     var setLoadingState = props.setLoadingState, renderProps = _object_without_properties(props, [
       "setLoadingState"
     ]);
     var finalRenderProps = _object_spread_props(_object_spread({}, renderProps), {
       _garfishPropsUpdateKey: propsUpdateKey
     });
-    var componentKey = "".concat(appInfo.name, "-").concat(propsUpdateKey);
+    var componentKey = isFromJupiter ? void 0 : "".concat(appInfo.name, "-").concat(propsUpdateKey);
     return /* @__PURE__ */ _jsx(_Fragment, {
       children: /* @__PURE__ */ _jsx("div", {
         id: domId,
-        children: SubModuleComponent && /* @__PURE__ */ _jsx(SubModuleComponent, _object_spread({}, finalRenderProps), componentKey)
+        children: SubModuleComponent && /* @__PURE__ */ _jsx(SubModuleComponent, _object_spread({}, componentKey ? {
+          key: componentKey
+        } : {}, finalRenderProps))
       })
     });
   }

package/dist/esm-node/runtime/utils/apps.js

@@ -62,8 +62,10 @@ function getAppInstance(options, appInfo, manifest) {
     const previousPropsRef = useRef(props);
     const propsUpdateCounterRef = useRef(0);
     const domId = generateSubAppContainerKey(appInfo);
-    const [{ component: SubModuleComponent }, setSubModuleComponent] = useState({
-      component: null
+    const componentRef = useRef(null);
+    const [{ component: SubModuleComponent, isFromJupiter }, setSubModuleComponent] = useState({
+      component: null,
+      isFromJupiter: false
     });
     const [propsUpdateKey, setPropsUpdateKey] = useState(0);
     const context = useContext(RuntimeReactContext);
@@ -150,19 +152,10 @@ or directly pass the "basename":
         }
       });
       if (!deepEqualExcludeFunctions(prevPropsForCompare, currentPropsForCompare)) {
-        var _appRef_current;
         previousPropsRef.current = props;
         propsRef.current = props;
         propsUpdateCounterRef.current += 1;
         setPropsUpdateKey((prev) => prev + 1);
-        if ((_appRef_current = appRef.current) === null || _appRef_current === void 0 ? void 0 : _appRef_current.mounted) {
-          window.dispatchEvent(new CustomEvent("garfishPropsUpdated", {
-            detail: {
-              appName: appInfo.name,
-              props
-            }
-          }));
-        }
       }
     }, [
       props,
@@ -187,13 +180,16 @@ or directly pass the "basename":
         customLoader: (provider) => {
           const { render, destroy, SubModuleComponent: SubModuleComponent2, jupiter_submodule_app_key } = provider;
           const SubComponent = SubModuleComponent2 || jupiter_submodule_app_key;
+          const isFromJupiter2 = !SubModuleComponent2 && !!jupiter_submodule_app_key;
           const componetRenderMode = manifest === null || manifest === void 0 ? void 0 : manifest.componentRender;
           return {
             mount: (...props2) => {
               if (componetRenderMode && SubComponent) {
                 if (componentSetterRegistry.current) {
+                  componentRef.current = SubComponent;
                   componentSetterRegistry.current({
-                    component: SubComponent
+                    component: SubComponent,
+                    isFromJupiter: isFromJupiter2
                   });
                 } else {
                   logger(`[Garfish] MicroApp for "${appInfo.name}" tried to mount, but no active component setter was found.`);
@@ -287,18 +283,54 @@ or directly pass the "basename":
       propsUpdateKey,
       props
     ]);
+    useEffect(() => {
+      var _appRef_current;
+      const componetRenderMode = manifest === null || manifest === void 0 ? void 0 : manifest.componentRender;
+      if (componetRenderMode && ((_appRef_current = appRef.current) === null || _appRef_current === void 0 ? void 0 : _appRef_current.mounted)) {
+        const componentToUse = SubModuleComponent || componentRef.current;
+        if (componentToUse) {
+          const currentComponent = componentToUse;
+          const currentIsFromJupiter = isFromJupiter;
+          setSubModuleComponent({
+            component: null,
+            isFromJupiter: false
+          });
+          setTimeout(() => {
+            setSubModuleComponent({
+              component: currentComponent,
+              isFromJupiter: currentIsFromJupiter
+            });
+          }, 50);
+        } else {
+          var _appRef_current1;
+          if ((_appRef_current1 = appRef.current) === null || _appRef_current1 === void 0 ? void 0 : _appRef_current1.mounted) {
+            var _appRef_current2;
+            (_appRef_current2 = appRef.current) === null || _appRef_current2 === void 0 ? void 0 : _appRef_current2.hide();
+            setTimeout(() => {
+              var _appRef_current3;
+              (_appRef_current3 = appRef.current) === null || _appRef_current3 === void 0 ? void 0 : _appRef_current3.show();
+            }, 10);
+          }
+        }
+      }
+    }, [
+      propsUpdateKey
+    ]);
     const { setLoadingState, ...renderProps } = props;
     const finalRenderProps = {
       ...renderProps,
       _garfishPropsUpdateKey: propsUpdateKey
     };
-    const componentKey = `${appInfo.name}-${propsUpdateKey}`;
+    const componentKey = isFromJupiter ? void 0 : `${appInfo.name}-${propsUpdateKey}`;
     return /* @__PURE__ */ _jsx(_Fragment, {
       children: /* @__PURE__ */ _jsx("div", {
         id: domId,
         children: SubModuleComponent && /* @__PURE__ */ _jsx(SubModuleComponent, {
+          ...componentKey ? {
+            key: componentKey
+          } : {},
           ...finalRenderProps
-        }, componentKey)
+        })
       })
     });
   }

package/package.json

@@ -15,7 +15,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.68.19-alpha.1",
+  "version": "2.68.19-alpha.3",
   "jsnext:source": "./src/cli/index.ts",
   "types": "./dist/types/cli/index.d.ts",
   "typesVersions": {
@@ -69,9 +69,9 @@
     "debug": "4.3.7",
     "garfish": "^1.8.1",
     "react-loadable": "^5.5.0",
+    "@modern-js/plugin-v2": "2.68.18",
     "@modern-js/utils": "2.68.18",
-    "@modern-js/runtime-utils": "2.68.18",
-    "@modern-js/plugin-v2": "2.68.18"
+    "@modern-js/runtime-utils": "2.68.18"
   },
   "peerDependencies": {
     "@modern-js/runtime": "^2.68.18",
@@ -95,11 +95,11 @@
     "typescript": "^5",
     "@modern-js/app-tools": "2.68.18",
     "@scripts/build": "2.66.0",
-    "@modern-js/core": "2.68.18",
+    "@modern-js/runtime": "2.68.18",
     "@modern-js/plugin-router-v5": "2.68.18",
     "@modern-js/types": "2.68.18",
     "@scripts/jest-config": "2.66.0",
-    "@modern-js/runtime": "2.68.18"
+    "@modern-js/core": "2.68.18"
   },
   "sideEffects": false,
   "publishConfig": {