@module-federation/modern-js 0.0.0-next-20240621074837 → 0.0.0-next-20240623084034

package/dist/cjs/cli/mfRuntimePlugins/resolve-entry-ipv4.js

@@ -66,8 +66,11 @@ const resolveEntryIpv4Plugin = () => ({
     if ("getPublicPath" in remoteSnapshot) {
       replaceObjectLocalhost("getPublicPath", remoteSnapshot);
     }
-    if ("matchedVersion:" in remoteSnapshot) {
-      replaceObjectLocalhost("matchedVersion:", remoteSnapshot);
+    if (remoteSnapshot.remotesInfo) {
+      Object.keys(remoteSnapshot.remotesInfo).forEach((key) => {
+        const remoteInfo = remoteSnapshot.remotesInfo[key];
+        replaceObjectLocalhost("matchedVersion", remoteInfo);
+      });
     }
     return args;
   }

package/dist/cjs/runtime/MFReactComponent.js

@@ -35,6 +35,7 @@ module.exports = __toCommonJS(MFReactComponent_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = __toESM(require("react"));
 var import_runtime = require("@module-federation/enhanced/runtime");
+var import_react_error_boundary = require("react-error-boundary");
 function getLoadedRemoteInfos(instance, id) {
   const { name, expose } = instance.remoteHandler.idToRemoteMap[id] || {};
   if (!name) {
@@ -138,9 +139,7 @@ function collectAssets(options) {
   ];
 }
 function MFReactComponent(props) {
-  const { loading = "loading...", id, fallback = void 0 } = typeof props === "string" ? {
-    id: props
-  } : props;
+  const { loading = "loading...", id, remoteProps = {}, fallback } = props;
   const Component = /* @__PURE__ */ import_react.default.lazy(() => (0, import_runtime.loadRemote)(id).then((mod) => {
     const assets = collectAssets(props);
     if (!mod) {
@@ -151,7 +150,9 @@ function MFReactComponent(props) {
       default: () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
         children: [
           assets,
-          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Com, {})
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Com, {
+            ...remoteProps
+          })
         ]
       })
     };
@@ -159,20 +160,23 @@ function MFReactComponent(props) {
     if (!fallback) {
       throw err;
     }
-    const FallbackNode = typeof fallback === "function" ? fallback(err) : fallback;
-    if (/* @__PURE__ */ import_react.default.isValidElement(FallbackNode)) {
-      return {
-        default: () => FallbackNode
-      };
-    }
-    const FallbackFunctionComponent = FallbackNode;
+    const FallbackFunctionComponent = fallback;
+    const FallbackNode = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FallbackFunctionComponent, {
+      error: err,
+      resetErrorBoundary: () => {
+        console.log('SSR mode not support "resetErrorBoundary" !');
+      }
+    });
     return {
-      default: () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FallbackFunctionComponent, {})
+      default: () => FallbackNode
     };
   }));
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.default.Suspense, {
-    fallback: loading,
-    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {})
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_error_boundary.ErrorBoundary, {
+    FallbackComponent: fallback,
+    children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.default.Suspense, {
+      fallback: loading,
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {})
+    })
   });
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/esm/cli/mfRuntimePlugins/resolve-entry-ipv4.js

@@ -54,8 +54,11 @@ var resolveEntryIpv4Plugin = function() {
       if ("getPublicPath" in remoteSnapshot) {
         replaceObjectLocalhost("getPublicPath", remoteSnapshot);
       }
-      if ("matchedVersion:" in remoteSnapshot) {
-        replaceObjectLocalhost("matchedVersion:", remoteSnapshot);
+      if (remoteSnapshot.remotesInfo) {
+        Object.keys(remoteSnapshot.remotesInfo).forEach(function(key) {
+          var remoteInfo = remoteSnapshot.remotesInfo[key];
+          replaceObjectLocalhost("matchedVersion", remoteInfo);
+        });
       }
       return args;
     }

package/dist/esm/runtime/MFReactComponent.js

@@ -4,6 +4,7 @@ import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from "react";
 import { loadRemote, getInstance } from "@module-federation/enhanced/runtime";
+import { ErrorBoundary } from "react-error-boundary";
 function getLoadedRemoteInfos(instance, id) {
   var _ref = instance.remoteHandler.idToRemoteMap[id] || {}, name = _ref.name, expose = _ref.expose;
   if (!name) {
@@ -94,9 +95,7 @@ function collectAssets(options) {
   return _to_consumable_array(scripts).concat(_to_consumable_array(links));
 }
 function MFReactComponent(props) {
-  var _ref = typeof props === "string" ? {
-    id: props
-  } : props, _ref_loading = _ref.loading, loading = _ref_loading === void 0 ? "loading..." : _ref_loading, id = _ref.id, _ref_fallback = _ref.fallback, fallback = _ref_fallback === void 0 ? void 0 : _ref_fallback;
+  var _props_loading = props.loading, loading = _props_loading === void 0 ? "loading..." : _props_loading, id = props.id, _props_remoteProps = props.remoteProps, remoteProps = _props_remoteProps === void 0 ? {} : _props_remoteProps, fallback = props.fallback;
   var Component = /* @__PURE__ */ React.lazy(function() {
     return loadRemote(id).then(function(mod) {
       var assets = collectAssets(props);
@@ -109,7 +108,7 @@ function MFReactComponent(props) {
           return /* @__PURE__ */ _jsxs(_Fragment, {
             children: [
               assets,
-              /* @__PURE__ */ _jsx(Com, {})
+              /* @__PURE__ */ _jsx(Com, _object_spread({}, remoteProps))
             ]
           });
         }
@@ -118,25 +117,26 @@ function MFReactComponent(props) {
       if (!fallback) {
         throw err;
       }
-      var FallbackNode = typeof fallback === "function" ? fallback(err) : fallback;
-      if (/* @__PURE__ */ React.isValidElement(FallbackNode)) {
-        return {
-          default: function() {
-            return FallbackNode;
-          }
-        };
-      }
-      var FallbackFunctionComponent = FallbackNode;
+      var FallbackFunctionComponent = fallback;
+      var FallbackNode = /* @__PURE__ */ _jsx(FallbackFunctionComponent, {
+        error: err,
+        resetErrorBoundary: function() {
+          console.log('SSR mode not support "resetErrorBoundary" !');
+        }
+      });
       return {
         default: function() {
-          return /* @__PURE__ */ _jsx(FallbackFunctionComponent, {});
+          return FallbackNode;
         }
       };
     });
   });
-  return /* @__PURE__ */ _jsx(React.Suspense, {
-    fallback: loading,
-    children: /* @__PURE__ */ _jsx(Component, {})
+  return /* @__PURE__ */ _jsx(ErrorBoundary, {
+    FallbackComponent: fallback,
+    children: /* @__PURE__ */ _jsx(React.Suspense, {
+      fallback: loading,
+      children: /* @__PURE__ */ _jsx(Component, {})
+    })
   });
 }
 export {

package/dist/esm-node/cli/mfRuntimePlugins/resolve-entry-ipv4.js

@@ -43,8 +43,11 @@ const resolveEntryIpv4Plugin = () => ({
     if ("getPublicPath" in remoteSnapshot) {
       replaceObjectLocalhost("getPublicPath", remoteSnapshot);
     }
-    if ("matchedVersion:" in remoteSnapshot) {
-      replaceObjectLocalhost("matchedVersion:", remoteSnapshot);
+    if (remoteSnapshot.remotesInfo) {
+      Object.keys(remoteSnapshot.remotesInfo).forEach((key) => {
+        const remoteInfo = remoteSnapshot.remotesInfo[key];
+        replaceObjectLocalhost("matchedVersion", remoteInfo);
+      });
     }
     return args;
   }

package/dist/esm-node/runtime/MFReactComponent.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import React from "react";
 import { loadRemote, getInstance } from "@module-federation/enhanced/runtime";
+import { ErrorBoundary } from "react-error-boundary";
 function getLoadedRemoteInfos(instance, id) {
   const { name, expose } = instance.remoteHandler.idToRemoteMap[id] || {};
   if (!name) {
@@ -104,9 +105,7 @@ function collectAssets(options) {
   ];
 }
 function MFReactComponent(props) {
-  const { loading = "loading...", id, fallback = void 0 } = typeof props === "string" ? {
-    id: props
-  } : props;
+  const { loading = "loading...", id, remoteProps = {}, fallback } = props;
   const Component = /* @__PURE__ */ React.lazy(() => loadRemote(id).then((mod) => {
     const assets = collectAssets(props);
     if (!mod) {
@@ -117,7 +116,9 @@ function MFReactComponent(props) {
       default: () => /* @__PURE__ */ _jsxs(_Fragment, {
         children: [
           assets,
-          /* @__PURE__ */ _jsx(Com, {})
+          /* @__PURE__ */ _jsx(Com, {
+            ...remoteProps
+          })
         ]
       })
     };
@@ -125,20 +126,23 @@ function MFReactComponent(props) {
     if (!fallback) {
       throw err;
     }
-    const FallbackNode = typeof fallback === "function" ? fallback(err) : fallback;
-    if (/* @__PURE__ */ React.isValidElement(FallbackNode)) {
-      return {
-        default: () => FallbackNode
-      };
-    }
-    const FallbackFunctionComponent = FallbackNode;
+    const FallbackFunctionComponent = fallback;
+    const FallbackNode = /* @__PURE__ */ _jsx(FallbackFunctionComponent, {
+      error: err,
+      resetErrorBoundary: () => {
+        console.log('SSR mode not support "resetErrorBoundary" !');
+      }
+    });
     return {
-      default: () => /* @__PURE__ */ _jsx(FallbackFunctionComponent, {})
+      default: () => FallbackNode
     };
   }));
-  return /* @__PURE__ */ _jsx(React.Suspense, {
-    fallback: loading,
-    children: /* @__PURE__ */ _jsx(Component, {})
+  return /* @__PURE__ */ _jsx(ErrorBoundary, {
+    FallbackComponent: fallback,
+    children: /* @__PURE__ */ _jsx(React.Suspense, {
+      fallback: loading,
+      children: /* @__PURE__ */ _jsx(Component, {})
+    })
   });
 }
 export {

package/dist/types/runtime/MFReactComponent.d.ts

@@ -1,12 +1,14 @@
 import React from 'react';
+import { ErrorBoundaryPropsWithComponent } from 'react-error-boundary';
 type Id = string;
 type IProps = {
     id: Id;
+    loading: React.ReactNode;
+    fallback: ErrorBoundaryPropsWithComponent['FallbackComponent'];
     injectScript?: boolean;
     injectLink?: boolean;
-    loading?: React.ReactNode;
-    fallback?: ((err: Error) => React.FC | React.ReactElement) | React.FC | React.ReactElement;
-} | Id;
+    remoteProps?: Record<string, any>;
+};
 declare function collectAssets(options: IProps): React.ReactNode[];
 declare function MFReactComponent(props: IProps): React.JSX.Element;
 export { MFReactComponent, collectAssets };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@module-federation/modern-js",
-  "version": "0.0.0-next-20240621074837",
+  "version": "0.0.0-next-20240623084034",
   "files": [
     "dist/",
     "types.d.ts",
@@ -46,9 +46,10 @@
     "@modern-js/utils": "^2.49.2",
     "@modern-js/node-bundle-require": "^2.49.2",
     "node-fetch": "~3.3.0",
-    "@module-federation/sdk": "0.0.0-next-20240621074837",
-    "@module-federation/enhanced": "0.0.0-next-20240621074837",
-    "@module-federation/node": "0.0.0-next-20240621074837"
+    "react-error-boundary": "4.0.13",
+    "@module-federation/sdk": "0.0.0-next-20240623084034",
+    "@module-federation/enhanced": "0.0.0-next-20240623084034",
+    "@module-federation/node": "0.0.0-next-20240623084034"
   },
   "devDependencies": {
     "@modern-js/app-tools": "^2.49.2",
@@ -56,7 +57,7 @@
     "@modern-js/runtime": "^2.49.2",
     "@modern-js/module-tools": "^2.35.0",
     "@modern-js/tsconfig": "^2.35.0",
-    "@module-federation/manifest": "0.0.0-next-20240621074837"
+    "@module-federation/manifest": "0.0.0-next-20240623084034"
   },
   "peerDependencies": {
     "react": ">=17",