@modern-js/plugin-garfish 2.68.19-alpha.2 → 2.68.19-alpha.4

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

@@ -55,13 +55,19 @@ function pathJoin(...args) {
   }, "");
   return res || "/";
 }
-function deepEqualExcludeFunctions(prev, next) {
+function deepEqualExcludeFunctions(prev, next, visited) {
   if (prev === next)
     return true;
   if (!prev || !next)
     return false;
   if (typeof prev !== "object" || typeof next !== "object")
     return false;
+  const visitedSet = visited !== null && visited !== void 0 ? visited : /* @__PURE__ */ new WeakSet();
+  if (visitedSet.has(prev) || visitedSet.has(next)) {
+    return true;
+  }
+  visitedSet.add(prev);
+  visitedSet.add(next);
   const prevKeys = Object.keys(prev).filter((key) => typeof prev[key] !== "function");
   const nextKeys = Object.keys(next).filter((key) => typeof next[key] !== "function");
   if (prevKeys.length !== nextKeys.length)
@@ -75,7 +81,7 @@ function deepEqualExcludeFunctions(prev, next) {
       continue;
     }
     if (typeof prevVal === "object" && typeof nextVal === "object") {
-      if (!deepEqualExcludeFunctions(prevVal, nextVal)) {
+      if (!deepEqualExcludeFunctions(prevVal, nextVal, visitedSet)) {
         return false;
       }
     } else if (prevVal !== nextVal) {
@@ -96,6 +102,7 @@ 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 componentRef = (0, import_react.useRef)(null);
     const [{ component: SubModuleComponent, isFromJupiter }, setSubModuleComponent] = (0, import_react.useState)({
       component: null,
       isFromJupiter: false
@@ -112,6 +119,8 @@ function getAppInstance(options, appInfo, manifest) {
     const useHistory = (_props_useHistory = props.useHistory) !== null && _props_useHistory !== void 0 ? _props_useHistory : context === null || context === void 0 ? void 0 : (_context_router3 = context.router) === null || _context_router3 === void 0 ? void 0 : _context_router3.useHistory;
     var _props_useHistory1;
     const useHref = (_props_useHistory1 = props.useHistory) !== null && _props_useHistory1 !== void 0 ? _props_useHistory1 : context === null || context === void 0 ? void 0 : (_context_router4 = context.router) === null || _context_router4 === void 0 ? void 0 : _context_router4.useHref;
+    const lastPropsUpdateKeyRef = (0, import_react.useRef)(0);
+    const isRemountingRef = (0, import_react.useRef)(false);
     const match = useRouteMatch === null || useRouteMatch === void 0 ? void 0 : useRouteMatch();
     const matchs = useMatches === null || useMatches === void 0 ? void 0 : useMatches();
     if (!useLocation) {
@@ -168,12 +177,24 @@ or directly pass the "basename":
       locationPathname
     ]);
     (0, import_react.useEffect)(() => {
+      if (previousPropsRef.current === props) {
+        return;
+      }
       const prevPropsForCompare = {
         ...previousPropsRef.current
       };
       const currentPropsForCompare = {
         ...props
       };
+      const ignoredKeysForRemount = [
+        "style",
+        "location",
+        "match",
+        "history",
+        "staticContext",
+        "guideState",
+        "guideConfig"
+      ];
       Object.keys(prevPropsForCompare).forEach((key) => {
         if (typeof prevPropsForCompare[key] === "function") {
           delete prevPropsForCompare[key];
@@ -184,11 +205,27 @@ or directly pass the "basename":
           delete currentPropsForCompare[key];
         }
       });
-      if (!deepEqualExcludeFunctions(prevPropsForCompare, currentPropsForCompare)) {
+      const prevPropsForDeepCompare = {};
+      const currentPropsForDeepCompare = {};
+      Object.keys(prevPropsForCompare).forEach((key) => {
+        if (!ignoredKeysForRemount.includes(key)) {
+          prevPropsForDeepCompare[key] = prevPropsForCompare[key];
+        }
+      });
+      Object.keys(currentPropsForCompare).forEach((key) => {
+        if (!ignoredKeysForRemount.includes(key)) {
+          currentPropsForDeepCompare[key] = currentPropsForCompare[key];
+        }
+      });
+      const propsEqual = deepEqualExcludeFunctions(prevPropsForDeepCompare, currentPropsForDeepCompare);
+      if (!propsEqual) {
         previousPropsRef.current = props;
         propsRef.current = props;
         propsUpdateCounterRef.current += 1;
         setPropsUpdateKey((prev) => prev + 1);
+      } else {
+        previousPropsRef.current = props;
+        propsRef.current = props;
       }
     }, [
       props,
@@ -219,6 +256,7 @@ or directly pass the "basename":
             mount: (...props2) => {
               if (componetRenderMode && SubComponent) {
                 if (componentSetterRegistry.current) {
+                  componentRef.current = SubComponent;
                   componentSetterRegistry.current({
                     component: SubComponent,
                     isFromJupiter: isFromJupiter2
@@ -315,6 +353,46 @@ 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 (propsUpdateKey === lastPropsUpdateKeyRef.current || isRemountingRef.current) {
+        return;
+      }
+      lastPropsUpdateKeyRef.current = propsUpdateKey;
+      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();
+              setTimeout(() => {
+                isRemountingRef.current = false;
+              }, 100);
+            }, 10);
+          }
+        }
+      }
+    }, [
+      propsUpdateKey
+    ]);
     const { setLoadingState, ...renderProps } = props;
     const finalRenderProps = {
       ...renderProps,

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

@@ -32,13 +32,19 @@ function pathJoin() {
   }, "");
   return res || "/";
 }
-function deepEqualExcludeFunctions(prev, next) {
+function deepEqualExcludeFunctions(prev, next, visited) {
   if (prev === next)
     return true;
   if (!prev || !next)
     return false;
   if ((typeof prev === "undefined" ? "undefined" : _type_of(prev)) !== "object" || (typeof next === "undefined" ? "undefined" : _type_of(next)) !== "object")
     return false;
+  var visitedSet = visited !== null && visited !== void 0 ? visited : /* @__PURE__ */ new WeakSet();
+  if (visitedSet.has(prev) || visitedSet.has(next)) {
+    return true;
+  }
+  visitedSet.add(prev);
+  visitedSet.add(next);
   var prevKeys = Object.keys(prev).filter(function(key2) {
     return typeof prev[key2] !== "function";
   });
@@ -59,7 +65,7 @@ function deepEqualExcludeFunctions(prev, next) {
         continue;
       }
       if ((typeof prevVal === "undefined" ? "undefined" : _type_of(prevVal)) === "object" && (typeof nextVal === "undefined" ? "undefined" : _type_of(nextVal)) === "object") {
-        if (!deepEqualExcludeFunctions(prevVal, nextVal)) {
+        if (!deepEqualExcludeFunctions(prevVal, nextVal, visitedSet)) {
           return false;
         }
       } else if (prevVal !== nextVal) {
@@ -94,6 +100,7 @@ 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,
       isFromJupiter: false
@@ -110,6 +117,8 @@ function getAppInstance(options, appInfo, manifest) {
     var useHistory = (_props_useHistory = props.useHistory) !== null && _props_useHistory !== void 0 ? _props_useHistory : context === null || context === void 0 ? void 0 : (_context_router3 = context.router) === null || _context_router3 === void 0 ? void 0 : _context_router3.useHistory;
     var _props_useHistory1;
     var useHref = (_props_useHistory1 = props.useHistory) !== null && _props_useHistory1 !== void 0 ? _props_useHistory1 : context === null || context === void 0 ? void 0 : (_context_router4 = context.router) === null || _context_router4 === void 0 ? void 0 : _context_router4.useHref;
+    var lastPropsUpdateKeyRef = useRef(0);
+    var isRemountingRef = useRef(false);
     var match = useRouteMatch === null || useRouteMatch === void 0 ? void 0 : useRouteMatch();
     var matchs = useMatches === null || useMatches === void 0 ? void 0 : useMatches();
     if (!useLocation) {
@@ -164,8 +173,20 @@ or directly pass the "basename":
       locationPathname
     ]);
     useEffect(function() {
+      if (previousPropsRef.current === props) {
+        return;
+      }
       var prevPropsForCompare = _object_spread({}, previousPropsRef.current);
       var currentPropsForCompare = _object_spread({}, props);
+      var ignoredKeysForRemount = [
+        "style",
+        "location",
+        "match",
+        "history",
+        "staticContext",
+        "guideState",
+        "guideConfig"
+      ];
       Object.keys(prevPropsForCompare).forEach(function(key2) {
         if (typeof prevPropsForCompare[key2] === "function") {
           delete prevPropsForCompare[key2];
@@ -176,13 +197,29 @@ or directly pass the "basename":
           delete currentPropsForCompare[key2];
         }
       });
-      if (!deepEqualExcludeFunctions(prevPropsForCompare, currentPropsForCompare)) {
+      var prevPropsForDeepCompare = {};
+      var currentPropsForDeepCompare = {};
+      Object.keys(prevPropsForCompare).forEach(function(key2) {
+        if (!ignoredKeysForRemount.includes(key2)) {
+          prevPropsForDeepCompare[key2] = prevPropsForCompare[key2];
+        }
+      });
+      Object.keys(currentPropsForCompare).forEach(function(key2) {
+        if (!ignoredKeysForRemount.includes(key2)) {
+          currentPropsForDeepCompare[key2] = currentPropsForCompare[key2];
+        }
+      });
+      var propsEqual = deepEqualExcludeFunctions(prevPropsForDeepCompare, currentPropsForDeepCompare);
+      if (!propsEqual) {
         previousPropsRef.current = props;
         propsRef.current = props;
         propsUpdateCounterRef.current += 1;
         setPropsUpdateKey(function(prev) {
           return prev + 1;
         });
+      } else {
+        previousPropsRef.current = props;
+        propsRef.current = props;
       }
     }, [
       props,
@@ -217,6 +254,7 @@ or directly pass the "basename":
               }
               if (componetRenderMode && SubComponent) {
                 if (componentSetterRegistry.current) {
+                  componentRef.current = SubComponent;
                   componentSetterRegistry.current({
                     component: SubComponent,
                     isFromJupiter: isFromJupiter2
@@ -366,6 +404,46 @@ or directly pass the "basename":
       propsUpdateKey,
       props
     ]);
+    useEffect(function() {
+      var _appRef_current;
+      var componetRenderMode = manifest === null || manifest === void 0 ? void 0 : manifest.componentRender;
+      if (propsUpdateKey === lastPropsUpdateKeyRef.current || isRemountingRef.current) {
+        return;
+      }
+      lastPropsUpdateKeyRef.current = propsUpdateKey;
+      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();
+              setTimeout(function() {
+                isRemountingRef.current = false;
+              }, 100);
+            }, 10);
+          }
+        }
+      }
+    }, [
+      propsUpdateKey
+    ]);
     var setLoadingState = props.setLoadingState, renderProps = _object_without_properties(props, [
       "setLoadingState"
     ]);

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

@@ -21,13 +21,19 @@ function pathJoin(...args) {
   }, "");
   return res || "/";
 }
-function deepEqualExcludeFunctions(prev, next) {
+function deepEqualExcludeFunctions(prev, next, visited) {
   if (prev === next)
     return true;
   if (!prev || !next)
     return false;
   if (typeof prev !== "object" || typeof next !== "object")
     return false;
+  const visitedSet = visited !== null && visited !== void 0 ? visited : /* @__PURE__ */ new WeakSet();
+  if (visitedSet.has(prev) || visitedSet.has(next)) {
+    return true;
+  }
+  visitedSet.add(prev);
+  visitedSet.add(next);
   const prevKeys = Object.keys(prev).filter((key) => typeof prev[key] !== "function");
   const nextKeys = Object.keys(next).filter((key) => typeof next[key] !== "function");
   if (prevKeys.length !== nextKeys.length)
@@ -41,7 +47,7 @@ function deepEqualExcludeFunctions(prev, next) {
       continue;
     }
     if (typeof prevVal === "object" && typeof nextVal === "object") {
-      if (!deepEqualExcludeFunctions(prevVal, nextVal)) {
+      if (!deepEqualExcludeFunctions(prevVal, nextVal, visitedSet)) {
         return false;
       }
     } else if (prevVal !== nextVal) {
@@ -62,6 +68,7 @@ function getAppInstance(options, appInfo, manifest) {
     const previousPropsRef = useRef(props);
     const propsUpdateCounterRef = useRef(0);
     const domId = generateSubAppContainerKey(appInfo);
+    const componentRef = useRef(null);
     const [{ component: SubModuleComponent, isFromJupiter }, setSubModuleComponent] = useState({
       component: null,
       isFromJupiter: false
@@ -78,6 +85,8 @@ function getAppInstance(options, appInfo, manifest) {
     const useHistory = (_props_useHistory = props.useHistory) !== null && _props_useHistory !== void 0 ? _props_useHistory : context === null || context === void 0 ? void 0 : (_context_router3 = context.router) === null || _context_router3 === void 0 ? void 0 : _context_router3.useHistory;
     var _props_useHistory1;
     const useHref = (_props_useHistory1 = props.useHistory) !== null && _props_useHistory1 !== void 0 ? _props_useHistory1 : context === null || context === void 0 ? void 0 : (_context_router4 = context.router) === null || _context_router4 === void 0 ? void 0 : _context_router4.useHref;
+    const lastPropsUpdateKeyRef = useRef(0);
+    const isRemountingRef = useRef(false);
     const match = useRouteMatch === null || useRouteMatch === void 0 ? void 0 : useRouteMatch();
     const matchs = useMatches === null || useMatches === void 0 ? void 0 : useMatches();
     if (!useLocation) {
@@ -134,12 +143,24 @@ or directly pass the "basename":
       locationPathname
     ]);
     useEffect(() => {
+      if (previousPropsRef.current === props) {
+        return;
+      }
       const prevPropsForCompare = {
         ...previousPropsRef.current
       };
       const currentPropsForCompare = {
         ...props
       };
+      const ignoredKeysForRemount = [
+        "style",
+        "location",
+        "match",
+        "history",
+        "staticContext",
+        "guideState",
+        "guideConfig"
+      ];
       Object.keys(prevPropsForCompare).forEach((key) => {
         if (typeof prevPropsForCompare[key] === "function") {
           delete prevPropsForCompare[key];
@@ -150,11 +171,27 @@ or directly pass the "basename":
           delete currentPropsForCompare[key];
         }
       });
-      if (!deepEqualExcludeFunctions(prevPropsForCompare, currentPropsForCompare)) {
+      const prevPropsForDeepCompare = {};
+      const currentPropsForDeepCompare = {};
+      Object.keys(prevPropsForCompare).forEach((key) => {
+        if (!ignoredKeysForRemount.includes(key)) {
+          prevPropsForDeepCompare[key] = prevPropsForCompare[key];
+        }
+      });
+      Object.keys(currentPropsForCompare).forEach((key) => {
+        if (!ignoredKeysForRemount.includes(key)) {
+          currentPropsForDeepCompare[key] = currentPropsForCompare[key];
+        }
+      });
+      const propsEqual = deepEqualExcludeFunctions(prevPropsForDeepCompare, currentPropsForDeepCompare);
+      if (!propsEqual) {
         previousPropsRef.current = props;
         propsRef.current = props;
         propsUpdateCounterRef.current += 1;
         setPropsUpdateKey((prev) => prev + 1);
+      } else {
+        previousPropsRef.current = props;
+        propsRef.current = props;
       }
     }, [
       props,
@@ -185,6 +222,7 @@ or directly pass the "basename":
             mount: (...props2) => {
               if (componetRenderMode && SubComponent) {
                 if (componentSetterRegistry.current) {
+                  componentRef.current = SubComponent;
                   componentSetterRegistry.current({
                     component: SubComponent,
                     isFromJupiter: isFromJupiter2
@@ -281,6 +319,46 @@ or directly pass the "basename":
       propsUpdateKey,
       props
     ]);
+    useEffect(() => {
+      var _appRef_current;
+      const componetRenderMode = manifest === null || manifest === void 0 ? void 0 : manifest.componentRender;
+      if (propsUpdateKey === lastPropsUpdateKeyRef.current || isRemountingRef.current) {
+        return;
+      }
+      lastPropsUpdateKeyRef.current = propsUpdateKey;
+      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();
+              setTimeout(() => {
+                isRemountingRef.current = false;
+              }, 100);
+            }, 10);
+          }
+        }
+      }
+    }, [
+      propsUpdateKey
+    ]);
     const { setLoadingState, ...renderProps } = props;
     const finalRenderProps = {
       ...renderProps,

package/package.json

@@ -15,7 +15,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.68.19-alpha.2",
+  "version": "2.68.19-alpha.4",
   "jsnext:source": "./src/cli/index.ts",
   "types": "./dist/types/cli/index.d.ts",
   "typesVersions": {
@@ -93,12 +93,12 @@
     "react-dom": "^18.3.1",
     "react-router-dom": "6.27.0",
     "typescript": "^5",
-    "@modern-js/app-tools": "2.68.18",
     "@scripts/build": "2.66.0",
+    "@modern-js/app-tools": "2.68.18",
     "@modern-js/core": "2.68.18",
-    "@modern-js/plugin-router-v5": "2.68.18",
     "@modern-js/types": "2.68.18",
     "@modern-js/runtime": "2.68.18",
+    "@modern-js/plugin-router-v5": "2.68.18",
     "@scripts/jest-config": "2.66.0"
   },
   "sideEffects": false,