remote-components 0.0.40 → 0.0.41

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.
@@ -132,7 +132,7 @@ function RemoteComponent({
132
132
  });
133
133
  childrenRef.current = [];
134
134
  }
135
- if (isolate !== false && typeof document !== "undefined" && !shadowRoot) {
135
+ if (isolate !== false && typeof document !== "undefined" && (!shadowRoot || !shadowRoot.isConnected)) {
136
136
  const self = globalThis;
137
137
  const shadowRootKey = `__remote_components_shadowroot_${keySuffix}`;
138
138
  let shadowRootElement = null;
@@ -162,7 +162,7 @@ function RemoteComponent({
162
162
  );
163
163
  if (resetStyles.length > 1) {
164
164
  resetStyles.forEach((style, index) => {
165
- if (index > 0) {
165
+ if (index > 0 && style.getAttribute("data-remote-components-reset") !== "react") {
166
166
  style.remove();
167
167
  }
168
168
  });
@@ -520,7 +520,7 @@ function RemoteComponent({
520
520
  route: data?.route || import_remote_component.DEFAULT_ROUTE,
521
521
  runtime: prevIsRemoteComponentRef.current ? import_remote_component.RUNTIME_SCRIPT : data?.runtime || import_remote_component.RUNTIME_WEBPACK
522
522
  }) });
523
- const resetStyle = reset ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { "data-remote-components-reset": "", children: `:host { all: initial; }` }) : null;
523
+ const resetStyle = reset ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("style", { "data-remote-components-reset": "react", children: `:host { all: initial; }` }) : null;
524
524
  const linksToRender = data?.links?.map((link) => /* @__PURE__ */ (0, import_react.createElement)(
525
525
  "link",
526
526
  {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/react/index.tsx"],"sourcesContent":["import {\n startTransition,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { applyOriginToNodes } from '#internal/shared/client/apply-origin';\nimport { sharedPolyfills } from '#internal/shared/client/polyfill';\nimport {\n DEFAULT_ROUTE,\n type LoadRemoteComponentProps,\n loadRemoteComponent,\n loadStaticRemoteComponent,\n REMOTE_COMPONENT_REGEX,\n RemoteComponentsError,\n RUNTIME_SCRIPT,\n RUNTIME_WEBPACK,\n setAttributesFromProps,\n} from '#internal/shared/client/remote-component';\nimport {\n failedToFetchRemoteComponentError,\n multipleRemoteComponentsError,\n} from '#internal/shared/error';\nimport { remoteFetchHeaders } from '#internal/shared/ssr/fetch-headers';\nimport { getClientOrServerUrl } from '#internal/shared/ssr/get-client-or-server-url';\nimport { attrToProp, escapeString } from '#internal/shared/utils';\nimport type {\n MountOrUnmountFunction,\n RemoteComponentMountUnmount,\n RemoteComponentProps as RemoteComponentPropsType,\n} from '#remote-components/shared/client/types';\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 ref?: React.Ref<HTMLTemplateElement>;\n dangerouslySetInnerHTML?: {\n __html: string;\n };\n children?: React.ReactNode;\n };\n }\n }\n}\n\nexport interface RemoteComponentProps {\n /** The source URL of the remote component. */\n src?: string | URL;\n /** Whether to isolate the remote component using a Shadow DOM wrapper. */\n isolate?: boolean;\n /** The shadow DOM mode to use when isolating the remote component. */\n mode?: 'open' | 'closed';\n /** Whether to include a CSS reset style in the shadow DOM. Defaults to `false`. */\n reset?: boolean;\n /** The credentials to use for the fetch request. Defaults to `same-origin`. */\n credentials?: RequestCredentials;\n name?: string;\n /** Shared modules to include in the remote component's context. */\n shared?: LoadRemoteComponentProps['shared'];\n /** Additional headers to use when fetching the remote component. */\n additionalHeaders?: Headers | Record<string, string>;\n /** The children to use as a loading fallback until the remote component is loaded. */\n children?: React.ReactNode;\n /** Called right before a new remote component load starts. */\n onBeforeLoad?: (src: string | URL) => void;\n /** Called when the remote component has been successfully loaded and mounted. */\n onLoad?: (src: string | URL) => void;\n /** Called when an error occurs while loading or mounting the remote component. */\n onError?: (error: unknown) => void;\n /** Called when a different remote component is loaded into the same wrapper. */\n onChange?: (info: {\n previousSrc: string | URL | null;\n nextSrc: string | URL | null;\n previousName: string | undefined;\n nextName: string | undefined;\n }) => void;\n}\n\nfunction getRemoteComponentHtml(html: string) {\n if (typeof document === 'undefined') return html;\n\n // parse the HTML string to extract the relevant parts\n const parser = new DOMParser();\n const temp = parser.parseFromString(html, 'text/html');\n\n // used by the Next.js Pages Router remote as a wrapper\n const ssrRemoteComponentContainer = temp.querySelector(\n 'div[id^=\"__REMOTE_COMPONENT\"]',\n );\n if (ssrRemoteComponentContainer) {\n return ssrRemoteComponentContainer.innerHTML;\n }\n\n // remote component content\n const remoteComponentContainer = temp.querySelectorAll(\n `div[data-bundle][data-route][data-runtime][id^=\"__vercel_remote_component\"],div[data-bundle][data-route],div#__next,remote-component:not([src])`,\n );\n if (remoteComponentContainer.length > 0) {\n return `${Array.from(temp.querySelectorAll('link,script'))\n .map((link) => link.outerHTML)\n .join('')}${Array.from(remoteComponentContainer)\n .map((container) => container.outerHTML)\n .join('')}`;\n }\n\n return '';\n}\n\nconst DUMMY_FALLBACK = 'http://remote-components-dummy-fallback';\n\n/**\n * RemoteComponent is a React component that fetches and renders a remote component.\n * It supports SSR and can isolate the remote component in a shadow DOM.\n *\n * @param props - The properties for the remote component.\n * @returns A React component that renders the remote component.\n *\n * @example\n *\n * Use the `<RemoteComponent>` in your React application to consume a remote component from a remote application:\n *\n * ```tsx\n * import { RemoteComponent } from 'remote-components/react';\n *\n * export default function App() {\n * return (\n * <>\n * <h1>Welcome to My App</h1>\n * <p>This page consumes a remote component from another application.</p>\n * <RemoteComponent src=\"/nextjs-app-remote/components/header\" />\n * </>\n * );\n * }\n * ```\n *\n * To share modules, you can provide a shared module map with references to the shared modules:\n *\n * ```tsx\n * <RemoteComponent\n * src=\"/nextjs-app-remote/components/header\"\n * shared={{\n * '@/components/provider': () => import('@/components/host-provider')\n * }}\n * />\n * ```\n */\nexport function RemoteComponent({\n src,\n isolate,\n mode = 'open',\n reset,\n credentials = 'same-origin',\n name: nameProp = '__vercel_remote_component',\n shared = {},\n additionalHeaders,\n children,\n onBeforeLoad,\n onLoad,\n onError,\n onChange,\n}: RemoteComponentProps) {\n const name = useMemo(() => {\n if (typeof src === 'string') {\n const url = new URL(\n src,\n typeof document !== 'undefined' ? location.href : DUMMY_FALLBACK,\n );\n if (url.hash) {\n return url.hash.slice(1);\n }\n } else if (typeof src === 'object' && 'hash' in src && src.hash) {\n return src.hash.slice(1) || nameProp;\n }\n return nameProp;\n }, [src, nameProp]);\n\n const [data, setData] = useState<Omit<\n RemoteComponentPropsType,\n 'children'\n > | null>(null);\n\n const url = useMemo(() => getClientOrServerUrl(src, DUMMY_FALLBACK), [src]);\n\n // for relative src paths, use just the pathname as the unique id.\n // for static urls, use the full url as the unique id as the path may not be unique.\n // this id needs to be the same for server and client side rendering.\n // note that if this needs to be more unique, can pass through the bundle as an id prop and ammend it to this id.\n const id =\n url.origin ===\n (typeof location !== 'undefined' ? location.origin : DUMMY_FALLBACK)\n ? url.pathname\n : url.href;\n\n const keySuffix = `${escapeString(id)}_${escapeString(data?.name ?? name)}`;\n\n const [remoteComponent, setRemoteComponent] = useState<\n React.ReactNode | Error\n >(null);\n const shadowRootContainerRef = useRef<HTMLDivElement | null>(null);\n const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(() => {\n const self = globalThis as Record<\n `__remote_components_shadowroot_${string}`,\n ShadowRoot | null\n >;\n const shadowRootKey =\n `__remote_components_shadowroot_${keySuffix}` as const;\n const ssrShadowRoot =\n typeof document !== 'undefined'\n ? (document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n )?.shadowRoot ??\n self[shadowRootKey] ??\n null)\n : null;\n self[shadowRootKey] = null;\n return ssrShadowRoot;\n });\n const htmlRef = useRef<string | null>(\n typeof document !== 'undefined'\n ? (document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n )?.shadowRoot?.innerHTML ??\n document.getElementById(`__REMOTE_COMPONENT${name}`)?.innerHTML ??\n document.querySelector(`div[data-bundle][data-route][id^=\"${name}\"]`)\n ?.innerHTML ??\n document.querySelector('div[data-bundle][data-route]')?.innerHTML)\n : null,\n );\n const endTemplateRef = useRef<HTMLTemplateElement | null>(null);\n // collect initial content that needs to be removed after remote component renders\n const childrenRef = useRef(\n typeof document !== 'undefined'\n ? (() => {\n let el = document.querySelector(`template[id=\"${name}_start\"]`);\n const elements = [];\n while (el && el.id !== `${name}_end`) {\n if (\n el.id !== `${name}_start` &&\n !el.getAttribute('data-remote-component')\n ) {\n elements.push(el);\n }\n el = el.nextElementSibling as HTMLTemplateElement | null;\n }\n return elements;\n })()\n : [],\n );\n const prevSrcRef = useRef<string | URL | null>(null);\n const componentHydrationHtml = useRef<string | null>(null);\n const prevIsRemoteComponentRef = useRef<boolean>(false);\n const prevUrlRef = useRef<URL | null>(null);\n const prevRemoteComponentContainerRef = useRef<HTMLDivElement | null>(null);\n const unmountRef = useRef<Set<MountOrUnmountFunction> | null>(null);\n const prevNameRef = useRef<string | undefined>(undefined);\n\n useLayoutEffect(() => {\n // clear initial content\n if (childrenRef.current.length > 0 && remoteComponent) {\n childrenRef.current.forEach((el) => {\n el.remove();\n });\n childrenRef.current = [];\n }\n\n if (isolate !== false && typeof document !== 'undefined' && !shadowRoot) {\n const self = globalThis as Record<\n `__remote_components_shadowroot_${string}`,\n ShadowRoot | null\n >;\n const shadowRootKey =\n `__remote_components_shadowroot_${keySuffix}` as const;\n\n let shadowRootElement: ShadowRoot | null = null;\n const element = document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n );\n shadowRootElement = self[shadowRootKey] ?? 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 try {\n shadowRootElement = element.attachShadow({ mode });\n self[shadowRootKey] = shadowRootElement;\n } catch {\n // do nothing if attachShadow fails because of existing shadow root\n }\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 }, [isolate, shadowRoot, remoteComponent, mode, keySuffix]);\n\n useLayoutEffect(() => {\n if (shadowRoot && remoteComponent) {\n const resetStyles = shadowRoot.querySelectorAll(\n 'style[data-remote-components-reset]',\n );\n // ensure we only have one reset style in the shadow root\n if (resetStyles.length > 1) {\n resetStyles.forEach((style, index) => {\n if (index > 0) {\n style.remove();\n }\n });\n }\n\n // clear the html ref after hydration\n htmlRef.current = null;\n\n // clear all nodes except links and styles until the start marker\n // the marker gets only rendered on hydration\n let el: ChildNode | null = shadowRoot.childNodes[0] ?? null;\n while (el && (!('id' in el) || el.id !== `${name}_start`)) {\n const nextEl = el.nextSibling;\n if (el.nodeName !== 'LINK' && el.nodeName !== 'STYLE') {\n el.parentNode?.removeChild(el);\n }\n el = nextEl;\n }\n }\n }, [shadowRoot, remoteComponent, name]);\n\n useEffect(() => {\n if (src && src !== prevSrcRef.current) {\n const previousSrc = prevSrcRef.current;\n const previousName = prevNameRef.current;\n prevSrcRef.current = src;\n\n onBeforeLoad?.(src);\n\n startTransition(async () => {\n try {\n let html = getRemoteComponentHtml(\n htmlRef.current ??\n (endTemplateRef.current?.previousElementSibling?.tagName === 'div'\n ? endTemplateRef.current.previousElementSibling.innerHTML\n : ''),\n );\n\n if (!html && src) {\n // fetch the remote component\n const fetchInit = {\n method: 'GET',\n headers: remoteFetchHeaders(additionalHeaders),\n credentials,\n } as RequestInit;\n\n const res = await fetch(url, fetchInit);\n\n if (!res.ok) {\n let error: Error = failedToFetchRemoteComponentError(url.href, {\n cause: new Error(`${res.status} ${res.statusText}`),\n });\n try {\n const body = await res.text();\n const parser = new DOMParser();\n const doc = parser.parseFromString(body, 'text/html');\n const errorTemplate = doc.querySelector(\n 'template[data-next-error-message]',\n );\n const errorMessage = errorTemplate?.getAttribute(\n 'data-next-error-message',\n );\n const errorStack = errorTemplate?.getAttribute(\n 'data-next-error-stack',\n );\n\n if (errorMessage) {\n error = new RemoteComponentsError(errorMessage);\n if (errorStack) {\n error.stack = errorStack;\n }\n }\n } catch {\n // ignore\n }\n\n throw error;\n }\n\n // get the full HTML content as a string\n const remoteHtml = await res.text();\n htmlRef.current = remoteHtml;\n html = getRemoteComponentHtml(remoteHtml);\n }\n\n // create a virtual element which will be used to parse the HTML and extract the component and RSC flight data\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text/html');\n\n if (\n (doc.querySelectorAll('div[data-bundle][data-route]').length > 1 &&\n !doc.querySelector(\n `div[data-bundle][data-route][id^=\"${name}\"]`,\n )) ||\n (doc.querySelectorAll('remote-component:not([src])').length > 1 &&\n !doc.querySelector(`remote-component[name=\"${name}\"]`))\n ) {\n throw multipleRemoteComponentsError(url.href);\n }\n\n // reference to the remote component content\n const component =\n doc.querySelector(`div[data-bundle][data-route][id^=\"${name}\"]`) ??\n // fallback to the first element with the data-bundle and data-route attributes when not using a named remote component\n doc.querySelector('div[data-bundle][data-route]') ??\n // fallback to Next.js Pages Router\n doc.querySelector('div#__next') ??\n // fallback to the remote-component web component\n doc.querySelector(`remote-component[name=\"${name}\"]:not([src])`) ??\n doc.querySelector('remote-component:not([src])');\n const nextData = JSON.parse(\n (\n doc.querySelector('#__NEXT_DATA__') ??\n doc.querySelector('#__REMOTE_NEXT_DATA__')\n )?.textContent ?? 'null',\n ) as {\n props: {\n pageProps: Record<string, unknown>;\n __REMOTE_COMPONENT__?: {\n bundle: string;\n runtime: 'turbopack' | 'webpack' | 'script';\n shared?: Record<string, string>;\n };\n };\n page: string;\n buildId: string;\n } | null;\n\n const remoteName =\n component?.getAttribute('id')?.replace(/_ssr$/, '') ||\n (nextData ? '__next' : name);\n // reference to the RSC flight data\n const rsc = doc.querySelector(`#${remoteName}_rsc`);\n\n // reference to the bundle containing the client components\n const bundle =\n component?.getAttribute('data-bundle') ||\n nextData?.props.__REMOTE_COMPONENT__?.bundle ||\n 'default';\n\n const isRemoteComponent =\n component?.tagName.toLowerCase() === 'remote-component';\n\n const metadata = {\n name: remoteName,\n bundle,\n route:\n component?.getAttribute('data-route') ??\n nextData?.page ??\n (url.pathname || DEFAULT_ROUTE),\n runtime: (component?.getAttribute('data-runtime') ??\n (nextData?.props.__REMOTE_COMPONENT__?.runtime ||\n RUNTIME_SCRIPT)) as RemoteComponentPropsType['runtime'],\n };\n\n const remoteSharedEl = doc.querySelector(\n `#${remoteName}_shared[data-remote-components-shared]`,\n );\n const remoteShared =\n nextData?.props.__REMOTE_COMPONENT__?.shared ??\n ((JSON.parse(remoteSharedEl?.textContent ?? '{}') ?? {}) as Record<\n string,\n string\n >);\n remoteSharedEl?.remove();\n\n if (!component || !(rsc || nextData || isRemoteComponent)) {\n throw new RemoteComponentsError(\n `Remote Component not found on ${url.href}.${\n remoteName !== '__vercel_remote_component'\n ? `The name for the <RemoteComponent> is \"${remoteName}\". Check <RemoteComponent> usage.`\n : ''\n } Did you forget to wrap the content in <RemoteComponent>?`,\n );\n }\n\n if (prevIsRemoteComponentRef.current) {\n if (shadowRoot) {\n shadowRoot.innerHTML = '';\n }\n const self = globalThis as typeof globalThis &\n RemoteComponentMountUnmount;\n const prevUrl = prevUrlRef.current;\n if (\n prevUrl &&\n self.__remote_script_entrypoint_unmount__?.[prevUrl.href]\n ) {\n const unmountPromises = Promise.all(\n Array.from(unmountRef.current ?? []).map(async (unmount) =>\n unmount(\n shadowRoot ?? prevRemoteComponentContainerRef.current,\n ),\n ),\n );\n unmountRef.current = null;\n await unmountPromises;\n }\n }\n prevIsRemoteComponentRef.current = isRemoteComponent;\n prevUrlRef.current = url;\n prevNameRef.current = remoteName;\n\n // update all relative URLs to absolute URLs based on the remote component URL\n applyOriginToNodes(doc, url);\n\n // reference to all link elements in the remote component\n const links = Array.from(\n doc.querySelectorAll<HTMLLinkElement>('link[href]'),\n )\n .filter((link) => {\n return !component.contains(link);\n })\n .map((link) => ({\n href: new URL(link.getAttribute('href') ?? link.href, url).href,\n ...link\n .getAttributeNames()\n .reduce<Record<string, string>>((acc, key) => {\n if (key !== 'href') {\n acc[attrToProp[key] ?? key] = link.getAttribute(key) ?? '';\n }\n return acc;\n }, {}),\n }));\n\n const scripts = (\n isRemoteComponent ? component : doc\n ).querySelectorAll<HTMLScriptElement>('script[src],script[data-src]');\n\n // handle inline scripts in the remote component\n const inlineScripts = (\n isRemoteComponent ? component : doc\n ).querySelectorAll(\n \"script:not([src]):not([data-src]):not([id*='_rsc']):not([id='__NEXT_DATA__']):not([id='__REMOTE_NEXT_DATA__'])\",\n );\n\n if (!isRemoteComponent) {\n // Next.js Script support\n const self = globalThis as typeof globalThis & {\n __next_s: [string, Record<string, string>][];\n };\n const prevNextScripts = self.__next_s;\n const nextScripts = [] as [string, Record<string, string>][];\n // eslint-disable-next-line camelcase\n self.__next_s = nextScripts;\n\n await Promise.all(\n Array.from(inlineScripts)\n .filter(\n (script) =>\n !(\n script.id.endsWith('_shared') &&\n script.getAttribute('type') === 'application/json' &&\n typeof script.getAttribute(\n 'data-remote-components-shared',\n ) === 'string'\n ),\n )\n .map((script) => {\n return new Promise((resolve) => {\n // only handle inline scripts with content, but not Next.js RSC scripts\n if (\n script.textContent &&\n !script.textContent.includes('self.__next_f=') &&\n !script.textContent.includes('self.__next_f.push')\n ) {\n // if script is inline javascript, then execute using blob\n if (\n !script.getAttribute('type') ||\n script.getAttribute('type') === 'text/javascript' ||\n script.getAttribute('type') === 'application/javascript'\n ) {\n const newScript = document.createElement('script');\n\n // scripts loaded from external sources needs this workaround\n const blob = new Blob([script.textContent], {\n type: 'application/javascript',\n });\n const blobUrl = URL.createObjectURL(blob);\n\n newScript.onload = () => {\n resolve(undefined);\n // script executed and safe to remove\n URL.revokeObjectURL(blobUrl);\n newScript.remove();\n };\n // on error we still want to resolve to not block the remote component loading\n newScript.onerror = () => {\n URL.revokeObjectURL(blobUrl);\n newScript.remove();\n resolve(undefined);\n };\n\n newScript.src = blobUrl;\n document.body.appendChild(newScript);\n } else {\n resolve(undefined);\n document.body.appendChild(script);\n }\n } else {\n resolve(undefined);\n }\n });\n }),\n );\n // process the remote component Next.js Script container\n nextScripts.forEach(([scriptSrc, props]) => {\n const script = document.createElement('script');\n // when we have a script src, apply it (inline scripts have `0` as src)\n if (scriptSrc) {\n script.src = scriptSrc;\n }\n // apply Script props\n if (typeof props.children === 'string') {\n script.textContent = props.children;\n }\n setAttributesFromProps(script, props);\n document.head.appendChild(script);\n });\n // restore previous Next.js Script container\n // eslint-disable-next-line camelcase\n self.__next_s = prevNextScripts;\n }\n\n let rscName;\n if (rsc) {\n rscName = `__remote_component_rsc_${escapeString(\n id,\n )}_${escapeString(remoteName)}`;\n rsc.textContent =\n rsc.textContent?.replace(\n new RegExp(`self\\\\[\"${remoteName}\"\\\\]`, 'g'),\n `self[\"${rscName}\"]`,\n ) ?? '';\n document.body.appendChild(rsc);\n }\n\n const newData = {\n ...metadata,\n links,\n remoteShared,\n src: typeof src === 'string' ? src : src.href,\n serverUrl: url.href,\n data: rsc\n ? (rsc.textContent || '').split('\\n').filter(Boolean)\n : [],\n };\n\n componentHydrationHtml.current = `${Array.from(\n doc.querySelectorAll('link,style'),\n )\n .map((link) => link.outerHTML)\n .join('')}${\n reset\n ? `<style data-remote-components-reset=\"\">:host { all: initial; }</style>`\n : ''\n }${component.innerHTML}`;\n\n const userShared = await shared;\n\n if ('__remote_components_missing_shared__' in userShared) {\n userShared.__remote_components_missing_shared__().catch((e) => {\n throw e;\n });\n } else if ('__remote_components_missing_shared__' in remoteShared) {\n throw new RemoteComponentsError(\n remoteShared.__remote_components_missing_shared__,\n );\n }\n\n if (isRemoteComponent) {\n // Only call onChange when not on first load (matching HTML implementation)\n if (previousSrc !== null) {\n onChange?.({\n previousSrc,\n nextSrc: src,\n previousName,\n nextName: remoteName,\n });\n }\n setData(newData);\n if (shadowRoot) {\n let shadowRootHtml = component.innerHTML;\n if (reset) {\n shadowRootHtml = `<style data-remote-components-reset=\"\">:host { all: initial; }</style>${shadowRootHtml}`;\n }\n shadowRoot.innerHTML = shadowRootHtml;\n setRemoteComponent(null);\n const { mount, unmount } = await loadStaticRemoteComponent(\n Array.from(shadowRoot.querySelectorAll('script')),\n url,\n );\n unmountRef.current = unmount;\n await Promise.all(\n Array.from(mount).map((mountFn) => mountFn(shadowRoot)),\n );\n onLoad?.(src);\n } else if (isolate === false) {\n setRemoteComponent(\n // TODO: remove wrapper div by converting HTML to RSC or React tree\n <div\n dangerouslySetInnerHTML={{ __html: component.innerHTML }}\n ref={prevRemoteComponentContainerRef}\n />,\n );\n const { mount, unmount } = await loadStaticRemoteComponent(\n Array.from(component.querySelectorAll('script')),\n url,\n );\n unmountRef.current = unmount;\n await Promise.all(\n Array.from(mount).map((mountFn) =>\n mountFn(prevRemoteComponentContainerRef.current),\n ),\n );\n onLoad?.(src);\n }\n } else {\n const result = await loadRemoteComponent({\n url,\n name: remoteName,\n rscName,\n bundle,\n route: metadata.route,\n runtime: metadata.runtime,\n data: newData.data,\n nextData,\n scripts: Array.from(scripts).map((script) => {\n const scriptSrc =\n script.getAttribute('data-src') ||\n script.getAttribute('src') ||\n script.src;\n const { prefix, id: path } = REMOTE_COMPONENT_REGEX.exec(\n scriptSrc,\n )?.groups ?? {\n prefix: undefined,\n id: scriptSrc,\n };\n return {\n src: new URL(\n `${prefix ?? ''}${path}`.replace(\n /(?<char>[^:])(?<double>\\/\\/)/g,\n '$1/',\n ),\n url,\n ).href,\n };\n }),\n shared: {\n ...sharedPolyfills(userShared),\n ...userShared,\n },\n remoteShared,\n container: shadowRoot,\n });\n if (rsc) {\n rsc.remove();\n }\n\n setData(newData);\n // Only call onChange when not on first load (matching HTML implementation)\n if (previousSrc !== null) {\n onChange?.({\n previousSrc,\n nextSrc: src,\n previousName,\n nextName: remoteName,\n });\n }\n if (result.error) {\n setRemoteComponent(result.error);\n onError?.(result.error);\n } else {\n setRemoteComponent(result.component);\n onLoad?.(src);\n }\n }\n } catch (error) {\n setRemoteComponent(error as Error);\n onError?.(error);\n }\n });\n }\n }, [\n url,\n src,\n isolate,\n credentials,\n name,\n shared,\n shadowRoot,\n additionalHeaders,\n reset,\n id,\n onBeforeLoad,\n onLoad,\n onError,\n onChange,\n ]);\n\n if (remoteComponent instanceof Error) {\n throw remoteComponent;\n }\n\n const metadataJson = (\n <script data-remote-component type=\"application/json\">\n {JSON.stringify({\n name: data?.name || name,\n bundle: data?.bundle || 'default',\n route: data?.route || DEFAULT_ROUTE,\n runtime: prevIsRemoteComponentRef.current\n ? RUNTIME_SCRIPT\n : data?.runtime || RUNTIME_WEBPACK,\n })}\n </script>\n );\n const resetStyle = reset ? (\n <style data-remote-components-reset=\"\">{`:host { all: initial; }`}</style>\n ) : null;\n const linksToRender: React.ReactNode[] | null =\n data?.links?.map((link) => (\n <link\n {...link}\n href={new URL(link.href as string, url).href}\n key={JSON.stringify(link)}\n />\n )) || null;\n const componentToRender = (\n <>\n {resetStyle}\n {linksToRender}\n {remoteComponent ?? children}\n </>\n );\n\n if (componentHydrationHtml.current && shadowRoot && !shadowRoot.innerHTML) {\n shadowRoot.innerHTML = componentHydrationHtml.current;\n componentHydrationHtml.current = null;\n\n if (prevIsRemoteComponentRef.current) {\n // ensure we load static resources when hydrating a remote component in shadow DOM\n loadStaticRemoteComponent(\n Array.from(shadowRoot.querySelectorAll('script')),\n url,\n )\n .then(({ mount }) => {\n return Promise.all(\n Array.from(mount).map((mountFn) => mountFn(shadowRoot)),\n );\n })\n .then(() => {\n if (src) {\n onLoad?.(src);\n }\n })\n .catch((e) => {\n const error = new RemoteComponentsError(\n `Error mounting remote component from \"${url.href}\"`,\n {\n cause: e,\n },\n );\n setRemoteComponent(error);\n onError?.(error);\n });\n }\n }\n\n if (isolate !== false) {\n const shadowRemoteComponentHtml =\n shadowRoot?.querySelector(`#__REMOTE_COMPONENT${name}`) ??\n shadowRoot?.querySelector('div[data-bundle][data-route]');\n if (shadowRemoteComponentHtml) {\n shadowRemoteComponentHtml.remove();\n }\n\n return (\n <>\n {metadataJson}\n <div\n data-remote-component-id={`shadowroot_${keySuffix}`}\n id={`shadowroot_${data?.name ?? name}`}\n ref={shadowRootContainerRef}\n >\n {typeof document === 'undefined' ? (\n // eslint-disable-next-line react/no-unknown-property\n <template shadowrootmode={mode}>\n {typeof document === 'undefined' ? (\n <div\n dangerouslySetInnerHTML={{\n __html: `<img\n alt=\"\" decoding=\"async\" style=\"display:none\"\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==\"\n onload=\"(function(el){\n const root = el.getRootNode();\n globalThis.__remote_components_shadowroot_${keySuffix} = root;\n el.parentElement.remove();\n })(this)\"\n />`,\n }}\n />\n ) : null}\n {resetStyle}\n {linksToRender}\n {children}\n </template>\n ) : null}\n {shadowRoot && remoteComponent\n ? createPortal(\n <>\n <template id={`${name}_start`} />\n {resetStyle}\n {linksToRender}\n {remoteComponent}\n <template id={`${name}_end`} ref={endTemplateRef} />\n </>,\n shadowRoot,\n )\n : null}\n </div>\n </>\n );\n }\n htmlRef.current = null;\n\n // render start/end markers for the remote component\n return (\n <>\n <template id={`${name}_start`} />\n {metadataJson}\n {componentToRender}\n <template id={`${name}_end`} ref={endTemplateRef} />\n </>\n );\n}\n"],"mappings":"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","names":["import_react","url","parser","doc"]}
1
+ {"version":3,"sources":["../../src/react/index.tsx"],"sourcesContent":["import {\n startTransition,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { applyOriginToNodes } from '#internal/shared/client/apply-origin';\nimport { sharedPolyfills } from '#internal/shared/client/polyfill';\nimport {\n DEFAULT_ROUTE,\n type LoadRemoteComponentProps,\n loadRemoteComponent,\n loadStaticRemoteComponent,\n REMOTE_COMPONENT_REGEX,\n RemoteComponentsError,\n RUNTIME_SCRIPT,\n RUNTIME_WEBPACK,\n setAttributesFromProps,\n} from '#internal/shared/client/remote-component';\nimport {\n failedToFetchRemoteComponentError,\n multipleRemoteComponentsError,\n} from '#internal/shared/error';\nimport { remoteFetchHeaders } from '#internal/shared/ssr/fetch-headers';\nimport { getClientOrServerUrl } from '#internal/shared/ssr/get-client-or-server-url';\nimport { attrToProp, escapeString } from '#internal/shared/utils';\nimport type {\n MountOrUnmountFunction,\n RemoteComponentMountUnmount,\n RemoteComponentProps as RemoteComponentPropsType,\n} from '#remote-components/shared/client/types';\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 ref?: React.Ref<HTMLTemplateElement>;\n dangerouslySetInnerHTML?: {\n __html: string;\n };\n children?: React.ReactNode;\n };\n }\n }\n}\n\nexport interface RemoteComponentProps {\n /** The source URL of the remote component. */\n src?: string | URL;\n /** Whether to isolate the remote component using a Shadow DOM wrapper. */\n isolate?: boolean;\n /** The shadow DOM mode to use when isolating the remote component. */\n mode?: 'open' | 'closed';\n /** Whether to include a CSS reset style in the shadow DOM. Defaults to `false`. */\n reset?: boolean;\n /** The credentials to use for the fetch request. Defaults to `same-origin`. */\n credentials?: RequestCredentials;\n name?: string;\n /** Shared modules to include in the remote component's context. */\n shared?: LoadRemoteComponentProps['shared'];\n /** Additional headers to use when fetching the remote component. */\n additionalHeaders?: Headers | Record<string, string>;\n /** The children to use as a loading fallback until the remote component is loaded. */\n children?: React.ReactNode;\n /** Called right before a new remote component load starts. */\n onBeforeLoad?: (src: string | URL) => void;\n /** Called when the remote component has been successfully loaded and mounted. */\n onLoad?: (src: string | URL) => void;\n /** Called when an error occurs while loading or mounting the remote component. */\n onError?: (error: unknown) => void;\n /** Called when a different remote component is loaded into the same wrapper. */\n onChange?: (info: {\n previousSrc: string | URL | null;\n nextSrc: string | URL | null;\n previousName: string | undefined;\n nextName: string | undefined;\n }) => void;\n}\n\nfunction getRemoteComponentHtml(html: string) {\n if (typeof document === 'undefined') return html;\n\n // parse the HTML string to extract the relevant parts\n const parser = new DOMParser();\n const temp = parser.parseFromString(html, 'text/html');\n\n // used by the Next.js Pages Router remote as a wrapper\n const ssrRemoteComponentContainer = temp.querySelector(\n 'div[id^=\"__REMOTE_COMPONENT\"]',\n );\n if (ssrRemoteComponentContainer) {\n return ssrRemoteComponentContainer.innerHTML;\n }\n\n // remote component content\n const remoteComponentContainer = temp.querySelectorAll(\n `div[data-bundle][data-route][data-runtime][id^=\"__vercel_remote_component\"],div[data-bundle][data-route],div#__next,remote-component:not([src])`,\n );\n if (remoteComponentContainer.length > 0) {\n return `${Array.from(temp.querySelectorAll('link,script'))\n .map((link) => link.outerHTML)\n .join('')}${Array.from(remoteComponentContainer)\n .map((container) => container.outerHTML)\n .join('')}`;\n }\n\n return '';\n}\n\nconst DUMMY_FALLBACK = 'http://remote-components-dummy-fallback';\n\n/**\n * RemoteComponent is a React component that fetches and renders a remote component.\n * It supports SSR and can isolate the remote component in a shadow DOM.\n *\n * @param props - The properties for the remote component.\n * @returns A React component that renders the remote component.\n *\n * @example\n *\n * Use the `<RemoteComponent>` in your React application to consume a remote component from a remote application:\n *\n * ```tsx\n * import { RemoteComponent } from 'remote-components/react';\n *\n * export default function App() {\n * return (\n * <>\n * <h1>Welcome to My App</h1>\n * <p>This page consumes a remote component from another application.</p>\n * <RemoteComponent src=\"/nextjs-app-remote/components/header\" />\n * </>\n * );\n * }\n * ```\n *\n * To share modules, you can provide a shared module map with references to the shared modules:\n *\n * ```tsx\n * <RemoteComponent\n * src=\"/nextjs-app-remote/components/header\"\n * shared={{\n * '@/components/provider': () => import('@/components/host-provider')\n * }}\n * />\n * ```\n */\nexport function RemoteComponent({\n src,\n isolate,\n mode = 'open',\n reset,\n credentials = 'same-origin',\n name: nameProp = '__vercel_remote_component',\n shared = {},\n additionalHeaders,\n children,\n onBeforeLoad,\n onLoad,\n onError,\n onChange,\n}: RemoteComponentProps) {\n const name = useMemo(() => {\n if (typeof src === 'string') {\n const url = new URL(\n src,\n typeof document !== 'undefined' ? location.href : DUMMY_FALLBACK,\n );\n if (url.hash) {\n return url.hash.slice(1);\n }\n } else if (typeof src === 'object' && 'hash' in src && src.hash) {\n return src.hash.slice(1) || nameProp;\n }\n return nameProp;\n }, [src, nameProp]);\n\n const [data, setData] = useState<Omit<\n RemoteComponentPropsType,\n 'children'\n > | null>(null);\n\n const url = useMemo(() => getClientOrServerUrl(src, DUMMY_FALLBACK), [src]);\n\n // for relative src paths, use just the pathname as the unique id.\n // for static urls, use the full url as the unique id as the path may not be unique.\n // this id needs to be the same for server and client side rendering.\n // note that if this needs to be more unique, can pass through the bundle as an id prop and ammend it to this id.\n const id =\n url.origin ===\n (typeof location !== 'undefined' ? location.origin : DUMMY_FALLBACK)\n ? url.pathname\n : url.href;\n\n const keySuffix = `${escapeString(id)}_${escapeString(data?.name ?? name)}`;\n\n const [remoteComponent, setRemoteComponent] = useState<\n React.ReactNode | Error\n >(null);\n const shadowRootContainerRef = useRef<HTMLDivElement | null>(null);\n const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(() => {\n const self = globalThis as Record<\n `__remote_components_shadowroot_${string}`,\n ShadowRoot | null\n >;\n const shadowRootKey =\n `__remote_components_shadowroot_${keySuffix}` as const;\n const ssrShadowRoot =\n typeof document !== 'undefined'\n ? (document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n )?.shadowRoot ??\n self[shadowRootKey] ??\n null)\n : null;\n self[shadowRootKey] = null;\n return ssrShadowRoot;\n });\n const htmlRef = useRef<string | null>(\n typeof document !== 'undefined'\n ? (document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n )?.shadowRoot?.innerHTML ??\n document.getElementById(`__REMOTE_COMPONENT${name}`)?.innerHTML ??\n document.querySelector(`div[data-bundle][data-route][id^=\"${name}\"]`)\n ?.innerHTML ??\n document.querySelector('div[data-bundle][data-route]')?.innerHTML)\n : null,\n );\n const endTemplateRef = useRef<HTMLTemplateElement | null>(null);\n // collect initial content that needs to be removed after remote component renders\n const childrenRef = useRef(\n typeof document !== 'undefined'\n ? (() => {\n let el = document.querySelector(`template[id=\"${name}_start\"]`);\n const elements = [];\n while (el && el.id !== `${name}_end`) {\n if (\n el.id !== `${name}_start` &&\n !el.getAttribute('data-remote-component')\n ) {\n elements.push(el);\n }\n el = el.nextElementSibling as HTMLTemplateElement | null;\n }\n return elements;\n })()\n : [],\n );\n const prevSrcRef = useRef<string | URL | null>(null);\n const componentHydrationHtml = useRef<string | null>(null);\n const prevIsRemoteComponentRef = useRef<boolean>(false);\n const prevUrlRef = useRef<URL | null>(null);\n const prevRemoteComponentContainerRef = useRef<HTMLDivElement | null>(null);\n const unmountRef = useRef<Set<MountOrUnmountFunction> | null>(null);\n const prevNameRef = useRef<string | undefined>(undefined);\n\n useLayoutEffect(() => {\n // clear initial content\n if (childrenRef.current.length > 0 && remoteComponent) {\n childrenRef.current.forEach((el) => {\n el.remove();\n });\n childrenRef.current = [];\n }\n\n if (\n isolate !== false &&\n typeof document !== 'undefined' &&\n (!shadowRoot || !shadowRoot.isConnected)\n ) {\n const self = globalThis as Record<\n `__remote_components_shadowroot_${string}`,\n ShadowRoot | null\n >;\n const shadowRootKey =\n `__remote_components_shadowroot_${keySuffix}` as const;\n\n let shadowRootElement: ShadowRoot | null = null;\n const element = document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n );\n shadowRootElement = self[shadowRootKey] ?? 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 try {\n shadowRootElement = element.attachShadow({ mode });\n self[shadowRootKey] = shadowRootElement;\n } catch {\n // do nothing if attachShadow fails because of existing shadow root\n }\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 }, [isolate, shadowRoot, remoteComponent, mode, keySuffix]);\n\n useLayoutEffect(() => {\n if (shadowRoot && remoteComponent) {\n const resetStyles = shadowRoot.querySelectorAll(\n 'style[data-remote-components-reset]',\n );\n // ensure we only have one reset style in the shadow root\n if (resetStyles.length > 1) {\n resetStyles.forEach((style, index) => {\n if (\n index > 0 &&\n style.getAttribute('data-remote-components-reset') !== 'react'\n ) {\n style.remove();\n }\n });\n }\n\n // clear the html ref after hydration\n htmlRef.current = null;\n\n // clear all nodes except links and styles until the start marker\n // the marker gets only rendered on hydration\n let el: ChildNode | null = shadowRoot.childNodes[0] ?? null;\n while (el && (!('id' in el) || el.id !== `${name}_start`)) {\n const nextEl = el.nextSibling;\n if (el.nodeName !== 'LINK' && el.nodeName !== 'STYLE') {\n el.parentNode?.removeChild(el);\n }\n el = nextEl;\n }\n }\n }, [shadowRoot, remoteComponent, name]);\n\n useEffect(() => {\n if (src && src !== prevSrcRef.current) {\n const previousSrc = prevSrcRef.current;\n const previousName = prevNameRef.current;\n prevSrcRef.current = src;\n\n onBeforeLoad?.(src);\n\n startTransition(async () => {\n try {\n let html = getRemoteComponentHtml(\n htmlRef.current ??\n (endTemplateRef.current?.previousElementSibling?.tagName === 'div'\n ? endTemplateRef.current.previousElementSibling.innerHTML\n : ''),\n );\n\n if (!html && src) {\n // fetch the remote component\n const fetchInit = {\n method: 'GET',\n headers: remoteFetchHeaders(additionalHeaders),\n credentials,\n } as RequestInit;\n\n const res = await fetch(url, fetchInit);\n\n if (!res.ok) {\n let error: Error = failedToFetchRemoteComponentError(url.href, {\n cause: new Error(`${res.status} ${res.statusText}`),\n });\n try {\n const body = await res.text();\n const parser = new DOMParser();\n const doc = parser.parseFromString(body, 'text/html');\n const errorTemplate = doc.querySelector(\n 'template[data-next-error-message]',\n );\n const errorMessage = errorTemplate?.getAttribute(\n 'data-next-error-message',\n );\n const errorStack = errorTemplate?.getAttribute(\n 'data-next-error-stack',\n );\n\n if (errorMessage) {\n error = new RemoteComponentsError(errorMessage);\n if (errorStack) {\n error.stack = errorStack;\n }\n }\n } catch {\n // ignore\n }\n\n throw error;\n }\n\n // get the full HTML content as a string\n const remoteHtml = await res.text();\n htmlRef.current = remoteHtml;\n html = getRemoteComponentHtml(remoteHtml);\n }\n\n // create a virtual element which will be used to parse the HTML and extract the component and RSC flight data\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text/html');\n\n if (\n (doc.querySelectorAll('div[data-bundle][data-route]').length > 1 &&\n !doc.querySelector(\n `div[data-bundle][data-route][id^=\"${name}\"]`,\n )) ||\n (doc.querySelectorAll('remote-component:not([src])').length > 1 &&\n !doc.querySelector(`remote-component[name=\"${name}\"]`))\n ) {\n throw multipleRemoteComponentsError(url.href);\n }\n\n // reference to the remote component content\n const component =\n doc.querySelector(`div[data-bundle][data-route][id^=\"${name}\"]`) ??\n // fallback to the first element with the data-bundle and data-route attributes when not using a named remote component\n doc.querySelector('div[data-bundle][data-route]') ??\n // fallback to Next.js Pages Router\n doc.querySelector('div#__next') ??\n // fallback to the remote-component web component\n doc.querySelector(`remote-component[name=\"${name}\"]:not([src])`) ??\n doc.querySelector('remote-component:not([src])');\n const nextData = JSON.parse(\n (\n doc.querySelector('#__NEXT_DATA__') ??\n doc.querySelector('#__REMOTE_NEXT_DATA__')\n )?.textContent ?? 'null',\n ) as {\n props: {\n pageProps: Record<string, unknown>;\n __REMOTE_COMPONENT__?: {\n bundle: string;\n runtime: 'turbopack' | 'webpack' | 'script';\n shared?: Record<string, string>;\n };\n };\n page: string;\n buildId: string;\n } | null;\n\n const remoteName =\n component?.getAttribute('id')?.replace(/_ssr$/, '') ||\n (nextData ? '__next' : name);\n // reference to the RSC flight data\n const rsc = doc.querySelector(`#${remoteName}_rsc`);\n\n // reference to the bundle containing the client components\n const bundle =\n component?.getAttribute('data-bundle') ||\n nextData?.props.__REMOTE_COMPONENT__?.bundle ||\n 'default';\n\n const isRemoteComponent =\n component?.tagName.toLowerCase() === 'remote-component';\n\n const metadata = {\n name: remoteName,\n bundle,\n route:\n component?.getAttribute('data-route') ??\n nextData?.page ??\n (url.pathname || DEFAULT_ROUTE),\n runtime: (component?.getAttribute('data-runtime') ??\n (nextData?.props.__REMOTE_COMPONENT__?.runtime ||\n RUNTIME_SCRIPT)) as RemoteComponentPropsType['runtime'],\n };\n\n const remoteSharedEl = doc.querySelector(\n `#${remoteName}_shared[data-remote-components-shared]`,\n );\n const remoteShared =\n nextData?.props.__REMOTE_COMPONENT__?.shared ??\n ((JSON.parse(remoteSharedEl?.textContent ?? '{}') ?? {}) as Record<\n string,\n string\n >);\n remoteSharedEl?.remove();\n\n if (!component || !(rsc || nextData || isRemoteComponent)) {\n throw new RemoteComponentsError(\n `Remote Component not found on ${url.href}.${\n remoteName !== '__vercel_remote_component'\n ? `The name for the <RemoteComponent> is \"${remoteName}\". Check <RemoteComponent> usage.`\n : ''\n } Did you forget to wrap the content in <RemoteComponent>?`,\n );\n }\n\n if (prevIsRemoteComponentRef.current) {\n if (shadowRoot) {\n shadowRoot.innerHTML = '';\n }\n const self = globalThis as typeof globalThis &\n RemoteComponentMountUnmount;\n const prevUrl = prevUrlRef.current;\n if (\n prevUrl &&\n self.__remote_script_entrypoint_unmount__?.[prevUrl.href]\n ) {\n const unmountPromises = Promise.all(\n Array.from(unmountRef.current ?? []).map(async (unmount) =>\n unmount(\n shadowRoot ?? prevRemoteComponentContainerRef.current,\n ),\n ),\n );\n unmountRef.current = null;\n await unmountPromises;\n }\n }\n prevIsRemoteComponentRef.current = isRemoteComponent;\n prevUrlRef.current = url;\n prevNameRef.current = remoteName;\n\n // update all relative URLs to absolute URLs based on the remote component URL\n applyOriginToNodes(doc, url);\n\n // reference to all link elements in the remote component\n const links = Array.from(\n doc.querySelectorAll<HTMLLinkElement>('link[href]'),\n )\n .filter((link) => {\n return !component.contains(link);\n })\n .map((link) => ({\n href: new URL(link.getAttribute('href') ?? link.href, url).href,\n ...link\n .getAttributeNames()\n .reduce<Record<string, string>>((acc, key) => {\n if (key !== 'href') {\n acc[attrToProp[key] ?? key] = link.getAttribute(key) ?? '';\n }\n return acc;\n }, {}),\n }));\n\n const scripts = (\n isRemoteComponent ? component : doc\n ).querySelectorAll<HTMLScriptElement>('script[src],script[data-src]');\n\n // handle inline scripts in the remote component\n const inlineScripts = (\n isRemoteComponent ? component : doc\n ).querySelectorAll(\n \"script:not([src]):not([data-src]):not([id*='_rsc']):not([id='__NEXT_DATA__']):not([id='__REMOTE_NEXT_DATA__'])\",\n );\n\n if (!isRemoteComponent) {\n // Next.js Script support\n const self = globalThis as typeof globalThis & {\n __next_s: [string, Record<string, string>][];\n };\n const prevNextScripts = self.__next_s;\n const nextScripts = [] as [string, Record<string, string>][];\n // eslint-disable-next-line camelcase\n self.__next_s = nextScripts;\n\n await Promise.all(\n Array.from(inlineScripts)\n .filter(\n (script) =>\n !(\n script.id.endsWith('_shared') &&\n script.getAttribute('type') === 'application/json' &&\n typeof script.getAttribute(\n 'data-remote-components-shared',\n ) === 'string'\n ),\n )\n .map((script) => {\n return new Promise((resolve) => {\n // only handle inline scripts with content, but not Next.js RSC scripts\n if (\n script.textContent &&\n !script.textContent.includes('self.__next_f=') &&\n !script.textContent.includes('self.__next_f.push')\n ) {\n // if script is inline javascript, then execute using blob\n if (\n !script.getAttribute('type') ||\n script.getAttribute('type') === 'text/javascript' ||\n script.getAttribute('type') === 'application/javascript'\n ) {\n const newScript = document.createElement('script');\n\n // scripts loaded from external sources needs this workaround\n const blob = new Blob([script.textContent], {\n type: 'application/javascript',\n });\n const blobUrl = URL.createObjectURL(blob);\n\n newScript.onload = () => {\n resolve(undefined);\n // script executed and safe to remove\n URL.revokeObjectURL(blobUrl);\n newScript.remove();\n };\n // on error we still want to resolve to not block the remote component loading\n newScript.onerror = () => {\n URL.revokeObjectURL(blobUrl);\n newScript.remove();\n resolve(undefined);\n };\n\n newScript.src = blobUrl;\n document.body.appendChild(newScript);\n } else {\n resolve(undefined);\n document.body.appendChild(script);\n }\n } else {\n resolve(undefined);\n }\n });\n }),\n );\n // process the remote component Next.js Script container\n nextScripts.forEach(([scriptSrc, props]) => {\n const script = document.createElement('script');\n // when we have a script src, apply it (inline scripts have `0` as src)\n if (scriptSrc) {\n script.src = scriptSrc;\n }\n // apply Script props\n if (typeof props.children === 'string') {\n script.textContent = props.children;\n }\n setAttributesFromProps(script, props);\n document.head.appendChild(script);\n });\n // restore previous Next.js Script container\n // eslint-disable-next-line camelcase\n self.__next_s = prevNextScripts;\n }\n\n let rscName;\n if (rsc) {\n rscName = `__remote_component_rsc_${escapeString(\n id,\n )}_${escapeString(remoteName)}`;\n rsc.textContent =\n rsc.textContent?.replace(\n new RegExp(`self\\\\[\"${remoteName}\"\\\\]`, 'g'),\n `self[\"${rscName}\"]`,\n ) ?? '';\n document.body.appendChild(rsc);\n }\n\n const newData = {\n ...metadata,\n links,\n remoteShared,\n src: typeof src === 'string' ? src : src.href,\n serverUrl: url.href,\n data: rsc\n ? (rsc.textContent || '').split('\\n').filter(Boolean)\n : [],\n };\n\n componentHydrationHtml.current = `${Array.from(\n doc.querySelectorAll('link,style'),\n )\n .map((link) => link.outerHTML)\n .join('')}${\n reset\n ? `<style data-remote-components-reset=\"\">:host { all: initial; }</style>`\n : ''\n }${component.innerHTML}`;\n\n const userShared = await shared;\n\n if ('__remote_components_missing_shared__' in userShared) {\n userShared.__remote_components_missing_shared__().catch((e) => {\n throw e;\n });\n } else if ('__remote_components_missing_shared__' in remoteShared) {\n throw new RemoteComponentsError(\n remoteShared.__remote_components_missing_shared__,\n );\n }\n\n if (isRemoteComponent) {\n // Only call onChange when not on first load (matching HTML implementation)\n if (previousSrc !== null) {\n onChange?.({\n previousSrc,\n nextSrc: src,\n previousName,\n nextName: remoteName,\n });\n }\n setData(newData);\n if (shadowRoot) {\n let shadowRootHtml = component.innerHTML;\n if (reset) {\n shadowRootHtml = `<style data-remote-components-reset=\"\">:host { all: initial; }</style>${shadowRootHtml}`;\n }\n shadowRoot.innerHTML = shadowRootHtml;\n setRemoteComponent(null);\n const { mount, unmount } = await loadStaticRemoteComponent(\n Array.from(shadowRoot.querySelectorAll('script')),\n url,\n );\n unmountRef.current = unmount;\n await Promise.all(\n Array.from(mount).map((mountFn) => mountFn(shadowRoot)),\n );\n onLoad?.(src);\n } else if (isolate === false) {\n setRemoteComponent(\n // TODO: remove wrapper div by converting HTML to RSC or React tree\n <div\n dangerouslySetInnerHTML={{ __html: component.innerHTML }}\n ref={prevRemoteComponentContainerRef}\n />,\n );\n const { mount, unmount } = await loadStaticRemoteComponent(\n Array.from(component.querySelectorAll('script')),\n url,\n );\n unmountRef.current = unmount;\n await Promise.all(\n Array.from(mount).map((mountFn) =>\n mountFn(prevRemoteComponentContainerRef.current),\n ),\n );\n onLoad?.(src);\n }\n } else {\n const result = await loadRemoteComponent({\n url,\n name: remoteName,\n rscName,\n bundle,\n route: metadata.route,\n runtime: metadata.runtime,\n data: newData.data,\n nextData,\n scripts: Array.from(scripts).map((script) => {\n const scriptSrc =\n script.getAttribute('data-src') ||\n script.getAttribute('src') ||\n script.src;\n const { prefix, id: path } = REMOTE_COMPONENT_REGEX.exec(\n scriptSrc,\n )?.groups ?? {\n prefix: undefined,\n id: scriptSrc,\n };\n return {\n src: new URL(\n `${prefix ?? ''}${path}`.replace(\n /(?<char>[^:])(?<double>\\/\\/)/g,\n '$1/',\n ),\n url,\n ).href,\n };\n }),\n shared: {\n ...sharedPolyfills(userShared),\n ...userShared,\n },\n remoteShared,\n container: shadowRoot,\n });\n if (rsc) {\n rsc.remove();\n }\n\n setData(newData);\n // Only call onChange when not on first load (matching HTML implementation)\n if (previousSrc !== null) {\n onChange?.({\n previousSrc,\n nextSrc: src,\n previousName,\n nextName: remoteName,\n });\n }\n if (result.error) {\n setRemoteComponent(result.error);\n onError?.(result.error);\n } else {\n setRemoteComponent(result.component);\n onLoad?.(src);\n }\n }\n } catch (error) {\n setRemoteComponent(error as Error);\n onError?.(error);\n }\n });\n }\n }, [\n url,\n src,\n isolate,\n credentials,\n name,\n shared,\n shadowRoot,\n additionalHeaders,\n reset,\n id,\n onBeforeLoad,\n onLoad,\n onError,\n onChange,\n ]);\n\n if (remoteComponent instanceof Error) {\n throw remoteComponent;\n }\n\n const metadataJson = (\n <script data-remote-component type=\"application/json\">\n {JSON.stringify({\n name: data?.name || name,\n bundle: data?.bundle || 'default',\n route: data?.route || DEFAULT_ROUTE,\n runtime: prevIsRemoteComponentRef.current\n ? RUNTIME_SCRIPT\n : data?.runtime || RUNTIME_WEBPACK,\n })}\n </script>\n );\n const resetStyle = reset ? (\n <style data-remote-components-reset=\"react\">{`:host { all: initial; }`}</style>\n ) : null;\n const linksToRender: React.ReactNode[] | null =\n data?.links?.map((link) => (\n <link\n {...link}\n href={new URL(link.href as string, url).href}\n key={JSON.stringify(link)}\n />\n )) || null;\n const componentToRender = (\n <>\n {resetStyle}\n {linksToRender}\n {remoteComponent ?? children}\n </>\n );\n\n if (componentHydrationHtml.current && shadowRoot && !shadowRoot.innerHTML) {\n shadowRoot.innerHTML = componentHydrationHtml.current;\n componentHydrationHtml.current = null;\n\n if (prevIsRemoteComponentRef.current) {\n // ensure we load static resources when hydrating a remote component in shadow DOM\n loadStaticRemoteComponent(\n Array.from(shadowRoot.querySelectorAll('script')),\n url,\n )\n .then(({ mount }) => {\n return Promise.all(\n Array.from(mount).map((mountFn) => mountFn(shadowRoot)),\n );\n })\n .then(() => {\n if (src) {\n onLoad?.(src);\n }\n })\n .catch((e) => {\n const error = new RemoteComponentsError(\n `Error mounting remote component from \"${url.href}\"`,\n {\n cause: e,\n },\n );\n setRemoteComponent(error);\n onError?.(error);\n });\n }\n }\n\n if (isolate !== false) {\n const shadowRemoteComponentHtml =\n shadowRoot?.querySelector(`#__REMOTE_COMPONENT${name}`) ??\n shadowRoot?.querySelector('div[data-bundle][data-route]');\n if (shadowRemoteComponentHtml) {\n shadowRemoteComponentHtml.remove();\n }\n\n return (\n <>\n {metadataJson}\n <div\n data-remote-component-id={`shadowroot_${keySuffix}`}\n id={`shadowroot_${data?.name ?? name}`}\n ref={shadowRootContainerRef}\n >\n {typeof document === 'undefined' ? (\n // eslint-disable-next-line react/no-unknown-property\n <template shadowrootmode={mode}>\n {typeof document === 'undefined' ? (\n <div\n dangerouslySetInnerHTML={{\n __html: `<img\n alt=\"\" decoding=\"async\" style=\"display:none\"\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==\"\n onload=\"(function(el){\n const root = el.getRootNode();\n globalThis.__remote_components_shadowroot_${keySuffix} = root;\n el.parentElement.remove();\n })(this)\"\n />`,\n }}\n />\n ) : null}\n {resetStyle}\n {linksToRender}\n {children}\n </template>\n ) : null}\n {shadowRoot && remoteComponent\n ? createPortal(\n <>\n <template id={`${name}_start`} />\n {resetStyle}\n {linksToRender}\n {remoteComponent}\n <template id={`${name}_end`} ref={endTemplateRef} />\n </>,\n shadowRoot,\n )\n : null}\n </div>\n </>\n );\n }\n htmlRef.current = null;\n\n // render start/end markers for the remote component\n return (\n <>\n <template id={`${name}_start`} />\n {metadataJson}\n {componentToRender}\n <template id={`${name}_end`} ref={endTemplateRef} />\n </>\n );\n}\n"],"mappings":"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","names":["import_react","url","parser","doc"]}
@@ -125,7 +125,7 @@ function RemoteComponent({
125
125
  });
126
126
  childrenRef.current = [];
127
127
  }
128
- if (isolate !== false && typeof document !== "undefined" && !shadowRoot) {
128
+ if (isolate !== false && typeof document !== "undefined" && (!shadowRoot || !shadowRoot.isConnected)) {
129
129
  const self = globalThis;
130
130
  const shadowRootKey = `__remote_components_shadowroot_${keySuffix}`;
131
131
  let shadowRootElement = null;
@@ -155,7 +155,7 @@ function RemoteComponent({
155
155
  );
156
156
  if (resetStyles.length > 1) {
157
157
  resetStyles.forEach((style, index) => {
158
- if (index > 0) {
158
+ if (index > 0 && style.getAttribute("data-remote-components-reset") !== "react") {
159
159
  style.remove();
160
160
  }
161
161
  });
@@ -514,7 +514,7 @@ function RemoteComponent({
514
514
  route: data?.route || DEFAULT_ROUTE,
515
515
  runtime: prevIsRemoteComponentRef.current ? RUNTIME_SCRIPT : data?.runtime || RUNTIME_WEBPACK
516
516
  }) });
517
- const resetStyle = reset ? /* @__PURE__ */ jsx("style", { "data-remote-components-reset": "", children: `:host { all: initial; }` }) : null;
517
+ const resetStyle = reset ? /* @__PURE__ */ jsx("style", { "data-remote-components-reset": "react", children: `:host { all: initial; }` }) : null;
518
518
  const linksToRender = data?.links?.map((link) => /* @__PURE__ */ createElement(
519
519
  "link",
520
520
  {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/react/index.tsx"],"sourcesContent":["import {\n startTransition,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { applyOriginToNodes } from '#internal/shared/client/apply-origin';\nimport { sharedPolyfills } from '#internal/shared/client/polyfill';\nimport {\n DEFAULT_ROUTE,\n type LoadRemoteComponentProps,\n loadRemoteComponent,\n loadStaticRemoteComponent,\n REMOTE_COMPONENT_REGEX,\n RemoteComponentsError,\n RUNTIME_SCRIPT,\n RUNTIME_WEBPACK,\n setAttributesFromProps,\n} from '#internal/shared/client/remote-component';\nimport {\n failedToFetchRemoteComponentError,\n multipleRemoteComponentsError,\n} from '#internal/shared/error';\nimport { remoteFetchHeaders } from '#internal/shared/ssr/fetch-headers';\nimport { getClientOrServerUrl } from '#internal/shared/ssr/get-client-or-server-url';\nimport { attrToProp, escapeString } from '#internal/shared/utils';\nimport type {\n MountOrUnmountFunction,\n RemoteComponentMountUnmount,\n RemoteComponentProps as RemoteComponentPropsType,\n} from '#remote-components/shared/client/types';\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 ref?: React.Ref<HTMLTemplateElement>;\n dangerouslySetInnerHTML?: {\n __html: string;\n };\n children?: React.ReactNode;\n };\n }\n }\n}\n\nexport interface RemoteComponentProps {\n /** The source URL of the remote component. */\n src?: string | URL;\n /** Whether to isolate the remote component using a Shadow DOM wrapper. */\n isolate?: boolean;\n /** The shadow DOM mode to use when isolating the remote component. */\n mode?: 'open' | 'closed';\n /** Whether to include a CSS reset style in the shadow DOM. Defaults to `false`. */\n reset?: boolean;\n /** The credentials to use for the fetch request. Defaults to `same-origin`. */\n credentials?: RequestCredentials;\n name?: string;\n /** Shared modules to include in the remote component's context. */\n shared?: LoadRemoteComponentProps['shared'];\n /** Additional headers to use when fetching the remote component. */\n additionalHeaders?: Headers | Record<string, string>;\n /** The children to use as a loading fallback until the remote component is loaded. */\n children?: React.ReactNode;\n /** Called right before a new remote component load starts. */\n onBeforeLoad?: (src: string | URL) => void;\n /** Called when the remote component has been successfully loaded and mounted. */\n onLoad?: (src: string | URL) => void;\n /** Called when an error occurs while loading or mounting the remote component. */\n onError?: (error: unknown) => void;\n /** Called when a different remote component is loaded into the same wrapper. */\n onChange?: (info: {\n previousSrc: string | URL | null;\n nextSrc: string | URL | null;\n previousName: string | undefined;\n nextName: string | undefined;\n }) => void;\n}\n\nfunction getRemoteComponentHtml(html: string) {\n if (typeof document === 'undefined') return html;\n\n // parse the HTML string to extract the relevant parts\n const parser = new DOMParser();\n const temp = parser.parseFromString(html, 'text/html');\n\n // used by the Next.js Pages Router remote as a wrapper\n const ssrRemoteComponentContainer = temp.querySelector(\n 'div[id^=\"__REMOTE_COMPONENT\"]',\n );\n if (ssrRemoteComponentContainer) {\n return ssrRemoteComponentContainer.innerHTML;\n }\n\n // remote component content\n const remoteComponentContainer = temp.querySelectorAll(\n `div[data-bundle][data-route][data-runtime][id^=\"__vercel_remote_component\"],div[data-bundle][data-route],div#__next,remote-component:not([src])`,\n );\n if (remoteComponentContainer.length > 0) {\n return `${Array.from(temp.querySelectorAll('link,script'))\n .map((link) => link.outerHTML)\n .join('')}${Array.from(remoteComponentContainer)\n .map((container) => container.outerHTML)\n .join('')}`;\n }\n\n return '';\n}\n\nconst DUMMY_FALLBACK = 'http://remote-components-dummy-fallback';\n\n/**\n * RemoteComponent is a React component that fetches and renders a remote component.\n * It supports SSR and can isolate the remote component in a shadow DOM.\n *\n * @param props - The properties for the remote component.\n * @returns A React component that renders the remote component.\n *\n * @example\n *\n * Use the `<RemoteComponent>` in your React application to consume a remote component from a remote application:\n *\n * ```tsx\n * import { RemoteComponent } from 'remote-components/react';\n *\n * export default function App() {\n * return (\n * <>\n * <h1>Welcome to My App</h1>\n * <p>This page consumes a remote component from another application.</p>\n * <RemoteComponent src=\"/nextjs-app-remote/components/header\" />\n * </>\n * );\n * }\n * ```\n *\n * To share modules, you can provide a shared module map with references to the shared modules:\n *\n * ```tsx\n * <RemoteComponent\n * src=\"/nextjs-app-remote/components/header\"\n * shared={{\n * '@/components/provider': () => import('@/components/host-provider')\n * }}\n * />\n * ```\n */\nexport function RemoteComponent({\n src,\n isolate,\n mode = 'open',\n reset,\n credentials = 'same-origin',\n name: nameProp = '__vercel_remote_component',\n shared = {},\n additionalHeaders,\n children,\n onBeforeLoad,\n onLoad,\n onError,\n onChange,\n}: RemoteComponentProps) {\n const name = useMemo(() => {\n if (typeof src === 'string') {\n const url = new URL(\n src,\n typeof document !== 'undefined' ? location.href : DUMMY_FALLBACK,\n );\n if (url.hash) {\n return url.hash.slice(1);\n }\n } else if (typeof src === 'object' && 'hash' in src && src.hash) {\n return src.hash.slice(1) || nameProp;\n }\n return nameProp;\n }, [src, nameProp]);\n\n const [data, setData] = useState<Omit<\n RemoteComponentPropsType,\n 'children'\n > | null>(null);\n\n const url = useMemo(() => getClientOrServerUrl(src, DUMMY_FALLBACK), [src]);\n\n // for relative src paths, use just the pathname as the unique id.\n // for static urls, use the full url as the unique id as the path may not be unique.\n // this id needs to be the same for server and client side rendering.\n // note that if this needs to be more unique, can pass through the bundle as an id prop and ammend it to this id.\n const id =\n url.origin ===\n (typeof location !== 'undefined' ? location.origin : DUMMY_FALLBACK)\n ? url.pathname\n : url.href;\n\n const keySuffix = `${escapeString(id)}_${escapeString(data?.name ?? name)}`;\n\n const [remoteComponent, setRemoteComponent] = useState<\n React.ReactNode | Error\n >(null);\n const shadowRootContainerRef = useRef<HTMLDivElement | null>(null);\n const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(() => {\n const self = globalThis as Record<\n `__remote_components_shadowroot_${string}`,\n ShadowRoot | null\n >;\n const shadowRootKey =\n `__remote_components_shadowroot_${keySuffix}` as const;\n const ssrShadowRoot =\n typeof document !== 'undefined'\n ? (document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n )?.shadowRoot ??\n self[shadowRootKey] ??\n null)\n : null;\n self[shadowRootKey] = null;\n return ssrShadowRoot;\n });\n const htmlRef = useRef<string | null>(\n typeof document !== 'undefined'\n ? (document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n )?.shadowRoot?.innerHTML ??\n document.getElementById(`__REMOTE_COMPONENT${name}`)?.innerHTML ??\n document.querySelector(`div[data-bundle][data-route][id^=\"${name}\"]`)\n ?.innerHTML ??\n document.querySelector('div[data-bundle][data-route]')?.innerHTML)\n : null,\n );\n const endTemplateRef = useRef<HTMLTemplateElement | null>(null);\n // collect initial content that needs to be removed after remote component renders\n const childrenRef = useRef(\n typeof document !== 'undefined'\n ? (() => {\n let el = document.querySelector(`template[id=\"${name}_start\"]`);\n const elements = [];\n while (el && el.id !== `${name}_end`) {\n if (\n el.id !== `${name}_start` &&\n !el.getAttribute('data-remote-component')\n ) {\n elements.push(el);\n }\n el = el.nextElementSibling as HTMLTemplateElement | null;\n }\n return elements;\n })()\n : [],\n );\n const prevSrcRef = useRef<string | URL | null>(null);\n const componentHydrationHtml = useRef<string | null>(null);\n const prevIsRemoteComponentRef = useRef<boolean>(false);\n const prevUrlRef = useRef<URL | null>(null);\n const prevRemoteComponentContainerRef = useRef<HTMLDivElement | null>(null);\n const unmountRef = useRef<Set<MountOrUnmountFunction> | null>(null);\n const prevNameRef = useRef<string | undefined>(undefined);\n\n useLayoutEffect(() => {\n // clear initial content\n if (childrenRef.current.length > 0 && remoteComponent) {\n childrenRef.current.forEach((el) => {\n el.remove();\n });\n childrenRef.current = [];\n }\n\n if (isolate !== false && typeof document !== 'undefined' && !shadowRoot) {\n const self = globalThis as Record<\n `__remote_components_shadowroot_${string}`,\n ShadowRoot | null\n >;\n const shadowRootKey =\n `__remote_components_shadowroot_${keySuffix}` as const;\n\n let shadowRootElement: ShadowRoot | null = null;\n const element = document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n );\n shadowRootElement = self[shadowRootKey] ?? 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 try {\n shadowRootElement = element.attachShadow({ mode });\n self[shadowRootKey] = shadowRootElement;\n } catch {\n // do nothing if attachShadow fails because of existing shadow root\n }\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 }, [isolate, shadowRoot, remoteComponent, mode, keySuffix]);\n\n useLayoutEffect(() => {\n if (shadowRoot && remoteComponent) {\n const resetStyles = shadowRoot.querySelectorAll(\n 'style[data-remote-components-reset]',\n );\n // ensure we only have one reset style in the shadow root\n if (resetStyles.length > 1) {\n resetStyles.forEach((style, index) => {\n if (index > 0) {\n style.remove();\n }\n });\n }\n\n // clear the html ref after hydration\n htmlRef.current = null;\n\n // clear all nodes except links and styles until the start marker\n // the marker gets only rendered on hydration\n let el: ChildNode | null = shadowRoot.childNodes[0] ?? null;\n while (el && (!('id' in el) || el.id !== `${name}_start`)) {\n const nextEl = el.nextSibling;\n if (el.nodeName !== 'LINK' && el.nodeName !== 'STYLE') {\n el.parentNode?.removeChild(el);\n }\n el = nextEl;\n }\n }\n }, [shadowRoot, remoteComponent, name]);\n\n useEffect(() => {\n if (src && src !== prevSrcRef.current) {\n const previousSrc = prevSrcRef.current;\n const previousName = prevNameRef.current;\n prevSrcRef.current = src;\n\n onBeforeLoad?.(src);\n\n startTransition(async () => {\n try {\n let html = getRemoteComponentHtml(\n htmlRef.current ??\n (endTemplateRef.current?.previousElementSibling?.tagName === 'div'\n ? endTemplateRef.current.previousElementSibling.innerHTML\n : ''),\n );\n\n if (!html && src) {\n // fetch the remote component\n const fetchInit = {\n method: 'GET',\n headers: remoteFetchHeaders(additionalHeaders),\n credentials,\n } as RequestInit;\n\n const res = await fetch(url, fetchInit);\n\n if (!res.ok) {\n let error: Error = failedToFetchRemoteComponentError(url.href, {\n cause: new Error(`${res.status} ${res.statusText}`),\n });\n try {\n const body = await res.text();\n const parser = new DOMParser();\n const doc = parser.parseFromString(body, 'text/html');\n const errorTemplate = doc.querySelector(\n 'template[data-next-error-message]',\n );\n const errorMessage = errorTemplate?.getAttribute(\n 'data-next-error-message',\n );\n const errorStack = errorTemplate?.getAttribute(\n 'data-next-error-stack',\n );\n\n if (errorMessage) {\n error = new RemoteComponentsError(errorMessage);\n if (errorStack) {\n error.stack = errorStack;\n }\n }\n } catch {\n // ignore\n }\n\n throw error;\n }\n\n // get the full HTML content as a string\n const remoteHtml = await res.text();\n htmlRef.current = remoteHtml;\n html = getRemoteComponentHtml(remoteHtml);\n }\n\n // create a virtual element which will be used to parse the HTML and extract the component and RSC flight data\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text/html');\n\n if (\n (doc.querySelectorAll('div[data-bundle][data-route]').length > 1 &&\n !doc.querySelector(\n `div[data-bundle][data-route][id^=\"${name}\"]`,\n )) ||\n (doc.querySelectorAll('remote-component:not([src])').length > 1 &&\n !doc.querySelector(`remote-component[name=\"${name}\"]`))\n ) {\n throw multipleRemoteComponentsError(url.href);\n }\n\n // reference to the remote component content\n const component =\n doc.querySelector(`div[data-bundle][data-route][id^=\"${name}\"]`) ??\n // fallback to the first element with the data-bundle and data-route attributes when not using a named remote component\n doc.querySelector('div[data-bundle][data-route]') ??\n // fallback to Next.js Pages Router\n doc.querySelector('div#__next') ??\n // fallback to the remote-component web component\n doc.querySelector(`remote-component[name=\"${name}\"]:not([src])`) ??\n doc.querySelector('remote-component:not([src])');\n const nextData = JSON.parse(\n (\n doc.querySelector('#__NEXT_DATA__') ??\n doc.querySelector('#__REMOTE_NEXT_DATA__')\n )?.textContent ?? 'null',\n ) as {\n props: {\n pageProps: Record<string, unknown>;\n __REMOTE_COMPONENT__?: {\n bundle: string;\n runtime: 'turbopack' | 'webpack' | 'script';\n shared?: Record<string, string>;\n };\n };\n page: string;\n buildId: string;\n } | null;\n\n const remoteName =\n component?.getAttribute('id')?.replace(/_ssr$/, '') ||\n (nextData ? '__next' : name);\n // reference to the RSC flight data\n const rsc = doc.querySelector(`#${remoteName}_rsc`);\n\n // reference to the bundle containing the client components\n const bundle =\n component?.getAttribute('data-bundle') ||\n nextData?.props.__REMOTE_COMPONENT__?.bundle ||\n 'default';\n\n const isRemoteComponent =\n component?.tagName.toLowerCase() === 'remote-component';\n\n const metadata = {\n name: remoteName,\n bundle,\n route:\n component?.getAttribute('data-route') ??\n nextData?.page ??\n (url.pathname || DEFAULT_ROUTE),\n runtime: (component?.getAttribute('data-runtime') ??\n (nextData?.props.__REMOTE_COMPONENT__?.runtime ||\n RUNTIME_SCRIPT)) as RemoteComponentPropsType['runtime'],\n };\n\n const remoteSharedEl = doc.querySelector(\n `#${remoteName}_shared[data-remote-components-shared]`,\n );\n const remoteShared =\n nextData?.props.__REMOTE_COMPONENT__?.shared ??\n ((JSON.parse(remoteSharedEl?.textContent ?? '{}') ?? {}) as Record<\n string,\n string\n >);\n remoteSharedEl?.remove();\n\n if (!component || !(rsc || nextData || isRemoteComponent)) {\n throw new RemoteComponentsError(\n `Remote Component not found on ${url.href}.${\n remoteName !== '__vercel_remote_component'\n ? `The name for the <RemoteComponent> is \"${remoteName}\". Check <RemoteComponent> usage.`\n : ''\n } Did you forget to wrap the content in <RemoteComponent>?`,\n );\n }\n\n if (prevIsRemoteComponentRef.current) {\n if (shadowRoot) {\n shadowRoot.innerHTML = '';\n }\n const self = globalThis as typeof globalThis &\n RemoteComponentMountUnmount;\n const prevUrl = prevUrlRef.current;\n if (\n prevUrl &&\n self.__remote_script_entrypoint_unmount__?.[prevUrl.href]\n ) {\n const unmountPromises = Promise.all(\n Array.from(unmountRef.current ?? []).map(async (unmount) =>\n unmount(\n shadowRoot ?? prevRemoteComponentContainerRef.current,\n ),\n ),\n );\n unmountRef.current = null;\n await unmountPromises;\n }\n }\n prevIsRemoteComponentRef.current = isRemoteComponent;\n prevUrlRef.current = url;\n prevNameRef.current = remoteName;\n\n // update all relative URLs to absolute URLs based on the remote component URL\n applyOriginToNodes(doc, url);\n\n // reference to all link elements in the remote component\n const links = Array.from(\n doc.querySelectorAll<HTMLLinkElement>('link[href]'),\n )\n .filter((link) => {\n return !component.contains(link);\n })\n .map((link) => ({\n href: new URL(link.getAttribute('href') ?? link.href, url).href,\n ...link\n .getAttributeNames()\n .reduce<Record<string, string>>((acc, key) => {\n if (key !== 'href') {\n acc[attrToProp[key] ?? key] = link.getAttribute(key) ?? '';\n }\n return acc;\n }, {}),\n }));\n\n const scripts = (\n isRemoteComponent ? component : doc\n ).querySelectorAll<HTMLScriptElement>('script[src],script[data-src]');\n\n // handle inline scripts in the remote component\n const inlineScripts = (\n isRemoteComponent ? component : doc\n ).querySelectorAll(\n \"script:not([src]):not([data-src]):not([id*='_rsc']):not([id='__NEXT_DATA__']):not([id='__REMOTE_NEXT_DATA__'])\",\n );\n\n if (!isRemoteComponent) {\n // Next.js Script support\n const self = globalThis as typeof globalThis & {\n __next_s: [string, Record<string, string>][];\n };\n const prevNextScripts = self.__next_s;\n const nextScripts = [] as [string, Record<string, string>][];\n // eslint-disable-next-line camelcase\n self.__next_s = nextScripts;\n\n await Promise.all(\n Array.from(inlineScripts)\n .filter(\n (script) =>\n !(\n script.id.endsWith('_shared') &&\n script.getAttribute('type') === 'application/json' &&\n typeof script.getAttribute(\n 'data-remote-components-shared',\n ) === 'string'\n ),\n )\n .map((script) => {\n return new Promise((resolve) => {\n // only handle inline scripts with content, but not Next.js RSC scripts\n if (\n script.textContent &&\n !script.textContent.includes('self.__next_f=') &&\n !script.textContent.includes('self.__next_f.push')\n ) {\n // if script is inline javascript, then execute using blob\n if (\n !script.getAttribute('type') ||\n script.getAttribute('type') === 'text/javascript' ||\n script.getAttribute('type') === 'application/javascript'\n ) {\n const newScript = document.createElement('script');\n\n // scripts loaded from external sources needs this workaround\n const blob = new Blob([script.textContent], {\n type: 'application/javascript',\n });\n const blobUrl = URL.createObjectURL(blob);\n\n newScript.onload = () => {\n resolve(undefined);\n // script executed and safe to remove\n URL.revokeObjectURL(blobUrl);\n newScript.remove();\n };\n // on error we still want to resolve to not block the remote component loading\n newScript.onerror = () => {\n URL.revokeObjectURL(blobUrl);\n newScript.remove();\n resolve(undefined);\n };\n\n newScript.src = blobUrl;\n document.body.appendChild(newScript);\n } else {\n resolve(undefined);\n document.body.appendChild(script);\n }\n } else {\n resolve(undefined);\n }\n });\n }),\n );\n // process the remote component Next.js Script container\n nextScripts.forEach(([scriptSrc, props]) => {\n const script = document.createElement('script');\n // when we have a script src, apply it (inline scripts have `0` as src)\n if (scriptSrc) {\n script.src = scriptSrc;\n }\n // apply Script props\n if (typeof props.children === 'string') {\n script.textContent = props.children;\n }\n setAttributesFromProps(script, props);\n document.head.appendChild(script);\n });\n // restore previous Next.js Script container\n // eslint-disable-next-line camelcase\n self.__next_s = prevNextScripts;\n }\n\n let rscName;\n if (rsc) {\n rscName = `__remote_component_rsc_${escapeString(\n id,\n )}_${escapeString(remoteName)}`;\n rsc.textContent =\n rsc.textContent?.replace(\n new RegExp(`self\\\\[\"${remoteName}\"\\\\]`, 'g'),\n `self[\"${rscName}\"]`,\n ) ?? '';\n document.body.appendChild(rsc);\n }\n\n const newData = {\n ...metadata,\n links,\n remoteShared,\n src: typeof src === 'string' ? src : src.href,\n serverUrl: url.href,\n data: rsc\n ? (rsc.textContent || '').split('\\n').filter(Boolean)\n : [],\n };\n\n componentHydrationHtml.current = `${Array.from(\n doc.querySelectorAll('link,style'),\n )\n .map((link) => link.outerHTML)\n .join('')}${\n reset\n ? `<style data-remote-components-reset=\"\">:host { all: initial; }</style>`\n : ''\n }${component.innerHTML}`;\n\n const userShared = await shared;\n\n if ('__remote_components_missing_shared__' in userShared) {\n userShared.__remote_components_missing_shared__().catch((e) => {\n throw e;\n });\n } else if ('__remote_components_missing_shared__' in remoteShared) {\n throw new RemoteComponentsError(\n remoteShared.__remote_components_missing_shared__,\n );\n }\n\n if (isRemoteComponent) {\n // Only call onChange when not on first load (matching HTML implementation)\n if (previousSrc !== null) {\n onChange?.({\n previousSrc,\n nextSrc: src,\n previousName,\n nextName: remoteName,\n });\n }\n setData(newData);\n if (shadowRoot) {\n let shadowRootHtml = component.innerHTML;\n if (reset) {\n shadowRootHtml = `<style data-remote-components-reset=\"\">:host { all: initial; }</style>${shadowRootHtml}`;\n }\n shadowRoot.innerHTML = shadowRootHtml;\n setRemoteComponent(null);\n const { mount, unmount } = await loadStaticRemoteComponent(\n Array.from(shadowRoot.querySelectorAll('script')),\n url,\n );\n unmountRef.current = unmount;\n await Promise.all(\n Array.from(mount).map((mountFn) => mountFn(shadowRoot)),\n );\n onLoad?.(src);\n } else if (isolate === false) {\n setRemoteComponent(\n // TODO: remove wrapper div by converting HTML to RSC or React tree\n <div\n dangerouslySetInnerHTML={{ __html: component.innerHTML }}\n ref={prevRemoteComponentContainerRef}\n />,\n );\n const { mount, unmount } = await loadStaticRemoteComponent(\n Array.from(component.querySelectorAll('script')),\n url,\n );\n unmountRef.current = unmount;\n await Promise.all(\n Array.from(mount).map((mountFn) =>\n mountFn(prevRemoteComponentContainerRef.current),\n ),\n );\n onLoad?.(src);\n }\n } else {\n const result = await loadRemoteComponent({\n url,\n name: remoteName,\n rscName,\n bundle,\n route: metadata.route,\n runtime: metadata.runtime,\n data: newData.data,\n nextData,\n scripts: Array.from(scripts).map((script) => {\n const scriptSrc =\n script.getAttribute('data-src') ||\n script.getAttribute('src') ||\n script.src;\n const { prefix, id: path } = REMOTE_COMPONENT_REGEX.exec(\n scriptSrc,\n )?.groups ?? {\n prefix: undefined,\n id: scriptSrc,\n };\n return {\n src: new URL(\n `${prefix ?? ''}${path}`.replace(\n /(?<char>[^:])(?<double>\\/\\/)/g,\n '$1/',\n ),\n url,\n ).href,\n };\n }),\n shared: {\n ...sharedPolyfills(userShared),\n ...userShared,\n },\n remoteShared,\n container: shadowRoot,\n });\n if (rsc) {\n rsc.remove();\n }\n\n setData(newData);\n // Only call onChange when not on first load (matching HTML implementation)\n if (previousSrc !== null) {\n onChange?.({\n previousSrc,\n nextSrc: src,\n previousName,\n nextName: remoteName,\n });\n }\n if (result.error) {\n setRemoteComponent(result.error);\n onError?.(result.error);\n } else {\n setRemoteComponent(result.component);\n onLoad?.(src);\n }\n }\n } catch (error) {\n setRemoteComponent(error as Error);\n onError?.(error);\n }\n });\n }\n }, [\n url,\n src,\n isolate,\n credentials,\n name,\n shared,\n shadowRoot,\n additionalHeaders,\n reset,\n id,\n onBeforeLoad,\n onLoad,\n onError,\n onChange,\n ]);\n\n if (remoteComponent instanceof Error) {\n throw remoteComponent;\n }\n\n const metadataJson = (\n <script data-remote-component type=\"application/json\">\n {JSON.stringify({\n name: data?.name || name,\n bundle: data?.bundle || 'default',\n route: data?.route || DEFAULT_ROUTE,\n runtime: prevIsRemoteComponentRef.current\n ? RUNTIME_SCRIPT\n : data?.runtime || RUNTIME_WEBPACK,\n })}\n </script>\n );\n const resetStyle = reset ? (\n <style data-remote-components-reset=\"\">{`:host { all: initial; }`}</style>\n ) : null;\n const linksToRender: React.ReactNode[] | null =\n data?.links?.map((link) => (\n <link\n {...link}\n href={new URL(link.href as string, url).href}\n key={JSON.stringify(link)}\n />\n )) || null;\n const componentToRender = (\n <>\n {resetStyle}\n {linksToRender}\n {remoteComponent ?? children}\n </>\n );\n\n if (componentHydrationHtml.current && shadowRoot && !shadowRoot.innerHTML) {\n shadowRoot.innerHTML = componentHydrationHtml.current;\n componentHydrationHtml.current = null;\n\n if (prevIsRemoteComponentRef.current) {\n // ensure we load static resources when hydrating a remote component in shadow DOM\n loadStaticRemoteComponent(\n Array.from(shadowRoot.querySelectorAll('script')),\n url,\n )\n .then(({ mount }) => {\n return Promise.all(\n Array.from(mount).map((mountFn) => mountFn(shadowRoot)),\n );\n })\n .then(() => {\n if (src) {\n onLoad?.(src);\n }\n })\n .catch((e) => {\n const error = new RemoteComponentsError(\n `Error mounting remote component from \"${url.href}\"`,\n {\n cause: e,\n },\n );\n setRemoteComponent(error);\n onError?.(error);\n });\n }\n }\n\n if (isolate !== false) {\n const shadowRemoteComponentHtml =\n shadowRoot?.querySelector(`#__REMOTE_COMPONENT${name}`) ??\n shadowRoot?.querySelector('div[data-bundle][data-route]');\n if (shadowRemoteComponentHtml) {\n shadowRemoteComponentHtml.remove();\n }\n\n return (\n <>\n {metadataJson}\n <div\n data-remote-component-id={`shadowroot_${keySuffix}`}\n id={`shadowroot_${data?.name ?? name}`}\n ref={shadowRootContainerRef}\n >\n {typeof document === 'undefined' ? (\n // eslint-disable-next-line react/no-unknown-property\n <template shadowrootmode={mode}>\n {typeof document === 'undefined' ? (\n <div\n dangerouslySetInnerHTML={{\n __html: `<img\n alt=\"\" decoding=\"async\" style=\"display:none\"\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==\"\n onload=\"(function(el){\n const root = el.getRootNode();\n globalThis.__remote_components_shadowroot_${keySuffix} = root;\n el.parentElement.remove();\n })(this)\"\n />`,\n }}\n />\n ) : null}\n {resetStyle}\n {linksToRender}\n {children}\n </template>\n ) : null}\n {shadowRoot && remoteComponent\n ? createPortal(\n <>\n <template id={`${name}_start`} />\n {resetStyle}\n {linksToRender}\n {remoteComponent}\n <template id={`${name}_end`} ref={endTemplateRef} />\n </>,\n shadowRoot,\n )\n : null}\n </div>\n </>\n );\n }\n htmlRef.current = null;\n\n // render start/end markers for the remote component\n return (\n <>\n <template id={`${name}_start`} />\n {metadataJson}\n {componentToRender}\n <template id={`${name}_end`} ref={endTemplateRef} />\n </>\n );\n}\n"],"mappings":"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","names":["url","parser","doc"]}
1
+ {"version":3,"sources":["../../src/react/index.tsx"],"sourcesContent":["import {\n startTransition,\n useEffect,\n useLayoutEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { applyOriginToNodes } from '#internal/shared/client/apply-origin';\nimport { sharedPolyfills } from '#internal/shared/client/polyfill';\nimport {\n DEFAULT_ROUTE,\n type LoadRemoteComponentProps,\n loadRemoteComponent,\n loadStaticRemoteComponent,\n REMOTE_COMPONENT_REGEX,\n RemoteComponentsError,\n RUNTIME_SCRIPT,\n RUNTIME_WEBPACK,\n setAttributesFromProps,\n} from '#internal/shared/client/remote-component';\nimport {\n failedToFetchRemoteComponentError,\n multipleRemoteComponentsError,\n} from '#internal/shared/error';\nimport { remoteFetchHeaders } from '#internal/shared/ssr/fetch-headers';\nimport { getClientOrServerUrl } from '#internal/shared/ssr/get-client-or-server-url';\nimport { attrToProp, escapeString } from '#internal/shared/utils';\nimport type {\n MountOrUnmountFunction,\n RemoteComponentMountUnmount,\n RemoteComponentProps as RemoteComponentPropsType,\n} from '#remote-components/shared/client/types';\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 ref?: React.Ref<HTMLTemplateElement>;\n dangerouslySetInnerHTML?: {\n __html: string;\n };\n children?: React.ReactNode;\n };\n }\n }\n}\n\nexport interface RemoteComponentProps {\n /** The source URL of the remote component. */\n src?: string | URL;\n /** Whether to isolate the remote component using a Shadow DOM wrapper. */\n isolate?: boolean;\n /** The shadow DOM mode to use when isolating the remote component. */\n mode?: 'open' | 'closed';\n /** Whether to include a CSS reset style in the shadow DOM. Defaults to `false`. */\n reset?: boolean;\n /** The credentials to use for the fetch request. Defaults to `same-origin`. */\n credentials?: RequestCredentials;\n name?: string;\n /** Shared modules to include in the remote component's context. */\n shared?: LoadRemoteComponentProps['shared'];\n /** Additional headers to use when fetching the remote component. */\n additionalHeaders?: Headers | Record<string, string>;\n /** The children to use as a loading fallback until the remote component is loaded. */\n children?: React.ReactNode;\n /** Called right before a new remote component load starts. */\n onBeforeLoad?: (src: string | URL) => void;\n /** Called when the remote component has been successfully loaded and mounted. */\n onLoad?: (src: string | URL) => void;\n /** Called when an error occurs while loading or mounting the remote component. */\n onError?: (error: unknown) => void;\n /** Called when a different remote component is loaded into the same wrapper. */\n onChange?: (info: {\n previousSrc: string | URL | null;\n nextSrc: string | URL | null;\n previousName: string | undefined;\n nextName: string | undefined;\n }) => void;\n}\n\nfunction getRemoteComponentHtml(html: string) {\n if (typeof document === 'undefined') return html;\n\n // parse the HTML string to extract the relevant parts\n const parser = new DOMParser();\n const temp = parser.parseFromString(html, 'text/html');\n\n // used by the Next.js Pages Router remote as a wrapper\n const ssrRemoteComponentContainer = temp.querySelector(\n 'div[id^=\"__REMOTE_COMPONENT\"]',\n );\n if (ssrRemoteComponentContainer) {\n return ssrRemoteComponentContainer.innerHTML;\n }\n\n // remote component content\n const remoteComponentContainer = temp.querySelectorAll(\n `div[data-bundle][data-route][data-runtime][id^=\"__vercel_remote_component\"],div[data-bundle][data-route],div#__next,remote-component:not([src])`,\n );\n if (remoteComponentContainer.length > 0) {\n return `${Array.from(temp.querySelectorAll('link,script'))\n .map((link) => link.outerHTML)\n .join('')}${Array.from(remoteComponentContainer)\n .map((container) => container.outerHTML)\n .join('')}`;\n }\n\n return '';\n}\n\nconst DUMMY_FALLBACK = 'http://remote-components-dummy-fallback';\n\n/**\n * RemoteComponent is a React component that fetches and renders a remote component.\n * It supports SSR and can isolate the remote component in a shadow DOM.\n *\n * @param props - The properties for the remote component.\n * @returns A React component that renders the remote component.\n *\n * @example\n *\n * Use the `<RemoteComponent>` in your React application to consume a remote component from a remote application:\n *\n * ```tsx\n * import { RemoteComponent } from 'remote-components/react';\n *\n * export default function App() {\n * return (\n * <>\n * <h1>Welcome to My App</h1>\n * <p>This page consumes a remote component from another application.</p>\n * <RemoteComponent src=\"/nextjs-app-remote/components/header\" />\n * </>\n * );\n * }\n * ```\n *\n * To share modules, you can provide a shared module map with references to the shared modules:\n *\n * ```tsx\n * <RemoteComponent\n * src=\"/nextjs-app-remote/components/header\"\n * shared={{\n * '@/components/provider': () => import('@/components/host-provider')\n * }}\n * />\n * ```\n */\nexport function RemoteComponent({\n src,\n isolate,\n mode = 'open',\n reset,\n credentials = 'same-origin',\n name: nameProp = '__vercel_remote_component',\n shared = {},\n additionalHeaders,\n children,\n onBeforeLoad,\n onLoad,\n onError,\n onChange,\n}: RemoteComponentProps) {\n const name = useMemo(() => {\n if (typeof src === 'string') {\n const url = new URL(\n src,\n typeof document !== 'undefined' ? location.href : DUMMY_FALLBACK,\n );\n if (url.hash) {\n return url.hash.slice(1);\n }\n } else if (typeof src === 'object' && 'hash' in src && src.hash) {\n return src.hash.slice(1) || nameProp;\n }\n return nameProp;\n }, [src, nameProp]);\n\n const [data, setData] = useState<Omit<\n RemoteComponentPropsType,\n 'children'\n > | null>(null);\n\n const url = useMemo(() => getClientOrServerUrl(src, DUMMY_FALLBACK), [src]);\n\n // for relative src paths, use just the pathname as the unique id.\n // for static urls, use the full url as the unique id as the path may not be unique.\n // this id needs to be the same for server and client side rendering.\n // note that if this needs to be more unique, can pass through the bundle as an id prop and ammend it to this id.\n const id =\n url.origin ===\n (typeof location !== 'undefined' ? location.origin : DUMMY_FALLBACK)\n ? url.pathname\n : url.href;\n\n const keySuffix = `${escapeString(id)}_${escapeString(data?.name ?? name)}`;\n\n const [remoteComponent, setRemoteComponent] = useState<\n React.ReactNode | Error\n >(null);\n const shadowRootContainerRef = useRef<HTMLDivElement | null>(null);\n const [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(() => {\n const self = globalThis as Record<\n `__remote_components_shadowroot_${string}`,\n ShadowRoot | null\n >;\n const shadowRootKey =\n `__remote_components_shadowroot_${keySuffix}` as const;\n const ssrShadowRoot =\n typeof document !== 'undefined'\n ? (document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n )?.shadowRoot ??\n self[shadowRootKey] ??\n null)\n : null;\n self[shadowRootKey] = null;\n return ssrShadowRoot;\n });\n const htmlRef = useRef<string | null>(\n typeof document !== 'undefined'\n ? (document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n )?.shadowRoot?.innerHTML ??\n document.getElementById(`__REMOTE_COMPONENT${name}`)?.innerHTML ??\n document.querySelector(`div[data-bundle][data-route][id^=\"${name}\"]`)\n ?.innerHTML ??\n document.querySelector('div[data-bundle][data-route]')?.innerHTML)\n : null,\n );\n const endTemplateRef = useRef<HTMLTemplateElement | null>(null);\n // collect initial content that needs to be removed after remote component renders\n const childrenRef = useRef(\n typeof document !== 'undefined'\n ? (() => {\n let el = document.querySelector(`template[id=\"${name}_start\"]`);\n const elements = [];\n while (el && el.id !== `${name}_end`) {\n if (\n el.id !== `${name}_start` &&\n !el.getAttribute('data-remote-component')\n ) {\n elements.push(el);\n }\n el = el.nextElementSibling as HTMLTemplateElement | null;\n }\n return elements;\n })()\n : [],\n );\n const prevSrcRef = useRef<string | URL | null>(null);\n const componentHydrationHtml = useRef<string | null>(null);\n const prevIsRemoteComponentRef = useRef<boolean>(false);\n const prevUrlRef = useRef<URL | null>(null);\n const prevRemoteComponentContainerRef = useRef<HTMLDivElement | null>(null);\n const unmountRef = useRef<Set<MountOrUnmountFunction> | null>(null);\n const prevNameRef = useRef<string | undefined>(undefined);\n\n useLayoutEffect(() => {\n // clear initial content\n if (childrenRef.current.length > 0 && remoteComponent) {\n childrenRef.current.forEach((el) => {\n el.remove();\n });\n childrenRef.current = [];\n }\n\n if (\n isolate !== false &&\n typeof document !== 'undefined' &&\n (!shadowRoot || !shadowRoot.isConnected)\n ) {\n const self = globalThis as Record<\n `__remote_components_shadowroot_${string}`,\n ShadowRoot | null\n >;\n const shadowRootKey =\n `__remote_components_shadowroot_${keySuffix}` as const;\n\n let shadowRootElement: ShadowRoot | null = null;\n const element = document.querySelector(\n `[data-remote-component-id=\"shadowroot_${keySuffix}\"]`,\n );\n shadowRootElement = self[shadowRootKey] ?? 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 try {\n shadowRootElement = element.attachShadow({ mode });\n self[shadowRootKey] = shadowRootElement;\n } catch {\n // do nothing if attachShadow fails because of existing shadow root\n }\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 }, [isolate, shadowRoot, remoteComponent, mode, keySuffix]);\n\n useLayoutEffect(() => {\n if (shadowRoot && remoteComponent) {\n const resetStyles = shadowRoot.querySelectorAll(\n 'style[data-remote-components-reset]',\n );\n // ensure we only have one reset style in the shadow root\n if (resetStyles.length > 1) {\n resetStyles.forEach((style, index) => {\n if (\n index > 0 &&\n style.getAttribute('data-remote-components-reset') !== 'react'\n ) {\n style.remove();\n }\n });\n }\n\n // clear the html ref after hydration\n htmlRef.current = null;\n\n // clear all nodes except links and styles until the start marker\n // the marker gets only rendered on hydration\n let el: ChildNode | null = shadowRoot.childNodes[0] ?? null;\n while (el && (!('id' in el) || el.id !== `${name}_start`)) {\n const nextEl = el.nextSibling;\n if (el.nodeName !== 'LINK' && el.nodeName !== 'STYLE') {\n el.parentNode?.removeChild(el);\n }\n el = nextEl;\n }\n }\n }, [shadowRoot, remoteComponent, name]);\n\n useEffect(() => {\n if (src && src !== prevSrcRef.current) {\n const previousSrc = prevSrcRef.current;\n const previousName = prevNameRef.current;\n prevSrcRef.current = src;\n\n onBeforeLoad?.(src);\n\n startTransition(async () => {\n try {\n let html = getRemoteComponentHtml(\n htmlRef.current ??\n (endTemplateRef.current?.previousElementSibling?.tagName === 'div'\n ? endTemplateRef.current.previousElementSibling.innerHTML\n : ''),\n );\n\n if (!html && src) {\n // fetch the remote component\n const fetchInit = {\n method: 'GET',\n headers: remoteFetchHeaders(additionalHeaders),\n credentials,\n } as RequestInit;\n\n const res = await fetch(url, fetchInit);\n\n if (!res.ok) {\n let error: Error = failedToFetchRemoteComponentError(url.href, {\n cause: new Error(`${res.status} ${res.statusText}`),\n });\n try {\n const body = await res.text();\n const parser = new DOMParser();\n const doc = parser.parseFromString(body, 'text/html');\n const errorTemplate = doc.querySelector(\n 'template[data-next-error-message]',\n );\n const errorMessage = errorTemplate?.getAttribute(\n 'data-next-error-message',\n );\n const errorStack = errorTemplate?.getAttribute(\n 'data-next-error-stack',\n );\n\n if (errorMessage) {\n error = new RemoteComponentsError(errorMessage);\n if (errorStack) {\n error.stack = errorStack;\n }\n }\n } catch {\n // ignore\n }\n\n throw error;\n }\n\n // get the full HTML content as a string\n const remoteHtml = await res.text();\n htmlRef.current = remoteHtml;\n html = getRemoteComponentHtml(remoteHtml);\n }\n\n // create a virtual element which will be used to parse the HTML and extract the component and RSC flight data\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text/html');\n\n if (\n (doc.querySelectorAll('div[data-bundle][data-route]').length > 1 &&\n !doc.querySelector(\n `div[data-bundle][data-route][id^=\"${name}\"]`,\n )) ||\n (doc.querySelectorAll('remote-component:not([src])').length > 1 &&\n !doc.querySelector(`remote-component[name=\"${name}\"]`))\n ) {\n throw multipleRemoteComponentsError(url.href);\n }\n\n // reference to the remote component content\n const component =\n doc.querySelector(`div[data-bundle][data-route][id^=\"${name}\"]`) ??\n // fallback to the first element with the data-bundle and data-route attributes when not using a named remote component\n doc.querySelector('div[data-bundle][data-route]') ??\n // fallback to Next.js Pages Router\n doc.querySelector('div#__next') ??\n // fallback to the remote-component web component\n doc.querySelector(`remote-component[name=\"${name}\"]:not([src])`) ??\n doc.querySelector('remote-component:not([src])');\n const nextData = JSON.parse(\n (\n doc.querySelector('#__NEXT_DATA__') ??\n doc.querySelector('#__REMOTE_NEXT_DATA__')\n )?.textContent ?? 'null',\n ) as {\n props: {\n pageProps: Record<string, unknown>;\n __REMOTE_COMPONENT__?: {\n bundle: string;\n runtime: 'turbopack' | 'webpack' | 'script';\n shared?: Record<string, string>;\n };\n };\n page: string;\n buildId: string;\n } | null;\n\n const remoteName =\n component?.getAttribute('id')?.replace(/_ssr$/, '') ||\n (nextData ? '__next' : name);\n // reference to the RSC flight data\n const rsc = doc.querySelector(`#${remoteName}_rsc`);\n\n // reference to the bundle containing the client components\n const bundle =\n component?.getAttribute('data-bundle') ||\n nextData?.props.__REMOTE_COMPONENT__?.bundle ||\n 'default';\n\n const isRemoteComponent =\n component?.tagName.toLowerCase() === 'remote-component';\n\n const metadata = {\n name: remoteName,\n bundle,\n route:\n component?.getAttribute('data-route') ??\n nextData?.page ??\n (url.pathname || DEFAULT_ROUTE),\n runtime: (component?.getAttribute('data-runtime') ??\n (nextData?.props.__REMOTE_COMPONENT__?.runtime ||\n RUNTIME_SCRIPT)) as RemoteComponentPropsType['runtime'],\n };\n\n const remoteSharedEl = doc.querySelector(\n `#${remoteName}_shared[data-remote-components-shared]`,\n );\n const remoteShared =\n nextData?.props.__REMOTE_COMPONENT__?.shared ??\n ((JSON.parse(remoteSharedEl?.textContent ?? '{}') ?? {}) as Record<\n string,\n string\n >);\n remoteSharedEl?.remove();\n\n if (!component || !(rsc || nextData || isRemoteComponent)) {\n throw new RemoteComponentsError(\n `Remote Component not found on ${url.href}.${\n remoteName !== '__vercel_remote_component'\n ? `The name for the <RemoteComponent> is \"${remoteName}\". Check <RemoteComponent> usage.`\n : ''\n } Did you forget to wrap the content in <RemoteComponent>?`,\n );\n }\n\n if (prevIsRemoteComponentRef.current) {\n if (shadowRoot) {\n shadowRoot.innerHTML = '';\n }\n const self = globalThis as typeof globalThis &\n RemoteComponentMountUnmount;\n const prevUrl = prevUrlRef.current;\n if (\n prevUrl &&\n self.__remote_script_entrypoint_unmount__?.[prevUrl.href]\n ) {\n const unmountPromises = Promise.all(\n Array.from(unmountRef.current ?? []).map(async (unmount) =>\n unmount(\n shadowRoot ?? prevRemoteComponentContainerRef.current,\n ),\n ),\n );\n unmountRef.current = null;\n await unmountPromises;\n }\n }\n prevIsRemoteComponentRef.current = isRemoteComponent;\n prevUrlRef.current = url;\n prevNameRef.current = remoteName;\n\n // update all relative URLs to absolute URLs based on the remote component URL\n applyOriginToNodes(doc, url);\n\n // reference to all link elements in the remote component\n const links = Array.from(\n doc.querySelectorAll<HTMLLinkElement>('link[href]'),\n )\n .filter((link) => {\n return !component.contains(link);\n })\n .map((link) => ({\n href: new URL(link.getAttribute('href') ?? link.href, url).href,\n ...link\n .getAttributeNames()\n .reduce<Record<string, string>>((acc, key) => {\n if (key !== 'href') {\n acc[attrToProp[key] ?? key] = link.getAttribute(key) ?? '';\n }\n return acc;\n }, {}),\n }));\n\n const scripts = (\n isRemoteComponent ? component : doc\n ).querySelectorAll<HTMLScriptElement>('script[src],script[data-src]');\n\n // handle inline scripts in the remote component\n const inlineScripts = (\n isRemoteComponent ? component : doc\n ).querySelectorAll(\n \"script:not([src]):not([data-src]):not([id*='_rsc']):not([id='__NEXT_DATA__']):not([id='__REMOTE_NEXT_DATA__'])\",\n );\n\n if (!isRemoteComponent) {\n // Next.js Script support\n const self = globalThis as typeof globalThis & {\n __next_s: [string, Record<string, string>][];\n };\n const prevNextScripts = self.__next_s;\n const nextScripts = [] as [string, Record<string, string>][];\n // eslint-disable-next-line camelcase\n self.__next_s = nextScripts;\n\n await Promise.all(\n Array.from(inlineScripts)\n .filter(\n (script) =>\n !(\n script.id.endsWith('_shared') &&\n script.getAttribute('type') === 'application/json' &&\n typeof script.getAttribute(\n 'data-remote-components-shared',\n ) === 'string'\n ),\n )\n .map((script) => {\n return new Promise((resolve) => {\n // only handle inline scripts with content, but not Next.js RSC scripts\n if (\n script.textContent &&\n !script.textContent.includes('self.__next_f=') &&\n !script.textContent.includes('self.__next_f.push')\n ) {\n // if script is inline javascript, then execute using blob\n if (\n !script.getAttribute('type') ||\n script.getAttribute('type') === 'text/javascript' ||\n script.getAttribute('type') === 'application/javascript'\n ) {\n const newScript = document.createElement('script');\n\n // scripts loaded from external sources needs this workaround\n const blob = new Blob([script.textContent], {\n type: 'application/javascript',\n });\n const blobUrl = URL.createObjectURL(blob);\n\n newScript.onload = () => {\n resolve(undefined);\n // script executed and safe to remove\n URL.revokeObjectURL(blobUrl);\n newScript.remove();\n };\n // on error we still want to resolve to not block the remote component loading\n newScript.onerror = () => {\n URL.revokeObjectURL(blobUrl);\n newScript.remove();\n resolve(undefined);\n };\n\n newScript.src = blobUrl;\n document.body.appendChild(newScript);\n } else {\n resolve(undefined);\n document.body.appendChild(script);\n }\n } else {\n resolve(undefined);\n }\n });\n }),\n );\n // process the remote component Next.js Script container\n nextScripts.forEach(([scriptSrc, props]) => {\n const script = document.createElement('script');\n // when we have a script src, apply it (inline scripts have `0` as src)\n if (scriptSrc) {\n script.src = scriptSrc;\n }\n // apply Script props\n if (typeof props.children === 'string') {\n script.textContent = props.children;\n }\n setAttributesFromProps(script, props);\n document.head.appendChild(script);\n });\n // restore previous Next.js Script container\n // eslint-disable-next-line camelcase\n self.__next_s = prevNextScripts;\n }\n\n let rscName;\n if (rsc) {\n rscName = `__remote_component_rsc_${escapeString(\n id,\n )}_${escapeString(remoteName)}`;\n rsc.textContent =\n rsc.textContent?.replace(\n new RegExp(`self\\\\[\"${remoteName}\"\\\\]`, 'g'),\n `self[\"${rscName}\"]`,\n ) ?? '';\n document.body.appendChild(rsc);\n }\n\n const newData = {\n ...metadata,\n links,\n remoteShared,\n src: typeof src === 'string' ? src : src.href,\n serverUrl: url.href,\n data: rsc\n ? (rsc.textContent || '').split('\\n').filter(Boolean)\n : [],\n };\n\n componentHydrationHtml.current = `${Array.from(\n doc.querySelectorAll('link,style'),\n )\n .map((link) => link.outerHTML)\n .join('')}${\n reset\n ? `<style data-remote-components-reset=\"\">:host { all: initial; }</style>`\n : ''\n }${component.innerHTML}`;\n\n const userShared = await shared;\n\n if ('__remote_components_missing_shared__' in userShared) {\n userShared.__remote_components_missing_shared__().catch((e) => {\n throw e;\n });\n } else if ('__remote_components_missing_shared__' in remoteShared) {\n throw new RemoteComponentsError(\n remoteShared.__remote_components_missing_shared__,\n );\n }\n\n if (isRemoteComponent) {\n // Only call onChange when not on first load (matching HTML implementation)\n if (previousSrc !== null) {\n onChange?.({\n previousSrc,\n nextSrc: src,\n previousName,\n nextName: remoteName,\n });\n }\n setData(newData);\n if (shadowRoot) {\n let shadowRootHtml = component.innerHTML;\n if (reset) {\n shadowRootHtml = `<style data-remote-components-reset=\"\">:host { all: initial; }</style>${shadowRootHtml}`;\n }\n shadowRoot.innerHTML = shadowRootHtml;\n setRemoteComponent(null);\n const { mount, unmount } = await loadStaticRemoteComponent(\n Array.from(shadowRoot.querySelectorAll('script')),\n url,\n );\n unmountRef.current = unmount;\n await Promise.all(\n Array.from(mount).map((mountFn) => mountFn(shadowRoot)),\n );\n onLoad?.(src);\n } else if (isolate === false) {\n setRemoteComponent(\n // TODO: remove wrapper div by converting HTML to RSC or React tree\n <div\n dangerouslySetInnerHTML={{ __html: component.innerHTML }}\n ref={prevRemoteComponentContainerRef}\n />,\n );\n const { mount, unmount } = await loadStaticRemoteComponent(\n Array.from(component.querySelectorAll('script')),\n url,\n );\n unmountRef.current = unmount;\n await Promise.all(\n Array.from(mount).map((mountFn) =>\n mountFn(prevRemoteComponentContainerRef.current),\n ),\n );\n onLoad?.(src);\n }\n } else {\n const result = await loadRemoteComponent({\n url,\n name: remoteName,\n rscName,\n bundle,\n route: metadata.route,\n runtime: metadata.runtime,\n data: newData.data,\n nextData,\n scripts: Array.from(scripts).map((script) => {\n const scriptSrc =\n script.getAttribute('data-src') ||\n script.getAttribute('src') ||\n script.src;\n const { prefix, id: path } = REMOTE_COMPONENT_REGEX.exec(\n scriptSrc,\n )?.groups ?? {\n prefix: undefined,\n id: scriptSrc,\n };\n return {\n src: new URL(\n `${prefix ?? ''}${path}`.replace(\n /(?<char>[^:])(?<double>\\/\\/)/g,\n '$1/',\n ),\n url,\n ).href,\n };\n }),\n shared: {\n ...sharedPolyfills(userShared),\n ...userShared,\n },\n remoteShared,\n container: shadowRoot,\n });\n if (rsc) {\n rsc.remove();\n }\n\n setData(newData);\n // Only call onChange when not on first load (matching HTML implementation)\n if (previousSrc !== null) {\n onChange?.({\n previousSrc,\n nextSrc: src,\n previousName,\n nextName: remoteName,\n });\n }\n if (result.error) {\n setRemoteComponent(result.error);\n onError?.(result.error);\n } else {\n setRemoteComponent(result.component);\n onLoad?.(src);\n }\n }\n } catch (error) {\n setRemoteComponent(error as Error);\n onError?.(error);\n }\n });\n }\n }, [\n url,\n src,\n isolate,\n credentials,\n name,\n shared,\n shadowRoot,\n additionalHeaders,\n reset,\n id,\n onBeforeLoad,\n onLoad,\n onError,\n onChange,\n ]);\n\n if (remoteComponent instanceof Error) {\n throw remoteComponent;\n }\n\n const metadataJson = (\n <script data-remote-component type=\"application/json\">\n {JSON.stringify({\n name: data?.name || name,\n bundle: data?.bundle || 'default',\n route: data?.route || DEFAULT_ROUTE,\n runtime: prevIsRemoteComponentRef.current\n ? RUNTIME_SCRIPT\n : data?.runtime || RUNTIME_WEBPACK,\n })}\n </script>\n );\n const resetStyle = reset ? (\n <style data-remote-components-reset=\"react\">{`:host { all: initial; }`}</style>\n ) : null;\n const linksToRender: React.ReactNode[] | null =\n data?.links?.map((link) => (\n <link\n {...link}\n href={new URL(link.href as string, url).href}\n key={JSON.stringify(link)}\n />\n )) || null;\n const componentToRender = (\n <>\n {resetStyle}\n {linksToRender}\n {remoteComponent ?? children}\n </>\n );\n\n if (componentHydrationHtml.current && shadowRoot && !shadowRoot.innerHTML) {\n shadowRoot.innerHTML = componentHydrationHtml.current;\n componentHydrationHtml.current = null;\n\n if (prevIsRemoteComponentRef.current) {\n // ensure we load static resources when hydrating a remote component in shadow DOM\n loadStaticRemoteComponent(\n Array.from(shadowRoot.querySelectorAll('script')),\n url,\n )\n .then(({ mount }) => {\n return Promise.all(\n Array.from(mount).map((mountFn) => mountFn(shadowRoot)),\n );\n })\n .then(() => {\n if (src) {\n onLoad?.(src);\n }\n })\n .catch((e) => {\n const error = new RemoteComponentsError(\n `Error mounting remote component from \"${url.href}\"`,\n {\n cause: e,\n },\n );\n setRemoteComponent(error);\n onError?.(error);\n });\n }\n }\n\n if (isolate !== false) {\n const shadowRemoteComponentHtml =\n shadowRoot?.querySelector(`#__REMOTE_COMPONENT${name}`) ??\n shadowRoot?.querySelector('div[data-bundle][data-route]');\n if (shadowRemoteComponentHtml) {\n shadowRemoteComponentHtml.remove();\n }\n\n return (\n <>\n {metadataJson}\n <div\n data-remote-component-id={`shadowroot_${keySuffix}`}\n id={`shadowroot_${data?.name ?? name}`}\n ref={shadowRootContainerRef}\n >\n {typeof document === 'undefined' ? (\n // eslint-disable-next-line react/no-unknown-property\n <template shadowrootmode={mode}>\n {typeof document === 'undefined' ? (\n <div\n dangerouslySetInnerHTML={{\n __html: `<img\n alt=\"\" decoding=\"async\" style=\"display:none\"\n src=\"data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==\"\n onload=\"(function(el){\n const root = el.getRootNode();\n globalThis.__remote_components_shadowroot_${keySuffix} = root;\n el.parentElement.remove();\n })(this)\"\n />`,\n }}\n />\n ) : null}\n {resetStyle}\n {linksToRender}\n {children}\n </template>\n ) : null}\n {shadowRoot && remoteComponent\n ? createPortal(\n <>\n <template id={`${name}_start`} />\n {resetStyle}\n {linksToRender}\n {remoteComponent}\n <template id={`${name}_end`} ref={endTemplateRef} />\n </>,\n shadowRoot,\n )\n : null}\n </div>\n </>\n );\n }\n htmlRef.current = null;\n\n // render start/end markers for the remote component\n return (\n <>\n <template id={`${name}_start`} />\n {metadataJson}\n {componentToRender}\n <template id={`${name}_end`} ref={endTemplateRef} />\n </>\n );\n}\n"],"mappings":"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","names":["url","parser","doc"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "remote-components",
3
- "version": "0.0.40",
3
+ "version": "0.0.41",
4
4
  "private": false,
5
5
  "description": "Compose remote components at runtime between microfrontends applications.",
6
6
  "keywords": [
@@ -182,8 +182,8 @@
182
182
  "react": "^19.2.1",
183
183
  "react-dom": "^19.2.1",
184
184
  "react-property": "^2.0.2",
185
- "react-server-dom-turbopack": "^19.1.0",
186
- "react-server-dom-webpack": "^19.1.0",
185
+ "react-server-dom-turbopack": "^19.2.1",
186
+ "react-server-dom-webpack": "^19.2.1",
187
187
  "style-to-js": "^1.1.16",
188
188
  "tsconfig-paths-webpack-plugin": "^4.2.0",
189
189
  "web-streams-polyfill": "^4.2.0",