@module-federation/bridge-react - npm Package Compare versions

Comparing version 0.0.0-next-20240619092117 to 0.0.0-next-20240619100937

CHANGELOG.md

 # @module-federation/bridge-react
 
-## 0.0.0-next-20240619092117
+## 0.0.0-next-20240619100937
 
 ### Patch Changes
 
-- @module-federation/bridge-shared@0.0.0-next-20240619092117
+- @module-federation/bridge-shared@0.0.0-next-20240619100937

dist/index.cjs.js

@@ -5,4 +5,21 @@ "use strict";
 const reactRouterDom = require("react-router-dom");
-const context = require("./context-C7FfFcIe.cjs");
-const require$$0 = require("react-dom");
+const context = require("./context-ePt4wynZ.cjs");
+const ReactDOM = require("react-dom");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
 const RemoteApp = ({
@@ -111,3 +128,3 @@ name,
 var client = {};
-var m = require$$0;
+var m = ReactDOM;
 if (process.env.NODE_ENV === "production") {
@@ -141,3 +158,3 @@ client.createRoot = m.createRoot;
       const { name, memoryRoute, basename = "/" } = appInfo;
-      return /* @__PURE__ */ React.createElement(context.RouterContext.Provider, { value: { name, basename, memoryRoute } }, /* @__PURE__ */ React.createElement(bridgeInfo.rootComponent, { ...propsInfo, basename }));
+      return /* @__PURE__ */ React__namespace.createElement(context.RouterContext.Provider, { value: { name, basename, memoryRoute } }, /* @__PURE__ */ React__namespace.createElement(bridgeInfo.rootComponent, { ...propsInfo, basename }));
     };
@@ -147,18 +164,35 @@ return {
         context.LoggerInstance.log(`createBridgeComponent render Info`, info);
-        const root = client.createRoot(info.dom);
-        rootMap.set(info.dom, root);
         const { name, basename, memoryRoute, ...propsInfo } = info;
-        root.render(
-          /* @__PURE__ */ React.createElement(
-            RawComponent,
-            {
-              propsInfo,
-              appInfo: {
-                name,
-                basename,
-                memoryRoute
+        if (context.atLeastReact18(React__namespace)) {
+          const root = client.createRoot(info.dom);
+          rootMap.set(info.dom, root);
+          root.render(
+            /* @__PURE__ */ React__namespace.createElement(
+              RawComponent,
+              {
+                propsInfo,
+                appInfo: {
+                  name,
+                  basename,
+                  memoryRoute
+                }
               }
-            }
-          )
-        );
+            )
+          );
+        } else {
+          ReactDOM.render(
+            /* @__PURE__ */ React__namespace.createElement(
+              RawComponent,
+              {
+                propsInfo,
+                appInfo: {
+                  name,
+                  basename,
+                  memoryRoute
+                }
+              }
+            ),
+            info.dom
+          );
+        }
       },
@@ -169,4 +203,8 @@ destroy(info) {
         });
-        const root = rootMap.get(info.dom);
-        root == null ? void 0 : root.unmount();
+        if (context.atLeastReact18(React__namespace)) {
+          const root = rootMap.get(info.dom);
+          root == null ? void 0 : root.unmount();
+        } else {
+          ReactDOM.unmountComponentAtNode(info.dom);
+        }
       },
@@ -173,0 +211,0 @@ rawComponent: bridgeInfo.rootComponent,

dist/index.d.ts

 import { default as default_2 } from 'react';
+import * as React_2 from 'react';
 import { ReactNode } from 'react';
@@ -9,3 +10,3 @@
     }): void;
-    rawComponent: default_2.ComponentType<T>;
+    rawComponent: React_2.ComponentType<T>;
     __BRIDGE_FN__: (_args: T) => void;
@@ -23,3 +24,3 @@ };
 declare type ProviderFnParams<T> = {
-    rootComponent: default_2.ComponentType<T>;
+    rootComponent: React_2.ComponentType<T>;
 };
@@ -26,0 +27,0 @@

dist/index.es.js

@@ -1,5 +0,6 @@
-import React, { useContext, useMemo, useRef, useState, useEffect } from "react";
+import * as React from "react";
+import React__default, { useContext, useMemo, useRef, useState, useEffect } from "react";
 import { UNSAFE_RouteContext, useLocation } from "react-router-dom";
-import { L as LoggerInstance, f, R as RouterContext } from "./context-CoFgcMIF.js";
-import require$$0 from "react-dom";
+import { L as LoggerInstance, f, a as atLeastReact18, R as RouterContext } from "./context-CPtN38Ur.js";
+import ReactDOM from "react-dom";
 const RemoteApp = ({
@@ -61,3 +62,3 @@ name,
   }, []);
-  return /* @__PURE__ */ React.createElement("div", { ref: rootRef });
+  return /* @__PURE__ */ React__default.createElement("div", { ref: rootRef });
 };
@@ -74,3 +75,3 @@ RemoteApp["__APP_VERSION__"] = "0.0.1";
     const LazyComponent = useMemo(() => {
-      return React.lazy(async () => {
+      return React__default.lazy(async () => {
         LoggerInstance.log(`createRemoteComponent LazyComponent create >>>`, {
@@ -91,3 +92,3 @@ basename,
           return {
-            default: () => /* @__PURE__ */ React.createElement(
+            default: () => /* @__PURE__ */ React__default.createElement(
               RemoteApp,
@@ -107,7 +108,7 @@ {
     }, [exportName, basename, props.memoryRoute]);
-    return /* @__PURE__ */ React.createElement(React.Suspense, { fallback: props.fallback }, /* @__PURE__ */ React.createElement(LazyComponent, null));
+    return /* @__PURE__ */ React__default.createElement(React__default.Suspense, { fallback: props.fallback }, /* @__PURE__ */ React__default.createElement(LazyComponent, null));
   };
 }
 var client = {};
-var m = require$$0;
+var m = ReactDOM;
 if (process.env.NODE_ENV === "production") {
@@ -146,18 +147,35 @@ client.createRoot = m.createRoot;
         LoggerInstance.log(`createBridgeComponent render Info`, info);
-        const root = client.createRoot(info.dom);
-        rootMap.set(info.dom, root);
         const { name, basename, memoryRoute, ...propsInfo } = info;
-        root.render(
-          /* @__PURE__ */ React.createElement(
-            RawComponent,
-            {
-              propsInfo,
-              appInfo: {
-                name,
-                basename,
-                memoryRoute
+        if (atLeastReact18(React)) {
+          const root = client.createRoot(info.dom);
+          rootMap.set(info.dom, root);
+          root.render(
+            /* @__PURE__ */ React.createElement(
+              RawComponent,
+              {
+                propsInfo,
+                appInfo: {
+                  name,
+                  basename,
+                  memoryRoute
+                }
               }
-            }
-          )
-        );
+            )
+          );
+        } else {
+          ReactDOM.render(
+            /* @__PURE__ */ React.createElement(
+              RawComponent,
+              {
+                propsInfo,
+                appInfo: {
+                  name,
+                  basename,
+                  memoryRoute
+                }
+              }
+            ),
+            info.dom
+          );
+        }
       },
@@ -168,4 +186,8 @@ destroy(info) {
         });
-        const root = rootMap.get(info.dom);
-        root == null ? void 0 : root.unmount();
+        if (atLeastReact18(React)) {
+          const root = rootMap.get(info.dom);
+          root == null ? void 0 : root.unmount();
+        } else {
+          ReactDOM.unmountComponentAtNode(info.dom);
+        }
       },
@@ -172,0 +194,0 @@ rawComponent: bridgeInfo.rootComponent,

dist/router.cjs.js

@@ -5,3 +5,3 @@ "use strict";
 const ReactRouterDom = require("react-router-dom/");
-const context = require("./context-C7FfFcIe.cjs");
+const context = require("./context-ePt4wynZ.cjs");
 function _interopNamespaceDefault(e) {
@@ -8,0 +8,0 @@ const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });

dist/router.es.js

@@ -1,5 +0,5 @@
-import React, { useContext } from "react";
+import React__default, { useContext } from "react";
 import * as ReactRouterDom from "react-router-dom/";
 export * from "react-router-dom/";
-import { R as RouterContext, L as LoggerInstance } from "./context-CoFgcMIF.js";
+import { R as RouterContext, L as LoggerInstance } from "./context-CPtN38Ur.js";
 function WraperRouter(props) {
@@ -14,5 +14,5 @@ const { basename, ...propsRes } = props;
   if (!routerContextProps)
-    return /* @__PURE__ */ React.createElement(ReactRouterDom.BrowserRouter, { ...props });
+    return /* @__PURE__ */ React__default.createElement(ReactRouterDom.BrowserRouter, { ...props });
   if (routerContextProps == null ? void 0 : routerContextProps.memoryRoute) {
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ React__default.createElement(
       ReactRouterDom.MemoryRouter,
@@ -25,3 +25,3 @@ {
   }
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React__default.createElement(
     ReactRouterDom.BrowserRouter,
@@ -45,3 +45,3 @@ {
   if (!routerContextProps)
-    return /* @__PURE__ */ React.createElement(ReactRouterDom.RouterProvider, { ...props });
+    return /* @__PURE__ */ React__default.createElement(ReactRouterDom.RouterProvider, { ...props });
   if (routerContextProps.memoryRoute) {
@@ -51,3 +51,3 @@ const MemeoryRouterInstance = ReactRouterDom.createMemoryRouter(routers, {
     });
-    return /* @__PURE__ */ React.createElement(ReactRouterDom.RouterProvider, { router: MemeoryRouterInstance });
+    return /* @__PURE__ */ React__default.createElement(ReactRouterDom.RouterProvider, { router: MemeoryRouterInstance });
   } else {
@@ -59,3 +59,3 @@ const BrowserRouterInstance = ReactRouterDom.createBrowserRouter(routers, {
     });
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ React__default.createElement(
       ReactRouterDom.RouterProvider,
@@ -62,0 +62,0 @@ {

package.json

 {
   "name": "@module-federation/bridge-react",
-  "version": "0.0.0-next-20240619092117",
+  "version": "0.0.0-next-20240619100937",
   "publishConfig": {
@@ -28,8 +28,8 @@ "access": "public"
     "react-error-boundary": "^4.0.13",
-    "@module-federation/bridge-shared": "0.0.0-next-20240619092117"
+    "@module-federation/bridge-shared": "0.0.0-next-20240619100937"
   },
   "peerDependencies": {
-    "react": "=18",
-    "react-dom": "=18",
-    "react-router-dom": ">=5"
+    "react": ">=16.9.0",
+    "react-dom": ">=16.9.0",
+    "react-router-dom": ">=4"
   },
@@ -36,0 +36,0 @@ "devDependencies": {

src/utils.ts

@@ -0,3 +1,23 @@
+import React from 'react';
 import { Logger } from '@module-federation/bridge-shared';
 
 export const LoggerInstance = new Logger('bridge-react');
+
+type typeReact = typeof React;
+
+export function atLeastReact18(React: typeReact) {
+  if (
+    React &&
+    typeof React.version === 'string' &&
+    React.version.indexOf('.') >= 0
+  ) {
+    const majorVersionString = React.version.split('.')[0];
+    try {
+      return Number(majorVersionString) >= 18;
+    } catch (err) {
+      return false;
+    }
+  } else {
+    return false;
+  }
+}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

49030

increased by7.92%

Lines of code

1373

increased by10.02%

Dependency changes

• + Added@module-federation/bridge-shared@0.0.0-next-20240619100937(transitive)

• + Addedreact@19.0.0(transitive)

• + Addedreact-dom@19.0.0(transitive)

• + Addedscheduler@0.25.0(transitive)

• - Removed@module-federation/bridge-shared@0.0.0-next-20240619092117(transitive)

• - Removedjs-tokens@4.0.0(transitive)

• - Removedloose-envify@1.4.0(transitive)

• - Removedreact@18.3.1(transitive)

• - Removedreact-dom@18.3.1(transitive)

• - Removedscheduler@0.23.2(transitive)

• Updated@module-federation/bridge-shared@0.0.0-next-20240619100937