Skip to content

Commit b3a9d2a

Browse files
committed
add support for passing parameters to remote components
1 parent 4d9dd2b commit b3a9d2a

File tree

2 files changed

+19
-11
lines changed

2 files changed

+19
-11
lines changed

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "react-dynamic-remote-component",
3-
"version": "0.0.3",
3+
"version": "0.0.4",
44
"description": "Allows you to dynamically load a component from a remote using webpack 5's module federation.",
55
"keywords": [
66
"react",

src/RemoteComponent.tsx

Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,7 @@
1-
import { FC } from "react";
21
import { attachScript } from "./attach-script";
32
import { loadModule } from "./load-module";
4-
import { RemoteModule } from "./types";
53
import { suspend } from "./suspend";
4+
import { RemoteModule } from "./types";
65
import { getRemoteModuleId } from "./utils";
76

87
export type RemoteComponentProps = RemoteModule & {
@@ -52,12 +51,21 @@ export const useRemoteModule = (remoteModule: RemoteModule) => {
5251
return getModuleSuspended(remoteModule);
5352
};
5453

55-
export const RemoteComponent: FC<RemoteComponentProps> = ({
56-
unLoadScriptOnUnmount = true,
57-
exportName = "default",
58-
...remoteModule
59-
}) => {
60-
const { [exportName]: Component } = getModuleSuspended(remoteModule);
54+
export function RemoteComponent<ExtraProps>(props: RemoteComponentProps) {
55+
const {
56+
unLoadScriptOnUnmount = true,
57+
exportName = "default",
58+
url,
59+
scope,
60+
module,
61+
...componentProps
62+
} = props;
6163

62-
return <Component />;
63-
};
64+
const { [exportName]: Component } = getModuleSuspended({
65+
url,
66+
scope,
67+
module,
68+
});
69+
70+
return <Component {...componentProps} />;
71+
}

0 commit comments

Comments
 (0)