remote-components 0.4.3 → 0.4.5

package/dist/host/html.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/host/html/index.tsx","../../src/host/html/attach-styles.ts","../../src/host/html/runtime/index.ts"],"sourcesContent":["import { startTransition, useLayoutEffect } from 'react';\nimport { hydrateRoot } from 'react-dom/client';\nimport { fetchWithHooks } from '#internal/host/server/fetch-with-hooks';\nimport { getClientOrServerUrl } from '#internal/host/server/get-client-or-server-url';\nimport type {\n  ConsumeClientConfig,\n  ConsumeServerConfig,\n} from '#internal/host/shared/config';\nimport {\n  type LifecycleEmitter,\n  makeEventEmitter,\n} from '#internal/host/shared/lifecycle';\nimport { preparePipeline } from '#internal/host/shared/pipeline';\nimport type { HostState } from '#internal/host/shared/state';\nimport { createHostState } from '#internal/host/shared/state';\nimport { resolveNameFromSrc } from '#internal/host/utils/resolve-name-from-src';\nimport {\n  DEFAULT_BUNDLE_NAME,\n  DEFAULT_COMPONENT_NAME,\n} from '#internal/runtime/constants';\nimport { getNamespace } from '#internal/runtime/namespace';\nimport { createRSCStream } from '#internal/runtime/rsc';\nimport type { RSCKey } from '#internal/runtime/types';\nimport { bindResolveClientUrl } from '#internal/runtime/url/default-resolve-client-url';\nimport { escapeString } from '#internal/utils';\nimport { isAbortError } from '#internal/utils/abort';\nimport {\n  errorFromFailedFetch,\n  RemoteComponentsError,\n} from '#internal/utils/error';\nimport { logError } from '#internal/utils/logger';\nimport { attachStyles } from './attach-styles';\nimport { getRuntime, type Runtime } from './runtime';\n\nif (typeof HTMLElement !== 'undefined') {\n  /**\n   * `<remote-component>` custom element — the HTML host implementation.\n   *\n   * Implements {@link ConsumeClientConfig}\n   * via typed property accessors that reflect to/from DOM attributes.\n   *\n   * {@link ConsumeLifecycleCallbacks} are dispatched as DOM events:\n   * `beforeload`, `load`, `error`, `change`.\n   */\n  class RemoteComponent extends HTMLElement implements ConsumeClientConfig {\n    name: string = DEFAULT_COMPONENT_NAME;\n    bundle: string = DEFAULT_BUNDLE_NAME;\n    fallbackSlot?: HTMLSlotElement;\n    __next: HTMLDivElement | null = null;\n    fouc: HTMLStyleElement | null = null;\n    hostState: HostState = createHostState();\n    root?: ShadowRoot | null = null;\n    reactRoot?: ReturnType<typeof hydrateRoot>;\n    emitter: LifecycleEmitter = makeEventEmitter(this);\n    onRequest?: ConsumeServerConfig['onRequest'];\n    onResponse?: ConsumeServerConfig['onResponse'];\n    resolveClientUrl?: ConsumeClientConfig['resolveClientUrl'];\n\n    // -- ConsumeServerConfig property accessors (attribute-reflected) --\n\n    get src(): string | URL | undefined {\n      return this.getAttribute('src') ?? undefined;\n    }\n\n    set src(value: string | URL | undefined) {\n      if (value == null) {\n        this.removeAttribute('src');\n      } else {\n        this.setAttribute('src', String(value));\n      }\n    }\n\n    /** Always `true` — the HTML host always isolates via Shadow DOM. */\n    get isolate(): boolean {\n      return true;\n    }\n\n    get mode(): 'open' | 'closed' | undefined {\n      const attr = this.getAttribute('mode');\n      return attr === 'closed' ? 'closed' : 'open';\n    }\n\n    set mode(value: 'open' | 'closed' | undefined) {\n      if (value) {\n        this.setAttribute('mode', value);\n      }\n    }\n\n    get reset(): boolean | undefined {\n      return this.getAttribute('reset') !== null;\n    }\n\n    set reset(value: boolean | undefined) {\n      if (value) {\n        this.setAttribute('reset', '');\n      } else {\n        this.removeAttribute('reset');\n      }\n    }\n\n    get credentials(): RequestCredentials | undefined {\n      return (this.getAttribute('credentials') ||\n        'same-origin') as RequestCredentials;\n    }\n\n    set credentials(value: RequestCredentials | undefined) {\n      if (value) {\n        this.setAttribute('credentials', value);\n      } else {\n        this.removeAttribute('credentials');\n      }\n    }\n\n    static get observedAttributes() {\n      return ['src', 'name', 'mode'];\n    }\n\n    attributeChangedCallback(name: string, oldValue: string, newValue: string) {\n      if ((name === 'src' || name === 'name') && oldValue !== newValue) {\n        if (this.src) {\n          this.load().catch((e) => {\n            // AbortError is expected when loading is cancelled - don't log or dispatch\n            if (isAbortError(e)) {\n              return;\n            }\n            logError('HtmlHost', 'Error loading remote component.', e);\n            this.emitter.error(e, this.src);\n            this.hostState.stage = 'error';\n          });\n        }\n      } else if (name === 'mode' && oldValue !== newValue && this.root) {\n        // changing the shadow DOM mode is not supported\n        // we need to recreate the shadow DOM and reload the component\n        const newRoot = this.attachShadow({\n          mode: newValue === 'closed' ? 'closed' : 'open',\n        });\n        // move all existing children to the new shadow root\n        Array.from(this.root.children).forEach((child) => {\n          newRoot.appendChild(child);\n        });\n        this.root = newRoot;\n        // reload the remote component to apply the new shadow DOM\n        this.load().catch((e) => {\n          // AbortError is expected when loading is cancelled - don't log or dispatch\n          if (isAbortError(e)) {\n            return;\n          }\n          logError('HtmlHost', 'Error reloading remote component.', e);\n          this.emitter.error(e, this.src);\n        });\n      }\n    }\n\n    async load() {\n      // wait for the current call stack to finish\n      await new Promise((resolve) => {\n        (typeof queueMicrotask === 'function'\n          ? queueMicrotask\n          : requestAnimationFrame)(() => {\n          resolve(undefined);\n        });\n      });\n\n      // Abort any in-progress load so the latest src always wins.\n      if (this.hostState.stage === 'loading') {\n        this.hostState.abortController?.abort();\n        this.hostState.stage = 'idle';\n        // The aborted load may have already appended partial content to the shadow DOM\n        // (styles, component children) before reaching an isCurrentLoad() check.\n        // Clear it now so the new load starts from a clean state. Skip this when a\n        // React root exists — that means a previous load completed successfully and\n        // we'll take the startTransition re-render path instead.\n        if (this.root && !this.reactRoot) {\n          this.root.innerHTML = '';\n          this.fouc = null;\n          this.fallbackSlot = document.createElement('slot');\n          this.root.appendChild(this.fallbackSlot);\n        }\n      }\n\n      if (!this.root) {\n        this.root = this.attachShadow({\n          mode: this.mode === 'closed' ? 'closed' : 'open',\n        });\n\n        // create a slot element to allow the remote component to use the default slot\n        this.fallbackSlot = document.createElement('slot');\n        this.root.appendChild(this.fallbackSlot);\n      }\n\n      this.name = this.getAttribute('name') || this.name;\n\n      this.hostState.stage = 'loading';\n      const src = this.src;\n\n      // Create AbortController for this load operation\n      this.hostState.abortController = new AbortController();\n      const signal = this.hostState.abortController.signal;\n\n      // Returns true if this is still the active load — the signal hasn't been\n      // aborted by a newer load() call, and the src hasn't changed in the meantime.\n      // Checking the signal (not just the src) handles the case where the user\n      // cycles back to the same src (e.g. styled → basic → styled): both loads\n      // share the same src string, so a src-only check would pass for both,\n      // causing double renders.\n      const isCurrentLoad = () => !signal.aborted && this.src === src;\n\n      // Resets stage to 'idle' for expected cancellations (AbortError). Real\n      // errors are thrown and caught by attributeChangedCallback which sets\n      // stage to 'error'. Only resets if no newer load() has superseded this\n      // one — a new load replaces the abortController so the signal comparison\n      // fails, preventing us from clobbering the new load's stage.\n      const abandonLoad = () => {\n        if (\n          this.hostState.abortController?.signal === signal &&\n          this.hostState.stage === 'loading'\n        ) {\n          this.hostState.stage = 'idle';\n        }\n      };\n\n      this.emitter.beforeLoad(src ?? '');\n\n      const remoteComponentChild =\n        this.querySelector('div#__REMOTE_COMPONENT__') ||\n        this.querySelector('div[data-bundle][data-route]');\n\n      if (!src && !remoteComponentChild) {\n        throw new RemoteComponentsError('\"src\" attribute is required');\n      }\n\n      let url: URL | null = null;\n      let html = this.innerHTML;\n\n      if (src) {\n        url = getClientOrServerUrl(src, window.location.href);\n        this.name = resolveNameFromSrc(src, this.name);\n      }\n\n      const resolveClientUrl = url\n        ? bindResolveClientUrl(this.resolveClientUrl, url.href)\n        : undefined;\n\n      if (!remoteComponentChild && url) {\n        // fetch the remote component\n        const fetchInit = {\n          credentials: this.credentials || 'same-origin',\n        } as RequestInit;\n\n        const resolvedUrl = new URL(\n          resolveClientUrl?.(url.href) ?? url.href,\n          window.location.href,\n        );\n        let res: Response;\n        try {\n          res = await fetchWithHooks(resolvedUrl, fetchInit, {\n            onRequest: this.onRequest,\n            onResponse: this.onResponse,\n            abortController: this.hostState.abortController,\n          });\n        } catch (e) {\n          if (isAbortError(e)) {\n            return abandonLoad();\n          }\n          throw e;\n        }\n\n        if (!res || !res.ok) {\n          throw await errorFromFailedFetch(url.href, resolvedUrl, res);\n        }\n\n        // get the full HTML content as a string - race with abort signal\n        try {\n          html = await res.text();\n        } catch (e) {\n          if (isAbortError(e)) {\n            return abandonLoad();\n          }\n          throw e;\n        }\n        if (!isCurrentLoad()) {\n          return abandonLoad();\n        }\n      }\n\n      const effectiveUrl = url ?? new URL(window.location.href);\n      const { doc, parsed } = preparePipeline({\n        html,\n        name: this.name,\n        url: effectiveUrl,\n        shared: {},\n        resolveClientUrl,\n      });\n      const {\n        component,\n        name: resolvedName,\n        isRemoteComponent,\n        metadata: parsedMetadata,\n        nextData,\n        rsc,\n        remoteShared,\n      } = parsed;\n\n      // when using a Next.js Pages Router remote application in development mode\n      // we hide the remote component to prevent flickering\n      // until the CSS is loaded for the remote component\n      if (nextData && nextData.buildId === 'development' && !this.reactRoot) {\n        this.fouc = document.createElement('style');\n        this.fouc.textContent = `:host { display: none; }`;\n        this.root.appendChild(this.fouc);\n      }\n\n      this.name = resolvedName;\n      this.bundle = parsedMetadata.bundle;\n\n      if (url) {\n        getNamespace().bundleUrls[this.bundle] = url;\n      }\n\n      // add remote component metadata information at the custom element\n      const metadataEl = document.createElement('script');\n      metadataEl.type = 'application/json';\n      metadataEl.setAttribute('data-remote-component', '');\n      const metadataObj = {\n        name: this.name,\n        bundle: this.bundle,\n        route: parsedMetadata.route,\n        runtime: parsedMetadata.runtime,\n      };\n      metadataEl.textContent = JSON.stringify(metadataObj);\n\n      if (\n        this.previousElementSibling?.getAttribute('data-remote-component') !==\n        null\n      ) {\n        this.previousElementSibling?.remove();\n      }\n      this.parentElement?.insertBefore(metadataEl, this);\n\n      if (this.hostState.prevIsRemoteComponent) {\n        if (this.hostState.prevUrl) {\n          const prevUrl = this.hostState.prevUrl;\n          const nsUnmount = getNamespace();\n          if (nsUnmount.unmountFns[prevUrl.href]) {\n            // call unmount() for all registered unmount functions for the previous remote component\n            await Promise.all(\n              Array.from(nsUnmount.unmountFns[prevUrl.href] ?? []).map(\n                async (unmount) => {\n                  try {\n                    await unmount(this.root);\n                  } catch (e) {\n                    logError(\n                      'HtmlHost',\n                      `Error while calling unmount() for Remote Component from ${prevUrl.href}.`,\n                      e,\n                    );\n                  }\n                },\n              ),\n            );\n            if (!isCurrentLoad()) {\n              return abandonLoad();\n            }\n          }\n        }\n        this.root.innerHTML = '';\n      }\n      // Dispatch change event if this is not the first load\n      if (this.hostState.prevSrc !== undefined) {\n        this.emitter.change({\n          previousSrc: this.hostState.prevSrc ?? null,\n          nextSrc: src ?? null,\n          previousName: this.hostState.prevName,\n          nextName: this.name,\n        });\n      }\n\n      this.hostState.prevUrl = effectiveUrl;\n      this.hostState.prevIsRemoteComponent = isRemoteComponent;\n      this.hostState.prevSrc = src;\n      this.hostState.prevName = this.name;\n\n      // store the original loading content of the custom element\n      // this is required to remove the loading content after the remote component is loaded\n      const removable = Array.from(this.childNodes);\n\n      // reference to all link elements in the remote component\n      const links = doc.querySelectorAll<HTMLLinkElement>('link[href]');\n\n      const remoteComponentSrc = this.src ? String(this.src) : null;\n\n      // Bound function for attaching styles — used both initially and in React effects\n      const doAttachStyles = () =>\n        attachStyles({\n          doc,\n          component,\n          links,\n          signal: undefined, // Effects run after load, no abort needed\n          baseUrl: url?.href,\n          remoteComponentSrc,\n          root: this.root ?? null,\n          resolveClientUrl,\n        });\n\n      if (!this.reactRoot) {\n        // ensure all styles are loaded before hydrating to prevent FOUC\n        await attachStyles({\n          doc,\n          component,\n          links,\n          signal,\n          baseUrl: url?.href,\n          remoteComponentSrc,\n          root: this.root,\n          resolveClientUrl,\n        });\n        if (!isCurrentLoad()) {\n          return abandonLoad();\n        }\n      }\n\n      if (!this.reactRoot) {\n        // attach the remote component content to the shadow DOM\n        Array.from(component.children).forEach((el) => {\n          if (!isRemoteComponent && el.tagName.toLowerCase() === 'script') {\n            const newScript = document.createElement('script');\n            // copy all attributes\n            for (const attr of el.attributes) {\n              if (attr.name === 'src') {\n                const absoluteSrc = new URL(\n                  attr.value,\n                  url ?? window.location.origin,\n                ).href;\n                newScript.setAttribute(\n                  attr.name,\n                  resolveClientUrl?.(absoluteSrc) ?? absoluteSrc,\n                );\n              } else {\n                newScript.setAttribute(attr.name, attr.value);\n              }\n            }\n            newScript.textContent = el.textContent;\n            if (remoteComponentSrc) {\n              newScript.setAttribute(\n                'data-remote-component-src',\n                remoteComponentSrc,\n              );\n            }\n            this.root?.appendChild(newScript);\n          } else {\n            const newEl = el.cloneNode(true) as HTMLElement;\n            for (const attr of el.attributes) {\n              if (attr.name.startsWith('on')) {\n                newEl.setAttribute(attr.name, attr.value);\n              }\n            }\n            this.root?.appendChild(newEl);\n          }\n        });\n      }\n\n      // clear the loading content of the shadow DOM root\n      for (const el of removable) {\n        el.parentElement?.removeChild(el);\n      }\n      this.fallbackSlot?.remove();\n\n      // function to apply the reset styles to the shadow DOM\n      const applyReset = () => {\n        if (\n          this.reset &&\n          !this.root?.querySelector('link[data-remote-components-reset]')\n        ) {\n          // all initial styles to reset inherited styles leaking from the host page\n          const allInitial = document.createElement('link');\n          allInitial.setAttribute('data-remote-components-reset', '');\n          const css = `:host { all: initial; }`;\n          const allInitialHref = URL.createObjectURL(\n            new Blob([css], { type: 'text/css' }),\n          );\n          allInitial.href = allInitialHref;\n          allInitial.rel = 'stylesheet';\n          // we need to revoke the object URL after the stylesheet is loaded to free up memory\n          allInitial.onload = () => {\n            URL.revokeObjectURL(allInitialHref);\n            allInitial.removeAttribute('onload');\n          };\n          allInitial.onerror = () => {\n            URL.revokeObjectURL(allInitialHref);\n            allInitial.removeAttribute('onload');\n          };\n          this.root?.prepend(allInitial);\n        } else if (\n          !this.reset &&\n          this.root?.querySelector('link[data-remote-components-reset]')\n        ) {\n          this.root\n            .querySelector('link[data-remote-components-reset]')\n            ?.remove();\n        }\n      };\n\n      // apply the reset styles if required and not already applied\n      if (!this.reactRoot) {\n        applyReset();\n      }\n\n      const {\n        self,\n        createFromReadableStream,\n        nextClientPagesLoader,\n        preloadScripts,\n      } = await getRuntime(\n        metadataObj.runtime as Runtime,\n        effectiveUrl,\n        this.bundle,\n        {\n          react: async () => (await import('react')).default,\n          'react/jsx-dev-runtime': async () =>\n            (await import('react/jsx-dev-runtime')).default,\n          'react/jsx-runtime': async () =>\n            (await import('react/jsx-runtime')).default,\n          'react-dom': async () => (await import('react-dom')).default,\n          'react-dom/client': async () =>\n            (await import('react-dom/client')).default,\n        },\n        remoteShared,\n        resolveClientUrl,\n      );\n      if (!isCurrentLoad()) {\n        return abandonLoad();\n      }\n\n      const scripts = isRemoteComponent\n        ? component.querySelectorAll<HTMLScriptElement>('script')\n        : doc.querySelectorAll<HTMLScriptElement>(\n            'script[src],script[data-src],script[data-remote-component-entrypoint]',\n          );\n      if (!url) {\n        url = new URL(\n          component.getAttribute('data-route') ?? '/',\n          window.location.href,\n        );\n      }\n\n      await preloadScripts(Array.from(scripts), url, this.bundle, this.name);\n      if (!isCurrentLoad()) {\n        return abandonLoad();\n      }\n\n      // remove all script elements from the shadow DOM to prevent re-execution of scripts\n      if (isRemoteComponent) {\n        Array.from(component.children).forEach((child) => {\n          if (child.tagName === 'SCRIPT') {\n            child.remove();\n          }\n        });\n      }\n\n      // cleanup previous remote component instances when a new remote component is loaded\n      // this is required when the src attribute is changed to load a new remote component\n      const doCleanup = () => {\n        if (this.root && remoteComponentSrc) {\n          const selector = `[data-remote-component-src]:not([data-remote-component-src=\"${remoteComponentSrc}\"])`;\n          const prevCleanup = [\n            ...this.root.querySelectorAll(selector),\n            ...document.body.querySelectorAll(selector),\n          ] as HTMLElement[];\n\n          if (prevCleanup.length > 0) {\n            prevCleanup.forEach((prev) => {\n              prev.remove();\n            });\n          }\n        }\n      };\n\n      // using RSC hydration if the RSC flight data is available\n      if (rsc) {\n        // remove the RSC flight data script element\n        rsc.parentElement?.removeChild(rsc);\n\n        // reload the RSC flight data script to eval it's content\n        const rscName = `__remote_component_rsc_${escapeString(\n          url.href,\n        )}_${escapeString(this.name)}`;\n        const rscClone = document.createElement('script');\n        rscClone.id = `${rscName}_rsc`;\n        rscClone.textContent =\n          rsc.textContent?.replace(\n            new RegExp(`self\\\\[\"${this.name}\"\\\\]`, 'g'),\n            `self[\"${rscName}\"]`,\n          ) ?? '';\n        document.body.appendChild(rscClone);\n\n        let cache: React.ReactNode;\n        // React component to convert the RSC flight data into a React component\n        const RemoteComponentFromReadableStream = ({\n          name,\n          initial,\n        }: {\n          name: string;\n          initial: boolean;\n        }) => {\n          // convert the RSC flight data array into a ReadableStream\n          // get the RSC flight data from the global scope\n          // the RSC flight data is stored in an array\n          // fallback to an empty RSC payload if the data is not found\n          const stream = createRSCStream(\n            rscName,\n            self[rscName as RSCKey] ?? [`0:[null]\\n`],\n          );\n          const Component =\n            cache ??\n            // cache the component to avoid reloading the RSC flight data\n            (cache = createFromReadableStream(stream) as React.ReactNode);\n\n          useLayoutEffect(() => {\n            // clear the RSC flight data from the global scope to free up memory\n            if (self[name as RSCKey]) {\n              // eslint-disable-next-line @typescript-eslint/no-dynamic-delete\n              delete self[name as RSCKey];\n            }\n            const rscScript = document.getElementById(`${name}_rsc`);\n            if (rscScript) {\n              rscScript.remove();\n            }\n\n            doCleanup();\n            applyReset();\n            if (!initial) {\n              doAttachStyles().catch((e: unknown) => {\n                logError('HtmlHost', 'Error attaching styles.', e);\n              });\n            }\n            if (isCurrentLoad()) {\n              this.hostState.stage = 'loaded';\n            }\n\n            this.emitter.load(this.src ?? '');\n          }, [initial, name]);\n\n          // React can handle the component reference and will wait for the component to be ready\n          return Component;\n        };\n\n        // when we already have a React root, we just need to render the new component\n        if (this.reactRoot) {\n          const root = this.reactRoot;\n          startTransition(() => {\n            root.render(\n              <RemoteComponentFromReadableStream\n                initial={false}\n                name={this.name}\n              />,\n            );\n          });\n          return;\n        }\n\n        // hydrate the remote component using the RSC flight data\n        this.reactRoot = hydrateRoot(\n          // hydrateRoot expects a document or element, but it works for the shadow DOM too\n          // @ts-expect-error support for shadow DOM\n          this.root,\n          <RemoteComponentFromReadableStream initial name={this.name} />,\n        );\n      } else if (nextData) {\n        // using Next.js client pages loader if the Next.js hydration data is available\n        const { Component, App } = nextClientPagesLoader(\n          this.bundle,\n          nextData.page ?? '/',\n          this.root,\n        );\n\n        // if we have the component, we can hydrate it\n        if (Component) {\n          const RemoteComponentFromNext = ((\n            NextApp: ReturnType<typeof nextClientPagesLoader>['App'],\n            NextComponent: NonNullable<\n              ReturnType<typeof nextClientPagesLoader>['Component']\n            >,\n            remoteComponent = this,\n          ) =>\n            function RemoteComponentNext({ initial }: { initial: boolean }) {\n              useLayoutEffect(() => {\n                doCleanup();\n                if (!initial) {\n                  applyReset();\n                  doAttachStyles().catch((e: unknown) => {\n                    logError('HtmlHost', 'Error attaching styles.', e);\n                  });\n                }\n                if (isCurrentLoad()) {\n                  remoteComponent.hostState.stage = 'loaded';\n                }\n\n                remoteComponent.emitter.load(remoteComponent.src ?? '');\n              }, [initial, remoteComponent]);\n\n              return NextApp ? (\n                <NextApp Component={NextComponent} {...nextData.props} />\n              ) : (\n                <NextComponent {...nextData.props} />\n              );\n            })(App, Component, this);\n\n          // when we already have a React root, we just need to render the new component\n          if (this.reactRoot) {\n            const root = this.reactRoot;\n            startTransition(() => {\n              root.render(<RemoteComponentFromNext initial={false} />);\n              doCleanup();\n              if (isCurrentLoad()) {\n                this.hostState.stage = 'loaded';\n              }\n            });\n            return;\n          }\n\n          // hydrate the remote component using the Next.js pages router\n          this.reactRoot = hydrateRoot(\n            // hydrateRoot expects a document or element, but it works for the shadow DOM too\n            // @ts-expect-error support for shadow DOM\n            this.root,\n            <RemoteComponentFromNext initial />,\n          );\n        }\n\n        // remove the FOUC workaround style element to show the remote component\n        // this is only for development mode\n        if (this.fouc) {\n          this.root.removeChild(this.fouc);\n        }\n      } else if (getNamespace().mountFns[url.href]) {\n        // using script entrypoint when no RSC or Next.js data is available\n        await Promise.all(\n          Array.from(getNamespace().mountFns[url.href] ?? []).map(\n            async (mount) => {\n              try {\n                await mount(this.root);\n              } catch (e) {\n                logError(\n                  'HtmlHost',\n                  `Error while calling mount() for Remote Component from ${url.href}.`,\n                  e,\n                );\n              }\n            },\n          ),\n        );\n\n        this.emitter.load(this.src ?? '');\n      } else {\n        this.emitter.load(this.src ?? '');\n      }\n\n      if (isCurrentLoad()) {\n        this.hostState.stage = 'loaded';\n      }\n    }\n  }\n\n  // register the custom element\n  customElements.define('remote-component', RemoteComponent);\n}\n\nexport function registerSharedModules(\n  modules: Record<string, () => Promise<unknown>> = {},\n) {\n  const ns = getNamespace();\n  Object.entries(modules).forEach(([key, value]) => {\n    ns.hostSharedModules[key] = value;\n  });\n}\n","import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport { RemoteComponentsError } from '#internal/utils/error';\n\ninterface AttachStylesOptions {\n  /** The parsed document containing link and style elements */\n  doc: Document;\n  /** The component element to check if links are already contained */\n  component: Element;\n  /** Links from the document head */\n  links: NodeListOf<HTMLLinkElement>;\n  /** AbortSignal to cancel loading */\n  signal: AbortSignal | undefined;\n  /** Base URL for resolving relative hrefs */\n  baseUrl: string | undefined;\n  /** Source URL to set as data attribute */\n  remoteComponentSrc: string | null;\n  /** Root element to append styles to (ShadowRoot or Element) */\n  root: ShadowRoot | Element | null;\n  /** Callback to transform asset URLs before loading */\n  resolveClientUrl?: InternalResolveClientUrl;\n}\n\n/**\n * Attaches link and style elements from a remote component document to the shadow root.\n * Handles abort signals efficiently with a single shared listener for all links.\n *\n * @throws DOMException with name 'AbortError' if signal is aborted\n * @throws RemoteComponentsError if a stylesheet fails to load\n */\nexport async function attachStyles({\n  doc,\n  component,\n  links,\n  signal,\n  baseUrl,\n  remoteComponentSrc,\n  root,\n  resolveClientUrl,\n}: AttachStylesOptions): Promise<void> {\n  // Track appended links for cleanup on abort\n  const appendedLinks: HTMLLinkElement[] = [];\n\n  // Single shared abort promise - avoids N listeners for N links\n  let abortReject: ((error: DOMException) => void) | null = null;\n  const abortPromise = new Promise<never>((_, reject) => {\n    abortReject = reject;\n  });\n  const abortHandler = () => {\n    // Clean up all pending links on abort\n    for (const link of appendedLinks) {\n      link.onload = null;\n      link.onerror = null;\n      link.remove();\n    }\n    abortReject?.(new DOMException('Aborted', 'AbortError'));\n  };\n  signal?.addEventListener('abort', abortHandler, { once: true });\n\n  try {\n    // Attach each link element to the shadow DOM to load the styles\n    await Promise.all(\n      Array.from(links)\n        .filter((link) => !component.contains(link))\n        .map((link) => {\n          const newLink = document.createElement('link');\n          appendedLinks.push(newLink);\n\n          const loadPromise = new Promise<void>((resolve, reject) => {\n            if (link.rel === 'stylesheet') {\n              // TODO: needs to be cancellable with a singular listener for the abort signal https://linear.app/vercel/issue/MFES-1253/handle-abortcontroller-clean-up-scenarios\n              newLink.onload = () => resolve();\n              newLink.onerror = () =>\n                reject(\n                  new RemoteComponentsError(\n                    `Failed to load <link href=\"${link.href}\"> for Remote Component. Check the URL is correct.`,\n                  ),\n                );\n            } else {\n              resolve();\n            }\n          });\n\n          for (const attr of link.attributes) {\n            if (attr.name === 'href') {\n              const absoluteHref = new URL(\n                attr.value,\n                baseUrl ?? location.origin,\n              ).href;\n              newLink.setAttribute(\n                attr.name,\n                resolveClientUrl?.(absoluteHref) ?? absoluteHref,\n              );\n            } else {\n              newLink.setAttribute(attr.name, attr.value);\n            }\n          }\n\n          if (remoteComponentSrc) {\n            newLink.setAttribute(\n              'data-remote-component-src',\n              remoteComponentSrc,\n            );\n          }\n\n          // TODO: needs to be cancellable with a singular listener for the abort signal https://linear.app/vercel/issue/MFES-1253/handle-abortcontroller-clean-up-scenarios\n          root?.appendChild(newLink);\n\n          // Race each link load against the shared abort promise\n          return Promise.race([loadPromise, abortPromise]);\n        }),\n    );\n  } finally {\n    signal?.removeEventListener('abort', abortHandler);\n  }\n\n  // Attach inline styles from the document head\n  const styles = doc.querySelectorAll<HTMLStyleElement>('style');\n  for (const style of styles) {\n    if (style.parentElement?.tagName.toLowerCase() === 'head') {\n      const newStyle = document.createElement('style');\n      newStyle.textContent = style.textContent;\n\n      if (remoteComponentSrc) {\n        newStyle.setAttribute('data-remote-component-src', remoteComponentSrc);\n      }\n\n      root?.appendChild(newStyle);\n    }\n  }\n}\n","import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport { RemoteComponentsError } from '#internal/utils/error';\n\nexport type Runtime = 'webpack' | 'turbopack' | 'script' | 'unknown';\n\nexport async function getRuntime(\n  type: Runtime,\n  url: URL,\n  bundle: string,\n  shared?: Record<string, () => Promise<unknown>>,\n  remoteShared?: Record<string, string>,\n  resolveClientUrl?: InternalResolveClientUrl,\n) {\n  // minimally mock process.env for browser environments\n  if (typeof globalThis.process === 'undefined') {\n    globalThis.process = {\n      env: {},\n    } as NodeJS.Process;\n  }\n\n  if (type === 'webpack') {\n    const { webpackRuntime } = await import(`./webpack`);\n    return webpackRuntime(bundle, shared, remoteShared, resolveClientUrl);\n  } else if (type === 'turbopack') {\n    const { turbopackRuntime } = await import(`./turbopack`);\n    return turbopackRuntime(\n      url,\n      bundle,\n      shared,\n      remoteShared,\n      resolveClientUrl,\n    );\n  } else if (type === 'script') {\n    const { scriptRuntime } = await import(`./script`);\n    return scriptRuntime(resolveClientUrl);\n  }\n  throw new RemoteComponentsError(\n    `Remote Components runtime \"${type}\" is not supported. Supported runtimes are \"webpack\", \"turbopack\", and \"script\".`,\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/host/html/index.tsx","../../src/host/html/attach-styles.ts","../../src/host/html/runtime/index.ts"],"sourcesContent":["import { startTransition, useLayoutEffect } from 'react';\nimport { hydrateRoot } from 'react-dom/client';\nimport { fetchWithHooks } from '#internal/host/server/fetch-with-hooks';\nimport { getClientOrServerUrl } from '#internal/host/server/get-client-or-server-url';\nimport type {\n  ConsumeClientConfig,\n  ConsumeServerConfig,\n} from '#internal/host/shared/config';\nimport {\n  type LifecycleEmitter,\n  makeEventEmitter,\n} from '#internal/host/shared/lifecycle';\nimport { preparePipeline } from '#internal/host/shared/pipeline';\nimport type { HostState } from '#internal/host/shared/state';\nimport { createHostState } from '#internal/host/shared/state';\nimport { resolveNameFromSrc } from '#internal/host/utils/resolve-name-from-src';\nimport {\n  DEFAULT_BUNDLE_NAME,\n  DEFAULT_COMPONENT_NAME,\n} from '#internal/runtime/constants';\nimport { getNamespace } from '#internal/runtime/namespace';\nimport { createRSCStream } from '#internal/runtime/rsc';\nimport type { RSCKey } from '#internal/runtime/types';\nimport { bindResolveClientUrl } from '#internal/runtime/url/default-resolve-client-url';\nimport { escapeString } from '#internal/utils';\nimport { isAbortError } from '#internal/utils/abort';\nimport {\n  errorFromFailedFetch,\n  RemoteComponentsError,\n} from '#internal/utils/error';\nimport { logError } from '#internal/utils/logger';\nimport { attachStyles } from './attach-styles';\nimport { getRuntime, type Runtime } from './runtime';\n\nif (typeof HTMLElement !== 'undefined') {\n  /**\n   * `<remote-component>` custom element — the HTML host implementation.\n   *\n   * Implements {@link ConsumeClientConfig}\n   * via typed property accessors that reflect to/from DOM attributes.\n   *\n   * {@link ConsumeLifecycleCallbacks} are dispatched as DOM events:\n   * `beforeload`, `load`, `error`, `change`.\n   */\n  class RemoteComponent extends HTMLElement implements ConsumeClientConfig {\n    name: string = DEFAULT_COMPONENT_NAME;\n    bundle: string = DEFAULT_BUNDLE_NAME;\n    fallbackSlot?: HTMLSlotElement;\n    __next: HTMLDivElement | null = null;\n    fouc: HTMLStyleElement | null = null;\n    hostState: HostState = createHostState();\n    root?: ShadowRoot | null = null;\n    reactRoot?: ReturnType<typeof hydrateRoot>;\n    emitter: LifecycleEmitter = makeEventEmitter(this);\n    onRequest?: ConsumeServerConfig['onRequest'];\n    onResponse?: ConsumeServerConfig['onResponse'];\n    resolveClientUrl?: ConsumeClientConfig['resolveClientUrl'];\n\n    // -- ConsumeServerConfig property accessors (attribute-reflected) --\n\n    get src(): string | URL | undefined {\n      return this.getAttribute('src') ?? undefined;\n    }\n\n    set src(value: string | URL | undefined) {\n      if (value == null) {\n        this.removeAttribute('src');\n      } else {\n        this.setAttribute('src', String(value));\n      }\n    }\n\n    /** Always `true` — the HTML host always isolates via Shadow DOM. */\n    get isolate(): boolean {\n      return true;\n    }\n\n    get mode(): 'open' | 'closed' | undefined {\n      const attr = this.getAttribute('mode');\n      return attr === 'closed' ? 'closed' : 'open';\n    }\n\n    set mode(value: 'open' | 'closed' | undefined) {\n      if (value) {\n        this.setAttribute('mode', value);\n      }\n    }\n\n    get reset(): boolean | undefined {\n      return this.getAttribute('reset') !== null;\n    }\n\n    set reset(value: boolean | undefined) {\n      if (value) {\n        this.setAttribute('reset', '');\n      } else {\n        this.removeAttribute('reset');\n      }\n    }\n\n    get credentials(): RequestCredentials | undefined {\n      return (this.getAttribute('credentials') ||\n        'same-origin') as RequestCredentials;\n    }\n\n    set credentials(value: RequestCredentials | undefined) {\n      if (value) {\n        this.setAttribute('credentials', value);\n      } else {\n        this.removeAttribute('credentials');\n      }\n    }\n\n    static get observedAttributes() {\n      return ['src', 'name', 'mode'];\n    }\n\n    attributeChangedCallback(name: string, oldValue: string, newValue: string) {\n      if ((name === 'src' || name === 'name') && oldValue !== newValue) {\n        if (this.src) {\n          this.load().catch((e) => {\n            // AbortError is expected when loading is cancelled - don't log or dispatch\n            if (isAbortError(e)) {\n              return;\n            }\n            logError('HtmlHost', 'Error loading remote component.', e);\n            this.emitter.error(e, this.src);\n            this.hostState.stage = 'error';\n          });\n        }\n      } else if (name === 'mode' && oldValue !== newValue && this.root) {\n        // changing the shadow DOM mode is not supported\n        // we need to recreate the shadow DOM and reload the component\n        const newRoot = this.attachShadow({\n          mode: newValue === 'closed' ? 'closed' : 'open',\n        });\n        // move all existing children to the new shadow root\n        Array.from(this.root.children).forEach((child) => {\n          newRoot.appendChild(child);\n        });\n        this.root = newRoot;\n        // reload the remote component to apply the new shadow DOM\n        this.load().catch((e) => {\n          // AbortError is expected when loading is cancelled - don't log or dispatch\n          if (isAbortError(e)) {\n            return;\n          }\n          logError('HtmlHost', 'Error reloading remote component.', e);\n          this.emitter.error(e, this.src);\n        });\n      }\n    }\n\n    async load() {\n      // wait for the current call stack to finish\n      await new Promise((resolve) => {\n        (typeof queueMicrotask === 'function'\n          ? queueMicrotask\n          : requestAnimationFrame)(() => {\n          resolve(undefined);\n        });\n      });\n\n      // Abort any in-progress load so the latest src always wins.\n      if (this.hostState.stage === 'loading') {\n        this.hostState.abortController?.abort();\n        this.hostState.stage = 'idle';\n        // The aborted load may have already appended partial content to the shadow DOM\n        // (styles, component children) before reaching an isCurrentLoad() check.\n        // Clear it now so the new load starts from a clean state. Skip this when a\n        // React root exists — that means a previous load completed successfully and\n        // we'll take the startTransition re-render path instead.\n        if (this.root && !this.reactRoot) {\n          this.root.innerHTML = '';\n          this.fouc = null;\n          this.fallbackSlot = document.createElement('slot');\n          this.root.appendChild(this.fallbackSlot);\n        }\n      }\n\n      if (!this.root) {\n        this.root = this.attachShadow({\n          mode: this.mode === 'closed' ? 'closed' : 'open',\n        });\n\n        // create a slot element to allow the remote component to use the default slot\n        this.fallbackSlot = document.createElement('slot');\n        this.root.appendChild(this.fallbackSlot);\n      }\n\n      this.name = this.getAttribute('name') || this.name;\n\n      this.hostState.stage = 'loading';\n      const src = this.src;\n\n      // Create AbortController for this load operation\n      this.hostState.abortController = new AbortController();\n      const signal = this.hostState.abortController.signal;\n\n      // Returns true if this is still the active load — the signal hasn't been\n      // aborted by a newer load() call, and the src hasn't changed in the meantime.\n      // Checking the signal (not just the src) handles the case where the user\n      // cycles back to the same src (e.g. styled → basic → styled): both loads\n      // share the same src string, so a src-only check would pass for both,\n      // causing double renders.\n      const isCurrentLoad = () => !signal.aborted && this.src === src;\n\n      // Resets stage to 'idle' for expected cancellations (AbortError). Real\n      // errors are thrown and caught by attributeChangedCallback which sets\n      // stage to 'error'. Only resets if no newer load() has superseded this\n      // one — a new load replaces the abortController so the signal comparison\n      // fails, preventing us from clobbering the new load's stage.\n      const abandonLoad = () => {\n        if (\n          this.hostState.abortController?.signal === signal &&\n          this.hostState.stage === 'loading'\n        ) {\n          this.hostState.stage = 'idle';\n        }\n      };\n\n      this.emitter.beforeLoad(src ?? '');\n\n      const remoteComponentChild =\n        this.querySelector('div#__REMOTE_COMPONENT__') ||\n        this.querySelector('div[data-bundle][data-route]');\n\n      if (!src && !remoteComponentChild) {\n        throw new RemoteComponentsError('\"src\" attribute is required');\n      }\n\n      let url: URL | null = null;\n      let html = this.innerHTML;\n\n      if (src) {\n        url = getClientOrServerUrl(src, window.location.href);\n        this.name = resolveNameFromSrc(src, this.name);\n      }\n\n      const resolveClientUrl = url\n        ? bindResolveClientUrl(this.resolveClientUrl, url.href)\n        : undefined;\n\n      if (!remoteComponentChild && url) {\n        // fetch the remote component\n        const fetchInit = {\n          credentials: this.credentials || 'same-origin',\n        } as RequestInit;\n\n        const resolvedUrl = new URL(\n          resolveClientUrl?.(url.href) ?? url.href,\n          window.location.href,\n        );\n        let res: Response;\n        try {\n          res = await fetchWithHooks(resolvedUrl, fetchInit, {\n            onRequest: this.onRequest,\n            onResponse: this.onResponse,\n            abortController: this.hostState.abortController,\n          });\n        } catch (e) {\n          if (isAbortError(e)) {\n            return abandonLoad();\n          }\n          throw e;\n        }\n\n        if (!res || !res.ok) {\n          throw await errorFromFailedFetch(url.href, resolvedUrl, res);\n        }\n\n        // get the full HTML content as a string - race with abort signal\n        try {\n          html = await res.text();\n        } catch (e) {\n          if (isAbortError(e)) {\n            return abandonLoad();\n          }\n          throw e;\n        }\n        if (!isCurrentLoad()) {\n          return abandonLoad();\n        }\n      }\n\n      const effectiveUrl = url ?? new URL(window.location.href);\n      const { doc, parsed } = preparePipeline({\n        html,\n        name: this.name,\n        url: effectiveUrl,\n        shared: {},\n        resolveClientUrl,\n      });\n      const {\n        component,\n        name: resolvedName,\n        isRemoteComponent,\n        metadata: parsedMetadata,\n        nextData,\n        rsc,\n        remoteShared,\n      } = parsed;\n\n      // when using a Next.js Pages Router remote application in development mode\n      // we hide the remote component to prevent flickering\n      // until the CSS is loaded for the remote component\n      if (nextData && nextData.buildId === 'development' && !this.reactRoot) {\n        this.fouc = document.createElement('style');\n        this.fouc.textContent = `:host { display: none; }`;\n        this.root.appendChild(this.fouc);\n      }\n\n      this.name = resolvedName;\n      this.bundle = parsedMetadata.bundle;\n\n      if (url) {\n        getNamespace().bundleUrls[this.bundle] = url;\n      }\n\n      // add remote component metadata information at the custom element\n      const metadataEl = document.createElement('script');\n      metadataEl.type = 'application/json';\n      metadataEl.setAttribute('data-remote-component', '');\n      const metadataObj = {\n        name: this.name,\n        bundle: this.bundle,\n        route: parsedMetadata.route,\n        runtime: parsedMetadata.runtime,\n      };\n      metadataEl.textContent = JSON.stringify(metadataObj);\n\n      if (\n        this.previousElementSibling?.getAttribute('data-remote-component') !==\n        null\n      ) {\n        this.previousElementSibling?.remove();\n      }\n      this.parentElement?.insertBefore(metadataEl, this);\n\n      if (this.hostState.prevIsRemoteComponent) {\n        if (this.hostState.prevUrl) {\n          const prevUrl = this.hostState.prevUrl;\n          const nsUnmount = getNamespace();\n          if (nsUnmount.unmountFns[prevUrl.href]) {\n            // call unmount() for all registered unmount functions for the previous remote component\n            await Promise.all(\n              Array.from(nsUnmount.unmountFns[prevUrl.href] ?? []).map(\n                async (unmount) => {\n                  try {\n                    await unmount(this.root);\n                  } catch (e) {\n                    logError(\n                      'HtmlHost',\n                      `Error while calling unmount() for Remote Component from ${prevUrl.href}.`,\n                      e,\n                    );\n                  }\n                },\n              ),\n            );\n            if (!isCurrentLoad()) {\n              return abandonLoad();\n            }\n          }\n        }\n        this.root.innerHTML = '';\n      }\n      // Dispatch change event if this is not the first load\n      if (this.hostState.prevSrc !== undefined) {\n        this.emitter.change({\n          previousSrc: this.hostState.prevSrc ?? null,\n          nextSrc: src ?? null,\n          previousName: this.hostState.prevName,\n          nextName: this.name,\n        });\n      }\n\n      this.hostState.prevUrl = effectiveUrl;\n      this.hostState.prevIsRemoteComponent = isRemoteComponent;\n      this.hostState.prevSrc = src;\n      this.hostState.prevName = this.name;\n\n      // store the original loading content of the custom element\n      // this is required to remove the loading content after the remote component is loaded\n      const removable = Array.from(this.childNodes);\n\n      // reference to all link elements in the remote component\n      const links = doc.querySelectorAll<HTMLLinkElement>('link[href]');\n\n      const remoteComponentSrc = this.src ? String(this.src) : null;\n\n      // Bound function for attaching styles — used both initially and in React effects\n      const doAttachStyles = () =>\n        attachStyles({\n          doc,\n          component,\n          links,\n          signal: undefined, // Effects run after load, no abort needed\n          baseUrl: url?.href,\n          remoteComponentSrc,\n          root: this.root ?? null,\n          resolveClientUrl,\n        });\n\n      if (!this.reactRoot) {\n        // ensure all styles are loaded before hydrating to prevent FOUC\n        await attachStyles({\n          doc,\n          component,\n          links,\n          signal,\n          baseUrl: url?.href,\n          remoteComponentSrc,\n          root: this.root,\n          resolveClientUrl,\n        });\n        if (!isCurrentLoad()) {\n          return abandonLoad();\n        }\n      }\n\n      if (!this.reactRoot) {\n        // attach the remote component content to the shadow DOM\n        Array.from(component.children).forEach((el) => {\n          if (!isRemoteComponent && el.tagName.toLowerCase() === 'script') {\n            const newScript = document.createElement('script');\n            // copy all attributes\n            for (const attr of el.attributes) {\n              if (attr.name === 'src') {\n                const absoluteSrc = new URL(\n                  attr.value,\n                  url ?? window.location.origin,\n                ).href;\n                newScript.setAttribute(\n                  attr.name,\n                  resolveClientUrl?.(absoluteSrc) ?? absoluteSrc,\n                );\n              } else {\n                newScript.setAttribute(attr.name, attr.value);\n              }\n            }\n            newScript.textContent = el.textContent;\n            if (remoteComponentSrc) {\n              newScript.setAttribute(\n                'data-remote-component-src',\n                remoteComponentSrc,\n              );\n            }\n            this.root?.appendChild(newScript);\n          } else {\n            const newEl = el.cloneNode(true) as HTMLElement;\n            for (const attr of el.attributes) {\n              if (attr.name.startsWith('on')) {\n                newEl.setAttribute(attr.name, attr.value);\n              }\n            }\n            this.root?.appendChild(newEl);\n          }\n        });\n      }\n\n      // clear the loading content of the shadow DOM root\n      for (const el of removable) {\n        el.parentElement?.removeChild(el);\n      }\n      this.fallbackSlot?.remove();\n\n      // function to apply the reset styles to the shadow DOM\n      const applyReset = () => {\n        if (\n          this.reset &&\n          !this.root?.querySelector('link[data-remote-components-reset]')\n        ) {\n          // all initial styles to reset inherited styles leaking from the host page\n          const allInitial = document.createElement('link');\n          allInitial.setAttribute('data-remote-components-reset', '');\n          const css = `:host { all: initial; }`;\n          const allInitialHref = URL.createObjectURL(\n            new Blob([css], { type: 'text/css' }),\n          );\n          allInitial.href = allInitialHref;\n          allInitial.rel = 'stylesheet';\n          // we need to revoke the object URL after the stylesheet is loaded to free up memory\n          allInitial.onload = () => {\n            URL.revokeObjectURL(allInitialHref);\n            allInitial.removeAttribute('onload');\n          };\n          allInitial.onerror = () => {\n            URL.revokeObjectURL(allInitialHref);\n            allInitial.removeAttribute('onload');\n          };\n          this.root?.prepend(allInitial);\n        } else if (\n          !this.reset &&\n          this.root?.querySelector('link[data-remote-components-reset]')\n        ) {\n          this.root\n            .querySelector('link[data-remote-components-reset]')\n            ?.remove();\n        }\n      };\n\n      // apply the reset styles if required and not already applied\n      if (!this.reactRoot) {\n        applyReset();\n      }\n\n      const {\n        self,\n        createFromReadableStream,\n        nextClientPagesLoader,\n        preloadScripts,\n      } = await getRuntime(\n        metadataObj.runtime as Runtime,\n        effectiveUrl,\n        this.bundle,\n        {\n          react: async () => (await import('react')).default,\n          'react/jsx-dev-runtime': async () =>\n            (await import('react/jsx-dev-runtime')).default,\n          'react/jsx-runtime': async () =>\n            (await import('react/jsx-runtime')).default,\n          'react-dom': async () => (await import('react-dom')).default,\n          'react-dom/client': async () =>\n            (await import('react-dom/client')).default,\n        },\n        remoteShared,\n        resolveClientUrl,\n      );\n      if (!isCurrentLoad()) {\n        return abandonLoad();\n      }\n\n      const scripts = isRemoteComponent\n        ? component.querySelectorAll<HTMLScriptElement>('script')\n        : doc.querySelectorAll<HTMLScriptElement>(\n            'script[src],script[data-src],script[data-remote-component-entrypoint]',\n          );\n      if (!url) {\n        url = new URL(\n          component.getAttribute('data-route') ?? '/',\n          window.location.href,\n        );\n      }\n\n      await preloadScripts(Array.from(scripts), url, this.bundle, this.name);\n      if (!isCurrentLoad()) {\n        return abandonLoad();\n      }\n\n      // remove all script elements from the shadow DOM to prevent re-execution of scripts\n      if (isRemoteComponent) {\n        Array.from(component.children).forEach((child) => {\n          if (child.tagName === 'SCRIPT') {\n            child.remove();\n          }\n        });\n      }\n\n      // cleanup previous remote component instances when a new remote component is loaded\n      // this is required when the src attribute is changed to load a new remote component\n      const doCleanup = () => {\n        if (this.root && remoteComponentSrc) {\n          const selector = `[data-remote-component-src]:not([data-remote-component-src=\"${remoteComponentSrc}\"])`;\n          const prevCleanup = [\n            ...this.root.querySelectorAll(selector),\n            ...document.body.querySelectorAll(selector),\n          ] as HTMLElement[];\n\n          if (prevCleanup.length > 0) {\n            prevCleanup.forEach((prev) => {\n              prev.remove();\n            });\n          }\n        }\n      };\n\n      // using RSC hydration if the RSC flight data is available\n      if (rsc) {\n        // remove the RSC flight data script element\n        rsc.parentElement?.removeChild(rsc);\n\n        // reload the RSC flight data script to eval it's content\n        const rscName = `__remote_component_rsc_${escapeString(\n          url.href,\n        )}_${escapeString(this.name)}`;\n        const rscClone = document.createElement('script');\n        rscClone.id = `${rscName}_rsc`;\n        rscClone.textContent =\n          rsc.textContent?.replace(\n            new RegExp(`self\\\\[\"${this.name}\"\\\\]`, 'g'),\n            `self[\"${rscName}\"]`,\n          ) ?? '';\n        document.body.appendChild(rscClone);\n\n        let cache: React.ReactNode;\n        // React component to convert the RSC flight data into a React component\n        const RemoteComponentFromReadableStream = ({\n          name,\n          initial,\n        }: {\n          name: string;\n          initial: boolean;\n        }) => {\n          // convert the RSC flight data array into a ReadableStream\n          // get the RSC flight data from the global scope\n          // the RSC flight data is stored in an array\n          // fallback to an empty RSC payload if the data is not found\n          const stream = createRSCStream(\n            rscName,\n            self[rscName as RSCKey] ?? [`0:[null]\\n`],\n          );\n          const Component =\n            cache ??\n            // cache the component to avoid reloading the RSC flight data\n            (cache = createFromReadableStream(stream) as React.ReactNode);\n\n          useLayoutEffect(() => {\n            // clear the RSC flight data from the global scope to free up memory\n            if (self[name as RSCKey]) {\n              // eslint-disable-next-line @typescript-eslint/no-dynamic-delete\n              delete self[name as RSCKey];\n            }\n            const rscScript = document.getElementById(`${name}_rsc`);\n            if (rscScript) {\n              rscScript.remove();\n            }\n\n            doCleanup();\n            applyReset();\n            if (!initial) {\n              doAttachStyles().catch((e: unknown) => {\n                logError('HtmlHost', 'Error attaching styles.', e);\n              });\n            }\n            if (isCurrentLoad()) {\n              this.hostState.stage = 'loaded';\n            }\n\n            this.emitter.load(this.src ?? '');\n          }, [initial, name]);\n\n          // React can handle the component reference and will wait for the component to be ready\n          return Component;\n        };\n\n        // when we already have a React root, we just need to render the new component\n        if (this.reactRoot) {\n          const root = this.reactRoot;\n          startTransition(() => {\n            root.render(\n              <RemoteComponentFromReadableStream\n                initial={false}\n                name={this.name}\n              />,\n            );\n          });\n          return;\n        }\n\n        // hydrate the remote component using the RSC flight data\n        this.reactRoot = hydrateRoot(\n          // hydrateRoot expects a document or element, but it works for the shadow DOM too\n          // @ts-expect-error support for shadow DOM\n          this.root,\n          <RemoteComponentFromReadableStream initial name={this.name} />,\n        );\n      } else if (nextData) {\n        // using Next.js client pages loader if the Next.js hydration data is available\n        const { Component, App } = nextClientPagesLoader(\n          this.bundle,\n          nextData.page ?? '/',\n          this.root,\n        );\n\n        // if we have the component, we can hydrate it\n        if (Component) {\n          const RemoteComponentFromNext = ((\n            NextApp: ReturnType<typeof nextClientPagesLoader>['App'],\n            NextComponent: NonNullable<\n              ReturnType<typeof nextClientPagesLoader>['Component']\n            >,\n            remoteComponent = this,\n          ) =>\n            function RemoteComponentNext({ initial }: { initial: boolean }) {\n              useLayoutEffect(() => {\n                doCleanup();\n                if (!initial) {\n                  applyReset();\n                  doAttachStyles().catch((e: unknown) => {\n                    logError('HtmlHost', 'Error attaching styles.', e);\n                  });\n                }\n                if (isCurrentLoad()) {\n                  remoteComponent.hostState.stage = 'loaded';\n                }\n\n                remoteComponent.emitter.load(remoteComponent.src ?? '');\n              }, [initial, remoteComponent]);\n\n              return NextApp ? (\n                <NextApp Component={NextComponent} {...nextData.props} />\n              ) : (\n                <NextComponent {...nextData.props} />\n              );\n            })(App, Component, this);\n\n          // when we already have a React root, we just need to render the new component\n          if (this.reactRoot) {\n            const root = this.reactRoot;\n            startTransition(() => {\n              root.render(<RemoteComponentFromNext initial={false} />);\n              doCleanup();\n              if (isCurrentLoad()) {\n                this.hostState.stage = 'loaded';\n              }\n            });\n            return;\n          }\n\n          // hydrate the remote component using the Next.js pages router\n          this.reactRoot = hydrateRoot(\n            // hydrateRoot expects a document or element, but it works for the shadow DOM too\n            // @ts-expect-error support for shadow DOM\n            this.root,\n            <RemoteComponentFromNext initial />,\n          );\n        }\n\n        // remove the FOUC workaround style element to show the remote component\n        // this is only for development mode\n        if (this.fouc) {\n          this.root.removeChild(this.fouc);\n        }\n      } else if (getNamespace().mountFns[url.href]) {\n        // using script entrypoint when no RSC or Next.js data is available\n        await Promise.all(\n          Array.from(getNamespace().mountFns[url.href] ?? []).map(\n            async (mount) => {\n              try {\n                await mount(this.root);\n              } catch (e) {\n                logError(\n                  'HtmlHost',\n                  `Error while calling mount() for Remote Component from ${url.href}.`,\n                  e,\n                );\n              }\n            },\n          ),\n        );\n\n        this.emitter.load(this.src ?? '');\n      } else {\n        this.emitter.load(this.src ?? '');\n      }\n\n      if (isCurrentLoad()) {\n        this.hostState.stage = 'loaded';\n      }\n    }\n  }\n\n  // register the custom element\n  customElements.define('remote-component', RemoteComponent);\n}\n\nexport function registerSharedModules(\n  modules: Record<string, () => Promise<unknown>> = {},\n) {\n  const ns = getNamespace();\n  Object.entries(modules).forEach(([key, value]) => {\n    ns.hostSharedModules[key] = value;\n  });\n}\n","import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport { RemoteComponentsError } from '#internal/utils/error';\n\ninterface AttachStylesOptions {\n  /** The parsed document containing link and style elements */\n  doc: Document;\n  /** The component element to check if links are already contained */\n  component: Element;\n  /** Links from the document head */\n  links: NodeListOf<HTMLLinkElement>;\n  /** AbortSignal to cancel loading */\n  signal: AbortSignal | undefined;\n  /** Base URL for resolving relative hrefs */\n  baseUrl: string | undefined;\n  /** Source URL to set as data attribute */\n  remoteComponentSrc: string | null;\n  /** Root element to append styles to (ShadowRoot or Element) */\n  root: ShadowRoot | Element | null;\n  /** Callback to transform asset URLs before loading */\n  resolveClientUrl?: InternalResolveClientUrl;\n}\n\n/**\n * Attaches link and style elements from a remote component document to the shadow root.\n * Handles abort signals efficiently with a single shared listener for all links.\n *\n * @throws DOMException with name 'AbortError' if signal is aborted\n * @throws RemoteComponentsError if a stylesheet fails to load\n */\nexport async function attachStyles({\n  doc,\n  component,\n  links,\n  signal,\n  baseUrl,\n  remoteComponentSrc,\n  root,\n  resolveClientUrl,\n}: AttachStylesOptions): Promise<void> {\n  // Track appended links for cleanup on abort\n  const appendedLinks: HTMLLinkElement[] = [];\n\n  // Single shared abort promise - avoids N listeners for N links\n  let abortReject: ((error: DOMException) => void) | null = null;\n  const abortPromise = new Promise<never>((_, reject) => {\n    abortReject = reject;\n  });\n  const abortHandler = () => {\n    // Clean up all pending links on abort\n    for (const link of appendedLinks) {\n      link.onload = null;\n      link.onerror = null;\n      link.remove();\n    }\n    abortReject?.(new DOMException('Aborted', 'AbortError'));\n  };\n  signal?.addEventListener('abort', abortHandler, { once: true });\n\n  try {\n    // Attach each link element to the shadow DOM to load the styles\n    await Promise.all(\n      Array.from(links)\n        .filter((link) => !component.contains(link))\n        .map((link) => {\n          const newLink = document.createElement('link');\n          appendedLinks.push(newLink);\n\n          const loadPromise = new Promise<void>((resolve, reject) => {\n            if (link.rel === 'stylesheet') {\n              // TODO: needs to be cancellable with a singular listener for the abort signal https://linear.app/vercel/issue/MFES-1253/handle-abortcontroller-clean-up-scenarios\n              newLink.onload = () => resolve();\n              newLink.onerror = () =>\n                reject(\n                  new RemoteComponentsError(\n                    `Failed to load <link href=\"${link.href}\"> for Remote Component. Check the URL is correct.`,\n                  ),\n                );\n            } else {\n              resolve();\n            }\n          });\n\n          for (const attr of link.attributes) {\n            if (attr.name === 'href') {\n              const absoluteHref = new URL(\n                attr.value,\n                baseUrl ?? location.origin,\n              ).href;\n              newLink.setAttribute(\n                attr.name,\n                resolveClientUrl?.(absoluteHref) ?? absoluteHref,\n              );\n            } else {\n              newLink.setAttribute(attr.name, attr.value);\n            }\n          }\n\n          if (remoteComponentSrc) {\n            newLink.setAttribute(\n              'data-remote-component-src',\n              remoteComponentSrc,\n            );\n          }\n\n          // TODO: needs to be cancellable with a singular listener for the abort signal https://linear.app/vercel/issue/MFES-1253/handle-abortcontroller-clean-up-scenarios\n          root?.appendChild(newLink);\n\n          // Race each link load against the shared abort promise\n          return Promise.race([loadPromise, abortPromise]);\n        }),\n    );\n  } finally {\n    signal?.removeEventListener('abort', abortHandler);\n  }\n\n  // Attach inline styles from the document head\n  const styles = doc.querySelectorAll<HTMLStyleElement>('style');\n  for (const style of styles) {\n    if (style.parentElement?.tagName.toLowerCase() === 'head') {\n      const newStyle = document.createElement('style');\n      newStyle.textContent = style.textContent;\n\n      if (remoteComponentSrc) {\n        newStyle.setAttribute('data-remote-component-src', remoteComponentSrc);\n      }\n\n      root?.appendChild(newStyle);\n    }\n  }\n}\n","import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport type { RemoteSharedModules } from '#internal/host/shared/shared-broker';\nimport { RemoteComponentsError } from '#internal/utils/error';\n\nexport type Runtime = 'webpack' | 'turbopack' | 'script' | 'unknown';\n\nexport async function getRuntime(\n  type: Runtime,\n  url: URL,\n  bundle: string,\n  shared?: Record<string, () => Promise<unknown>>,\n  remoteShared?: RemoteSharedModules,\n  resolveClientUrl?: InternalResolveClientUrl,\n) {\n  // minimally mock process.env for browser environments\n  if (typeof globalThis.process === 'undefined') {\n    globalThis.process = {\n      env: {},\n    } as NodeJS.Process;\n  }\n\n  if (type === 'webpack') {\n    const { webpackRuntime } = await import(`./webpack`);\n    return webpackRuntime(bundle, shared, remoteShared, resolveClientUrl);\n  } else if (type === 'turbopack') {\n    const { turbopackRuntime } = await import(`./turbopack`);\n    return turbopackRuntime(\n      url,\n      bundle,\n      shared,\n      remoteShared,\n      resolveClientUrl,\n    );\n  } else if (type === 'script') {\n    const { scriptRuntime } = await import(`./script`);\n    return scriptRuntime(resolveClientUrl);\n  }\n  throw new RemoteComponentsError(\n    `Remote Components runtime \"${type}\" is not supported. Supported runtimes are \"webpack\", \"turbopack\", and \"script\".`,\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/host/nextjs/app/client-only.cjs

@@ -1,19 +1,19 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }"use client";
 
 
-var _chunk4AH3KXDWcjs = require('../../../chunk-4AH3KXDW.cjs');
+var _chunkTWO3XB6Hcjs = require('../../../chunk-TWO3XB6H.cjs');
 
 
-var _chunk2W7JBTIDcjs = require('../../../chunk-2W7JBTID.cjs');
-require('../../../chunk-C5EYU7EQ.cjs');
-require('../../../chunk-SECN7UAL.cjs');
-require('../../../chunk-HMB3SIVJ.cjs');
+var _chunkPNASFKWAcjs = require('../../../chunk-PNASFKWA.cjs');
+require('../../../chunk-4MLJE6UP.cjs');
+require('../../../chunk-7OD5S534.cjs');
+require('../../../chunk-W5FSHVWU.cjs');
 require('../../../chunk-3AX5WLZD.cjs');
 require('../../../chunk-N3SQTOSE.cjs');
 
 
 
-var _chunk7XXO2DLFcjs = require('../../../chunk-7XXO2DLF.cjs');
+var _chunkI7VKDF3Ecjs = require('../../../chunk-I7VKDF3E.cjs');
 require('../../../chunk-Z2SLBFQL.cjs');
 require('../../../chunk-5KTAEO52.cjs');
 
@@ -31,8 +31,8 @@ var _react = require('react');
 function resolveForBundle(unbound, bundle) {
   if (!unbound)
     return void 0;
-  const remoteSrc = _nullishCoalesce(_optionalChain([_chunk7XXO2DLFcjs.getScope.call(void 0, bundle), 'optionalAccess', _2 => _2.url, 'access', _3 => _3.href]), () => ( ""));
-  return _chunk2W7JBTIDcjs.bindResolveClientUrl.call(void 0, unbound, remoteSrc);
+  const remoteSrc = _nullishCoalesce(_optionalChain([_chunkI7VKDF3Ecjs.getScope.call(void 0, bundle), 'optionalAccess', _2 => _2.url, 'access', _3 => _3.href]), () => ( ""));
+  return _chunkPNASFKWAcjs.bindResolveClientUrl.call(void 0, unbound, remoteSrc);
 }
 function createImageLoaderSharedEntries({
   bound,
@@ -41,13 +41,13 @@ function createImageLoaderSharedEntries({
   const loaderEntry = (bundle) => {
     const resolveClientUrl = _nullishCoalesce(bound, () => ( resolveForBundle(unbound, bundle)));
     return Promise.resolve({
-      default: _chunk7XXO2DLFcjs.createRemoteImageLoader.call(void 0, bundle, resolveClientUrl),
+      default: _chunkI7VKDF3Ecjs.createRemoteImageLoader.call(void 0, bundle, resolveClientUrl),
       __esModule: true
     });
   };
   const imageEntry = async (bundle) => {
     const resolveClientUrl = _nullishCoalesce(bound, () => ( resolveForBundle(unbound, bundle)));
-    const rawLoader = _chunk7XXO2DLFcjs.createRemoteImageLoader.call(void 0, bundle, resolveClientUrl);
+    const rawLoader = _chunkI7VKDF3Ecjs.createRemoteImageLoader.call(void 0, bundle, resolveClientUrl);
     const remoteLoader = Object.assign(
       (p) => rawLoader({ ...p, config: { path: "/_next/image" } }),
       { __next_img_default: true }
@@ -191,7 +191,7 @@ function ConsumeRemoteComponent2(props) {
     return _nullishCoalesce(props.children, () => ( null));
   }
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunk4AH3KXDWcjs.ConsumeRemoteComponent,
+    _chunkTWO3XB6Hcjs.ConsumeRemoteComponent,
     {
       ...props,
       shared: sharedModules(props.shared, props.resolveClientUrl)

package/dist/host/nextjs/app/client-only.js

@@ -1,19 +1,19 @@
 "use client";
 import {
   ConsumeRemoteComponent
-} from "../../../chunk-HYVNEUIK.js";
+} from "../../../chunk-MJ2KYXGR.js";
 import {
   bindResolveClientUrl
-} from "../../../chunk-DGZVFKSQ.js";
-import "../../../chunk-HL6BL5HY.js";
-import "../../../chunk-KV5J7PNM.js";
-import "../../../chunk-4NW46ZVD.js";
+} from "../../../chunk-O4A6CJGI.js";
+import "../../../chunk-WGSS7TJP.js";
+import "../../../chunk-NZM2SI6U.js";
+import "../../../chunk-PT3R275L.js";
 import "../../../chunk-LEKG4YWI.js";
 import "../../../chunk-RHGEBXPL.js";
 import {
   createRemoteImageLoader,
   getScope
-} from "../../../chunk-55TEMSB5.js";
+} from "../../../chunk-JZRA6DPE.js";
 import "../../../chunk-D5GNZB6O.js";
 import "../../../chunk-STIJO4AG.js";
 import {

package/dist/host/nextjs/pages.cjs

@@ -42,7 +42,9 @@ var import_react = require("react");
 var import_react2 = require("remote-components/host/react");
 var import_image_shared = require("#internal/host/nextjs/image-shared");
 var import_fetch_remote_component = require("#internal/host/server/fetch-remote-component");
+var import_shared_broker = require("#internal/host/shared/shared-broker");
 var import_constants = require("#internal/runtime/constants");
+var import_html_spec = require("#internal/runtime/html/html-spec");
 var import_error = require("#internal/utils/error");
 var import_pages = require("#remote-components/host/defaults/pages");
 const navigationImpl = {
@@ -85,6 +87,35 @@ const shared = (bundle, resolveClientUrl) => {
 const REMOTE_COMPONENT_STORE = Symbol("REMOTE_COMPONENT_STORE");
 const REMOTE_COMPONENT_KEY = "__REMOTE_COMPONENT_KEY__";
 const self = globalThis;
+function RemoteSharedScript({
+  name,
+  remoteShared
+}) {
+  if ((0, import_shared_broker.isSharedModuleManifest)(remoteShared)) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "script",
+      {
+        ...{ [import_html_spec.DATA_REMOTE_COMPONENTS_SHARED_MANIFEST]: "" },
+        id: `${name}${import_html_spec.ID_SUFFIX_SHARED_MANIFEST}`,
+        type: "application/json",
+        children: JSON.stringify(remoteShared)
+      }
+    );
+  }
+  return (
+    // @legacy(remote-components<=0.4.x): keep writing the historical shared
+    // map until hosts and remotes on 0.4.x are outside support.
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      "script",
+      {
+        ...{ [import_html_spec.DATA_REMOTE_COMPONENTS_SHARED]: "" },
+        id: `${name}${import_html_spec.ID_SUFFIX_SHARED}`,
+        type: "application/json",
+        children: JSON.stringify(remoteShared)
+      }
+    )
+  );
+}
 function getKey(bundle, route, name) {
   return `${bundle}:${route}:${name}__${crypto.randomUUID()}`;
 }
@@ -181,15 +212,7 @@ async function getConsumeRemoteComponentProps(src, options) {
     setComponent(
       key,
       /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-          "script",
-          {
-            "data-remote-components-shared": "",
-            id: `${name}_shared`,
-            type: "application/json",
-            children: JSON.stringify(remoteShared)
-          }
-        ),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RemoteSharedScript, { name, remoteShared }),
         links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           "link",
           {

package/dist/host/nextjs/pages.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/host/nextjs/pages.tsx"],"sourcesContent":["import 'remote-components/remote/defaults/wrapper';\nimport * as Form from 'next/form';\nimport * as Link from 'next/link';\nimport * as Router from 'next/router';\nimport * as Script from 'next/script';\nimport { useEffect } from 'react';\nimport { ConsumeRemoteComponent as ConsumeRemoteComponentReact } from 'remote-components/host/react';\nimport { createImageLoaderSharedEntries } from '#internal/host/nextjs/image-shared';\nimport { fetchRemoteComponent } from '#internal/host/server/fetch-remote-component';\nimport type { ConsumeRemoteComponentConfig } from '#internal/host/shared/config';\nimport type {\n  OnRequestHook,\n  OnResponseHook,\n} from '#internal/host/shared/fetch-interceptors';\nimport {\n  DEFAULT_BUNDLE_NAME,\n  DEFAULT_COMPONENT_NAME,\n} from '#internal/runtime/constants';\nimport type { ResolveClientUrl } from '#internal/runtime/url/resolve-client-url';\nimport { RemoteComponentsError } from '#internal/utils/error';\nimport { shared as _shared } from '#remote-components/host/defaults/pages';\n\nconst navigationImpl = {\n  useRouter: () => Router.useRouter(),\n  useSearchParams: () => {\n    const router = Router.useRouter();\n    return {\n      get: (key: string) => router.query[key],\n      has: (key: string) => key in router.query,\n    };\n  },\n};\n\nconst sharedCache = new Map<string, Record<string, () => Promise<unknown>>>();\nconst shared = (bundle: string, resolveClientUrl?: ResolveClientUrl) => {\n  // Skip cache when resolveClientUrl is provided — different resolver instances\n  // must not share a cache entry, since the image loader closes over the resolver.\n  if (!resolveClientUrl) {\n    if (sharedCache.has(bundle)) {\n      return sharedCache.get(bundle);\n    }\n  }\n\n  const result = {\n    // polyfill Next.js App Router client API (minimal)\n    // some API methods are not available when using a Next.js Pages Router application as host\n    'next/navigation': () =>\n      Promise.resolve(navigationImpl) as Promise<unknown>,\n    'next/dist/client/components/navigation': () =>\n      Promise.resolve(navigationImpl) as Promise<unknown>,\n    'next/dist/client/app-dir/link': () =>\n      Promise.resolve(Link.default) as Promise<unknown>,\n    'next/link': () => Promise.resolve(Link.default) as Promise<unknown>,\n    'next/dist/client/app-dir/form': () =>\n      Promise.resolve(Form.default) as Promise<unknown>,\n    'next/form': () => Promise.resolve(Form.default) as Promise<unknown>,\n    'next/dist/client/script': () =>\n      Promise.resolve(Script.default) as Promise<unknown>,\n    'next/script': () => Promise.resolve(Script.default) as Promise<unknown>,\n    'next/router': () => Promise.resolve(Router) as Promise<unknown>,\n    ..._shared,\n    ...createImageLoaderSharedEntries({ unbound: resolveClientUrl }),\n  };\n\n  if (!resolveClientUrl) {\n    sharedCache.set(bundle, result);\n  }\n\n  return result;\n};\n\n// internal symbols to access global store\nconst REMOTE_COMPONENT_STORE = Symbol('REMOTE_COMPONENT_STORE');\nconst REMOTE_COMPONENT_KEY = '__REMOTE_COMPONENT_KEY__';\n\n// temporary global store for remote component HTML\n// the store is used to save the HTML of remote components for SSR without sending the content to the client\nconst self = globalThis as typeof globalThis & {\n  [REMOTE_COMPONENT_STORE]?: Map<string, React.ReactNode>;\n};\n\nfunction getKey(bundle: string, route: string, name: string): string {\n  return `${bundle}:${route}:${name}__${crypto.randomUUID()}`;\n}\n\nfunction setComponent(key: string, component: React.ReactNode): void {\n  if (!self[REMOTE_COMPONENT_STORE]) {\n    self[REMOTE_COMPONENT_STORE] = new Map();\n  }\n  self[REMOTE_COMPONENT_STORE].set(key, component);\n}\n\nfunction getComponent(key: string): React.ReactNode | undefined {\n  const component = self[REMOTE_COMPONENT_STORE]?.get(key);\n  // remove the component from the store after retrieving it to prevent memory leaks\n  // storing the HTML in the global store is only needed for SSR and it's temporary only used for a single render\n  self[REMOTE_COMPONENT_STORE]?.delete(key);\n  return component;\n}\n\n/**\n * Props for the Next.js Pages Router remote component host.\n *\n * Extends {@link ConsumeRemoteComponentConfig} with Pages Router–specific `bundle` and\n * `route` props used for SSR hydration.\n */\nexport interface ConsumeRemoteComponentProps\n  extends ConsumeRemoteComponentConfig {\n  /** The source URL of the remote component. Required for server rendering. */\n  src: string | URL;\n  /** The Webpack bundle name for the remote component. */\n  bundle?: string;\n  /** The page route of the remote component. */\n  route?: string;\n  /** Loading fallback content displayed while the remote component is being fetched. */\n  children?: React.ReactNode;\n  [REMOTE_COMPONENT_KEY]?: string;\n}\n\n/**\n * This component handles the rendering of remote microfrontends.\n *\n * @param props - The properties for the remote component.\n * @returns A React component that renders the remote component.\n */\nexport function ConsumeRemoteComponent(props: ConsumeRemoteComponentProps) {\n  const remoteComponent =\n    typeof document !== 'undefined'\n      ? null\n      : // retrieve the HTML from the global store\n        getComponent(props[REMOTE_COMPONENT_KEY] ?? DEFAULT_COMPONENT_NAME);\n\n  const sharedResult = shared(\n    props.bundle ?? DEFAULT_BUNDLE_NAME,\n    props.resolveClientUrl,\n  );\n\n  useEffect(() => {\n    const clientSelf = globalThis as typeof globalThis & {\n      __remote_component_shared__?: Record<string, () => Promise<unknown>>;\n    };\n    // eslint-disable-next-line camelcase\n    clientSelf.__remote_component_shared__ = sharedResult;\n  }, [sharedResult]);\n\n  if (!props[REMOTE_COMPONENT_KEY]) {\n    return (\n      <ConsumeRemoteComponentReact\n        isolate={props.isolate}\n        mode={props.mode}\n        name={props.name}\n        onBeforeLoad={props.onBeforeLoad}\n        onChange={props.onChange}\n        onError={props.onError}\n        onLoad={props.onLoad}\n        onRequest={props.onRequest}\n        onResponse={props.onResponse}\n        resolveClientUrl={props.resolveClientUrl}\n        reset={props.reset}\n        shared={sharedResult}\n        src={props.src}\n      >\n        {props.children}\n      </ConsumeRemoteComponentReact>\n    );\n  }\n\n  return (\n    <ConsumeRemoteComponentReact\n      isolate={props.isolate}\n      mode={props.mode}\n      name={props.name}\n      onBeforeLoad={props.onBeforeLoad}\n      onChange={props.onChange}\n      onError={props.onError}\n      onLoad={props.onLoad}\n      onRequest={props.onRequest}\n      onResponse={props.onResponse}\n      resolveClientUrl={props.resolveClientUrl}\n      reset={props.reset}\n      shared={sharedResult}\n      src={props.src}\n    >\n      {remoteComponent}\n    </ConsumeRemoteComponentReact>\n  );\n}\n\n/**\n * Fetches the remote component properties from the server. You need to pass these properties to the `<ConsumeRemoteComponent>` component to render the fetched remote component.\n *\n * @param src - The source URL of the remote component. When using the Vercel Microfrontends solution, you can use relative paths, e.g. `/nextjs-app-remote/components/header`. Absolute URLs are also supported.\n * @param headers - The HTTP headers used for supporting the Vercel Microfrontends proxy.\n * @returns The properties of the remote component.\n *\n * @example\n *\n * ```tsx\n * import { getRemoteComponentProps } from 'remote-components/next/host/pages';\n * import type { GetServerSideProps } from 'next';\n *\n * export const getServerSideProps: GetServerSideProps<PageProps> = async function getServerSideProps({ req }) {\n *   const myRemoteComponent = await getConsumeRemoteComponentProps(\n *     '/nextjs-app-remote/components/header',\n *     req.headers,\n *   );\n *   return {\n *     props: {\n *       remoteComponents: {\n *         myRemoteComponent,\n *       },\n *     },\n *   };\n * }\n * ```\n */\nexport async function getConsumeRemoteComponentProps(\n  src: string,\n  options?: {\n    /**\n     * Called when a fetch request is made to retrieve the remote component payload.\n     * Can be used to intercept requests, modify headers, or provide a custom response.\n     */\n    onRequest?: OnRequestHook;\n    /**\n     * Called after a fetch completes to retrieve the remote component payload.\n     * Can be used to inspect the response (e.g., check for redirects) or transform it.\n     */\n    onResponse?: OnResponseHook;\n    /**\n     * The name of the exposed remote component. Used to identify the remote component\n     * when multiple remote components are exposed on a page.\n     */\n    name?: string;\n  },\n): Promise<ConsumeRemoteComponentProps> {\n  if (typeof document !== 'undefined') {\n    throw new RemoteComponentsError(\n      '`getConsumeRemoteComponentProps()` can only be used on the server side.',\n    );\n  }\n\n  const {\n    metadata: { bundle, route },\n    name,\n    links,\n    component,\n    nextData,\n    remoteShared,\n  } = await fetchRemoteComponent(src, {\n    rsc: true,\n    ...options,\n  });\n\n  const props: ConsumeRemoteComponentProps = {\n    src,\n    bundle,\n    name,\n    route,\n  };\n\n  const key = getKey(bundle, route, name);\n\n  // do not render the HTML in development mode when remote is using Next.js Pages Router\n  // this behavior is emulating the Next.js Pages Router FOUC as the styles are only applied on the client when running in development mode\n  if (nextData?.buildId !== 'development') {\n    // store the HTML in a global store\n    setComponent(\n      key,\n      <>\n        <script\n          data-remote-components-shared=\"\"\n          id={`${name}_shared`}\n          type=\"application/json\"\n        >\n          {JSON.stringify(remoteShared)}\n        </script>\n        {links.map((link) => (\n          <link\n            key={`${link.as}_${link.href}`}\n            {...link}\n            precedence={undefined}\n          />\n        ))}\n        {component}\n      </>,\n    );\n  }\n\n  return {\n    ...props,\n    // add remote component key to the props\n    [REMOTE_COMPONENT_KEY]: key,\n  };\n}\n"],"mappings":"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","names":["import_react","_shared","ConsumeRemoteComponentReact"]}
+{"version":3,"sources":["../../../src/host/nextjs/pages.tsx"],"sourcesContent":["import 'remote-components/remote/defaults/wrapper';\nimport * as Form from 'next/form';\nimport * as Link from 'next/link';\nimport * as Router from 'next/router';\nimport * as Script from 'next/script';\nimport { useEffect } from 'react';\nimport { ConsumeRemoteComponent as ConsumeRemoteComponentReact } from 'remote-components/host/react';\nimport { createImageLoaderSharedEntries } from '#internal/host/nextjs/image-shared';\nimport { fetchRemoteComponent } from '#internal/host/server/fetch-remote-component';\nimport type { ConsumeRemoteComponentConfig } from '#internal/host/shared/config';\nimport type {\n  OnRequestHook,\n  OnResponseHook,\n} from '#internal/host/shared/fetch-interceptors';\nimport {\n  isSharedModuleManifest,\n  type RemoteSharedModules,\n} from '#internal/host/shared/shared-broker';\nimport {\n  DEFAULT_BUNDLE_NAME,\n  DEFAULT_COMPONENT_NAME,\n} from '#internal/runtime/constants';\nimport {\n  DATA_REMOTE_COMPONENTS_SHARED,\n  DATA_REMOTE_COMPONENTS_SHARED_MANIFEST,\n  ID_SUFFIX_SHARED,\n  ID_SUFFIX_SHARED_MANIFEST,\n} from '#internal/runtime/html/html-spec';\nimport type { ResolveClientUrl } from '#internal/runtime/url/resolve-client-url';\nimport { RemoteComponentsError } from '#internal/utils/error';\nimport { shared as _shared } from '#remote-components/host/defaults/pages';\n\nconst navigationImpl = {\n  useRouter: () => Router.useRouter(),\n  useSearchParams: () => {\n    const router = Router.useRouter();\n    return {\n      get: (key: string) => router.query[key],\n      has: (key: string) => key in router.query,\n    };\n  },\n};\n\nconst sharedCache = new Map<string, Record<string, () => Promise<unknown>>>();\nconst shared = (bundle: string, resolveClientUrl?: ResolveClientUrl) => {\n  // Skip cache when resolveClientUrl is provided — different resolver instances\n  // must not share a cache entry, since the image loader closes over the resolver.\n  if (!resolveClientUrl) {\n    if (sharedCache.has(bundle)) {\n      return sharedCache.get(bundle);\n    }\n  }\n\n  const result = {\n    // polyfill Next.js App Router client API (minimal)\n    // some API methods are not available when using a Next.js Pages Router application as host\n    'next/navigation': () =>\n      Promise.resolve(navigationImpl) as Promise<unknown>,\n    'next/dist/client/components/navigation': () =>\n      Promise.resolve(navigationImpl) as Promise<unknown>,\n    'next/dist/client/app-dir/link': () =>\n      Promise.resolve(Link.default) as Promise<unknown>,\n    'next/link': () => Promise.resolve(Link.default) as Promise<unknown>,\n    'next/dist/client/app-dir/form': () =>\n      Promise.resolve(Form.default) as Promise<unknown>,\n    'next/form': () => Promise.resolve(Form.default) as Promise<unknown>,\n    'next/dist/client/script': () =>\n      Promise.resolve(Script.default) as Promise<unknown>,\n    'next/script': () => Promise.resolve(Script.default) as Promise<unknown>,\n    'next/router': () => Promise.resolve(Router) as Promise<unknown>,\n    ..._shared,\n    ...createImageLoaderSharedEntries({ unbound: resolveClientUrl }),\n  };\n\n  if (!resolveClientUrl) {\n    sharedCache.set(bundle, result);\n  }\n\n  return result;\n};\n\n// internal symbols to access global store\nconst REMOTE_COMPONENT_STORE = Symbol('REMOTE_COMPONENT_STORE');\nconst REMOTE_COMPONENT_KEY = '__REMOTE_COMPONENT_KEY__';\n\n// temporary global store for remote component HTML\n// the store is used to save the HTML of remote components for SSR without sending the content to the client\nconst self = globalThis as typeof globalThis & {\n  [REMOTE_COMPONENT_STORE]?: Map<string, React.ReactNode>;\n};\n\nfunction RemoteSharedScript({\n  name,\n  remoteShared,\n}: {\n  name: string;\n  remoteShared: RemoteSharedModules;\n}) {\n  if (isSharedModuleManifest(remoteShared)) {\n    return (\n      <script\n        {...{ [DATA_REMOTE_COMPONENTS_SHARED_MANIFEST]: '' }}\n        id={`${name}${ID_SUFFIX_SHARED_MANIFEST}`}\n        type=\"application/json\"\n      >\n        {JSON.stringify(remoteShared)}\n      </script>\n    );\n  }\n\n  return (\n    // @legacy(remote-components<=0.4.x): keep writing the historical shared\n    // map until hosts and remotes on 0.4.x are outside support.\n    <script\n      {...{ [DATA_REMOTE_COMPONENTS_SHARED]: '' }}\n      id={`${name}${ID_SUFFIX_SHARED}`}\n      type=\"application/json\"\n    >\n      {JSON.stringify(remoteShared)}\n    </script>\n  );\n}\n\nfunction getKey(bundle: string, route: string, name: string): string {\n  return `${bundle}:${route}:${name}__${crypto.randomUUID()}`;\n}\n\nfunction setComponent(key: string, component: React.ReactNode): void {\n  if (!self[REMOTE_COMPONENT_STORE]) {\n    self[REMOTE_COMPONENT_STORE] = new Map();\n  }\n  self[REMOTE_COMPONENT_STORE].set(key, component);\n}\n\nfunction getComponent(key: string): React.ReactNode | undefined {\n  const component = self[REMOTE_COMPONENT_STORE]?.get(key);\n  // remove the component from the store after retrieving it to prevent memory leaks\n  // storing the HTML in the global store is only needed for SSR and it's temporary only used for a single render\n  self[REMOTE_COMPONENT_STORE]?.delete(key);\n  return component;\n}\n\n/**\n * Props for the Next.js Pages Router remote component host.\n *\n * Extends {@link ConsumeRemoteComponentConfig} with Pages Router–specific `bundle` and\n * `route` props used for SSR hydration.\n */\nexport interface ConsumeRemoteComponentProps\n  extends ConsumeRemoteComponentConfig {\n  /** The source URL of the remote component. Required for server rendering. */\n  src: string | URL;\n  /** The Webpack bundle name for the remote component. */\n  bundle?: string;\n  /** The page route of the remote component. */\n  route?: string;\n  /** Loading fallback content displayed while the remote component is being fetched. */\n  children?: React.ReactNode;\n  [REMOTE_COMPONENT_KEY]?: string;\n}\n\n/**\n * This component handles the rendering of remote microfrontends.\n *\n * @param props - The properties for the remote component.\n * @returns A React component that renders the remote component.\n */\nexport function ConsumeRemoteComponent(props: ConsumeRemoteComponentProps) {\n  const remoteComponent =\n    typeof document !== 'undefined'\n      ? null\n      : // retrieve the HTML from the global store\n        getComponent(props[REMOTE_COMPONENT_KEY] ?? DEFAULT_COMPONENT_NAME);\n\n  const sharedResult = shared(\n    props.bundle ?? DEFAULT_BUNDLE_NAME,\n    props.resolveClientUrl,\n  );\n\n  useEffect(() => {\n    const clientSelf = globalThis as typeof globalThis & {\n      __remote_component_shared__?: Record<string, () => Promise<unknown>>;\n    };\n    // eslint-disable-next-line camelcase\n    clientSelf.__remote_component_shared__ = sharedResult;\n  }, [sharedResult]);\n\n  if (!props[REMOTE_COMPONENT_KEY]) {\n    return (\n      <ConsumeRemoteComponentReact\n        isolate={props.isolate}\n        mode={props.mode}\n        name={props.name}\n        onBeforeLoad={props.onBeforeLoad}\n        onChange={props.onChange}\n        onError={props.onError}\n        onLoad={props.onLoad}\n        onRequest={props.onRequest}\n        onResponse={props.onResponse}\n        resolveClientUrl={props.resolveClientUrl}\n        reset={props.reset}\n        shared={sharedResult}\n        src={props.src}\n      >\n        {props.children}\n      </ConsumeRemoteComponentReact>\n    );\n  }\n\n  return (\n    <ConsumeRemoteComponentReact\n      isolate={props.isolate}\n      mode={props.mode}\n      name={props.name}\n      onBeforeLoad={props.onBeforeLoad}\n      onChange={props.onChange}\n      onError={props.onError}\n      onLoad={props.onLoad}\n      onRequest={props.onRequest}\n      onResponse={props.onResponse}\n      resolveClientUrl={props.resolveClientUrl}\n      reset={props.reset}\n      shared={sharedResult}\n      src={props.src}\n    >\n      {remoteComponent}\n    </ConsumeRemoteComponentReact>\n  );\n}\n\n/**\n * Fetches the remote component properties from the server. You need to pass these properties to the `<ConsumeRemoteComponent>` component to render the fetched remote component.\n *\n * @param src - The source URL of the remote component. When using the Vercel Microfrontends solution, you can use relative paths, e.g. `/nextjs-app-remote/components/header`. Absolute URLs are also supported.\n * @param headers - The HTTP headers used for supporting the Vercel Microfrontends proxy.\n * @returns The properties of the remote component.\n *\n * @example\n *\n * ```tsx\n * import { getRemoteComponentProps } from 'remote-components/next/host/pages';\n * import type { GetServerSideProps } from 'next';\n *\n * export const getServerSideProps: GetServerSideProps<PageProps> = async function getServerSideProps({ req }) {\n *   const myRemoteComponent = await getConsumeRemoteComponentProps(\n *     '/nextjs-app-remote/components/header',\n *     req.headers,\n *   );\n *   return {\n *     props: {\n *       remoteComponents: {\n *         myRemoteComponent,\n *       },\n *     },\n *   };\n * }\n * ```\n */\nexport async function getConsumeRemoteComponentProps(\n  src: string,\n  options?: {\n    /**\n     * Called when a fetch request is made to retrieve the remote component payload.\n     * Can be used to intercept requests, modify headers, or provide a custom response.\n     */\n    onRequest?: OnRequestHook;\n    /**\n     * Called after a fetch completes to retrieve the remote component payload.\n     * Can be used to inspect the response (e.g., check for redirects) or transform it.\n     */\n    onResponse?: OnResponseHook;\n    /**\n     * The name of the exposed remote component. Used to identify the remote component\n     * when multiple remote components are exposed on a page.\n     */\n    name?: string;\n  },\n): Promise<ConsumeRemoteComponentProps> {\n  if (typeof document !== 'undefined') {\n    throw new RemoteComponentsError(\n      '`getConsumeRemoteComponentProps()` can only be used on the server side.',\n    );\n  }\n\n  const {\n    metadata: { bundle, route },\n    name,\n    links,\n    component,\n    nextData,\n    remoteShared,\n  } = await fetchRemoteComponent(src, {\n    rsc: true,\n    ...options,\n  });\n\n  const props: ConsumeRemoteComponentProps = {\n    src,\n    bundle,\n    name,\n    route,\n  };\n\n  const key = getKey(bundle, route, name);\n\n  // do not render the HTML in development mode when remote is using Next.js Pages Router\n  // this behavior is emulating the Next.js Pages Router FOUC as the styles are only applied on the client when running in development mode\n  if (nextData?.buildId !== 'development') {\n    // store the HTML in a global store\n    setComponent(\n      key,\n      <>\n        <RemoteSharedScript name={name} remoteShared={remoteShared} />\n        {links.map((link) => (\n          <link\n            key={`${link.as}_${link.href}`}\n            {...link}\n            precedence={undefined}\n          />\n        ))}\n        {component}\n      </>,\n    );\n  }\n\n  return {\n    ...props,\n    // add remote component key to the props\n    [REMOTE_COMPONENT_KEY]: key,\n  };\n}\n"],"mappings":"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","names":["import_react","_shared","ConsumeRemoteComponentReact"]}

package/dist/host/nextjs/pages.js

@@ -8,10 +8,19 @@ import { useEffect } from "react";
 import { ConsumeRemoteComponent as ConsumeRemoteComponentReact } from "remote-components/host/react";
 import { createImageLoaderSharedEntries } from "#internal/host/nextjs/image-shared";
 import { fetchRemoteComponent } from "#internal/host/server/fetch-remote-component";
+import {
+  isSharedModuleManifest
+} from "#internal/host/shared/shared-broker";
 import {
   DEFAULT_BUNDLE_NAME,
   DEFAULT_COMPONENT_NAME
 } from "#internal/runtime/constants";
+import {
+  DATA_REMOTE_COMPONENTS_SHARED,
+  DATA_REMOTE_COMPONENTS_SHARED_MANIFEST,
+  ID_SUFFIX_SHARED,
+  ID_SUFFIX_SHARED_MANIFEST
+} from "#internal/runtime/html/html-spec";
 import { RemoteComponentsError } from "#internal/utils/error";
 import { shared as _shared } from "#remote-components/host/defaults/pages";
 const navigationImpl = {
@@ -54,6 +63,35 @@ const shared = (bundle, resolveClientUrl) => {
 const REMOTE_COMPONENT_STORE = Symbol("REMOTE_COMPONENT_STORE");
 const REMOTE_COMPONENT_KEY = "__REMOTE_COMPONENT_KEY__";
 const self = globalThis;
+function RemoteSharedScript({
+  name,
+  remoteShared
+}) {
+  if (isSharedModuleManifest(remoteShared)) {
+    return /* @__PURE__ */ jsx(
+      "script",
+      {
+        ...{ [DATA_REMOTE_COMPONENTS_SHARED_MANIFEST]: "" },
+        id: `${name}${ID_SUFFIX_SHARED_MANIFEST}`,
+        type: "application/json",
+        children: JSON.stringify(remoteShared)
+      }
+    );
+  }
+  return (
+    // @legacy(remote-components<=0.4.x): keep writing the historical shared
+    // map until hosts and remotes on 0.4.x are outside support.
+    /* @__PURE__ */ jsx(
+      "script",
+      {
+        ...{ [DATA_REMOTE_COMPONENTS_SHARED]: "" },
+        id: `${name}${ID_SUFFIX_SHARED}`,
+        type: "application/json",
+        children: JSON.stringify(remoteShared)
+      }
+    )
+  );
+}
 function getKey(bundle, route, name) {
   return `${bundle}:${route}:${name}__${crypto.randomUUID()}`;
 }
@@ -150,15 +188,7 @@ async function getConsumeRemoteComponentProps(src, options) {
     setComponent(
       key,
       /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(
-          "script",
-          {
-            "data-remote-components-shared": "",
-            id: `${name}_shared`,
-            type: "application/json",
-            children: JSON.stringify(remoteShared)
-          }
-        ),
+        /* @__PURE__ */ jsx(RemoteSharedScript, { name, remoteShared }),
         links.map((link) => /* @__PURE__ */ jsx(
           "link",
           {

package/dist/host/nextjs/pages.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/host/nextjs/pages.tsx"],"sourcesContent":["import 'remote-components/remote/defaults/wrapper';\nimport * as Form from 'next/form';\nimport * as Link from 'next/link';\nimport * as Router from 'next/router';\nimport * as Script from 'next/script';\nimport { useEffect } from 'react';\nimport { ConsumeRemoteComponent as ConsumeRemoteComponentReact } from 'remote-components/host/react';\nimport { createImageLoaderSharedEntries } from '#internal/host/nextjs/image-shared';\nimport { fetchRemoteComponent } from '#internal/host/server/fetch-remote-component';\nimport type { ConsumeRemoteComponentConfig } from '#internal/host/shared/config';\nimport type {\n  OnRequestHook,\n  OnResponseHook,\n} from '#internal/host/shared/fetch-interceptors';\nimport {\n  DEFAULT_BUNDLE_NAME,\n  DEFAULT_COMPONENT_NAME,\n} from '#internal/runtime/constants';\nimport type { ResolveClientUrl } from '#internal/runtime/url/resolve-client-url';\nimport { RemoteComponentsError } from '#internal/utils/error';\nimport { shared as _shared } from '#remote-components/host/defaults/pages';\n\nconst navigationImpl = {\n  useRouter: () => Router.useRouter(),\n  useSearchParams: () => {\n    const router = Router.useRouter();\n    return {\n      get: (key: string) => router.query[key],\n      has: (key: string) => key in router.query,\n    };\n  },\n};\n\nconst sharedCache = new Map<string, Record<string, () => Promise<unknown>>>();\nconst shared = (bundle: string, resolveClientUrl?: ResolveClientUrl) => {\n  // Skip cache when resolveClientUrl is provided — different resolver instances\n  // must not share a cache entry, since the image loader closes over the resolver.\n  if (!resolveClientUrl) {\n    if (sharedCache.has(bundle)) {\n      return sharedCache.get(bundle);\n    }\n  }\n\n  const result = {\n    // polyfill Next.js App Router client API (minimal)\n    // some API methods are not available when using a Next.js Pages Router application as host\n    'next/navigation': () =>\n      Promise.resolve(navigationImpl) as Promise<unknown>,\n    'next/dist/client/components/navigation': () =>\n      Promise.resolve(navigationImpl) as Promise<unknown>,\n    'next/dist/client/app-dir/link': () =>\n      Promise.resolve(Link.default) as Promise<unknown>,\n    'next/link': () => Promise.resolve(Link.default) as Promise<unknown>,\n    'next/dist/client/app-dir/form': () =>\n      Promise.resolve(Form.default) as Promise<unknown>,\n    'next/form': () => Promise.resolve(Form.default) as Promise<unknown>,\n    'next/dist/client/script': () =>\n      Promise.resolve(Script.default) as Promise<unknown>,\n    'next/script': () => Promise.resolve(Script.default) as Promise<unknown>,\n    'next/router': () => Promise.resolve(Router) as Promise<unknown>,\n    ..._shared,\n    ...createImageLoaderSharedEntries({ unbound: resolveClientUrl }),\n  };\n\n  if (!resolveClientUrl) {\n    sharedCache.set(bundle, result);\n  }\n\n  return result;\n};\n\n// internal symbols to access global store\nconst REMOTE_COMPONENT_STORE = Symbol('REMOTE_COMPONENT_STORE');\nconst REMOTE_COMPONENT_KEY = '__REMOTE_COMPONENT_KEY__';\n\n// temporary global store for remote component HTML\n// the store is used to save the HTML of remote components for SSR without sending the content to the client\nconst self = globalThis as typeof globalThis & {\n  [REMOTE_COMPONENT_STORE]?: Map<string, React.ReactNode>;\n};\n\nfunction getKey(bundle: string, route: string, name: string): string {\n  return `${bundle}:${route}:${name}__${crypto.randomUUID()}`;\n}\n\nfunction setComponent(key: string, component: React.ReactNode): void {\n  if (!self[REMOTE_COMPONENT_STORE]) {\n    self[REMOTE_COMPONENT_STORE] = new Map();\n  }\n  self[REMOTE_COMPONENT_STORE].set(key, component);\n}\n\nfunction getComponent(key: string): React.ReactNode | undefined {\n  const component = self[REMOTE_COMPONENT_STORE]?.get(key);\n  // remove the component from the store after retrieving it to prevent memory leaks\n  // storing the HTML in the global store is only needed for SSR and it's temporary only used for a single render\n  self[REMOTE_COMPONENT_STORE]?.delete(key);\n  return component;\n}\n\n/**\n * Props for the Next.js Pages Router remote component host.\n *\n * Extends {@link ConsumeRemoteComponentConfig} with Pages Router–specific `bundle` and\n * `route` props used for SSR hydration.\n */\nexport interface ConsumeRemoteComponentProps\n  extends ConsumeRemoteComponentConfig {\n  /** The source URL of the remote component. Required for server rendering. */\n  src: string | URL;\n  /** The Webpack bundle name for the remote component. */\n  bundle?: string;\n  /** The page route of the remote component. */\n  route?: string;\n  /** Loading fallback content displayed while the remote component is being fetched. */\n  children?: React.ReactNode;\n  [REMOTE_COMPONENT_KEY]?: string;\n}\n\n/**\n * This component handles the rendering of remote microfrontends.\n *\n * @param props - The properties for the remote component.\n * @returns A React component that renders the remote component.\n */\nexport function ConsumeRemoteComponent(props: ConsumeRemoteComponentProps) {\n  const remoteComponent =\n    typeof document !== 'undefined'\n      ? null\n      : // retrieve the HTML from the global store\n        getComponent(props[REMOTE_COMPONENT_KEY] ?? DEFAULT_COMPONENT_NAME);\n\n  const sharedResult = shared(\n    props.bundle ?? DEFAULT_BUNDLE_NAME,\n    props.resolveClientUrl,\n  );\n\n  useEffect(() => {\n    const clientSelf = globalThis as typeof globalThis & {\n      __remote_component_shared__?: Record<string, () => Promise<unknown>>;\n    };\n    // eslint-disable-next-line camelcase\n    clientSelf.__remote_component_shared__ = sharedResult;\n  }, [sharedResult]);\n\n  if (!props[REMOTE_COMPONENT_KEY]) {\n    return (\n      <ConsumeRemoteComponentReact\n        isolate={props.isolate}\n        mode={props.mode}\n        name={props.name}\n        onBeforeLoad={props.onBeforeLoad}\n        onChange={props.onChange}\n        onError={props.onError}\n        onLoad={props.onLoad}\n        onRequest={props.onRequest}\n        onResponse={props.onResponse}\n        resolveClientUrl={props.resolveClientUrl}\n        reset={props.reset}\n        shared={sharedResult}\n        src={props.src}\n      >\n        {props.children}\n      </ConsumeRemoteComponentReact>\n    );\n  }\n\n  return (\n    <ConsumeRemoteComponentReact\n      isolate={props.isolate}\n      mode={props.mode}\n      name={props.name}\n      onBeforeLoad={props.onBeforeLoad}\n      onChange={props.onChange}\n      onError={props.onError}\n      onLoad={props.onLoad}\n      onRequest={props.onRequest}\n      onResponse={props.onResponse}\n      resolveClientUrl={props.resolveClientUrl}\n      reset={props.reset}\n      shared={sharedResult}\n      src={props.src}\n    >\n      {remoteComponent}\n    </ConsumeRemoteComponentReact>\n  );\n}\n\n/**\n * Fetches the remote component properties from the server. You need to pass these properties to the `<ConsumeRemoteComponent>` component to render the fetched remote component.\n *\n * @param src - The source URL of the remote component. When using the Vercel Microfrontends solution, you can use relative paths, e.g. `/nextjs-app-remote/components/header`. Absolute URLs are also supported.\n * @param headers - The HTTP headers used for supporting the Vercel Microfrontends proxy.\n * @returns The properties of the remote component.\n *\n * @example\n *\n * ```tsx\n * import { getRemoteComponentProps } from 'remote-components/next/host/pages';\n * import type { GetServerSideProps } from 'next';\n *\n * export const getServerSideProps: GetServerSideProps<PageProps> = async function getServerSideProps({ req }) {\n *   const myRemoteComponent = await getConsumeRemoteComponentProps(\n *     '/nextjs-app-remote/components/header',\n *     req.headers,\n *   );\n *   return {\n *     props: {\n *       remoteComponents: {\n *         myRemoteComponent,\n *       },\n *     },\n *   };\n * }\n * ```\n */\nexport async function getConsumeRemoteComponentProps(\n  src: string,\n  options?: {\n    /**\n     * Called when a fetch request is made to retrieve the remote component payload.\n     * Can be used to intercept requests, modify headers, or provide a custom response.\n     */\n    onRequest?: OnRequestHook;\n    /**\n     * Called after a fetch completes to retrieve the remote component payload.\n     * Can be used to inspect the response (e.g., check for redirects) or transform it.\n     */\n    onResponse?: OnResponseHook;\n    /**\n     * The name of the exposed remote component. Used to identify the remote component\n     * when multiple remote components are exposed on a page.\n     */\n    name?: string;\n  },\n): Promise<ConsumeRemoteComponentProps> {\n  if (typeof document !== 'undefined') {\n    throw new RemoteComponentsError(\n      '`getConsumeRemoteComponentProps()` can only be used on the server side.',\n    );\n  }\n\n  const {\n    metadata: { bundle, route },\n    name,\n    links,\n    component,\n    nextData,\n    remoteShared,\n  } = await fetchRemoteComponent(src, {\n    rsc: true,\n    ...options,\n  });\n\n  const props: ConsumeRemoteComponentProps = {\n    src,\n    bundle,\n    name,\n    route,\n  };\n\n  const key = getKey(bundle, route, name);\n\n  // do not render the HTML in development mode when remote is using Next.js Pages Router\n  // this behavior is emulating the Next.js Pages Router FOUC as the styles are only applied on the client when running in development mode\n  if (nextData?.buildId !== 'development') {\n    // store the HTML in a global store\n    setComponent(\n      key,\n      <>\n        <script\n          data-remote-components-shared=\"\"\n          id={`${name}_shared`}\n          type=\"application/json\"\n        >\n          {JSON.stringify(remoteShared)}\n        </script>\n        {links.map((link) => (\n          <link\n            key={`${link.as}_${link.href}`}\n            {...link}\n            precedence={undefined}\n          />\n        ))}\n        {component}\n      </>,\n    );\n  }\n\n  return {\n    ...props,\n    // add remote component key to the props\n    [REMOTE_COMPONENT_KEY]: key,\n  };\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/host/nextjs/pages.tsx"],"sourcesContent":["import 'remote-components/remote/defaults/wrapper';\nimport * as Form from 'next/form';\nimport * as Link from 'next/link';\nimport * as Router from 'next/router';\nimport * as Script from 'next/script';\nimport { useEffect } from 'react';\nimport { ConsumeRemoteComponent as ConsumeRemoteComponentReact } from 'remote-components/host/react';\nimport { createImageLoaderSharedEntries } from '#internal/host/nextjs/image-shared';\nimport { fetchRemoteComponent } from '#internal/host/server/fetch-remote-component';\nimport type { ConsumeRemoteComponentConfig } from '#internal/host/shared/config';\nimport type {\n  OnRequestHook,\n  OnResponseHook,\n} from '#internal/host/shared/fetch-interceptors';\nimport {\n  isSharedModuleManifest,\n  type RemoteSharedModules,\n} from '#internal/host/shared/shared-broker';\nimport {\n  DEFAULT_BUNDLE_NAME,\n  DEFAULT_COMPONENT_NAME,\n} from '#internal/runtime/constants';\nimport {\n  DATA_REMOTE_COMPONENTS_SHARED,\n  DATA_REMOTE_COMPONENTS_SHARED_MANIFEST,\n  ID_SUFFIX_SHARED,\n  ID_SUFFIX_SHARED_MANIFEST,\n} from '#internal/runtime/html/html-spec';\nimport type { ResolveClientUrl } from '#internal/runtime/url/resolve-client-url';\nimport { RemoteComponentsError } from '#internal/utils/error';\nimport { shared as _shared } from '#remote-components/host/defaults/pages';\n\nconst navigationImpl = {\n  useRouter: () => Router.useRouter(),\n  useSearchParams: () => {\n    const router = Router.useRouter();\n    return {\n      get: (key: string) => router.query[key],\n      has: (key: string) => key in router.query,\n    };\n  },\n};\n\nconst sharedCache = new Map<string, Record<string, () => Promise<unknown>>>();\nconst shared = (bundle: string, resolveClientUrl?: ResolveClientUrl) => {\n  // Skip cache when resolveClientUrl is provided — different resolver instances\n  // must not share a cache entry, since the image loader closes over the resolver.\n  if (!resolveClientUrl) {\n    if (sharedCache.has(bundle)) {\n      return sharedCache.get(bundle);\n    }\n  }\n\n  const result = {\n    // polyfill Next.js App Router client API (minimal)\n    // some API methods are not available when using a Next.js Pages Router application as host\n    'next/navigation': () =>\n      Promise.resolve(navigationImpl) as Promise<unknown>,\n    'next/dist/client/components/navigation': () =>\n      Promise.resolve(navigationImpl) as Promise<unknown>,\n    'next/dist/client/app-dir/link': () =>\n      Promise.resolve(Link.default) as Promise<unknown>,\n    'next/link': () => Promise.resolve(Link.default) as Promise<unknown>,\n    'next/dist/client/app-dir/form': () =>\n      Promise.resolve(Form.default) as Promise<unknown>,\n    'next/form': () => Promise.resolve(Form.default) as Promise<unknown>,\n    'next/dist/client/script': () =>\n      Promise.resolve(Script.default) as Promise<unknown>,\n    'next/script': () => Promise.resolve(Script.default) as Promise<unknown>,\n    'next/router': () => Promise.resolve(Router) as Promise<unknown>,\n    ..._shared,\n    ...createImageLoaderSharedEntries({ unbound: resolveClientUrl }),\n  };\n\n  if (!resolveClientUrl) {\n    sharedCache.set(bundle, result);\n  }\n\n  return result;\n};\n\n// internal symbols to access global store\nconst REMOTE_COMPONENT_STORE = Symbol('REMOTE_COMPONENT_STORE');\nconst REMOTE_COMPONENT_KEY = '__REMOTE_COMPONENT_KEY__';\n\n// temporary global store for remote component HTML\n// the store is used to save the HTML of remote components for SSR without sending the content to the client\nconst self = globalThis as typeof globalThis & {\n  [REMOTE_COMPONENT_STORE]?: Map<string, React.ReactNode>;\n};\n\nfunction RemoteSharedScript({\n  name,\n  remoteShared,\n}: {\n  name: string;\n  remoteShared: RemoteSharedModules;\n}) {\n  if (isSharedModuleManifest(remoteShared)) {\n    return (\n      <script\n        {...{ [DATA_REMOTE_COMPONENTS_SHARED_MANIFEST]: '' }}\n        id={`${name}${ID_SUFFIX_SHARED_MANIFEST}`}\n        type=\"application/json\"\n      >\n        {JSON.stringify(remoteShared)}\n      </script>\n    );\n  }\n\n  return (\n    // @legacy(remote-components<=0.4.x): keep writing the historical shared\n    // map until hosts and remotes on 0.4.x are outside support.\n    <script\n      {...{ [DATA_REMOTE_COMPONENTS_SHARED]: '' }}\n      id={`${name}${ID_SUFFIX_SHARED}`}\n      type=\"application/json\"\n    >\n      {JSON.stringify(remoteShared)}\n    </script>\n  );\n}\n\nfunction getKey(bundle: string, route: string, name: string): string {\n  return `${bundle}:${route}:${name}__${crypto.randomUUID()}`;\n}\n\nfunction setComponent(key: string, component: React.ReactNode): void {\n  if (!self[REMOTE_COMPONENT_STORE]) {\n    self[REMOTE_COMPONENT_STORE] = new Map();\n  }\n  self[REMOTE_COMPONENT_STORE].set(key, component);\n}\n\nfunction getComponent(key: string): React.ReactNode | undefined {\n  const component = self[REMOTE_COMPONENT_STORE]?.get(key);\n  // remove the component from the store after retrieving it to prevent memory leaks\n  // storing the HTML in the global store is only needed for SSR and it's temporary only used for a single render\n  self[REMOTE_COMPONENT_STORE]?.delete(key);\n  return component;\n}\n\n/**\n * Props for the Next.js Pages Router remote component host.\n *\n * Extends {@link ConsumeRemoteComponentConfig} with Pages Router–specific `bundle` and\n * `route` props used for SSR hydration.\n */\nexport interface ConsumeRemoteComponentProps\n  extends ConsumeRemoteComponentConfig {\n  /** The source URL of the remote component. Required for server rendering. */\n  src: string | URL;\n  /** The Webpack bundle name for the remote component. */\n  bundle?: string;\n  /** The page route of the remote component. */\n  route?: string;\n  /** Loading fallback content displayed while the remote component is being fetched. */\n  children?: React.ReactNode;\n  [REMOTE_COMPONENT_KEY]?: string;\n}\n\n/**\n * This component handles the rendering of remote microfrontends.\n *\n * @param props - The properties for the remote component.\n * @returns A React component that renders the remote component.\n */\nexport function ConsumeRemoteComponent(props: ConsumeRemoteComponentProps) {\n  const remoteComponent =\n    typeof document !== 'undefined'\n      ? null\n      : // retrieve the HTML from the global store\n        getComponent(props[REMOTE_COMPONENT_KEY] ?? DEFAULT_COMPONENT_NAME);\n\n  const sharedResult = shared(\n    props.bundle ?? DEFAULT_BUNDLE_NAME,\n    props.resolveClientUrl,\n  );\n\n  useEffect(() => {\n    const clientSelf = globalThis as typeof globalThis & {\n      __remote_component_shared__?: Record<string, () => Promise<unknown>>;\n    };\n    // eslint-disable-next-line camelcase\n    clientSelf.__remote_component_shared__ = sharedResult;\n  }, [sharedResult]);\n\n  if (!props[REMOTE_COMPONENT_KEY]) {\n    return (\n      <ConsumeRemoteComponentReact\n        isolate={props.isolate}\n        mode={props.mode}\n        name={props.name}\n        onBeforeLoad={props.onBeforeLoad}\n        onChange={props.onChange}\n        onError={props.onError}\n        onLoad={props.onLoad}\n        onRequest={props.onRequest}\n        onResponse={props.onResponse}\n        resolveClientUrl={props.resolveClientUrl}\n        reset={props.reset}\n        shared={sharedResult}\n        src={props.src}\n      >\n        {props.children}\n      </ConsumeRemoteComponentReact>\n    );\n  }\n\n  return (\n    <ConsumeRemoteComponentReact\n      isolate={props.isolate}\n      mode={props.mode}\n      name={props.name}\n      onBeforeLoad={props.onBeforeLoad}\n      onChange={props.onChange}\n      onError={props.onError}\n      onLoad={props.onLoad}\n      onRequest={props.onRequest}\n      onResponse={props.onResponse}\n      resolveClientUrl={props.resolveClientUrl}\n      reset={props.reset}\n      shared={sharedResult}\n      src={props.src}\n    >\n      {remoteComponent}\n    </ConsumeRemoteComponentReact>\n  );\n}\n\n/**\n * Fetches the remote component properties from the server. You need to pass these properties to the `<ConsumeRemoteComponent>` component to render the fetched remote component.\n *\n * @param src - The source URL of the remote component. When using the Vercel Microfrontends solution, you can use relative paths, e.g. `/nextjs-app-remote/components/header`. Absolute URLs are also supported.\n * @param headers - The HTTP headers used for supporting the Vercel Microfrontends proxy.\n * @returns The properties of the remote component.\n *\n * @example\n *\n * ```tsx\n * import { getRemoteComponentProps } from 'remote-components/next/host/pages';\n * import type { GetServerSideProps } from 'next';\n *\n * export const getServerSideProps: GetServerSideProps<PageProps> = async function getServerSideProps({ req }) {\n *   const myRemoteComponent = await getConsumeRemoteComponentProps(\n *     '/nextjs-app-remote/components/header',\n *     req.headers,\n *   );\n *   return {\n *     props: {\n *       remoteComponents: {\n *         myRemoteComponent,\n *       },\n *     },\n *   };\n * }\n * ```\n */\nexport async function getConsumeRemoteComponentProps(\n  src: string,\n  options?: {\n    /**\n     * Called when a fetch request is made to retrieve the remote component payload.\n     * Can be used to intercept requests, modify headers, or provide a custom response.\n     */\n    onRequest?: OnRequestHook;\n    /**\n     * Called after a fetch completes to retrieve the remote component payload.\n     * Can be used to inspect the response (e.g., check for redirects) or transform it.\n     */\n    onResponse?: OnResponseHook;\n    /**\n     * The name of the exposed remote component. Used to identify the remote component\n     * when multiple remote components are exposed on a page.\n     */\n    name?: string;\n  },\n): Promise<ConsumeRemoteComponentProps> {\n  if (typeof document !== 'undefined') {\n    throw new RemoteComponentsError(\n      '`getConsumeRemoteComponentProps()` can only be used on the server side.',\n    );\n  }\n\n  const {\n    metadata: { bundle, route },\n    name,\n    links,\n    component,\n    nextData,\n    remoteShared,\n  } = await fetchRemoteComponent(src, {\n    rsc: true,\n    ...options,\n  });\n\n  const props: ConsumeRemoteComponentProps = {\n    src,\n    bundle,\n    name,\n    route,\n  };\n\n  const key = getKey(bundle, route, name);\n\n  // do not render the HTML in development mode when remote is using Next.js Pages Router\n  // this behavior is emulating the Next.js Pages Router FOUC as the styles are only applied on the client when running in development mode\n  if (nextData?.buildId !== 'development') {\n    // store the HTML in a global store\n    setComponent(\n      key,\n      <>\n        <RemoteSharedScript name={name} remoteShared={remoteShared} />\n        {links.map((link) => (\n          <link\n            key={`${link.as}_${link.href}`}\n            {...link}\n            precedence={undefined}\n          />\n        ))}\n        {component}\n      </>,\n    );\n  }\n\n  return {\n    ...props,\n    // add remote component key to the props\n    [REMOTE_COMPONENT_KEY]: key,\n  };\n}\n"],"mappings":"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","names":[]}