@mittwald/flow-remote-react-renderer 0.2.0-alpha.46 → 0.2.0-alpha.48
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -5,10 +5,10 @@ import { jsxs, Fragment, jsx } from "react/jsx-runtime";
|
|
|
5
5
|
import { components } from "./components.mjs";
|
|
6
6
|
import { connectRemoteIframeRef } from "@mittwald/flow-remote-core";
|
|
7
7
|
import { RemoteReceiver, RemoteRootRenderer } from "@remote-dom/react/host";
|
|
8
|
-
import { useMemo,
|
|
8
|
+
import { useMemo, useState } from "react";
|
|
9
9
|
import { reduce } from "remeda";
|
|
10
10
|
const RemoteRendererClient = (props) => {
|
|
11
|
-
const { integrations = [], src, iframeStyle,
|
|
11
|
+
const { integrations = [], src, iframeStyle, fallback } = props;
|
|
12
12
|
const receiver = useMemo(() => new RemoteReceiver(), []);
|
|
13
13
|
const mergedComponents = useMemo(() => {
|
|
14
14
|
return new Map(
|
|
@@ -25,22 +25,12 @@ const RemoteRendererClient = (props) => {
|
|
|
25
25
|
);
|
|
26
26
|
}, [...integrations]);
|
|
27
27
|
const connect = connectRemoteIframeRef(receiver.connection);
|
|
28
|
-
const connection = useRef(null);
|
|
29
|
-
useEffect(() => {
|
|
30
|
-
var _a;
|
|
31
|
-
(_a = connection.current) == null ? void 0 : _a.receiveData(data);
|
|
32
|
-
}, [data, connection]);
|
|
33
28
|
const [iframeHasLoaded, setIframeHasLoaded] = useState(false);
|
|
34
29
|
const remoteFrame = /* @__PURE__ */ jsx(
|
|
35
30
|
"iframe",
|
|
36
31
|
{
|
|
37
32
|
onLoad: () => setIframeHasLoaded(true),
|
|
38
|
-
ref:
|
|
39
|
-
if (iframe) {
|
|
40
|
-
connection.current = connect(iframe);
|
|
41
|
-
connection.current.receiveData(data);
|
|
42
|
-
}
|
|
43
|
-
},
|
|
33
|
+
ref: connect,
|
|
44
34
|
src,
|
|
45
35
|
style: iframeStyle ?? {
|
|
46
36
|
visibility: "hidden",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RemoteRendererClient.mjs","sources":["../../src/RemoteRendererClient.tsx"],"sourcesContent":["\"use client\";\nimport { components } from \"@/components\";\nimport type { RemoteComponentsMap } from \"@/lib/types\";\nimport { connectRemoteIframeRef } from \"@mittwald/flow-remote-core\";\nimport type { RemoteComponentRendererProps } from \"@remote-dom/react/host\";\nimport { RemoteReceiver, RemoteRootRenderer } from \"@remote-dom/react/host\";\nimport type { ComponentType, CSSProperties, FC, ReactNode } from \"react\";\nimport {
|
|
1
|
+
{"version":3,"file":"RemoteRendererClient.mjs","sources":["../../src/RemoteRendererClient.tsx"],"sourcesContent":["\"use client\";\nimport { components } from \"@/components\";\nimport type { RemoteComponentsMap } from \"@/lib/types\";\nimport { connectRemoteIframeRef } from \"@mittwald/flow-remote-core\";\nimport type { RemoteComponentRendererProps } from \"@remote-dom/react/host\";\nimport { RemoteReceiver, RemoteRootRenderer } from \"@remote-dom/react/host\";\nimport type { ComponentType, CSSProperties, FC, ReactNode } from \"react\";\nimport { useMemo, useState } from \"react\";\nimport { reduce } from \"remeda\";\n\nexport interface RemoteRendererProps {\n integrations?: RemoteComponentsMap<never>[];\n src: string;\n iframeStyle?: CSSProperties;\n fallback?: ReactNode;\n}\n\nexport const RemoteRendererClient: FC<RemoteRendererProps> = (props) => {\n const { integrations = [], src, iframeStyle, fallback } = props;\n const receiver = useMemo(() => new RemoteReceiver(), []);\n\n const mergedComponents = useMemo(() => {\n return new Map<string, ComponentType<RemoteComponentRendererProps>>(\n Object.entries(\n reduce(\n [...integrations, components],\n (merged, current) => ({\n ...merged,\n ...current,\n }),\n {},\n ),\n ),\n );\n }, [...integrations]);\n\n const connect = connectRemoteIframeRef(receiver.connection);\n\n const [iframeHasLoaded, setIframeHasLoaded] = useState(false);\n\n const remoteFrame = (\n <iframe\n onLoad={() => setIframeHasLoaded(true)}\n ref={connect}\n src={src}\n style={\n iframeStyle ?? {\n visibility: \"hidden\",\n height: 0,\n width: 0,\n border: \"none\",\n position: \"absolute\",\n marginLeft: \"-9999px\",\n }\n }\n />\n );\n\n return (\n <>\n {!iframeHasLoaded && fallback}\n <RemoteRootRenderer components={mergedComponents} receiver={receiver} />\n {remoteFrame}\n </>\n );\n};\n\nexport default RemoteRendererClient;\n"],"names":[],"mappings":";;;;;;;AAiBa,MAAA,uBAAgD,CAAC,UAAU;AACtE,QAAM,EAAE,eAAe,IAAI,KAAK,aAAa,aAAa;AAC1D,QAAM,WAAW,QAAQ,MAAM,IAAI,eAAe,GAAG,CAAA,CAAE;AAEjD,QAAA,mBAAmB,QAAQ,MAAM;AACrC,WAAO,IAAI;AAAA,MACT,OAAO;AAAA,QACL;AAAA,UACE,CAAC,GAAG,cAAc,UAAU;AAAA,UAC5B,CAAC,QAAQ,aAAa;AAAA,YACpB,GAAG;AAAA,YACH,GAAG;AAAA,UAAA;AAAA,UAEL,CAAA;AAAA,QAAC;AAAA,MACH;AAAA,IAEJ;AAAA,EAAA,GACC,CAAC,GAAG,YAAY,CAAC;AAEd,QAAA,UAAU,uBAAuB,SAAS,UAAU;AAE1D,QAAM,CAAC,iBAAiB,kBAAkB,IAAI,SAAS,KAAK;AAE5D,QAAM,cACJ;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,QAAQ,MAAM,mBAAmB,IAAI;AAAA,MACrC,KAAK;AAAA,MACL;AAAA,MACA,OACE,eAAe;AAAA,QACb,YAAY;AAAA,QACZ,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,UAAU;AAAA,QACV,YAAY;AAAA,MAAA;AAAA,IACd;AAAA,EAEJ;AAGF,SAEK,qBAAA,UAAA,EAAA,UAAA;AAAA,IAAA,CAAC,mBAAmB;AAAA,IACpB,oBAAA,oBAAA,EAAmB,YAAY,kBAAkB,SAAoB,CAAA;AAAA,IACrE;AAAA,EAAA,GACH;AAEJ;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RemoteRendererClient.d.ts","sourceRoot":"","sources":["../../src/RemoteRendererClient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAIvD,OAAO,KAAK,EAAiB,aAAa,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIzE,MAAM,WAAW,mBAAmB;IAClC,YAAY,CAAC,EAAE,mBAAmB,CAAC,KAAK,CAAC,EAAE,CAAC;IAC5C,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,
|
|
1
|
+
{"version":3,"file":"RemoteRendererClient.d.ts","sourceRoot":"","sources":["../../src/RemoteRendererClient.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAIvD,OAAO,KAAK,EAAiB,aAAa,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIzE,MAAM,WAAW,mBAAmB;IAClC,YAAY,CAAC,EAAE,mBAAmB,CAAC,KAAK,CAAC,EAAE,CAAC;IAC5C,GAAG,EAAE,MAAM,CAAC;IACZ,WAAW,CAAC,EAAE,aAAa,CAAC;IAC5B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,eAAO,MAAM,oBAAoB,EAAE,EAAE,CAAC,mBAAmB,CAgDxD,CAAC;AAEF,eAAe,oBAAoB,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mittwald/flow-remote-react-renderer",
|
|
3
|
-
"version": "0.2.0-alpha.
|
|
3
|
+
"version": "0.2.0-alpha.48",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "React rendering for Flow Remote Elements",
|
|
6
6
|
"homepage": "https://mittwald.github.io/flow",
|
|
@@ -28,8 +28,8 @@
|
|
|
28
28
|
"test:compile": "tsc --noEmit"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@mittwald/flow-remote-core": "0.2.0-alpha.
|
|
32
|
-
"@mittwald/flow-remote-elements": "0.2.0-alpha.
|
|
31
|
+
"@mittwald/flow-remote-core": "0.2.0-alpha.48",
|
|
32
|
+
"@mittwald/flow-remote-elements": "0.2.0-alpha.48",
|
|
33
33
|
"@remote-dom/react": "^1.2.1",
|
|
34
34
|
"@types/react": "^19.0.10",
|
|
35
35
|
"clsx": "^2.1.1",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"remeda": "^2.20.2"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@mittwald/flow-react-components": "0.2.0-alpha.
|
|
40
|
+
"@mittwald/flow-react-components": "0.2.0-alpha.48",
|
|
41
41
|
"@mittwald/typescript-config": "",
|
|
42
42
|
"@types/node": "^22.13.4",
|
|
43
43
|
"nx": "^20.4.5",
|
|
@@ -65,5 +65,5 @@
|
|
|
65
65
|
"optional": true
|
|
66
66
|
}
|
|
67
67
|
},
|
|
68
|
-
"gitHead": "
|
|
68
|
+
"gitHead": "5cf55de4b649798acf26efc228a8bcd5af79e7c3"
|
|
69
69
|
}
|