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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/cjs/cli/mfRuntimePlugins/resolve-entry-ipv4.js +5 -2
  2. package/dist/cjs/runtime/MFReactComponent.js +19 -15
  3. package/dist/esm/cli/mfRuntimePlugins/resolve-entry-ipv4.js +5 -2
  4. package/dist/esm/runtime/MFReactComponent.js +17 -17
  5. package/dist/esm-node/cli/mfRuntimePlugins/resolve-entry-ipv4.js +5 -2
  6. package/dist/esm-node/runtime/MFReactComponent.js +19 -15
  7. package/dist/types/runtime/MFReactComponent.d.ts +5 -3
  8. package/package.json +6 -5
package/dist/cjs/cli/mfRuntimePlugins/resolve-entry-ipv4.js CHANGED
@@ -66,8 +66,11 @@ const resolveEntryIpv4Plugin = () => ({
66
66
  if ("getPublicPath" in remoteSnapshot) {
67
67
  replaceObjectLocalhost("getPublicPath", remoteSnapshot);
68
68
  }
69
- if ("matchedVersion:" in remoteSnapshot) {
70
- replaceObjectLocalhost("matchedVersion:", remoteSnapshot);
69
+ if (remoteSnapshot.remotesInfo) {
70
+ Object.keys(remoteSnapshot.remotesInfo).forEach((key) => {
71
+ const remoteInfo = remoteSnapshot.remotesInfo[key];
72
+ replaceObjectLocalhost("matchedVersion", remoteInfo);
73
+ });
71
74
  }
72
75
  return args;
73
76
  }
package/dist/cjs/runtime/MFReactComponent.js CHANGED
@@ -35,6 +35,7 @@ module.exports = __toCommonJS(MFReactComponent_exports);
35
35
  var import_jsx_runtime = require("react/jsx-runtime");
36
36
  var import_react = __toESM(require("react"));
37
37
  var import_runtime = require("@module-federation/enhanced/runtime");
38
+ var import_react_error_boundary = require("react-error-boundary");
38
39
  function getLoadedRemoteInfos(instance, id) {
39
40
  const { name, expose } = instance.remoteHandler.idToRemoteMap[id] || {};
40
41
  if (!name) {
@@ -138,9 +139,7 @@ function collectAssets(options) {
138
139
  ];
139
140
  }
140
141
  function MFReactComponent(props) {
141
- const { loading = "loading...", id, fallback = void 0 } = typeof props === "string" ? {
142
- id: props
143
- } : props;
142
+ const { loading = "loading...", id, remoteProps = {}, fallback } = props;
144
143
  const Component = /* @__PURE__ */ import_react.default.lazy(() => (0, import_runtime.loadRemote)(id).then((mod) => {
145
144
  const assets = collectAssets(props);
146
145
  if (!mod) {
@@ -151,7 +150,9 @@ function MFReactComponent(props) {
151
150
  default: () => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, {
152
151
  children: [
153
152
  assets,
154
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Com, {})
153
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Com, {
154
+ ...remoteProps
155
+ })
155
156
  ]
156
157
  })
157
158
  };
@@ -159,20 +160,23 @@ function MFReactComponent(props) {
159
160
  if (!fallback) {
160
161
  throw err;
161
162
  }
162
- const FallbackNode = typeof fallback === "function" ? fallback(err) : fallback;
163
- if (/* @__PURE__ */ import_react.default.isValidElement(FallbackNode)) {
164
- return {
165
- default: () => FallbackNode
166
- };
167
- }
168
- const FallbackFunctionComponent = FallbackNode;
163
+ const FallbackFunctionComponent = fallback;
164
+ const FallbackNode = /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FallbackFunctionComponent, {
165
+ error: err,
166
+ resetErrorBoundary: () => {
167
+ console.log('SSR mode not support "resetErrorBoundary" !');
168
+ }
169
+ });
169
170
  return {
170
- default: () => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FallbackFunctionComponent, {})
171
+ default: () => FallbackNode
171
172
  };
172
173
  }));
173
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.default.Suspense, {
174
- fallback: loading,
175
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {})
174
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_error_boundary.ErrorBoundary, {
175
+ FallbackComponent: fallback,
176
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.default.Suspense, {
177
+ fallback: loading,
178
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Component, {})
179
+ })
176
180
  });
177
181
  }
178
182
  // Annotate the CommonJS export names for ESM import in node:
package/dist/esm/cli/mfRuntimePlugins/resolve-entry-ipv4.js CHANGED
@@ -54,8 +54,11 @@ var resolveEntryIpv4Plugin = function() {
54
54
  if ("getPublicPath" in remoteSnapshot) {
55
55
  replaceObjectLocalhost("getPublicPath", remoteSnapshot);
56
56
  }
57
- if ("matchedVersion:" in remoteSnapshot) {
58
- replaceObjectLocalhost("matchedVersion:", remoteSnapshot);
57
+ if (remoteSnapshot.remotesInfo) {
58
+ Object.keys(remoteSnapshot.remotesInfo).forEach(function(key) {
59
+ var remoteInfo = remoteSnapshot.remotesInfo[key];
60
+ replaceObjectLocalhost("matchedVersion", remoteInfo);
61
+ });
59
62
  }
60
63
  return args;
61
64
  }
package/dist/esm/runtime/MFReactComponent.js CHANGED
@@ -4,6 +4,7 @@ import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
4
4
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
5
5
  import React from "react";
6
6
  import { loadRemote, getInstance } from "@module-federation/enhanced/runtime";
7
+ import { ErrorBoundary } from "react-error-boundary";
7
8
  function getLoadedRemoteInfos(instance, id) {
8
9
  var _ref = instance.remoteHandler.idToRemoteMap[id] || {}, name = _ref.name, expose = _ref.expose;
9
10
  if (!name) {
@@ -94,9 +95,7 @@ function collectAssets(options) {
94
95
  return _to_consumable_array(scripts).concat(_to_consumable_array(links));
95
96
  }
96
97
  function MFReactComponent(props) {
97
- var _ref = typeof props === "string" ? {
98
- id: props
99
- } : 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;
98
+ 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;
100
99
  var Component = /* @__PURE__ */ React.lazy(function() {
101
100
  return loadRemote(id).then(function(mod) {
102
101
  var assets = collectAssets(props);
@@ -109,7 +108,7 @@ function MFReactComponent(props) {
109
108
  return /* @__PURE__ */ _jsxs(_Fragment, {
110
109
  children: [
111
110
  assets,
112
- /* @__PURE__ */ _jsx(Com, {})
111
+ /* @__PURE__ */ _jsx(Com, _object_spread({}, remoteProps))
113
112
  ]
114
113
  });
115
114
  }
@@ -118,25 +117,26 @@ function MFReactComponent(props) {
118
117
  if (!fallback) {
119
118
  throw err;
120
119
  }
121
- var FallbackNode = typeof fallback === "function" ? fallback(err) : fallback;
122
- if (/* @__PURE__ */ React.isValidElement(FallbackNode)) {
123
- return {
124
- default: function() {
125
- return FallbackNode;
126
- }
127
- };
128
- }
129
- var FallbackFunctionComponent = FallbackNode;
120
+ var FallbackFunctionComponent = fallback;
121
+ var FallbackNode = /* @__PURE__ */ _jsx(FallbackFunctionComponent, {
122
+ error: err,
123
+ resetErrorBoundary: function() {
124
+ console.log('SSR mode not support "resetErrorBoundary" !');
125
+ }
126
+ });
130
127
  return {
131
128
  default: function() {
132
- return /* @__PURE__ */ _jsx(FallbackFunctionComponent, {});
129
+ return FallbackNode;
133
130
  }
134
131
  };
135
132
  });
136
133
  });
137
- return /* @__PURE__ */ _jsx(React.Suspense, {
138
- fallback: loading,
139
- children: /* @__PURE__ */ _jsx(Component, {})
134
+ return /* @__PURE__ */ _jsx(ErrorBoundary, {
135
+ FallbackComponent: fallback,
136
+ children: /* @__PURE__ */ _jsx(React.Suspense, {
137
+ fallback: loading,
138
+ children: /* @__PURE__ */ _jsx(Component, {})
139
+ })
140
140
  });
141
141
  }
142
142
  export {
package/dist/esm-node/cli/mfRuntimePlugins/resolve-entry-ipv4.js CHANGED
@@ -43,8 +43,11 @@ const resolveEntryIpv4Plugin = () => ({
43
43
  if ("getPublicPath" in remoteSnapshot) {
44
44
  replaceObjectLocalhost("getPublicPath", remoteSnapshot);
45
45
  }
46
- if ("matchedVersion:" in remoteSnapshot) {
47
- replaceObjectLocalhost("matchedVersion:", remoteSnapshot);
46
+ if (remoteSnapshot.remotesInfo) {
47
+ Object.keys(remoteSnapshot.remotesInfo).forEach((key) => {
48
+ const remoteInfo = remoteSnapshot.remotesInfo[key];
49
+ replaceObjectLocalhost("matchedVersion", remoteInfo);
50
+ });
48
51
  }
49
52
  return args;
50
53
  }
package/dist/esm-node/runtime/MFReactComponent.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
2
  import React from "react";
3
3
  import { loadRemote, getInstance } from "@module-federation/enhanced/runtime";
4
+ import { ErrorBoundary } from "react-error-boundary";
4
5
  function getLoadedRemoteInfos(instance, id) {
5
6
  const { name, expose } = instance.remoteHandler.idToRemoteMap[id] || {};
6
7
  if (!name) {
@@ -104,9 +105,7 @@ function collectAssets(options) {
104
105
  ];
105
106
  }
106
107
  function MFReactComponent(props) {
107
- const { loading = "loading...", id, fallback = void 0 } = typeof props === "string" ? {
108
- id: props
109
- } : props;
108
+ const { loading = "loading...", id, remoteProps = {}, fallback } = props;
110
109
  const Component = /* @__PURE__ */ React.lazy(() => loadRemote(id).then((mod) => {
111
110
  const assets = collectAssets(props);
112
111
  if (!mod) {
@@ -117,7 +116,9 @@ function MFReactComponent(props) {
117
116
  default: () => /* @__PURE__ */ _jsxs(_Fragment, {
118
117
  children: [
119
118
  assets,
120
- /* @__PURE__ */ _jsx(Com, {})
119
+ /* @__PURE__ */ _jsx(Com, {
120
+ ...remoteProps
121
+ })
121
122
  ]
122
123
  })
123
124
  };
@@ -125,20 +126,23 @@ function MFReactComponent(props) {
125
126
  if (!fallback) {
126
127
  throw err;
127
128
  }
128
- const FallbackNode = typeof fallback === "function" ? fallback(err) : fallback;
129
- if (/* @__PURE__ */ React.isValidElement(FallbackNode)) {
130
- return {
131
- default: () => FallbackNode
132
- };
133
- }
134
- const FallbackFunctionComponent = FallbackNode;
129
+ const FallbackFunctionComponent = fallback;
130
+ const FallbackNode = /* @__PURE__ */ _jsx(FallbackFunctionComponent, {
131
+ error: err,
132
+ resetErrorBoundary: () => {
133
+ console.log('SSR mode not support "resetErrorBoundary" !');
134
+ }
135
+ });
135
136
  return {
136
- default: () => /* @__PURE__ */ _jsx(FallbackFunctionComponent, {})
137
+ default: () => FallbackNode
137
138
  };
138
139
  }));
139
- return /* @__PURE__ */ _jsx(React.Suspense, {
140
- fallback: loading,
141
- children: /* @__PURE__ */ _jsx(Component, {})
140
+ return /* @__PURE__ */ _jsx(ErrorBoundary, {
141
+ FallbackComponent: fallback,
142
+ children: /* @__PURE__ */ _jsx(React.Suspense, {
143
+ fallback: loading,
144
+ children: /* @__PURE__ */ _jsx(Component, {})
145
+ })
142
146
  });
143
147
  }
144
148
  export {
package/dist/types/runtime/MFReactComponent.d.ts CHANGED
@@ -1,12 +1,14 @@
1
1
  import React from 'react';
2
+ import { ErrorBoundaryPropsWithComponent } from 'react-error-boundary';
2
3
  type Id = string;
3
4
  type IProps = {
4
5
  id: Id;
6
+ loading: React.ReactNode;
7
+ fallback: ErrorBoundaryPropsWithComponent['FallbackComponent'];
5
8
  injectScript?: boolean;
6
9
  injectLink?: boolean;
7
- loading?: React.ReactNode;
8
- fallback?: ((err: Error) => React.FC | React.ReactElement) | React.FC | React.ReactElement;
9
- } | Id;
10
+ remoteProps?: Record<string, any>;
11
+ };
10
12
  declare function collectAssets(options: IProps): React.ReactNode[];
11
13
  declare function MFReactComponent(props: IProps): React.JSX.Element;
12
14
  export { MFReactComponent, collectAssets };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@module-federation/modern-js",
3
- "version": "0.0.0-next-20240621074837",
3
+ "version": "0.0.0-next-20240623084034",
4
4
  "files": [
5
5
  "dist/",
6
6
  "types.d.ts",
@@ -46,9 +46,10 @@
46
46
  "@modern-js/utils": "^2.49.2",
47
47
  "@modern-js/node-bundle-require": "^2.49.2",
48
48
  "node-fetch": "~3.3.0",
49
- "@module-federation/sdk": "0.0.0-next-20240621074837",
50
- "@module-federation/enhanced": "0.0.0-next-20240621074837",
51
- "@module-federation/node": "0.0.0-next-20240621074837"
49
+ "react-error-boundary": "4.0.13",
50
+ "@module-federation/sdk": "0.0.0-next-20240623084034",
51
+ "@module-federation/enhanced": "0.0.0-next-20240623084034",
52
+ "@module-federation/node": "0.0.0-next-20240623084034"
52
53
  },
53
54
  "devDependencies": {
54
55
  "@modern-js/app-tools": "^2.49.2",
@@ -56,7 +57,7 @@
56
57
  "@modern-js/runtime": "^2.49.2",
57
58
  "@modern-js/module-tools": "^2.35.0",
58
59
  "@modern-js/tsconfig": "^2.35.0",
59
- "@module-federation/manifest": "0.0.0-next-20240621074837"
60
+ "@module-federation/manifest": "0.0.0-next-20240623084034"
60
61
  },
61
62
  "peerDependencies": {
62
63
  "react": ">=17",