@module-federation/bridge-react 0.0.0-next-20250408084324 → 0.0.0-next-20250410121036

package/dist/internal/bridge-base-CW88-1Be.es.js

@@ -0,0 +1,103 @@
+import * as React from "react";
+import { E as ErrorBoundary } from "./react-error-boundary.esm-CMdlkNPP.es.js";
+import { L as LoggerInstance, R as RouterContext } from "./context.es.js";
+import { federationRuntime } from "../plugin.es.js";
+function createBaseBridgeComponent({
+  createRoot,
+  defaultRootOptions,
+  ...bridgeInfo
+}) {
+  return () => {
+    const rootMap = /* @__PURE__ */ new Map();
+    const instance = federationRuntime.instance;
+    LoggerInstance.debug(
+      `createBridgeComponent instance from props >>>`,
+      instance
+    );
+    const RawComponent = (info) => {
+      const { appInfo, propsInfo, ...restProps } = info;
+      const { moduleName, memoryRoute, basename = "/" } = appInfo;
+      return /* @__PURE__ */ React.createElement(RouterContext.Provider, { value: { moduleName, basename, memoryRoute } }, /* @__PURE__ */ React.createElement(
+        bridgeInfo.rootComponent,
+        {
+          ...propsInfo,
+          basename,
+          ...restProps
+        }
+      ));
+    };
+    return {
+      async render(info) {
+        var _a, _b, _c, _d, _e, _f;
+        LoggerInstance.debug(`createBridgeComponent render Info`, info);
+        const {
+          moduleName,
+          dom,
+          basename,
+          memoryRoute,
+          fallback,
+          rootOptions,
+          ...propsInfo
+        } = info;
+        const mergedRootOptions = {
+          ...defaultRootOptions,
+          ...rootOptions
+        };
+        const beforeBridgeRenderRes = ((_c = (_b = (_a = instance == null ? void 0 : instance.bridgeHook) == null ? void 0 : _a.lifecycle) == null ? void 0 : _b.beforeBridgeRender) == null ? void 0 : _c.emit(info)) || {};
+        const rootComponentWithErrorBoundary = /* @__PURE__ */ React.createElement(
+          ErrorBoundary,
+          {
+            FallbackComponent: fallback
+          },
+          /* @__PURE__ */ React.createElement(
+            RawComponent,
+            {
+              appInfo: {
+                moduleName,
+                basename,
+                memoryRoute
+              },
+              propsInfo: {
+                ...propsInfo,
+                ...beforeBridgeRenderRes == null ? void 0 : beforeBridgeRenderRes.extraProps
+              }
+            }
+          )
+        );
+        if (bridgeInfo.render) {
+          await Promise.resolve(
+            bridgeInfo.render(rootComponentWithErrorBoundary, dom)
+          ).then((root) => rootMap.set(dom, root));
+        } else {
+          let root = rootMap.get(dom);
+          if (!root && createRoot) {
+            root = createRoot(dom, mergedRootOptions);
+            rootMap.set(dom, root);
+          }
+          if (root && "render" in root) {
+            root.render(rootComponentWithErrorBoundary);
+          }
+        }
+        ((_f = (_e = (_d = instance == null ? void 0 : instance.bridgeHook) == null ? void 0 : _d.lifecycle) == null ? void 0 : _e.afterBridgeRender) == null ? void 0 : _f.emit(info)) || {};
+      },
+      destroy(info) {
+        var _a, _b, _c;
+        const { dom } = info;
+        LoggerInstance.debug(`createBridgeComponent destroy Info`, info);
+        const root = rootMap.get(dom);
+        if (root) {
+          if ("unmount" in root) {
+            root.unmount();
+          } else {
+            console.warn("Root does not have unmount method");
+          }
+          rootMap.delete(dom);
+        }
+        (_c = (_b = (_a = instance == null ? void 0 : instance.bridgeHook) == null ? void 0 : _a.lifecycle) == null ? void 0 : _b.afterBridgeDestroy) == null ? void 0 : _c.emit(info);
+      }
+    };
+  };
+}
+export {
+  createBaseBridgeComponent as c
+};

package/dist/internal/bridge-base-DBiwuddQ.cjs.js

@@ -0,0 +1,119 @@
+"use strict";
+const React = require("react");
+const reactErrorBoundary_esm = require("./react-error-boundary.esm-D8nxmvmv.cjs.js");
+const context = require("./context.cjs.js");
+const plugin = require("../plugin.cjs.js");
+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);
+function createBaseBridgeComponent({
+  createRoot,
+  defaultRootOptions,
+  ...bridgeInfo
+}) {
+  return () => {
+    const rootMap = /* @__PURE__ */ new Map();
+    const instance = plugin.federationRuntime.instance;
+    context.LoggerInstance.debug(
+      `createBridgeComponent instance from props >>>`,
+      instance
+    );
+    const RawComponent = (info) => {
+      const { appInfo, propsInfo, ...restProps } = info;
+      const { moduleName, memoryRoute, basename = "/" } = appInfo;
+      return /* @__PURE__ */ React__namespace.createElement(context.RouterContext.Provider, { value: { moduleName, basename, memoryRoute } }, /* @__PURE__ */ React__namespace.createElement(
+        bridgeInfo.rootComponent,
+        {
+          ...propsInfo,
+          basename,
+          ...restProps
+        }
+      ));
+    };
+    return {
+      async render(info) {
+        var _a, _b, _c, _d, _e, _f;
+        context.LoggerInstance.debug(`createBridgeComponent render Info`, info);
+        const {
+          moduleName,
+          dom,
+          basename,
+          memoryRoute,
+          fallback,
+          rootOptions,
+          ...propsInfo
+        } = info;
+        const mergedRootOptions = {
+          ...defaultRootOptions,
+          ...rootOptions
+        };
+        const beforeBridgeRenderRes = ((_c = (_b = (_a = instance == null ? void 0 : instance.bridgeHook) == null ? void 0 : _a.lifecycle) == null ? void 0 : _b.beforeBridgeRender) == null ? void 0 : _c.emit(info)) || {};
+        const rootComponentWithErrorBoundary = /* @__PURE__ */ React__namespace.createElement(
+          reactErrorBoundary_esm.ErrorBoundary,
+          {
+            FallbackComponent: fallback
+          },
+          /* @__PURE__ */ React__namespace.createElement(
+            RawComponent,
+            {
+              appInfo: {
+                moduleName,
+                basename,
+                memoryRoute
+              },
+              propsInfo: {
+                ...propsInfo,
+                ...beforeBridgeRenderRes == null ? void 0 : beforeBridgeRenderRes.extraProps
+              }
+            }
+          )
+        );
+        if (bridgeInfo.render) {
+          await Promise.resolve(
+            bridgeInfo.render(rootComponentWithErrorBoundary, dom)
+          ).then((root) => rootMap.set(dom, root));
+        } else {
+          let root = rootMap.get(dom);
+          if (!root && createRoot) {
+            root = createRoot(dom, mergedRootOptions);
+            rootMap.set(dom, root);
+          }
+          if (root && "render" in root) {
+            root.render(rootComponentWithErrorBoundary);
+          }
+        }
+        ((_f = (_e = (_d = instance == null ? void 0 : instance.bridgeHook) == null ? void 0 : _d.lifecycle) == null ? void 0 : _e.afterBridgeRender) == null ? void 0 : _f.emit(info)) || {};
+      },
+      destroy(info) {
+        var _a, _b, _c;
+        const { dom } = info;
+        context.LoggerInstance.debug(`createBridgeComponent destroy Info`, info);
+        const root = rootMap.get(dom);
+        if (root) {
+          if ("unmount" in root) {
+            root.unmount();
+          } else {
+            console.warn("Root does not have unmount method");
+          }
+          rootMap.delete(dom);
+        }
+        (_c = (_b = (_a = instance == null ? void 0 : instance.bridgeHook) == null ? void 0 : _a.lifecycle) == null ? void 0 : _b.afterBridgeDestroy) == null ? void 0 : _c.emit(info);
+      }
+    };
+  };
+}
+exports.createBaseBridgeComponent = createBaseBridgeComponent;

package/dist/internal/react-error-boundary.esm-CMdlkNPP.es.js

@@ -0,0 +1,99 @@
+import { createContext, Component, createElement } from "react";
+const ErrorBoundaryContext = createContext(null);
+const initialState = {
+  didCatch: false,
+  error: null
+};
+class ErrorBoundary extends Component {
+  constructor(props) {
+    super(props);
+    this.resetErrorBoundary = this.resetErrorBoundary.bind(this);
+    this.state = initialState;
+  }
+  static getDerivedStateFromError(error) {
+    return {
+      didCatch: true,
+      error
+    };
+  }
+  resetErrorBoundary() {
+    const {
+      error
+    } = this.state;
+    if (error !== null) {
+      var _this$props$onReset, _this$props;
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      (_this$props$onReset = (_this$props = this.props).onReset) === null || _this$props$onReset === void 0 ? void 0 : _this$props$onReset.call(_this$props, {
+        args,
+        reason: "imperative-api"
+      });
+      this.setState(initialState);
+    }
+  }
+  componentDidCatch(error, info) {
+    var _this$props$onError, _this$props2;
+    (_this$props$onError = (_this$props2 = this.props).onError) === null || _this$props$onError === void 0 ? void 0 : _this$props$onError.call(_this$props2, error, info);
+  }
+  componentDidUpdate(prevProps, prevState) {
+    const {
+      didCatch
+    } = this.state;
+    const {
+      resetKeys
+    } = this.props;
+    if (didCatch && prevState.error !== null && hasArrayChanged(prevProps.resetKeys, resetKeys)) {
+      var _this$props$onReset2, _this$props3;
+      (_this$props$onReset2 = (_this$props3 = this.props).onReset) === null || _this$props$onReset2 === void 0 ? void 0 : _this$props$onReset2.call(_this$props3, {
+        next: resetKeys,
+        prev: prevProps.resetKeys,
+        reason: "keys"
+      });
+      this.setState(initialState);
+    }
+  }
+  render() {
+    const {
+      children,
+      fallbackRender,
+      FallbackComponent,
+      fallback
+    } = this.props;
+    const {
+      didCatch,
+      error
+    } = this.state;
+    let childToRender = children;
+    if (didCatch) {
+      const props = {
+        error,
+        resetErrorBoundary: this.resetErrorBoundary
+      };
+      if (typeof fallbackRender === "function") {
+        childToRender = fallbackRender(props);
+      } else if (FallbackComponent) {
+        childToRender = createElement(FallbackComponent, props);
+      } else if (fallback !== void 0) {
+        childToRender = fallback;
+      } else {
+        throw error;
+      }
+    }
+    return createElement(ErrorBoundaryContext.Provider, {
+      value: {
+        didCatch,
+        error,
+        resetErrorBoundary: this.resetErrorBoundary
+      }
+    }, childToRender);
+  }
+}
+function hasArrayChanged() {
+  let a = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
+  let b = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : [];
+  return a.length !== b.length || a.some((item, index) => !Object.is(item, b[index]));
+}
+export {
+  ErrorBoundary as E
+};

package/dist/internal/react-error-boundary.esm-D8nxmvmv.cjs.js

@@ -0,0 +1,98 @@
+"use strict";
+const React = require("react");
+const ErrorBoundaryContext = React.createContext(null);
+const initialState = {
+  didCatch: false,
+  error: null
+};
+class ErrorBoundary extends React.Component {
+  constructor(props) {
+    super(props);
+    this.resetErrorBoundary = this.resetErrorBoundary.bind(this);
+    this.state = initialState;
+  }
+  static getDerivedStateFromError(error) {
+    return {
+      didCatch: true,
+      error
+    };
+  }
+  resetErrorBoundary() {
+    const {
+      error
+    } = this.state;
+    if (error !== null) {
+      var _this$props$onReset, _this$props;
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      (_this$props$onReset = (_this$props = this.props).onReset) === null || _this$props$onReset === void 0 ? void 0 : _this$props$onReset.call(_this$props, {
+        args,
+        reason: "imperative-api"
+      });
+      this.setState(initialState);
+    }
+  }
+  componentDidCatch(error, info) {
+    var _this$props$onError, _this$props2;
+    (_this$props$onError = (_this$props2 = this.props).onError) === null || _this$props$onError === void 0 ? void 0 : _this$props$onError.call(_this$props2, error, info);
+  }
+  componentDidUpdate(prevProps, prevState) {
+    const {
+      didCatch
+    } = this.state;
+    const {
+      resetKeys
+    } = this.props;
+    if (didCatch && prevState.error !== null && hasArrayChanged(prevProps.resetKeys, resetKeys)) {
+      var _this$props$onReset2, _this$props3;
+      (_this$props$onReset2 = (_this$props3 = this.props).onReset) === null || _this$props$onReset2 === void 0 ? void 0 : _this$props$onReset2.call(_this$props3, {
+        next: resetKeys,
+        prev: prevProps.resetKeys,
+        reason: "keys"
+      });
+      this.setState(initialState);
+    }
+  }
+  render() {
+    const {
+      children,
+      fallbackRender,
+      FallbackComponent,
+      fallback
+    } = this.props;
+    const {
+      didCatch,
+      error
+    } = this.state;
+    let childToRender = children;
+    if (didCatch) {
+      const props = {
+        error,
+        resetErrorBoundary: this.resetErrorBoundary
+      };
+      if (typeof fallbackRender === "function") {
+        childToRender = fallbackRender(props);
+      } else if (FallbackComponent) {
+        childToRender = React.createElement(FallbackComponent, props);
+      } else if (fallback !== void 0) {
+        childToRender = fallback;
+      } else {
+        throw error;
+      }
+    }
+    return React.createElement(ErrorBoundaryContext.Provider, {
+      value: {
+        didCatch,
+        error,
+        resetErrorBoundary: this.resetErrorBoundary
+      }
+    }, childToRender);
+  }
+}
+function hasArrayChanged() {
+  let a = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
+  let b = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : [];
+  return a.length !== b.length || a.some((item, index) => !Object.is(item, b[index]));
+}
+exports.ErrorBoundary = ErrorBoundary;

package/dist/legacy.cjs.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const v16 = require("./v16.cjs.js");
+exports.createBridgeComponent = v16.createBridgeComponent;

package/dist/legacy.d.ts

@@ -0,0 +1,104 @@
+import * as React_2 from 'react';
+
+export declare function createBridgeComponent<T = any>(bridgeInfo: Omit<ProviderFnParams<T>, 'createRoot'>): () => {
+    render(info: RenderParams): Promise<void>;
+    destroy(info: DestroyParams): void;
+};
+
+export declare interface CreateRootOptions {
+    identifierPrefix?: string;
+    onRecoverableError?: (error: unknown, errorInfo: unknown) => void;
+}
+
+/**
+ * Options for creating a React root
+ */
+declare interface CreateRootOptions_2 {
+    identifierPrefix?: string;
+    onRecoverableError?: (error: unknown) => void;
+    transitionCallbacks?: unknown;
+}
+
+/**
+ * Parameters for the destroy function
+ */
+export declare interface DestroyParams {
+    moduleName: string;
+    dom: HTMLElement;
+}
+
+/**
+ * Parameters for the provider function
+ */
+export declare interface ProviderFnParams<T> {
+    rootComponent: React_2.ComponentType<T>;
+    render?: (App: React_2.ReactElement, id?: HTMLElement | string) => RootType | Promise<RootType>;
+    createRoot?: (container: Element | DocumentFragment, options?: CreateRootOptions_2) => Root_2;
+    /**
+     * Default options to pass to createRoot for React 18 and 19
+     * These options will be used when creating a root unless overridden by rootOptions in render params
+     * @example
+     * {
+     *   identifierPrefix: 'app-',
+     *   onRecoverableError: (err) => console.error(err)
+     * }
+     */
+    defaultRootOptions?: CreateRootOptions_2;
+}
+
+/**
+ * Parameters for the provider function
+ */
+export declare interface ProviderParams {
+    moduleName?: string;
+    basename?: string;
+    memoryRoute?: {
+        entryPath: string;
+        initialState?: Record<string, unknown>;
+    };
+    style?: React_2.CSSProperties;
+    className?: string;
+}
+
+/**
+ * Parameters for the render function
+ */
+export declare interface RenderParams {
+    moduleName?: string;
+    basename?: string;
+    memoryRoute?: {
+        entryPath: string;
+        initialState?: Record<string, unknown>;
+    };
+    dom: HTMLElement;
+    /**
+     * Options to pass to createRoot for React 18 and 19
+     * @example
+     * {
+     *   identifierPrefix: 'app-',
+     *   onRecoverableError: (err) => console.error(err)
+     * }
+     */
+    rootOptions?: CreateRootOptions_2;
+    [key: string]: unknown;
+}
+
+export declare interface Root {
+    render(children: React.ReactNode): void;
+    unmount(): void;
+}
+
+/**
+ * Interface for a React root object
+ */
+declare interface Root_2 {
+    render(children: React_2.ReactNode): void;
+    unmount(): void;
+}
+
+/**
+ * Type for a root element, which can be either an HTMLElement or a React root
+ */
+export declare type RootType = HTMLElement | Root_2;
+
+export { }

package/dist/legacy.es.js

@@ -0,0 +1,4 @@
+import { createBridgeComponent } from "./v16.es.js";
+export {
+  createBridgeComponent
+};

package/dist/router-v5.cjs.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const ReactRouterDom$1 = require("react-router-dom/index.js");
-const context = require("./context-C79iMWYD.cjs");
+const context = require("./internal/context.cjs.js");
 const ReactRouterDom = require("react-router-dom/index.js");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });

package/dist/router-v5.es.js

@@ -1,6 +1,6 @@
 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-Dbqf0szX.js";
+import { R as RouterContext, L as LoggerInstance } from "./internal/context.es.js";
 export * from "react-router-dom/index.js";
 function WraperRouter(props) {
   const { basename, ...propsRes } = props;

package/dist/router-v6.cjs.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const ReactRouterDom$1 = require("react-router-dom/dist/index.js");
-const context = require("./context-C79iMWYD.cjs");
+const context = require("./internal/context.cjs.js");
 const ReactRouterDom = require("react-router-dom/dist/index.js");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });

package/dist/router-v6.es.js

@@ -1,6 +1,6 @@
 import React__default, { useContext } from "react";
 import * as ReactRouterDom$1 from "react-router-dom/dist/index.js";
-import { R as RouterContext, L as LoggerInstance } from "./context-Dbqf0szX.js";
+import { R as RouterContext, L as LoggerInstance } from "./internal/context.es.js";
 export * from "react-router-dom/dist/index.js";
 function WraperRouter(props) {
   const { basename, ...propsRes } = props;

package/dist/router.cjs.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const ReactRouterDom = require("react-router-dom/");
-const context = require("./context-C79iMWYD.cjs");
+const context = require("./internal/context.cjs.js");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
   if (e) {

package/dist/router.es.js

@@ -1,7 +1,7 @@
 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-Dbqf0szX.js";
+import { R as RouterContext, L as LoggerInstance } from "./internal/context.es.js";
 function WrapperRouter(props) {
   const { basename, ...propsRes } = props;
   const routerContextProps = useContext(RouterContext) || {};

package/dist/v16.cjs.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const bridgeBase = require("./internal/bridge-base-DBiwuddQ.cjs.js");
+const ReactDOM = require("react-dom");
+function createReact16Or17Root(container) {
+  return {
+    render(children) {
+      ReactDOM.render(children, container);
+    },
+    unmount() {
+      ReactDOM.unmountComponentAtNode(container);
+    }
+  };
+}
+function createBridgeComponent(bridgeInfo) {
+  const fullBridgeInfo = {
+    ...bridgeInfo,
+    createRoot: createReact16Or17Root
+  };
+  return bridgeBase.createBaseBridgeComponent(fullBridgeInfo);
+}
+exports.createBridgeComponent = createBridgeComponent;