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

Comparing version 0.5.0 to 0.5.1

CHANGELOG.md

 # @module-federation/bridge-react
 
+## 0.5.1
+
+### Patch Changes
+
+- @module-federation/bridge-shared@0.5.1
+
 ## 0.5.0
@@ -4,0 +10,0 @@

dist/index.cjs.js

@@ -180,3 +180,3 @@ "use strict";
   };
-  RemoteApp2["__APP_VERSION__"] = "0.5.0";
+  RemoteApp2["__APP_VERSION__"] = "0.5.1";
   return /* @__PURE__ */ React.createElement(RemoteApp2, null);
@@ -299,9 +299,8 @@ });
 function createRemoteComponent(info) {
-  return React.forwardRef((props, ref) => {
-    const LazyComponent = createLazyRemoteComponent(info);
-    return (
-      // set ErrorBoundary for LazyComponent rendering error, usually caused by inner bridge logic render process
-      /* @__PURE__ */ React.createElement(ErrorBoundary, { FallbackComponent: info.fallback }, /* @__PURE__ */ React.createElement(React.Suspense, { fallback: info.loading }, /* @__PURE__ */ React.createElement(LazyComponent, { ...props, ref })))
-    );
-  });
+  return React.forwardRef(
+    (props, ref) => {
+      const LazyComponent = createLazyRemoteComponent(info);
+      return /* @__PURE__ */ React.createElement(ErrorBoundary, { FallbackComponent: info.fallback }, /* @__PURE__ */ React.createElement(React.Suspense, { fallback: info.loading }, /* @__PURE__ */ React.createElement(LazyComponent, { ...props, ref })));
+    }
+  );
 }
@@ -308,0 +307,0 @@ var client = {};

dist/index.d.ts

@@ -22,3 +22,3 @@ import { ComponentType } from 'react';
     export?: E;
-}): default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<ProviderParams & ("__BRIDGE_FN__" extends keyof (T[E] extends (...args: any) => any ? ReturnType<T[E]> : never) ? (T[E] extends (...args: any) => any ? ReturnType<T[E]> : never)["__BRIDGE_FN__"] extends (...args: any) => any ? Parameters<(T[E] extends (...args: any) => any ? ReturnType<T[E]> : never)["__BRIDGE_FN__"]>[0] : {} : {})> & default_2.RefAttributes<unknown>>;
+}): default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<ProviderParams & ("__BRIDGE_FN__" extends keyof (T[E] extends (...args: any) => any ? ReturnType<T[E]> : never) ? (T[E] extends (...args: any) => any ? ReturnType<T[E]> : never)["__BRIDGE_FN__"] extends (...args: any) => any ? Parameters<(T[E] extends (...args: any) => any ? ReturnType<T[E]> : never)["__BRIDGE_FN__"]>[0] : {} : {})> & default_2.RefAttributes<HTMLDivElement>>;
 
@@ -25,0 +25,0 @@ declare type ErrorBoundaryPropsWithComponent = ErrorBoundarySharedProps & {

dist/index.es.js

@@ -161,3 +161,3 @@ import * as React from "react";
   };
-  RemoteApp2["__APP_VERSION__"] = "0.5.0";
+  RemoteApp2["__APP_VERSION__"] = "0.5.1";
   return /* @__PURE__ */ React__default.createElement(RemoteApp2, null);
@@ -280,9 +280,8 @@ });
 function createRemoteComponent(info) {
-  return forwardRef((props, ref) => {
-    const LazyComponent = createLazyRemoteComponent(info);
-    return (
-      // set ErrorBoundary for LazyComponent rendering error, usually caused by inner bridge logic render process
-      /* @__PURE__ */ React__default.createElement(ErrorBoundary, { FallbackComponent: info.fallback }, /* @__PURE__ */ React__default.createElement(React__default.Suspense, { fallback: info.loading }, /* @__PURE__ */ React__default.createElement(LazyComponent, { ...props, ref })))
-    );
-  });
+  return forwardRef(
+    (props, ref) => {
+      const LazyComponent = createLazyRemoteComponent(info);
+      return /* @__PURE__ */ React__default.createElement(ErrorBoundary, { FallbackComponent: info.fallback }, /* @__PURE__ */ React__default.createElement(React__default.Suspense, { fallback: info.loading }, /* @__PURE__ */ React__default.createElement(LazyComponent, { ...props, ref })));
+    }
+  );
 }
@@ -289,0 +288,0 @@ var client = {};

dist/router-v5.cjs.js

 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-require("react");
+const React = require("react");
+const ReactRouterDom$1 = require("react-router-dom/index.js");
+const context = require("./context--mtFt3tp.cjs");
 const ReactRouterDom = require("react-router-dom/index.js");
-require("./context--mtFt3tp.cjs");
-const router = require("./router.cjs.js");
-exports.BrowserRouter = router.BrowserRouter;
-exports.RouterProvider = router.RouterProvider;
+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 ReactRouterDom__namespace = /* @__PURE__ */ _interopNamespaceDefault(ReactRouterDom$1);
+function WraperRouter(props) {
+  const { basename, ...propsRes } = props;
+  const routerContextProps = React.useContext(context.RouterContext) || {};
+  context.LoggerInstance.log(`WraperRouter info >>>`, {
+    ...routerContextProps,
+    routerContextProps,
+    WraperRouterProps: props
+  });
+  if (routerContextProps == null ? void 0 : routerContextProps.memoryRoute) {
+    return /* @__PURE__ */ React.createElement(
+      ReactRouterDom__namespace.MemoryRouter,
+      {
+        ...props,
+        initialEntries: [routerContextProps == null ? void 0 : routerContextProps.memoryRoute.entryPath]
+      }
+    );
+  }
+  return /* @__PURE__ */ React.createElement(
+    ReactRouterDom__namespace.BrowserRouter,
+    {
+      ...propsRes,
+      basename: (routerContextProps == null ? void 0 : routerContextProps.basename) || basename
+    }
+  );
+}
+exports.BrowserRouter = WraperRouter;
 Object.keys(ReactRouterDom).forEach((k) => {
@@ -10,0 +51,0 @@ if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k))

dist/router-v5.d.ts

 import { default as default_2 } from 'react';
-import * as ReactRouterDom from 'react-router-dom/';
+import * as ReactRouterDom from 'react-router-dom/index.js';
 
 export declare function BrowserRouter(props: Parameters<typeof ReactRouterDom.BrowserRouter>[0] | Parameters<typeof ReactRouterDom.MemoryRouter>[0]): default_2.JSX.Element;
 
-export declare function RouterProvider(props: Parameters<typeof ReactRouterDom.RouterProvider>[0]): default_2.JSX.Element;
 
-
 export * from "react-router-dom/";
 
 export { }

dist/router-v5.es.js

@@ -1,8 +0,32 @@
-import "react";
+import React__default, { useContext } from "react";
+import * as ReactRouterDom$1 from "react-router-dom/index.js";
+import { R as RouterContext, L as LoggerInstance } from "./context-Bw2PEwa6.js";
 export * from "react-router-dom/index.js";
-import "./context-Bw2PEwa6.js";
-import { BrowserRouter, RouterProvider } from "./router.es.js";
+function WraperRouter(props) {
+  const { basename, ...propsRes } = props;
+  const routerContextProps = useContext(RouterContext) || {};
+  LoggerInstance.log(`WraperRouter info >>>`, {
+    ...routerContextProps,
+    routerContextProps,
+    WraperRouterProps: props
+  });
+  if (routerContextProps == null ? void 0 : routerContextProps.memoryRoute) {
+    return /* @__PURE__ */ React__default.createElement(
+      ReactRouterDom$1.MemoryRouter,
+      {
+        ...props,
+        initialEntries: [routerContextProps == null ? void 0 : routerContextProps.memoryRoute.entryPath]
+      }
+    );
+  }
+  return /* @__PURE__ */ React__default.createElement(
+    ReactRouterDom$1.BrowserRouter,
+    {
+      ...propsRes,
+      basename: (routerContextProps == null ? void 0 : routerContextProps.basename) || basename
+    }
+  );
+}
 export {
-  BrowserRouter,
-  RouterProvider
+  WraperRouter as BrowserRouter
 };

dist/router-v6.cjs.js

 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-require("react");
+const React = require("react");
 const ReactRouterDom = require("react-router-dom/dist/index.js");
-require("./context--mtFt3tp.cjs");
-const router = require("./router.cjs.js");
-exports.BrowserRouter = router.BrowserRouter;
-exports.RouterProvider = router.RouterProvider;
+const context = require("./context--mtFt3tp.cjs");
+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 ReactRouterDom__namespace = /* @__PURE__ */ _interopNamespaceDefault(ReactRouterDom);
+function WraperRouter(props) {
+  const { basename, ...propsRes } = props;
+  const routerContextProps = React.useContext(context.RouterContext) || {};
+  context.LoggerInstance.log(`WraperRouter info >>>`, {
+    ...routerContextProps,
+    routerContextProps,
+    WraperRouterProps: props
+  });
+  if (routerContextProps == null ? void 0 : routerContextProps.memoryRoute) {
+    return /* @__PURE__ */ React.createElement(
+      ReactRouterDom__namespace.MemoryRouter,
+      {
+        ...props,
+        initialEntries: [routerContextProps == null ? void 0 : routerContextProps.memoryRoute.entryPath]
+      }
+    );
+  }
+  return /* @__PURE__ */ React.createElement(
+    ReactRouterDom__namespace.BrowserRouter,
+    {
+      ...propsRes,
+      basename: (routerContextProps == null ? void 0 : routerContextProps.basename) || basename
+    }
+  );
+}
+function WraperRouterProvider(props) {
+  const { router, ...propsRes } = props;
+  const routerContextProps = React.useContext(context.RouterContext) || {};
+  const routers = router.routes;
+  context.LoggerInstance.log(`WraperRouterProvider info >>>`, {
+    ...routerContextProps,
+    routerContextProps,
+    WraperRouterProviderProps: props,
+    router
+  });
+  const RouterProvider = ReactRouterDom__namespace["RouterProvider"];
+  const createMemoryRouter = ReactRouterDom__namespace["createMemoryRouter"];
+  const createBrowserRouter = ReactRouterDom__namespace["createBrowserRouter"];
+  if (routerContextProps.memoryRoute) {
+    const MemeoryRouterInstance = createMemoryRouter(routers, {
+      initialEntries: [routerContextProps == null ? void 0 : routerContextProps.memoryRoute.entryPath]
+    });
+    return /* @__PURE__ */ React.createElement(RouterProvider, { router: MemeoryRouterInstance });
+  } else {
+    const BrowserRouterInstance = createBrowserRouter(routers, {
+      basename: routerContextProps.basename,
+      future: router.future,
+      window: router.window
+    });
+    return /* @__PURE__ */ React.createElement(RouterProvider, { ...propsRes, router: BrowserRouterInstance });
+  }
+}
+exports.BrowserRouter = WraperRouter;
+exports.RouterProvider = WraperRouterProvider;
 Object.keys(ReactRouterDom).forEach((k) => {
@@ -10,0 +78,0 @@ if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k))

dist/router-v6.d.ts

 import { default as default_2 } from 'react';
-import * as ReactRouterDom from 'react-router-dom/';
+import * as ReactRouterDom from 'react-router-dom/dist/index.js';
 
@@ -9,4 +9,4 @@ export declare function BrowserRouter(props: Parameters<typeof ReactRouterDom.BrowserRouter>[0] | Parameters<typeof ReactRouterDom.MemoryRouter>[0]): default_2.JSX.Element;
 
-export * from "react-router-dom/";
+export * from "react-router-dom/dist/index.js";
 
 export { }

dist/router-v6.es.js

@@ -1,8 +0,60 @@
-import "react";
+import React__default, { useContext } from "react";
+import * as ReactRouterDom from "react-router-dom/dist/index.js";
 export * from "react-router-dom/dist/index.js";
-import "./context-Bw2PEwa6.js";
-import { BrowserRouter, RouterProvider } from "./router.es.js";
+import { R as RouterContext, L as LoggerInstance } from "./context-Bw2PEwa6.js";
+function WraperRouter(props) {
+  const { basename, ...propsRes } = props;
+  const routerContextProps = useContext(RouterContext) || {};
+  LoggerInstance.log(`WraperRouter info >>>`, {
+    ...routerContextProps,
+    routerContextProps,
+    WraperRouterProps: props
+  });
+  if (routerContextProps == null ? void 0 : routerContextProps.memoryRoute) {
+    return /* @__PURE__ */ React__default.createElement(
+      ReactRouterDom.MemoryRouter,
+      {
+        ...props,
+        initialEntries: [routerContextProps == null ? void 0 : routerContextProps.memoryRoute.entryPath]
+      }
+    );
+  }
+  return /* @__PURE__ */ React__default.createElement(
+    ReactRouterDom.BrowserRouter,
+    {
+      ...propsRes,
+      basename: (routerContextProps == null ? void 0 : routerContextProps.basename) || basename
+    }
+  );
+}
+function WraperRouterProvider(props) {
+  const { router, ...propsRes } = props;
+  const routerContextProps = useContext(RouterContext) || {};
+  const routers = router.routes;
+  LoggerInstance.log(`WraperRouterProvider info >>>`, {
+    ...routerContextProps,
+    routerContextProps,
+    WraperRouterProviderProps: props,
+    router
+  });
+  const RouterProvider = ReactRouterDom["RouterProvider"];
+  const createMemoryRouter = ReactRouterDom["createMemoryRouter"];
+  const createBrowserRouter = ReactRouterDom["createBrowserRouter"];
+  if (routerContextProps.memoryRoute) {
+    const MemeoryRouterInstance = createMemoryRouter(routers, {
+      initialEntries: [routerContextProps == null ? void 0 : routerContextProps.memoryRoute.entryPath]
+    });
+    return /* @__PURE__ */ React__default.createElement(RouterProvider, { router: MemeoryRouterInstance });
+  } else {
+    const BrowserRouterInstance = createBrowserRouter(routers, {
+      basename: routerContextProps.basename,
+      future: router.future,
+      window: router.window
+    });
+    return /* @__PURE__ */ React__default.createElement(RouterProvider, { ...propsRes, router: BrowserRouterInstance });
+  }
+}
 export {
-  BrowserRouter,
-  RouterProvider
+  WraperRouter as BrowserRouter,
+  WraperRouterProvider as RouterProvider
 };

package.json

 {
   "name": "@module-federation/bridge-react",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "publishConfig": {
@@ -24,10 +24,10 @@ "access": "public"
     "./router-v5": {
-      "types": "./dist/router.d.ts",
-      "import": "./dist/router.es.js",
-      "require": "./dist/router.cjs.js"
+      "types": "./dist/router-v5.d.ts",
+      "import": "./dist/router-v5.es.js",
+      "require": "./dist/router-v5.cjs.js"
     },
     "./router-v6": {
-      "types": "./dist/router.d.ts",
-      "import": "./dist/router.es.js",
-      "require": "./dist/router.cjs.js"
+      "types": "./dist/router-v6.d.ts",
+      "import": "./dist/router-v6.es.js",
+      "require": "./dist/router-v6.cjs.js"
     },
@@ -39,3 +39,3 @@ "./*": "./*"
     "react-error-boundary": "^4.0.13",
-    "@module-federation/bridge-shared": "0.5.0"
+    "@module-federation/bridge-shared": "0.5.1"
   },
@@ -42,0 +42,0 @@ "peerDependencies": {

vite.config.ts

@@ -25,4 +25,4 @@ import { defineConfig } from 'vite';
         router: path.resolve(__dirname, 'src/router.tsx'),
-        'router-v5': path.resolve(__dirname, 'src/router.tsx'),
-        'router-v6': path.resolve(__dirname, 'src/router.tsx'),
+        'router-v5': path.resolve(__dirname, 'src/router-v5.tsx'),
+        'router-v6': path.resolve(__dirname, 'src/router-v6.tsx'),
       },
@@ -47,9 +47,9 @@ formats: ['cjs', 'es'],
               const chunk = bundle[fileName];
-              if (fileName.includes('router-v6') && chunk.type === 'chunk') {
-                chunk.code = chunk.code.replace(
-                  // Match 'react-router-dom/' followed by single quotes, double quotes, or backticks, replacing only 'react-router-dom/' to react-router-v6 dist file structure
-                  /react-router-dom\/(?=[\'\"\`])/g,
-                  'react-router-dom/dist/index.js',
-                );
-              }
+              // if (fileName.includes('router-v6') && chunk.type === 'chunk') {
+              //   chunk.code = chunk.code.replace(
+              //     // Match 'react-router-dom/' followed by single quotes, double quotes, or backticks, replacing only 'react-router-dom/' to react-router-v6 dist file structure
+              //     /react-router-dom\/(?=[\'\"\`])/g,
+              //     'react-router-dom/dist/index.js',
+              //   );
+              // }
 
@@ -56,0 +56,0 @@ if (fileName.includes('router-v5') && chunk.type === 'chunk') {

No alert changes

Improved metrics

Total package byte prevSize

87401

increased by13.15%

Number of package files

37

increased by5.71%

Lines of code

2369

increased by13.84%

Dependency changes

• + Added@module-federation/bridge-shared@0.5.1(transitive)

• - Removed@module-federation/bridge-shared@0.5.0(transitive)

• Updated@module-federation/bridge-shared@0.5.1