remote-components 0.0.11 → 0.0.12

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.
@@ -177,7 +177,8 @@ function RemoteComponentClient({
177
177
  type: "application/json",
178
178
  children: JSON.stringify(nextData)
179
179
  }
180
- ) : null
180
+ ) : null,
181
+ isolate === false ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("template", { id: `${name}_end` }) : null
181
182
  ] });
182
183
  }
183
184
  // Annotate the CommonJS export names for ESM import in node:
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/next/host/app-router-client.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState, useLayoutEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport {\n loadRemoteComponent,\n DEFAULT_ROUTE,\n RUNTIME_WEBPACK,\n} from '../../shared/client/remote-component';\nimport type { RemoteComponentProps } from '../../shared/client/remote-component';\n\n// patch react/jsx-runtime to support the shadowrootmode attribute on template elements\ndeclare module 'react/jsx-runtime' {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace JSX {\n interface IntrinsicElements {\n template: {\n shadowrootmode?: 'open' | 'closed';\n children: React.ReactNode;\n };\n }\n }\n}\n\n// import { shared } from '@remote-components/shared/host';\nasync function tryImportShared() {\n try {\n const { shared } = await import('@remote-components/shared/host');\n return shared;\n } catch {\n return {};\n }\n}\n\n/**\n * RemoteComponentClient - Main component for rendering remote components\n *\n * This component handles the loading and rendering of remote microfrontends.\n * It supports both RSC (React Server Components) and Next.js Pages Router based components.\n */\nexport function RemoteComponentClient({\n url,\n name,\n bundle,\n route = DEFAULT_ROUTE,\n runtime = RUNTIME_WEBPACK,\n data,\n nextData,\n scripts = [],\n links = [],\n remoteShared = {},\n isolate,\n children,\n}: RemoteComponentProps) {\n const [component, setComponent] = useState<React.ReactNode | Error>(null);\n\n // Handle errors by re-throwing them\n if (component instanceof Error) {\n throw component;\n }\n\n // determine whether to use children or loaded component\n const shouldUseChildren =\n (!component ||\n (component &&\n !nextData &&\n typeof (component as unknown as Promise<unknown>).then !==\n 'function')) &&\n // if the remote Next.js Pages Router application is in development mode\n // we don't use the provided static HTML\n // to mitigate layout shift when loading CSS using JavaScript on the client\n nextData?.buildId !== 'development';\n\n const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(null);\n\n useLayoutEffect(() => {\n if (isolate !== false && typeof document !== 'undefined' && !shadowRoot) {\n let shadowRootElement: ShadowRoot | null = null;\n const element = document.getElementById(`shadowroot_${name}`);\n shadowRootElement = element?.shadowRoot ?? null;\n\n if (!shadowRootElement && element) {\n // create a shadow root if it doesn't exist\n // this is a fallback for browsers that don't support declarative shadow DOM\n element.attachShadow({ mode: 'open' });\n shadowRootElement = element.shadowRoot;\n }\n\n if (shadowRootElement) {\n // remove all nodes from the shadow root except links\n shadowRootElement.querySelectorAll('*:not(link)').forEach((node) => {\n node.remove();\n });\n setShadowRoot(shadowRootElement);\n }\n }\n }, [name, isolate, shadowRoot, links, url]);\n\n useEffect(() => {\n let mounted = true;\n\n // if we have a component, we don't need to load it again\n if (!component && (isolate === false || shadowRoot)) {\n loadRemoteComponent({\n url: new URL(url, location.origin),\n name,\n bundle,\n route,\n runtime,\n data,\n nextData,\n scripts,\n shared: tryImportShared(),\n remoteShared,\n container: shadowRoot,\n })\n .then((result) => {\n if (mounted) {\n if (result.error) {\n setComponent(result.error);\n } else {\n setComponent(result.component);\n }\n }\n })\n .catch((error: Error) => {\n if (mounted) {\n setComponent(error);\n }\n });\n }\n\n return () => {\n mounted = false;\n };\n }, [\n url,\n component,\n name,\n bundle,\n route,\n runtime,\n scripts,\n data,\n nextData,\n remoteShared,\n children,\n links,\n isolate,\n shadowRoot,\n ]);\n\n let componentToRender = (\n <>{shouldUseChildren ? children : (component as React.ReactNode)}</>\n );\n let linksToRender: React.ReactNode[] | null = links.map((link) => (\n <link\n as={link.as as string}\n href={new URL(link.href as string, url || location.origin).href}\n key={`${link.href as string}_${link.rel}`}\n rel={link.rel as string}\n />\n ));\n\n if (isolate !== false) {\n componentToRender = (\n <div id={`shadowroot_${name}`}>\n {typeof document === 'undefined' ? (\n // eslint-disable-next-line react/no-unknown-property\n <template shadowrootmode=\"open\">\n {linksToRender}\n {componentToRender}\n </template>\n ) : null}\n {shadowRoot\n ? createPortal(\n shadowRoot.querySelectorAll('link').length !== links.length ? (\n <>\n {linksToRender}\n {componentToRender}\n </>\n ) : (\n componentToRender\n ),\n shadowRoot,\n )\n : null}\n </div>\n );\n linksToRender = null;\n }\n\n return (\n <>\n <script data-remote-component type=\"application/json\">\n {JSON.stringify({\n name,\n bundle,\n route,\n runtime,\n })}\n </script>\n {linksToRender}\n {componentToRender}\n {nextData ? (\n <script\n id={`${bundle}_${route.replace(/\\//g, '_')}${name}_next_data`}\n type=\"application/json\"\n >\n {JSON.stringify(nextData)}\n </script>\n ) : null}\n </>\n );\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../src/next/host/app-router-client.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState, useLayoutEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport {\n loadRemoteComponent,\n DEFAULT_ROUTE,\n RUNTIME_WEBPACK,\n} from '../../shared/client/remote-component';\nimport type { RemoteComponentProps } from '../../shared/client/remote-component';\n\n// patch react/jsx-runtime to support the shadowrootmode attribute on template elements\ndeclare module 'react/jsx-runtime' {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace JSX {\n interface IntrinsicElements {\n template: {\n shadowrootmode?: 'open' | 'closed';\n id?: string;\n children?: React.ReactNode;\n };\n }\n }\n}\n\n// import { shared } from '@remote-components/shared/host';\nasync function tryImportShared() {\n try {\n const { shared } = await import('@remote-components/shared/host');\n return shared;\n } catch {\n return {};\n }\n}\n\n/**\n * RemoteComponentClient - Main component for rendering remote components\n *\n * This component handles the loading and rendering of remote microfrontends.\n * It supports both RSC (React Server Components) and Next.js Pages Router based components.\n */\nexport function RemoteComponentClient({\n url,\n name,\n bundle,\n route = DEFAULT_ROUTE,\n runtime = RUNTIME_WEBPACK,\n data,\n nextData,\n scripts = [],\n links = [],\n remoteShared = {},\n isolate,\n children,\n}: RemoteComponentProps) {\n const [component, setComponent] = useState<React.ReactNode | Error>(null);\n\n // Handle errors by re-throwing them\n if (component instanceof Error) {\n throw component;\n }\n\n // determine whether to use children or loaded component\n const shouldUseChildren =\n (!component ||\n (component &&\n !nextData &&\n typeof (component as unknown as Promise<unknown>).then !==\n 'function')) &&\n // if the remote Next.js Pages Router application is in development mode\n // we don't use the provided static HTML\n // to mitigate layout shift when loading CSS using JavaScript on the client\n nextData?.buildId !== 'development';\n\n const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(null);\n\n useLayoutEffect(() => {\n if (isolate !== false && typeof document !== 'undefined' && !shadowRoot) {\n let shadowRootElement: ShadowRoot | null = null;\n const element = document.getElementById(`shadowroot_${name}`);\n shadowRootElement = element?.shadowRoot ?? null;\n\n if (!shadowRootElement && element) {\n // create a shadow root if it doesn't exist\n // this is a fallback for browsers that don't support declarative shadow DOM\n element.attachShadow({ mode: 'open' });\n shadowRootElement = element.shadowRoot;\n }\n\n if (shadowRootElement) {\n // remove all nodes from the shadow root except links\n shadowRootElement.querySelectorAll('*:not(link)').forEach((node) => {\n node.remove();\n });\n setShadowRoot(shadowRootElement);\n }\n }\n }, [name, isolate, shadowRoot, links, url]);\n\n useEffect(() => {\n let mounted = true;\n\n // if we have a component, we don't need to load it again\n if (!component && (isolate === false || shadowRoot)) {\n loadRemoteComponent({\n url: new URL(url, location.origin),\n name,\n bundle,\n route,\n runtime,\n data,\n nextData,\n scripts,\n shared: tryImportShared(),\n remoteShared,\n container: shadowRoot,\n })\n .then((result) => {\n if (mounted) {\n if (result.error) {\n setComponent(result.error);\n } else {\n setComponent(result.component);\n }\n }\n })\n .catch((error: Error) => {\n if (mounted) {\n setComponent(error);\n }\n });\n }\n\n return () => {\n mounted = false;\n };\n }, [\n url,\n component,\n name,\n bundle,\n route,\n runtime,\n scripts,\n data,\n nextData,\n remoteShared,\n children,\n links,\n isolate,\n shadowRoot,\n ]);\n\n let componentToRender = (\n <>{shouldUseChildren ? children : (component as React.ReactNode)}</>\n );\n let linksToRender: React.ReactNode[] | null = links.map((link) => (\n <link\n as={link.as as string}\n href={new URL(link.href as string, url || location.origin).href}\n key={`${link.href as string}_${link.rel}`}\n rel={link.rel as string}\n />\n ));\n\n if (isolate !== false) {\n componentToRender = (\n <div id={`shadowroot_${name}`}>\n {typeof document === 'undefined' ? (\n // eslint-disable-next-line react/no-unknown-property\n <template shadowrootmode=\"open\">\n {linksToRender}\n {componentToRender}\n </template>\n ) : null}\n {shadowRoot\n ? createPortal(\n shadowRoot.querySelectorAll('link').length !== links.length ? (\n <>\n {linksToRender}\n {componentToRender}\n </>\n ) : (\n componentToRender\n ),\n shadowRoot,\n )\n : null}\n </div>\n );\n linksToRender = null;\n }\n\n return (\n <>\n <script data-remote-component type=\"application/json\">\n {JSON.stringify({\n name,\n bundle,\n route,\n runtime,\n })}\n </script>\n {linksToRender}\n {componentToRender}\n {nextData ? (\n <script\n id={`${bundle}_${route.replace(/\\//g, '_')}${name}_next_data`}\n type=\"application/json\"\n >\n {JSON.stringify(nextData)}\n </script>\n ) : null}\n {isolate === false ? <template id={`${name}_end`} /> : null}\n </>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA0JI;AAxJJ,mBAAqD;AACrD,uBAA6B;AAC7B,8BAIO;AAkBP,eAAe,kBAAkB;AAC/B,MAAI;AACF,UAAM,EAAE,OAAO,IAAI,MAAM,OAAO,gCAAgC;AAChE,WAAO;AAAA,EACT,QAAE;AACA,WAAO,CAAC;AAAA,EACV;AACF;AAQO,SAAS,sBAAsB;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,UAAU,CAAC;AAAA,EACX,QAAQ,CAAC;AAAA,EACT,eAAe,CAAC;AAAA,EAChB;AAAA,EACA;AACF,GAAyB;AACvB,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAkC,IAAI;AAGxE,MAAI,qBAAqB,OAAO;AAC9B,UAAM;AAAA,EACR;AAGA,QAAM,qBACH,CAAC,aACC,aACC,CAAC,YACD,OAAQ,UAA0C,SAChD;AAAA;AAAA;AAAA,EAIN,UAAU,YAAY;AAExB,QAAM,CAAC,YAAY,aAAa,QAAI,uBAA4B,IAAI;AAEpE,oCAAgB,MAAM;AACpB,QAAI,YAAY,SAAS,OAAO,aAAa,eAAe,CAAC,YAAY;AACvE,UAAI,oBAAuC;AAC3C,YAAM,UAAU,SAAS,eAAe,cAAc,MAAM;AAC5D,0BAAoB,SAAS,cAAc;AAE3C,UAAI,CAAC,qBAAqB,SAAS;AAGjC,gBAAQ,aAAa,EAAE,MAAM,OAAO,CAAC;AACrC,4BAAoB,QAAQ;AAAA,MAC9B;AAEA,UAAI,mBAAmB;AAErB,0BAAkB,iBAAiB,aAAa,EAAE,QAAQ,CAAC,SAAS;AAClE,eAAK,OAAO;AAAA,QACd,CAAC;AACD,sBAAc,iBAAiB;AAAA,MACjC;AAAA,IACF;AAAA,EACF,GAAG,CAAC,MAAM,SAAS,YAAY,OAAO,GAAG,CAAC;AAE1C,8BAAU,MAAM;AACd,QAAI,UAAU;AAGd,QAAI,CAAC,cAAc,YAAY,SAAS,aAAa;AACnD,uDAAoB;AAAA,QAClB,KAAK,IAAI,IAAI,KAAK,SAAS,MAAM;AAAA,QACjC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,QAAQ,gBAAgB;AAAA,QACxB;AAAA,QACA,WAAW;AAAA,MACb,CAAC,EACE,KAAK,CAAC,WAAW;AAChB,YAAI,SAAS;AACX,cAAI,OAAO,OAAO;AAChB,yBAAa,OAAO,KAAK;AAAA,UAC3B,OAAO;AACL,yBAAa,OAAO,SAAS;AAAA,UAC/B;AAAA,QACF;AAAA,MACF,CAAC,EACA,MAAM,CAAC,UAAiB;AACvB,YAAI,SAAS;AACX,uBAAa,KAAK;AAAA,QACpB;AAAA,MACF,CAAC;AAAA,IACL;AAEA,WAAO,MAAM;AACX,gBAAU;AAAA,IACZ;AAAA,EACF,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,MAAI,oBACF,2EAAG,8BAAoB,WAAY,WAA8B;AAEnE,MAAI,gBAA0C,MAAM,IAAI,CAAC,SACvD;AAAA,IAAC;AAAA;AAAA,MACC,IAAI,KAAK;AAAA,MACT,MAAM,IAAI,IAAI,KAAK,MAAgB,OAAO,SAAS,MAAM,EAAE;AAAA,MAE3D,KAAK,KAAK;AAAA;AAAA,IADL,GAAG,KAAK,QAAkB,KAAK;AAAA,EAEtC,CACD;AAED,MAAI,YAAY,OAAO;AACrB,wBACE,6CAAC,SAAI,IAAI,cAAc,QACpB;AAAA,aAAO,aAAa;AAAA;AAAA,QAEnB,6CAAC,cAAS,gBAAe,QACtB;AAAA;AAAA,UACA;AAAA,WACH;AAAA,UACE;AAAA,MACH,iBACG;AAAA,QACE,WAAW,iBAAiB,MAAM,EAAE,WAAW,MAAM,SACnD,4EACG;AAAA;AAAA,UACA;AAAA,WACH,IAEA;AAAA,QAEF;AAAA,MACF,IACA;AAAA,OACN;AAEF,oBAAgB;AAAA,EAClB;AAEA,SACE,4EACE;AAAA,gDAAC,YAAO,yBAAqB,MAAC,MAAK,oBAChC,eAAK,UAAU;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC,GACH;AAAA,IACC;AAAA,IACA;AAAA,IACA,WACC;AAAA,MAAC;AAAA;AAAA,QACC,IAAI,GAAG,UAAU,MAAM,QAAQ,OAAO,GAAG,IAAI;AAAA,QAC7C,MAAK;AAAA,QAEJ,eAAK,UAAU,QAAQ;AAAA;AAAA,IAC1B,IACE;AAAA,IACH,YAAY,QAAQ,4CAAC,cAAS,IAAI,GAAG,YAAY,IAAK;AAAA,KACzD;AAEJ;","names":[]}
@@ -1,14 +1,36 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
- import { R as RemoteComponentProps } from '../../types-d04035e6.js';
3
- import 'react';
4
- import '../../types-280a3640.js';
2
+ import * as react from 'react';
3
+ import { R as RemoteComponentMetadata } from '../../types-280a3640.js';
4
+
5
+ interface RemoteComponentProps {
6
+ url: string;
7
+ name: string;
8
+ bundle: string;
9
+ route?: string;
10
+ runtime?: RemoteComponentMetadata['runtime'];
11
+ data: string[];
12
+ nextData?: {
13
+ props: {
14
+ pageProps: Record<string, unknown>;
15
+ };
16
+ buildId?: string;
17
+ };
18
+ scripts?: {
19
+ src: string;
20
+ }[];
21
+ links?: Record<string, string | boolean | undefined>[];
22
+ remoteShared?: Record<string, string>;
23
+ isolate?: boolean;
24
+ children: react.ReactNode;
25
+ }
5
26
 
6
27
  declare module 'react/jsx-runtime' {
7
28
  namespace JSX {
8
29
  interface IntrinsicElements {
9
30
  template: {
10
31
  shadowrootmode?: 'open' | 'closed';
11
- children: React.ReactNode;
32
+ id?: string;
33
+ children?: React.ReactNode;
12
34
  };
13
35
  }
14
36
  }
@@ -148,7 +148,8 @@ function RemoteComponentClient({
148
148
  type: "application/json",
149
149
  children: JSON.stringify(nextData)
150
150
  }
151
- ) : null
151
+ ) : null,
152
+ isolate === false ? /* @__PURE__ */ jsx("template", { id: `${name}_end` }) : null
152
153
  ] });
153
154
  }
154
155
  export {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../src/next/host/app-router-client.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState, useLayoutEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport {\n loadRemoteComponent,\n DEFAULT_ROUTE,\n RUNTIME_WEBPACK,\n} from '../../shared/client/remote-component';\nimport type { RemoteComponentProps } from '../../shared/client/remote-component';\n\n// patch react/jsx-runtime to support the shadowrootmode attribute on template elements\ndeclare module 'react/jsx-runtime' {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace JSX {\n interface IntrinsicElements {\n template: {\n shadowrootmode?: 'open' | 'closed';\n children: React.ReactNode;\n };\n }\n }\n}\n\n// import { shared } from '@remote-components/shared/host';\nasync function tryImportShared() {\n try {\n const { shared } = await import('@remote-components/shared/host');\n return shared;\n } catch {\n return {};\n }\n}\n\n/**\n * RemoteComponentClient - Main component for rendering remote components\n *\n * This component handles the loading and rendering of remote microfrontends.\n * It supports both RSC (React Server Components) and Next.js Pages Router based components.\n */\nexport function RemoteComponentClient({\n url,\n name,\n bundle,\n route = DEFAULT_ROUTE,\n runtime = RUNTIME_WEBPACK,\n data,\n nextData,\n scripts = [],\n links = [],\n remoteShared = {},\n isolate,\n children,\n}: RemoteComponentProps) {\n const [component, setComponent] = useState<React.ReactNode | Error>(null);\n\n // Handle errors by re-throwing them\n if (component instanceof Error) {\n throw component;\n }\n\n // determine whether to use children or loaded component\n const shouldUseChildren =\n (!component ||\n (component &&\n !nextData &&\n typeof (component as unknown as Promise<unknown>).then !==\n 'function')) &&\n // if the remote Next.js Pages Router application is in development mode\n // we don't use the provided static HTML\n // to mitigate layout shift when loading CSS using JavaScript on the client\n nextData?.buildId !== 'development';\n\n const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(null);\n\n useLayoutEffect(() => {\n if (isolate !== false && typeof document !== 'undefined' && !shadowRoot) {\n let shadowRootElement: ShadowRoot | null = null;\n const element = document.getElementById(`shadowroot_${name}`);\n shadowRootElement = element?.shadowRoot ?? null;\n\n if (!shadowRootElement && element) {\n // create a shadow root if it doesn't exist\n // this is a fallback for browsers that don't support declarative shadow DOM\n element.attachShadow({ mode: 'open' });\n shadowRootElement = element.shadowRoot;\n }\n\n if (shadowRootElement) {\n // remove all nodes from the shadow root except links\n shadowRootElement.querySelectorAll('*:not(link)').forEach((node) => {\n node.remove();\n });\n setShadowRoot(shadowRootElement);\n }\n }\n }, [name, isolate, shadowRoot, links, url]);\n\n useEffect(() => {\n let mounted = true;\n\n // if we have a component, we don't need to load it again\n if (!component && (isolate === false || shadowRoot)) {\n loadRemoteComponent({\n url: new URL(url, location.origin),\n name,\n bundle,\n route,\n runtime,\n data,\n nextData,\n scripts,\n shared: tryImportShared(),\n remoteShared,\n container: shadowRoot,\n })\n .then((result) => {\n if (mounted) {\n if (result.error) {\n setComponent(result.error);\n } else {\n setComponent(result.component);\n }\n }\n })\n .catch((error: Error) => {\n if (mounted) {\n setComponent(error);\n }\n });\n }\n\n return () => {\n mounted = false;\n };\n }, [\n url,\n component,\n name,\n bundle,\n route,\n runtime,\n scripts,\n data,\n nextData,\n remoteShared,\n children,\n links,\n isolate,\n shadowRoot,\n ]);\n\n let componentToRender = (\n <>{shouldUseChildren ? children : (component as React.ReactNode)}</>\n );\n let linksToRender: React.ReactNode[] | null = links.map((link) => (\n <link\n as={link.as as string}\n href={new URL(link.href as string, url || location.origin).href}\n key={`${link.href as string}_${link.rel}`}\n rel={link.rel as string}\n />\n ));\n\n if (isolate !== false) {\n componentToRender = (\n <div id={`shadowroot_${name}`}>\n {typeof document === 'undefined' ? (\n // eslint-disable-next-line react/no-unknown-property\n <template shadowrootmode=\"open\">\n {linksToRender}\n {componentToRender}\n </template>\n ) : null}\n {shadowRoot\n ? createPortal(\n shadowRoot.querySelectorAll('link').length !== links.length ? (\n <>\n {linksToRender}\n {componentToRender}\n </>\n ) : (\n componentToRender\n ),\n shadowRoot,\n )\n : null}\n </div>\n );\n linksToRender = null;\n }\n\n return (\n <>\n <script data-remote-component type=\"application/json\">\n {JSON.stringify({\n name,\n bundle,\n route,\n runtime,\n })}\n </script>\n {linksToRender}\n {componentToRender}\n {nextData ? (\n <script\n id={`${bundle}_${route.replace(/\\//g, '_')}${name}_next_data`}\n type=\"application/json\"\n >\n {JSON.stringify(nextData)}\n </script>\n ) : null}\n </>\n );\n}\n"],"mappings":"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","names":[]}
1
+ {"version":3,"sources":["../../../src/next/host/app-router-client.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState, useLayoutEffect } from 'react';\nimport { createPortal } from 'react-dom';\nimport {\n loadRemoteComponent,\n DEFAULT_ROUTE,\n RUNTIME_WEBPACK,\n} from '../../shared/client/remote-component';\nimport type { RemoteComponentProps } from '../../shared/client/remote-component';\n\n// patch react/jsx-runtime to support the shadowrootmode attribute on template elements\ndeclare module 'react/jsx-runtime' {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace JSX {\n interface IntrinsicElements {\n template: {\n shadowrootmode?: 'open' | 'closed';\n id?: string;\n children?: React.ReactNode;\n };\n }\n }\n}\n\n// import { shared } from '@remote-components/shared/host';\nasync function tryImportShared() {\n try {\n const { shared } = await import('@remote-components/shared/host');\n return shared;\n } catch {\n return {};\n }\n}\n\n/**\n * RemoteComponentClient - Main component for rendering remote components\n *\n * This component handles the loading and rendering of remote microfrontends.\n * It supports both RSC (React Server Components) and Next.js Pages Router based components.\n */\nexport function RemoteComponentClient({\n url,\n name,\n bundle,\n route = DEFAULT_ROUTE,\n runtime = RUNTIME_WEBPACK,\n data,\n nextData,\n scripts = [],\n links = [],\n remoteShared = {},\n isolate,\n children,\n}: RemoteComponentProps) {\n const [component, setComponent] = useState<React.ReactNode | Error>(null);\n\n // Handle errors by re-throwing them\n if (component instanceof Error) {\n throw component;\n }\n\n // determine whether to use children or loaded component\n const shouldUseChildren =\n (!component ||\n (component &&\n !nextData &&\n typeof (component as unknown as Promise<unknown>).then !==\n 'function')) &&\n // if the remote Next.js Pages Router application is in development mode\n // we don't use the provided static HTML\n // to mitigate layout shift when loading CSS using JavaScript on the client\n nextData?.buildId !== 'development';\n\n const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(null);\n\n useLayoutEffect(() => {\n if (isolate !== false && typeof document !== 'undefined' && !shadowRoot) {\n let shadowRootElement: ShadowRoot | null = null;\n const element = document.getElementById(`shadowroot_${name}`);\n shadowRootElement = element?.shadowRoot ?? null;\n\n if (!shadowRootElement && element) {\n // create a shadow root if it doesn't exist\n // this is a fallback for browsers that don't support declarative shadow DOM\n element.attachShadow({ mode: 'open' });\n shadowRootElement = element.shadowRoot;\n }\n\n if (shadowRootElement) {\n // remove all nodes from the shadow root except links\n shadowRootElement.querySelectorAll('*:not(link)').forEach((node) => {\n node.remove();\n });\n setShadowRoot(shadowRootElement);\n }\n }\n }, [name, isolate, shadowRoot, links, url]);\n\n useEffect(() => {\n let mounted = true;\n\n // if we have a component, we don't need to load it again\n if (!component && (isolate === false || shadowRoot)) {\n loadRemoteComponent({\n url: new URL(url, location.origin),\n name,\n bundle,\n route,\n runtime,\n data,\n nextData,\n scripts,\n shared: tryImportShared(),\n remoteShared,\n container: shadowRoot,\n })\n .then((result) => {\n if (mounted) {\n if (result.error) {\n setComponent(result.error);\n } else {\n setComponent(result.component);\n }\n }\n })\n .catch((error: Error) => {\n if (mounted) {\n setComponent(error);\n }\n });\n }\n\n return () => {\n mounted = false;\n };\n }, [\n url,\n component,\n name,\n bundle,\n route,\n runtime,\n scripts,\n data,\n nextData,\n remoteShared,\n children,\n links,\n isolate,\n shadowRoot,\n ]);\n\n let componentToRender = (\n <>{shouldUseChildren ? children : (component as React.ReactNode)}</>\n );\n let linksToRender: React.ReactNode[] | null = links.map((link) => (\n <link\n as={link.as as string}\n href={new URL(link.href as string, url || location.origin).href}\n key={`${link.href as string}_${link.rel}`}\n rel={link.rel as string}\n />\n ));\n\n if (isolate !== false) {\n componentToRender = (\n <div id={`shadowroot_${name}`}>\n {typeof document === 'undefined' ? (\n // eslint-disable-next-line react/no-unknown-property\n <template shadowrootmode=\"open\">\n {linksToRender}\n {componentToRender}\n </template>\n ) : null}\n {shadowRoot\n ? createPortal(\n shadowRoot.querySelectorAll('link').length !== links.length ? (\n <>\n {linksToRender}\n {componentToRender}\n </>\n ) : (\n componentToRender\n ),\n shadowRoot,\n )\n : null}\n </div>\n );\n linksToRender = null;\n }\n\n return (\n <>\n <script data-remote-component type=\"application/json\">\n {JSON.stringify({\n name,\n bundle,\n route,\n runtime,\n })}\n </script>\n {linksToRender}\n {componentToRender}\n {nextData ? (\n <script\n id={`${bundle}_${route.replace(/\\//g, '_')}${name}_next_data`}\n type=\"application/json\"\n >\n {JSON.stringify(nextData)}\n </script>\n ) : null}\n {isolate === false ? <template id={`${name}_end`} /> : null}\n </>\n );\n}\n"],"mappings":"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","names":[]}
@@ -1,7 +1,60 @@
1
- import { R as RemoteComponentProps, L as LoaderResult } from '../../types-d04035e6.js';
2
- export { G as GlobalScope } from '../../types-d04035e6.js';
3
- import 'react';
4
- import '../../types-280a3640.js';
1
+ import * as React from 'react';
2
+
3
+ interface RemoteComponentMetadata {
4
+ bundle: string;
5
+ route: string;
6
+ runtime: 'webpack' | 'turbopack';
7
+ id: string;
8
+ }
9
+
10
+ interface RemoteComponentProps {
11
+ url: string;
12
+ name: string;
13
+ bundle: string;
14
+ route?: string;
15
+ runtime?: RemoteComponentMetadata['runtime'];
16
+ data: string[];
17
+ nextData?: {
18
+ props: {
19
+ pageProps: Record<string, unknown>;
20
+ };
21
+ buildId?: string;
22
+ };
23
+ scripts?: {
24
+ src: string;
25
+ }[];
26
+ links?: Record<string, string | boolean | undefined>[];
27
+ remoteShared?: Record<string, string>;
28
+ isolate?: boolean;
29
+ children: React.ReactNode;
30
+ }
31
+ interface GlobalScope {
32
+ __DISABLE_WEBPACK_EXEC__?: boolean;
33
+ __webpack_chunk_load__?: (chunkId: string, scriptBundle?: string) => Promise<unknown> | undefined;
34
+ __original_webpack_chunk_load__?: (chunkId: string, scriptBundle?: string) => Promise<unknown> | undefined;
35
+ __webpack_require__?: (id: string) => unknown;
36
+ __original_webpack_require__?: (id: string) => unknown;
37
+ __remote_webpack_require__?: Record<string, ((remoteId: string | number) => unknown) & {
38
+ c?: Record<string | number, {
39
+ id: string;
40
+ parents: string[];
41
+ children: string[];
42
+ }>;
43
+ m?: Record<string | number, (module: {
44
+ exports: unknown;
45
+ }) => void>;
46
+ type?: 'turbopack' | 'webpack';
47
+ }>;
48
+ __webpack_require_type__?: RemoteComponentMetadata['runtime'];
49
+ __remote_bundle_url__?: Record<string, string | URL>;
50
+ __remote_components_turbopack_chunk_loader_promise__?: Record<string, Promise<unknown>>;
51
+ __remote_components_turbopack_modules__?: Record<string, Record<string, unknown>>;
52
+ [key: string]: unknown;
53
+ }
54
+ interface LoaderResult {
55
+ component: React.ReactNode;
56
+ error?: Error;
57
+ }
5
58
 
6
59
  /**
7
60
  * Main loader function that orchestrates the component loading process
@@ -43,4 +96,4 @@ declare function fixPayload(payload: unknown): void;
43
96
  */
44
97
  declare function createRSCStream(name: string, data: string[]): ReadableStream<Uint8Array>;
45
98
 
46
- export { DEFAULT_ROUTE, LoaderResult, REMOTE_COMPONENT_REGEX, RUNTIME_TURBOPACK, RUNTIME_WEBPACK, RemoteComponentProps, Runtime, createRSCStream, fixPayload, getBundleKey, loadRemoteComponent, loadScripts, setupWebpackRuntime };
99
+ export { DEFAULT_ROUTE, GlobalScope, LoaderResult, REMOTE_COMPONENT_REGEX, RUNTIME_TURBOPACK, RUNTIME_WEBPACK, RemoteComponentProps, Runtime, createRSCStream, fixPayload, getBundleKey, loadRemoteComponent, loadScripts, setupWebpackRuntime };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "remote-components",
3
- "version": "0.0.11",
3
+ "version": "0.0.12",
4
4
  "private": false,
5
5
  "description": "Compose remote components at runtime between microfrontends applications.",
6
6
  "keywords": [
@@ -1,53 +0,0 @@
1
- import * as react from 'react';
2
- import { R as RemoteComponentMetadata } from './types-280a3640.js';
3
-
4
- interface RemoteComponentProps {
5
- url: string;
6
- name: string;
7
- bundle: string;
8
- route?: string;
9
- runtime?: RemoteComponentMetadata['runtime'];
10
- data: string[];
11
- nextData?: {
12
- props: {
13
- pageProps: Record<string, unknown>;
14
- };
15
- buildId?: string;
16
- };
17
- scripts?: {
18
- src: string;
19
- }[];
20
- links?: Record<string, string | boolean | undefined>[];
21
- remoteShared?: Record<string, string>;
22
- isolate?: boolean;
23
- children: react.ReactNode;
24
- }
25
- interface GlobalScope {
26
- __DISABLE_WEBPACK_EXEC__?: boolean;
27
- __webpack_chunk_load__?: (chunkId: string, scriptBundle?: string) => Promise<unknown> | undefined;
28
- __original_webpack_chunk_load__?: (chunkId: string, scriptBundle?: string) => Promise<unknown> | undefined;
29
- __webpack_require__?: (id: string) => unknown;
30
- __original_webpack_require__?: (id: string) => unknown;
31
- __remote_webpack_require__?: Record<string, ((remoteId: string | number) => unknown) & {
32
- c?: Record<string | number, {
33
- id: string;
34
- parents: string[];
35
- children: string[];
36
- }>;
37
- m?: Record<string | number, (module: {
38
- exports: unknown;
39
- }) => void>;
40
- type?: 'turbopack' | 'webpack';
41
- }>;
42
- __webpack_require_type__?: RemoteComponentMetadata['runtime'];
43
- __remote_bundle_url__?: Record<string, string | URL>;
44
- __remote_components_turbopack_chunk_loader_promise__?: Record<string, Promise<unknown>>;
45
- __remote_components_turbopack_modules__?: Record<string, Record<string, unknown>>;
46
- [key: string]: unknown;
47
- }
48
- interface LoaderResult {
49
- component: react.ReactNode;
50
- error?: Error;
51
- }
52
-
53
- export { GlobalScope as G, LoaderResult as L, RemoteComponentProps as R };