@module-federation/bridge-react 0.0.0-next-20240723065243 → 0.0.0-next-20240723095610

package/CHANGELOG.md

@@ -1,11 +1,11 @@
 # @module-federation/bridge-react
 
-## 0.0.0-next-20240723065243
+## 0.0.0-next-20240723095610
 
 ### Patch Changes
 
 - chore: bump next
-  - @module-federation/bridge-shared@0.0.0-next-20240723065243
+  - @module-federation/bridge-shared@0.0.0-next-20240723095610
 
 ## 0.2.6
 

package/dist/index.cjs.js

@@ -282,8 +282,8 @@ function createLazyRemoteComponent(info) {
   });
 }
 function createRemoteComponent(info) {
-  const LazyComponent = createLazyRemoteComponent(info);
   return React.forwardRef(function(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 })));
   });
 }

package/dist/index.d.ts

@@ -2,8 +2,11 @@ import { ComponentType } from 'react';
 import { default as default_2 } from 'react';
 import { default as default_3 } from 'react-dom/client';
 import { ErrorInfo } from 'react';
+import { ForwardRefExoticComponent } from 'react';
 import { PropsWithChildren } from 'react';
+import { PropsWithoutRef } from 'react';
 import * as React_2 from 'react';
+import { RefAttributes } from 'react';
 
 export declare function createBridgeComponent<T>(bridgeInfo: ProviderFnParams<T>): () => {
     render(info: RenderFnParams & any): Promise<void>;
@@ -19,10 +22,7 @@ export declare function createRemoteComponent<T, E extends keyof T>(info: {
     loading: default_2.ReactNode;
     fallback: ErrorBoundaryPropsWithComponent['FallbackComponent'];
     export?: E;
-}): default_2.ForwardRefExoticComponent<default_2.PropsWithoutRef<{
-    basename?: ProviderParams["basename"];
-    memoryRoute?: ProviderParams["memoryRoute"];
-} & ("__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>>;
+}): ForwardRefExoticComponent<PropsWithoutRef<RemoteProps> & RefAttributes<HTMLElement | HTMLDivElement>>;
 
 declare type ErrorBoundaryPropsWithComponent = ErrorBoundarySharedProps & {
     fallback?: never;
@@ -61,6 +61,12 @@ export declare interface ProviderParams {
     };
 }
 
+declare type RemoteProps = {
+    basename?: ProviderParams['basename'];
+    memoryRoute?: ProviderParams['memoryRoute'];
+    [key: string]: any;
+};
+
 export declare interface RenderFnParams extends ProviderParams {
     dom: HTMLElement;
 }

package/dist/index.es.js

@@ -263,8 +263,8 @@ function createLazyRemoteComponent(info) {
   });
 }
 function createRemoteComponent(info) {
-  const LazyComponent = createLazyRemoteComponent(info);
   return forwardRef(function(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 })));
   });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@module-federation/bridge-react",
-  "version": "0.0.0-next-20240723065243",
+  "version": "0.0.0-next-20240723095610",
   "publishConfig": {
     "access": "public"
   },
@@ -35,7 +35,7 @@
   "dependencies": {
     "@loadable/component": "^5.16.4",
     "react-error-boundary": "^4.0.13",
-    "@module-federation/bridge-shared": "0.0.0-next-20240723065243"
+    "@module-federation/bridge-shared": "0.0.0-next-20240723095610"
   },
   "peerDependencies": {
     "react": ">=16.9.0",

package/src/create.tsx

@@ -1,4 +1,5 @@
 import React, { forwardRef } from 'react';
+import type { ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from 'react';
 import type { ProviderParams } from '@module-federation/bridge-shared';
 import { LoggerInstance } from './utils';
 import {
@@ -83,27 +84,29 @@ function createLazyRemoteComponent<T, E extends keyof T>(info: {
   });
 }
 
+type RemoteProps = {
+  basename?: ProviderParams['basename'];
+  memoryRoute?: ProviderParams['memoryRoute'];
+  [key: string]: any;
+};
+
 export function createRemoteComponent<T, E extends keyof T>(info: {
   loader: () => Promise<T>;
   loading: React.ReactNode;
   fallback: ErrorBoundaryPropsWithComponent['FallbackComponent'];
   export?: E;
-}) {
-  type ExportType = T[E] extends (...args: any) => any
-    ? ReturnType<T[E]>
-    : never;
-  type RawComponentType = '__BRIDGE_FN__' extends keyof ExportType
-    ? ExportType['__BRIDGE_FN__'] extends (...args: any) => any
-      ? Parameters<ExportType['__BRIDGE_FN__']>[0]
-      : {}
-    : {};
+}): ForwardRefExoticComponent< PropsWithoutRef<RemoteProps> & RefAttributes<HTMLElement | HTMLDivElement>> {
+  // type ExportType = T[E] extends (...args: any) => any
+  //   ? ReturnType<T[E]>
+  //   : never;
+  // type RawComponentType = '__BRIDGE_FN__' extends keyof ExportType
+  //   ? ExportType['__BRIDGE_FN__'] extends (...args: any) => any
+  //     ? Parameters<ExportType['__BRIDGE_FN__']>[0]
+  //     : {}
+  //   : {};
 
-  const LazyComponent = createLazyRemoteComponent(info);
-  
-  return forwardRef(function (props: {
-    basename?: ProviderParams['basename'];
-    memoryRoute?: ProviderParams['memoryRoute'];
-  } & RawComponentType, ref) {
+  return forwardRef(function (props, ref) {
+    const LazyComponent = createLazyRemoteComponent(info);
     return (
       <ErrorBoundary FallbackComponent={info.fallback}>
         <React.Suspense fallback={info.loading}>