remote-components 0.2.2 → 0.3.1

package/dist/internal/runtime/turbopack/webpack-runtime.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/runtime/turbopack/webpack-runtime.ts"],"sourcesContent":["import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport {\n  REMOTE_COMPONENT_REGEX,\n  RUNTIME_TURBOPACK,\n  RUNTIME_WEBPACK,\n  type Runtime,\n} from '#internal/runtime/constants';\nimport type { GlobalScope } from '#internal/runtime/types';\nimport { RemoteComponentsError } from '#internal/utils/error';\nimport { logDebug, logWarn } from '#internal/utils/logger';\nimport { createChunkLoader } from './chunk-loader';\nimport { handleTurbopackModule } from './module';\nimport { getSharedModule, initializeSharedModules } from './shared-modules';\n\n/**\n * Sets up webpack runtime environment for remote components.\n * This function initializes the global webpack require and chunk loading functions\n * to support loading and executing remote component bundles.\n *\n * @param runtime - The bundler runtime type ('webpack' or 'turbopack')\n * @param scripts - Initial script chunks to load for Turbopack runtime\n * @param url - Base URL for the remote component bundle\n * @param bundle - Bundle identifier (defaults to 'default')\n * @param shared - Host-provided shared modules (e.g., React)\n * @param remoteShared - Mapping of remote module IDs to shared module names\n */\nexport async function setupWebpackRuntime(\n  runtime: Runtime,\n  scripts: { src: string | null }[] = [],\n  url: URL = new URL(location.href),\n  bundle?: string,\n  shared: Record<string, () => Promise<unknown>> = {},\n  remoteShared: Record<string, string> = {},\n  resolveClientUrl?: InternalResolveClientUrl,\n): Promise<void> {\n  const self = globalThis as GlobalScope;\n\n  if (!self.__remote_bundle_url__) {\n    self.__remote_bundle_url__ = {};\n  }\n  self.__remote_bundle_url__[bundle ?? 'default'] = url;\n  self.__webpack_get_script_filename__ = () => null;\n\n  if (\n    typeof self.__webpack_require__ !== 'function' ||\n    self.__webpack_require_type__ !== 'turbopack'\n  ) {\n    // preserve original webpack functions for fallback\n    if (\n      !self.__original_webpack_require__ &&\n      !self.__original_webpack_chunk_load__\n    ) {\n      self.__original_webpack_chunk_load__ = self.__webpack_chunk_load__;\n      self.__original_webpack_require__ = self.__webpack_require__;\n    }\n\n    self.__webpack_chunk_load__ = createChunkLoader(runtime, resolveClientUrl);\n    self.__webpack_require__ = createModuleRequire(runtime);\n    self.__webpack_require_type__ = runtime;\n\n    if (self.__remote_webpack_require__ && runtime === RUNTIME_TURBOPACK) {\n      const remoteBundle = bundle ?? 'default';\n      self.__remote_webpack_require__[remoteBundle] =\n        self.__webpack_require__ as (remoteId: string | number) => unknown;\n      self.__remote_webpack_require__[remoteBundle].type = 'turbopack';\n    }\n  }\n\n  // load all initial chunks when using Turbopack runtime\n  if (runtime === RUNTIME_TURBOPACK) {\n    await Promise.all(\n      scripts.map((script) => {\n        if (script.src) {\n          return self.__webpack_chunk_load__?.(script.src, bundle);\n        }\n        return Promise.resolve(undefined);\n      }),\n    );\n  }\n\n  // initialize shared modules with core React dependencies\n  const coreShared = {\n    react: async () => (await import('react')).default,\n    'react-dom': async () => (await import('react-dom')).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/client': async () => (await import('react-dom/client')).default,\n    ...shared,\n  };\n  await initializeSharedModules(\n    bundle ?? 'default',\n    // include all core modules as shared\n    coreShared,\n    remoteShared,\n  );\n}\n\n/**\n * Creates module require function for webpack runtime.\n * This function resolves module IDs to their exports, handling:\n * - Webpack remotes (pre-loaded bundles)\n * - Shared modules (React, etc.)\n * - Turbopack modules (dynamically loaded)\n */\nfunction createModuleRequire(runtime: Runtime): (id: string) => unknown {\n  return (id: string) => {\n    const self = globalThis as GlobalScope;\n    const { bundle, id: moduleId } = id.match(REMOTE_COMPONENT_REGEX)\n      ?.groups ?? {\n      bundle: 'default',\n      id,\n    };\n    const remoteRuntime = self.__remote_webpack_require__?.[bundle ?? 'default']\n      ? self.__remote_webpack_require__[bundle ?? 'default']?.type || 'webpack'\n      : runtime;\n\n    logDebug('WebpackRuntime', `remoteRuntime: \"${remoteRuntime}\"`);\n\n    try {\n      // for webpack remotes, use the pre-loaded require function\n      if (remoteRuntime === RUNTIME_WEBPACK && bundle && moduleId) {\n        return self.__remote_webpack_require__?.[bundle]?.(moduleId);\n      }\n      const sharedModuleId = moduleId ?? id;\n      const sharedModule = getSharedModule(bundle ?? 'default', sharedModuleId);\n      if (sharedModule) {\n        return sharedModule;\n      }\n      if (bundle && moduleId) {\n        return handleTurbopackModule(bundle, moduleId, id);\n      }\n      throw new Error(`Module \"${id}\" not found.`);\n    } catch (requireError) {\n      logWarn(\n        'WebpackRuntime',\n        `Module require failed: ${String(requireError)}`,\n      );\n      if (typeof self.__original_webpack_require__ !== 'function') {\n        throw new RemoteComponentsError(\n          `Module \"${id}\" not found in remote component bundle \"${bundle}\".`,\n          {\n            cause: requireError instanceof Error ? requireError : undefined,\n          },\n        );\n      }\n      try {\n        logDebug('WebpackRuntime', 'Falling back to original webpack require');\n        return self.__original_webpack_require__(id);\n      } catch (originalError) {\n        throw new RemoteComponentsError(\n          `Module \"${id}\" not found in remote component bundle \"${bundle}\".`,\n          { cause: originalError instanceof Error ? originalError : undefined },\n        );\n      }\n    }\n  };\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/runtime/turbopack/webpack-runtime.ts"],"sourcesContent":["import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport {\n  RUNTIME_TURBOPACK,\n  RUNTIME_WEBPACK,\n  type Runtime,\n} from '#internal/runtime/constants';\nimport { REMOTE_COMPONENT_REGEX } from '#internal/runtime/patterns';\nimport type { GlobalScope } from '#internal/runtime/types';\nimport { RemoteComponentsError } from '#internal/utils/error';\nimport { logDebug, logWarn } from '#internal/utils/logger';\nimport { createChunkLoader } from './chunk-loader';\nimport { handleTurbopackModule } from './module';\nimport { getSharedModule, initializeSharedModules } from './shared-modules';\n\n/**\n * Sets up webpack runtime environment for remote components.\n * This function initializes the global webpack require and chunk loading functions\n * to support loading and executing remote component bundles.\n *\n * @param runtime - The bundler runtime type ('webpack' or 'turbopack')\n * @param scripts - Initial script chunks to load for Turbopack runtime\n * @param url - Base URL for the remote component bundle\n * @param bundle - Bundle identifier (defaults to 'default')\n * @param shared - Host-provided shared modules (e.g., React)\n * @param remoteShared - Mapping of remote module IDs to shared module names\n */\nexport async function setupWebpackRuntime(\n  runtime: Runtime,\n  scripts: { src: string | null }[] = [],\n  url: URL = new URL(location.href),\n  bundle?: string,\n  shared: Record<string, () => Promise<unknown>> = {},\n  remoteShared: Record<string, string> = {},\n  resolveClientUrl?: InternalResolveClientUrl,\n): Promise<void> {\n  const self = globalThis as GlobalScope;\n\n  if (!self.__remote_bundle_url__) {\n    self.__remote_bundle_url__ = {};\n  }\n  self.__remote_bundle_url__[bundle ?? 'default'] = url;\n  self.__webpack_get_script_filename__ = () => null;\n\n  if (\n    typeof self.__webpack_require__ !== 'function' ||\n    self.__webpack_require_type__ !== 'turbopack'\n  ) {\n    // preserve original webpack functions for fallback\n    if (\n      !self.__original_webpack_require__ &&\n      !self.__original_webpack_chunk_load__\n    ) {\n      self.__original_webpack_chunk_load__ = self.__webpack_chunk_load__;\n      self.__original_webpack_require__ = self.__webpack_require__;\n    }\n\n    self.__webpack_chunk_load__ = createChunkLoader(runtime, resolveClientUrl);\n    self.__webpack_require__ = createModuleRequire(runtime);\n    self.__webpack_require_type__ = runtime;\n\n    if (self.__remote_webpack_require__ && runtime === RUNTIME_TURBOPACK) {\n      const remoteBundle = bundle ?? 'default';\n      self.__remote_webpack_require__[remoteBundle] =\n        self.__webpack_require__ as (remoteId: string | number) => unknown;\n      self.__remote_webpack_require__[remoteBundle].type = 'turbopack';\n    }\n  }\n\n  // load all initial chunks when using Turbopack runtime\n  if (runtime === RUNTIME_TURBOPACK) {\n    const results = await Promise.allSettled(\n      scripts.map((script) => {\n        if (script.src) {\n          return self.__webpack_chunk_load__?.(script.src, bundle);\n        }\n        return Promise.resolve(undefined);\n      }),\n    );\n\n    for (const result of results) {\n      if (result.status === 'rejected') {\n        logWarn(\n          'WebpackRuntime',\n          `Initial chunk load failed: ${String(result.reason)}`,\n        );\n      }\n    }\n  }\n\n  // initialize shared modules with core React dependencies\n  const coreShared = {\n    react: async () => (await import('react')).default,\n    'react-dom': async () => (await import('react-dom')).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/client': async () => (await import('react-dom/client')).default,\n    ...shared,\n  };\n  await initializeSharedModules(\n    bundle ?? 'default',\n    // include all core modules as shared\n    coreShared,\n    remoteShared,\n  );\n}\n\n/**\n * Creates module require function for webpack runtime.\n * This function resolves module IDs to their exports, handling:\n * - Webpack remotes (pre-loaded bundles)\n * - Shared modules (React, etc.)\n * - Turbopack modules (dynamically loaded)\n */\nfunction createModuleRequire(runtime: Runtime): (id: string) => unknown {\n  return (id: string) => {\n    const self = globalThis as GlobalScope;\n    const { bundle, id: moduleId } = id.match(REMOTE_COMPONENT_REGEX)\n      ?.groups ?? {\n      bundle: 'default',\n      id,\n    };\n    const remoteRuntime = self.__remote_webpack_require__?.[bundle ?? 'default']\n      ? self.__remote_webpack_require__[bundle ?? 'default']?.type || 'webpack'\n      : runtime;\n\n    logDebug('WebpackRuntime', `remoteRuntime: \"${remoteRuntime}\"`);\n\n    try {\n      // for webpack remotes, use the pre-loaded require function\n      if (remoteRuntime === RUNTIME_WEBPACK && bundle && moduleId) {\n        return self.__remote_webpack_require__?.[bundle]?.(moduleId);\n      }\n      const sharedModuleId = moduleId ?? id;\n      const sharedModule = getSharedModule(bundle ?? 'default', sharedModuleId);\n      if (sharedModule) {\n        return sharedModule;\n      }\n      if (bundle && moduleId) {\n        return handleTurbopackModule(bundle, moduleId, id);\n      }\n      throw new Error(`Module \"${id}\" not found.`);\n    } catch (requireError) {\n      logWarn(\n        'WebpackRuntime',\n        `Module require failed: ${String(requireError)}`,\n      );\n      if (typeof self.__original_webpack_require__ !== 'function') {\n        throw new RemoteComponentsError(\n          `Module \"${id}\" not found in remote component bundle \"${bundle}\".`,\n          {\n            cause: requireError instanceof Error ? requireError : undefined,\n          },\n        );\n      }\n      try {\n        logDebug('WebpackRuntime', 'Falling back to original webpack require');\n        return self.__original_webpack_require__(id);\n      } catch (originalError) {\n        throw new RemoteComponentsError(\n          `Module \"${id}\" not found in remote component bundle \"${bundle}\".`,\n          { cause: originalError instanceof Error ? originalError : undefined },\n        );\n      }\n    }\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/internal/runtime/turbopack/webpack-runtime.js

@@ -1,8 +1,8 @@
 import {
-  REMOTE_COMPONENT_REGEX,
   RUNTIME_TURBOPACK,
   RUNTIME_WEBPACK
 } from "#internal/runtime/constants";
+import { REMOTE_COMPONENT_REGEX } from "#internal/runtime/patterns";
 import { RemoteComponentsError } from "#internal/utils/error";
 import { logDebug, logWarn } from "#internal/utils/logger";
 import { createChunkLoader } from "./chunk-loader";
@@ -30,7 +30,7 @@ async function setupWebpackRuntime(runtime, scripts = [], url = new URL(location
     }
   }
   if (runtime === RUNTIME_TURBOPACK) {
-    await Promise.all(
+    const results = await Promise.allSettled(
       scripts.map((script) => {
         if (script.src) {
           return self.__webpack_chunk_load__?.(script.src, bundle);
@@ -38,6 +38,14 @@ async function setupWebpackRuntime(runtime, scripts = [], url = new URL(location
         return Promise.resolve(void 0);
       })
     );
+    for (const result of results) {
+      if (result.status === "rejected") {
+        logWarn(
+          "WebpackRuntime",
+          `Initial chunk load failed: ${String(result.reason)}`
+        );
+      }
+    }
   }
   const coreShared = {
     react: async () => (await import("react")).default,

package/dist/internal/runtime/turbopack/webpack-runtime.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/runtime/turbopack/webpack-runtime.ts"],"sourcesContent":["import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport {\n  REMOTE_COMPONENT_REGEX,\n  RUNTIME_TURBOPACK,\n  RUNTIME_WEBPACK,\n  type Runtime,\n} from '#internal/runtime/constants';\nimport type { GlobalScope } from '#internal/runtime/types';\nimport { RemoteComponentsError } from '#internal/utils/error';\nimport { logDebug, logWarn } from '#internal/utils/logger';\nimport { createChunkLoader } from './chunk-loader';\nimport { handleTurbopackModule } from './module';\nimport { getSharedModule, initializeSharedModules } from './shared-modules';\n\n/**\n * Sets up webpack runtime environment for remote components.\n * This function initializes the global webpack require and chunk loading functions\n * to support loading and executing remote component bundles.\n *\n * @param runtime - The bundler runtime type ('webpack' or 'turbopack')\n * @param scripts - Initial script chunks to load for Turbopack runtime\n * @param url - Base URL for the remote component bundle\n * @param bundle - Bundle identifier (defaults to 'default')\n * @param shared - Host-provided shared modules (e.g., React)\n * @param remoteShared - Mapping of remote module IDs to shared module names\n */\nexport async function setupWebpackRuntime(\n  runtime: Runtime,\n  scripts: { src: string | null }[] = [],\n  url: URL = new URL(location.href),\n  bundle?: string,\n  shared: Record<string, () => Promise<unknown>> = {},\n  remoteShared: Record<string, string> = {},\n  resolveClientUrl?: InternalResolveClientUrl,\n): Promise<void> {\n  const self = globalThis as GlobalScope;\n\n  if (!self.__remote_bundle_url__) {\n    self.__remote_bundle_url__ = {};\n  }\n  self.__remote_bundle_url__[bundle ?? 'default'] = url;\n  self.__webpack_get_script_filename__ = () => null;\n\n  if (\n    typeof self.__webpack_require__ !== 'function' ||\n    self.__webpack_require_type__ !== 'turbopack'\n  ) {\n    // preserve original webpack functions for fallback\n    if (\n      !self.__original_webpack_require__ &&\n      !self.__original_webpack_chunk_load__\n    ) {\n      self.__original_webpack_chunk_load__ = self.__webpack_chunk_load__;\n      self.__original_webpack_require__ = self.__webpack_require__;\n    }\n\n    self.__webpack_chunk_load__ = createChunkLoader(runtime, resolveClientUrl);\n    self.__webpack_require__ = createModuleRequire(runtime);\n    self.__webpack_require_type__ = runtime;\n\n    if (self.__remote_webpack_require__ && runtime === RUNTIME_TURBOPACK) {\n      const remoteBundle = bundle ?? 'default';\n      self.__remote_webpack_require__[remoteBundle] =\n        self.__webpack_require__ as (remoteId: string | number) => unknown;\n      self.__remote_webpack_require__[remoteBundle].type = 'turbopack';\n    }\n  }\n\n  // load all initial chunks when using Turbopack runtime\n  if (runtime === RUNTIME_TURBOPACK) {\n    await Promise.all(\n      scripts.map((script) => {\n        if (script.src) {\n          return self.__webpack_chunk_load__?.(script.src, bundle);\n        }\n        return Promise.resolve(undefined);\n      }),\n    );\n  }\n\n  // initialize shared modules with core React dependencies\n  const coreShared = {\n    react: async () => (await import('react')).default,\n    'react-dom': async () => (await import('react-dom')).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/client': async () => (await import('react-dom/client')).default,\n    ...shared,\n  };\n  await initializeSharedModules(\n    bundle ?? 'default',\n    // include all core modules as shared\n    coreShared,\n    remoteShared,\n  );\n}\n\n/**\n * Creates module require function for webpack runtime.\n * This function resolves module IDs to their exports, handling:\n * - Webpack remotes (pre-loaded bundles)\n * - Shared modules (React, etc.)\n * - Turbopack modules (dynamically loaded)\n */\nfunction createModuleRequire(runtime: Runtime): (id: string) => unknown {\n  return (id: string) => {\n    const self = globalThis as GlobalScope;\n    const { bundle, id: moduleId } = id.match(REMOTE_COMPONENT_REGEX)\n      ?.groups ?? {\n      bundle: 'default',\n      id,\n    };\n    const remoteRuntime = self.__remote_webpack_require__?.[bundle ?? 'default']\n      ? self.__remote_webpack_require__[bundle ?? 'default']?.type || 'webpack'\n      : runtime;\n\n    logDebug('WebpackRuntime', `remoteRuntime: \"${remoteRuntime}\"`);\n\n    try {\n      // for webpack remotes, use the pre-loaded require function\n      if (remoteRuntime === RUNTIME_WEBPACK && bundle && moduleId) {\n        return self.__remote_webpack_require__?.[bundle]?.(moduleId);\n      }\n      const sharedModuleId = moduleId ?? id;\n      const sharedModule = getSharedModule(bundle ?? 'default', sharedModuleId);\n      if (sharedModule) {\n        return sharedModule;\n      }\n      if (bundle && moduleId) {\n        return handleTurbopackModule(bundle, moduleId, id);\n      }\n      throw new Error(`Module \"${id}\" not found.`);\n    } catch (requireError) {\n      logWarn(\n        'WebpackRuntime',\n        `Module require failed: ${String(requireError)}`,\n      );\n      if (typeof self.__original_webpack_require__ !== 'function') {\n        throw new RemoteComponentsError(\n          `Module \"${id}\" not found in remote component bundle \"${bundle}\".`,\n          {\n            cause: requireError instanceof Error ? requireError : undefined,\n          },\n        );\n      }\n      try {\n        logDebug('WebpackRuntime', 'Falling back to original webpack require');\n        return self.__original_webpack_require__(id);\n      } catch (originalError) {\n        throw new RemoteComponentsError(\n          `Module \"${id}\" not found in remote component bundle \"${bundle}\".`,\n          { cause: originalError instanceof Error ? originalError : undefined },\n        );\n      }\n    }\n  };\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../../src/runtime/turbopack/webpack-runtime.ts"],"sourcesContent":["import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport {\n  RUNTIME_TURBOPACK,\n  RUNTIME_WEBPACK,\n  type Runtime,\n} from '#internal/runtime/constants';\nimport { REMOTE_COMPONENT_REGEX } from '#internal/runtime/patterns';\nimport type { GlobalScope } from '#internal/runtime/types';\nimport { RemoteComponentsError } from '#internal/utils/error';\nimport { logDebug, logWarn } from '#internal/utils/logger';\nimport { createChunkLoader } from './chunk-loader';\nimport { handleTurbopackModule } from './module';\nimport { getSharedModule, initializeSharedModules } from './shared-modules';\n\n/**\n * Sets up webpack runtime environment for remote components.\n * This function initializes the global webpack require and chunk loading functions\n * to support loading and executing remote component bundles.\n *\n * @param runtime - The bundler runtime type ('webpack' or 'turbopack')\n * @param scripts - Initial script chunks to load for Turbopack runtime\n * @param url - Base URL for the remote component bundle\n * @param bundle - Bundle identifier (defaults to 'default')\n * @param shared - Host-provided shared modules (e.g., React)\n * @param remoteShared - Mapping of remote module IDs to shared module names\n */\nexport async function setupWebpackRuntime(\n  runtime: Runtime,\n  scripts: { src: string | null }[] = [],\n  url: URL = new URL(location.href),\n  bundle?: string,\n  shared: Record<string, () => Promise<unknown>> = {},\n  remoteShared: Record<string, string> = {},\n  resolveClientUrl?: InternalResolveClientUrl,\n): Promise<void> {\n  const self = globalThis as GlobalScope;\n\n  if (!self.__remote_bundle_url__) {\n    self.__remote_bundle_url__ = {};\n  }\n  self.__remote_bundle_url__[bundle ?? 'default'] = url;\n  self.__webpack_get_script_filename__ = () => null;\n\n  if (\n    typeof self.__webpack_require__ !== 'function' ||\n    self.__webpack_require_type__ !== 'turbopack'\n  ) {\n    // preserve original webpack functions for fallback\n    if (\n      !self.__original_webpack_require__ &&\n      !self.__original_webpack_chunk_load__\n    ) {\n      self.__original_webpack_chunk_load__ = self.__webpack_chunk_load__;\n      self.__original_webpack_require__ = self.__webpack_require__;\n    }\n\n    self.__webpack_chunk_load__ = createChunkLoader(runtime, resolveClientUrl);\n    self.__webpack_require__ = createModuleRequire(runtime);\n    self.__webpack_require_type__ = runtime;\n\n    if (self.__remote_webpack_require__ && runtime === RUNTIME_TURBOPACK) {\n      const remoteBundle = bundle ?? 'default';\n      self.__remote_webpack_require__[remoteBundle] =\n        self.__webpack_require__ as (remoteId: string | number) => unknown;\n      self.__remote_webpack_require__[remoteBundle].type = 'turbopack';\n    }\n  }\n\n  // load all initial chunks when using Turbopack runtime\n  if (runtime === RUNTIME_TURBOPACK) {\n    const results = await Promise.allSettled(\n      scripts.map((script) => {\n        if (script.src) {\n          return self.__webpack_chunk_load__?.(script.src, bundle);\n        }\n        return Promise.resolve(undefined);\n      }),\n    );\n\n    for (const result of results) {\n      if (result.status === 'rejected') {\n        logWarn(\n          'WebpackRuntime',\n          `Initial chunk load failed: ${String(result.reason)}`,\n        );\n      }\n    }\n  }\n\n  // initialize shared modules with core React dependencies\n  const coreShared = {\n    react: async () => (await import('react')).default,\n    'react-dom': async () => (await import('react-dom')).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/client': async () => (await import('react-dom/client')).default,\n    ...shared,\n  };\n  await initializeSharedModules(\n    bundle ?? 'default',\n    // include all core modules as shared\n    coreShared,\n    remoteShared,\n  );\n}\n\n/**\n * Creates module require function for webpack runtime.\n * This function resolves module IDs to their exports, handling:\n * - Webpack remotes (pre-loaded bundles)\n * - Shared modules (React, etc.)\n * - Turbopack modules (dynamically loaded)\n */\nfunction createModuleRequire(runtime: Runtime): (id: string) => unknown {\n  return (id: string) => {\n    const self = globalThis as GlobalScope;\n    const { bundle, id: moduleId } = id.match(REMOTE_COMPONENT_REGEX)\n      ?.groups ?? {\n      bundle: 'default',\n      id,\n    };\n    const remoteRuntime = self.__remote_webpack_require__?.[bundle ?? 'default']\n      ? self.__remote_webpack_require__[bundle ?? 'default']?.type || 'webpack'\n      : runtime;\n\n    logDebug('WebpackRuntime', `remoteRuntime: \"${remoteRuntime}\"`);\n\n    try {\n      // for webpack remotes, use the pre-loaded require function\n      if (remoteRuntime === RUNTIME_WEBPACK && bundle && moduleId) {\n        return self.__remote_webpack_require__?.[bundle]?.(moduleId);\n      }\n      const sharedModuleId = moduleId ?? id;\n      const sharedModule = getSharedModule(bundle ?? 'default', sharedModuleId);\n      if (sharedModule) {\n        return sharedModule;\n      }\n      if (bundle && moduleId) {\n        return handleTurbopackModule(bundle, moduleId, id);\n      }\n      throw new Error(`Module \"${id}\" not found.`);\n    } catch (requireError) {\n      logWarn(\n        'WebpackRuntime',\n        `Module require failed: ${String(requireError)}`,\n      );\n      if (typeof self.__original_webpack_require__ !== 'function') {\n        throw new RemoteComponentsError(\n          `Module \"${id}\" not found in remote component bundle \"${bundle}\".`,\n          {\n            cause: requireError instanceof Error ? requireError : undefined,\n          },\n        );\n      }\n      try {\n        logDebug('WebpackRuntime', 'Falling back to original webpack require');\n        return self.__original_webpack_require__(id);\n      } catch (originalError) {\n        throw new RemoteComponentsError(\n          `Module \"${id}\" not found in remote component bundle \"${bundle}\".`,\n          { cause: originalError instanceof Error ? originalError : undefined },\n        );\n      }\n    }\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/remote/nextjs/app.cjs

@@ -36,6 +36,7 @@ var import_wrapper = require("remote-components/remote/defaults/wrapper");
 var import_work_async_storage = require("next/dist/server/app-render/work-async-storage.external");
 var import_react = require("react");
 var import_app_client = require("#internal/remote/nextjs/app-client");
+var import_constants = require("#internal/runtime/constants");
 var import_error = require("#internal/utils/error");
 const SERVER_ACTION_MANIFESTS_SINGLETON = Symbol.for(
   "next.server.action-manifests"
@@ -58,7 +59,7 @@ function RemoteComponentData({ name, data }) {
   ).join("\n") });
 }
 async function ExposeRemoteComponent({
-  name = "__vercel_remote_component",
+  name = import_constants.DEFAULT_COMPONENT_NAME,
   children
 }) {
   const { page, route } = import_work_async_storage.workAsyncStorage.getStore() ?? {

package/dist/remote/nextjs/app.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/remote/nextjs/app.tsx"],"sourcesContent":["import 'remote-components/remote/defaults/wrapper';\nimport { workAsyncStorage } from 'next/dist/server/app-render/work-async-storage.external';\nimport { Suspense } from 'react';\nimport type { ConsumeLifecycleCallbacks } from '#internal/host/shared/config';\nimport { RemoteComponentSharedRemote } from '#internal/remote/nextjs/app-client';\nimport { RemoteComponentsError } from '#internal/utils/error';\n\ninterface Manifest {\n  clientModules?: Record<\n    string,\n    { id: string; name: string; chunks: string[]; async: boolean }\n  >;\n  moduleLoading: { prefix?: string; crossOrigin?: boolean | null };\n  ssrModuleMapping?: Record<string, unknown>;\n}\n\n// internal Next.js symbol to access the manifest which is stored in the global scope\nconst SERVER_ACTION_MANIFESTS_SINGLETON = Symbol.for(\n  'next.server.action-manifests',\n);\nconst MANIFESTS_SINGLETON = Symbol.for('next.server.manifests');\n\nconst PROJECT_ID =\n  process.env.REMOTE_COMPONENTS_PROJECT_ID ||\n  process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION ||\n  process.env.VERCEL_PROJECT_ID;\n\nasync function tryImport<T>(importer: () => Promise<T>) {\n  try {\n    return (await importer()) as T;\n  } catch {\n    return {} as T;\n  }\n}\n\n// inject the RSC flight data into the HTML response using <script>\n// the RSC flight data is used to hydrate the remote component on the host\n// this approach is similar to an island architecture on the host\n// the remote component is static HTML until it is hydrated using this RSC flight data\nfunction RemoteComponentData({ name, data }: { name: string; data: string[] }) {\n  return (\n    <script id={`${name}_rsc`}>\n      {data\n        .map(\n          (chunk, i) =>\n            // make the data handling somewhat safe\n            `${\n              i === 0 ? `self[\"${name}\"]=self[\"${name}\"]||[];` : ''\n            }self[\"${name}\"].push(${JSON.stringify(chunk)});`,\n        )\n        .join('\\n')}\n    </script>\n  );\n}\n\n/**\n * Props for exposing a Next.js component as a remote component.\n *\n * Extends {@link ConsumeLifecycleCallbacks} so the consuming host can wire up lifecycle\n * events. The `children` prop is the component content to expose (required,\n * unlike host props where children are an optional loading fallback).\n */\nexport interface ExposeRemoteComponentProps extends ConsumeLifecycleCallbacks {\n  /** The name of the remote component. Use a unique name to expose multiple remote components from the same page. */\n  name?: string;\n  /** The content of the remote component. This is the content that will be rendered as the remote component. */\n  children: React.ReactNode;\n}\n\n/**\n * ExposeRemoteComponent is a Next.js component that exposes a remote component\n * that can be used in a host application.\n *\n * @param name - The name of the remote component. Use a unique name to expose multiple remote components from the same page.\n * @param children - The content of the remote component. This is the content that will be rendered as the remote component.\n * @returns A React component that renders the remote component.\n *\n * @example\n *\n * Use the `<ExposeRemoteComponent>` in your Next.js App Router application to expose the children as a remote component:\n *\n * ```tsx\n * import { ExposeRemoteComponent } from 'remote-components/remote/nextjs/app';\n *\n * export default function MyPage() {\n *   return (\n *     <ExposeRemoteComponent>\n *       <h1>Hello from the remote component!</h1>\n *       <p>This is a remote component that can be used in a host application.</p>\n *     </ExposeRemoteComponent>\n *   );\n * }\n * ```\n */\nexport async function ExposeRemoteComponent({\n  name = '__vercel_remote_component',\n  children,\n}: ExposeRemoteComponentProps): Promise<React.ReactElement> {\n  // access the internal Next.js work store to get the active page and route\n  const { page, route } = workAsyncStorage.getStore() ?? {\n    page: '/',\n    route: '/',\n  };\n\n  // get reference to the manifests from the global scope\n  const self = globalThis as typeof globalThis & {\n    [SERVER_ACTION_MANIFESTS_SINGLETON]?: {\n      clientReferenceManifestsPerPage?: Record<string, Manifest>;\n    };\n    [MANIFESTS_SINGLETON]?: {\n      clientReferenceManifestsPerRoute?: Map<string, Manifest>;\n    };\n    __RSC_MANIFEST?: Record<string, unknown>;\n    __RSC_SERVER_MANIFEST?: Record<string, unknown>;\n  };\n  const manifests =\n    self[MANIFESTS_SINGLETON] ?? self[SERVER_ACTION_MANIFESTS_SINGLETON] ?? {};\n  const manifest =\n    'clientReferenceManifestsPerRoute' in manifests\n      ? manifests.clientReferenceManifestsPerRoute?.get?.(route)\n      : 'clientReferenceManifestsPerPage' in manifests\n        ? manifests.clientReferenceManifestsPerPage?.[route]\n        : undefined;\n\n  // manually handle the internal Next.js manifest\n  self.__RSC_MANIFEST = self.__RSC_MANIFEST || {};\n  self.__RSC_MANIFEST[page] = self.__RSC_MANIFEST[page] || manifest;\n  self.__RSC_SERVER_MANIFEST = self.__RSC_SERVER_MANIFEST || {};\n  self.__RSC_SERVER_MANIFEST[page] =\n    self.__RSC_SERVER_MANIFEST[page] || manifest;\n\n  // get the client and SSR module mapping to be able to use client components in the remote component\n  const ssrModuleMapping = { ...manifest?.ssrModuleMapping };\n\n  // if the remote component is used in a hosting application, we need to mutate the module map to include the zone\n  const clientModules = Object.fromEntries(\n    Object.entries(manifest?.clientModules ?? {}).map(([key, value]) => {\n      // append a prefix to each entry in the module map to include the zone of the remote component\n      const remoteId = `[${PROJECT_ID}] ${value.id}`;\n      ssrModuleMapping[remoteId] = ssrModuleMapping[value.id];\n      // override the original id with the new remote id\n      return [\n        key,\n        {\n          ...value,\n          id: remoteId,\n          // prepend the current zone to the chunks to handle remote component chunk loading in Webpack\n          // this is required to avoid loading the wrong chunk in the host application\n          chunks: value.chunks.map((chunk) => `[${PROJECT_ID}] ${chunk}`),\n        },\n      ];\n    }),\n  );\n\n  // dynamically import the runtime specific RSC rendering functions and client component\n  const [\n    { renderToReadableStream: nextRenderToReadableStream },\n    { renderToReadableStream: legacyRenderToReadableStream },\n  ] = await Promise.all(\n    process.env.TURBOPACK\n      ? [\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-turbopack/server'),\n          ),\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-turbopack/server.edge'),\n          ),\n        ]\n      : [\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-webpack/server'),\n          ),\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-webpack/server.edge'),\n          ),\n        ],\n  );\n  const renderToReadableStream =\n    nextRenderToReadableStream ?? legacyRenderToReadableStream;\n\n  if (typeof renderToReadableStream !== 'function') {\n    throw new RemoteComponentsError(\n      'No valid `renderToReadableStream()` function found. Do you have Next.js installed?',\n    );\n  }\n\n  let error: Error | undefined;\n  // render the wrapped content of this component (children) into an RSC stream\n  const stream = renderToReadableStream(children, clientModules, {\n    onError(e) {\n      error = e;\n    },\n  });\n\n  const data = [];\n  const decoder = new TextDecoder();\n\n  // convert the stream to an array for safe passing to the client\n  for await (const chunk of stream as unknown as AsyncIterable<Uint8Array>) {\n    data.push(decoder.decode(chunk));\n  }\n\n  const runtime = process.env.TURBOPACK ? 'turbopack' : 'webpack';\n  const remoteComponentName = `${name}_${route.replace(/[/[\\].]/g, '_')}`;\n\n  return (\n    // wrap the remote component content into a div to know which part of the HTML belongs to the remote component\n    <div\n      data-bundle={PROJECT_ID}\n      data-route={route}\n      data-runtime={runtime}\n      data-type=\"nextjs\"\n      id={`${remoteComponentName}_ssr`}\n    >\n      <RemoteComponentSharedRemote name={remoteComponentName} />\n      {typeof error !== 'undefined' ? (\n        <>\n          <template\n            data-next-error-message={\n              error instanceof Error ? error.message : String(error)\n            }\n            data-next-error-stack={\n              error instanceof Error ? (error.stack ?? '') : ''\n            }\n          />\n          <Suspense fallback={null}>{children}</Suspense>\n        </>\n      ) : (\n        children\n      )}\n      {/* inject RSC flight data as <script> */}\n      <RemoteComponentData data={data} name={remoteComponentName} />\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/remote/nextjs/app.tsx"],"sourcesContent":["import 'remote-components/remote/defaults/wrapper';\nimport { workAsyncStorage } from 'next/dist/server/app-render/work-async-storage.external';\nimport { Suspense } from 'react';\nimport type { ConsumeLifecycleCallbacks } from '#internal/host/shared/config';\nimport { RemoteComponentSharedRemote } from '#internal/remote/nextjs/app-client';\nimport { DEFAULT_COMPONENT_NAME } from '#internal/runtime/constants';\nimport { RemoteComponentsError } from '#internal/utils/error';\n\ninterface Manifest {\n  clientModules?: Record<\n    string,\n    { id: string; name: string; chunks: string[]; async: boolean }\n  >;\n  moduleLoading: { prefix?: string; crossOrigin?: boolean | null };\n  ssrModuleMapping?: Record<string, unknown>;\n}\n\n// internal Next.js symbol to access the manifest which is stored in the global scope\nconst SERVER_ACTION_MANIFESTS_SINGLETON = Symbol.for(\n  'next.server.action-manifests',\n);\nconst MANIFESTS_SINGLETON = Symbol.for('next.server.manifests');\n\nconst PROJECT_ID =\n  process.env.REMOTE_COMPONENTS_PROJECT_ID ||\n  process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION ||\n  process.env.VERCEL_PROJECT_ID;\n\nasync function tryImport<T>(importer: () => Promise<T>) {\n  try {\n    return (await importer()) as T;\n  } catch {\n    return {} as T;\n  }\n}\n\n// inject the RSC flight data into the HTML response using <script>\n// the RSC flight data is used to hydrate the remote component on the host\n// this approach is similar to an island architecture on the host\n// the remote component is static HTML until it is hydrated using this RSC flight data\nfunction RemoteComponentData({ name, data }: { name: string; data: string[] }) {\n  return (\n    <script id={`${name}_rsc`}>\n      {data\n        .map(\n          (chunk, i) =>\n            // make the data handling somewhat safe\n            `${\n              i === 0 ? `self[\"${name}\"]=self[\"${name}\"]||[];` : ''\n            }self[\"${name}\"].push(${JSON.stringify(chunk)});`,\n        )\n        .join('\\n')}\n    </script>\n  );\n}\n\n/**\n * Props for exposing a Next.js component as a remote component.\n *\n * Extends {@link ConsumeLifecycleCallbacks} so the consuming host can wire up lifecycle\n * events. The `children` prop is the component content to expose (required,\n * unlike host props where children are an optional loading fallback).\n */\nexport interface ExposeRemoteComponentProps extends ConsumeLifecycleCallbacks {\n  /** The name of the remote component. Use a unique name to expose multiple remote components from the same page. */\n  name?: string;\n  /** The content of the remote component. This is the content that will be rendered as the remote component. */\n  children: React.ReactNode;\n}\n\n/**\n * ExposeRemoteComponent is a Next.js component that exposes a remote component\n * that can be used in a host application.\n *\n * @param name - The name of the remote component. Use a unique name to expose multiple remote components from the same page.\n * @param children - The content of the remote component. This is the content that will be rendered as the remote component.\n * @returns A React component that renders the remote component.\n *\n * @example\n *\n * Use the `<ExposeRemoteComponent>` in your Next.js App Router application to expose the children as a remote component:\n *\n * ```tsx\n * import { ExposeRemoteComponent } from 'remote-components/remote/nextjs/app';\n *\n * export default function MyPage() {\n *   return (\n *     <ExposeRemoteComponent>\n *       <h1>Hello from the remote component!</h1>\n *       <p>This is a remote component that can be used in a host application.</p>\n *     </ExposeRemoteComponent>\n *   );\n * }\n * ```\n */\nexport async function ExposeRemoteComponent({\n  name = DEFAULT_COMPONENT_NAME,\n  children,\n}: ExposeRemoteComponentProps): Promise<React.ReactElement> {\n  // access the internal Next.js work store to get the active page and route\n  const { page, route } = workAsyncStorage.getStore() ?? {\n    page: '/',\n    route: '/',\n  };\n\n  // get reference to the manifests from the global scope\n  const self = globalThis as typeof globalThis & {\n    [SERVER_ACTION_MANIFESTS_SINGLETON]?: {\n      clientReferenceManifestsPerPage?: Record<string, Manifest>;\n    };\n    [MANIFESTS_SINGLETON]?: {\n      clientReferenceManifestsPerRoute?: Map<string, Manifest>;\n    };\n    __RSC_MANIFEST?: Record<string, unknown>;\n    __RSC_SERVER_MANIFEST?: Record<string, unknown>;\n  };\n  const manifests =\n    self[MANIFESTS_SINGLETON] ?? self[SERVER_ACTION_MANIFESTS_SINGLETON] ?? {};\n  const manifest =\n    'clientReferenceManifestsPerRoute' in manifests\n      ? manifests.clientReferenceManifestsPerRoute?.get?.(route)\n      : 'clientReferenceManifestsPerPage' in manifests\n        ? manifests.clientReferenceManifestsPerPage?.[route]\n        : undefined;\n\n  // manually handle the internal Next.js manifest\n  self.__RSC_MANIFEST = self.__RSC_MANIFEST || {};\n  self.__RSC_MANIFEST[page] = self.__RSC_MANIFEST[page] || manifest;\n  self.__RSC_SERVER_MANIFEST = self.__RSC_SERVER_MANIFEST || {};\n  self.__RSC_SERVER_MANIFEST[page] =\n    self.__RSC_SERVER_MANIFEST[page] || manifest;\n\n  // get the client and SSR module mapping to be able to use client components in the remote component\n  const ssrModuleMapping = { ...manifest?.ssrModuleMapping };\n\n  // if the remote component is used in a hosting application, we need to mutate the module map to include the zone\n  const clientModules = Object.fromEntries(\n    Object.entries(manifest?.clientModules ?? {}).map(([key, value]) => {\n      // append a prefix to each entry in the module map to include the zone of the remote component\n      const remoteId = `[${PROJECT_ID}] ${value.id}`;\n      ssrModuleMapping[remoteId] = ssrModuleMapping[value.id];\n      // override the original id with the new remote id\n      return [\n        key,\n        {\n          ...value,\n          id: remoteId,\n          // prepend the current zone to the chunks to handle remote component chunk loading in Webpack\n          // this is required to avoid loading the wrong chunk in the host application\n          chunks: value.chunks.map((chunk) => `[${PROJECT_ID}] ${chunk}`),\n        },\n      ];\n    }),\n  );\n\n  // dynamically import the runtime specific RSC rendering functions and client component\n  const [\n    { renderToReadableStream: nextRenderToReadableStream },\n    { renderToReadableStream: legacyRenderToReadableStream },\n  ] = await Promise.all(\n    process.env.TURBOPACK\n      ? [\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-turbopack/server'),\n          ),\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-turbopack/server.edge'),\n          ),\n        ]\n      : [\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-webpack/server'),\n          ),\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-webpack/server.edge'),\n          ),\n        ],\n  );\n  const renderToReadableStream =\n    nextRenderToReadableStream ?? legacyRenderToReadableStream;\n\n  if (typeof renderToReadableStream !== 'function') {\n    throw new RemoteComponentsError(\n      'No valid `renderToReadableStream()` function found. Do you have Next.js installed?',\n    );\n  }\n\n  let error: Error | undefined;\n  // render the wrapped content of this component (children) into an RSC stream\n  const stream = renderToReadableStream(children, clientModules, {\n    onError(e) {\n      error = e;\n    },\n  });\n\n  const data = [];\n  const decoder = new TextDecoder();\n\n  // convert the stream to an array for safe passing to the client\n  for await (const chunk of stream as unknown as AsyncIterable<Uint8Array>) {\n    data.push(decoder.decode(chunk));\n  }\n\n  const runtime = process.env.TURBOPACK ? 'turbopack' : 'webpack';\n  const remoteComponentName = `${name}_${route.replace(/[/[\\].]/g, '_')}`;\n\n  return (\n    // wrap the remote component content into a div to know which part of the HTML belongs to the remote component\n    <div\n      data-bundle={PROJECT_ID}\n      data-route={route}\n      data-runtime={runtime}\n      data-type=\"nextjs\"\n      id={`${remoteComponentName}_ssr`}\n    >\n      <RemoteComponentSharedRemote name={remoteComponentName} />\n      {typeof error !== 'undefined' ? (\n        <>\n          <template\n            data-next-error-message={\n              error instanceof Error ? error.message : String(error)\n            }\n            data-next-error-stack={\n              error instanceof Error ? (error.stack ?? '') : ''\n            }\n          />\n          <Suspense fallback={null}>{children}</Suspense>\n        </>\n      ) : (\n        children\n      )}\n      {/* inject RSC flight data as <script> */}\n      <RemoteComponentData data={data} name={remoteComponentName} />\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/remote/nextjs/app.js

@@ -3,6 +3,7 @@ import "remote-components/remote/defaults/wrapper";
 import { workAsyncStorage } from "next/dist/server/app-render/work-async-storage.external";
 import { Suspense } from "react";
 import { RemoteComponentSharedRemote } from "#internal/remote/nextjs/app-client";
+import { DEFAULT_COMPONENT_NAME } from "#internal/runtime/constants";
 import { RemoteComponentsError } from "#internal/utils/error";
 const SERVER_ACTION_MANIFESTS_SINGLETON = Symbol.for(
   "next.server.action-manifests"
@@ -25,7 +26,7 @@ function RemoteComponentData({ name, data }) {
   ).join("\n") });
 }
 async function ExposeRemoteComponent({
-  name = "__vercel_remote_component",
+  name = DEFAULT_COMPONENT_NAME,
   children
 }) {
   const { page, route } = workAsyncStorage.getStore() ?? {

package/dist/remote/nextjs/app.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/remote/nextjs/app.tsx"],"sourcesContent":["import 'remote-components/remote/defaults/wrapper';\nimport { workAsyncStorage } from 'next/dist/server/app-render/work-async-storage.external';\nimport { Suspense } from 'react';\nimport type { ConsumeLifecycleCallbacks } from '#internal/host/shared/config';\nimport { RemoteComponentSharedRemote } from '#internal/remote/nextjs/app-client';\nimport { RemoteComponentsError } from '#internal/utils/error';\n\ninterface Manifest {\n  clientModules?: Record<\n    string,\n    { id: string; name: string; chunks: string[]; async: boolean }\n  >;\n  moduleLoading: { prefix?: string; crossOrigin?: boolean | null };\n  ssrModuleMapping?: Record<string, unknown>;\n}\n\n// internal Next.js symbol to access the manifest which is stored in the global scope\nconst SERVER_ACTION_MANIFESTS_SINGLETON = Symbol.for(\n  'next.server.action-manifests',\n);\nconst MANIFESTS_SINGLETON = Symbol.for('next.server.manifests');\n\nconst PROJECT_ID =\n  process.env.REMOTE_COMPONENTS_PROJECT_ID ||\n  process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION ||\n  process.env.VERCEL_PROJECT_ID;\n\nasync function tryImport<T>(importer: () => Promise<T>) {\n  try {\n    return (await importer()) as T;\n  } catch {\n    return {} as T;\n  }\n}\n\n// inject the RSC flight data into the HTML response using <script>\n// the RSC flight data is used to hydrate the remote component on the host\n// this approach is similar to an island architecture on the host\n// the remote component is static HTML until it is hydrated using this RSC flight data\nfunction RemoteComponentData({ name, data }: { name: string; data: string[] }) {\n  return (\n    <script id={`${name}_rsc`}>\n      {data\n        .map(\n          (chunk, i) =>\n            // make the data handling somewhat safe\n            `${\n              i === 0 ? `self[\"${name}\"]=self[\"${name}\"]||[];` : ''\n            }self[\"${name}\"].push(${JSON.stringify(chunk)});`,\n        )\n        .join('\\n')}\n    </script>\n  );\n}\n\n/**\n * Props for exposing a Next.js component as a remote component.\n *\n * Extends {@link ConsumeLifecycleCallbacks} so the consuming host can wire up lifecycle\n * events. The `children` prop is the component content to expose (required,\n * unlike host props where children are an optional loading fallback).\n */\nexport interface ExposeRemoteComponentProps extends ConsumeLifecycleCallbacks {\n  /** The name of the remote component. Use a unique name to expose multiple remote components from the same page. */\n  name?: string;\n  /** The content of the remote component. This is the content that will be rendered as the remote component. */\n  children: React.ReactNode;\n}\n\n/**\n * ExposeRemoteComponent is a Next.js component that exposes a remote component\n * that can be used in a host application.\n *\n * @param name - The name of the remote component. Use a unique name to expose multiple remote components from the same page.\n * @param children - The content of the remote component. This is the content that will be rendered as the remote component.\n * @returns A React component that renders the remote component.\n *\n * @example\n *\n * Use the `<ExposeRemoteComponent>` in your Next.js App Router application to expose the children as a remote component:\n *\n * ```tsx\n * import { ExposeRemoteComponent } from 'remote-components/remote/nextjs/app';\n *\n * export default function MyPage() {\n *   return (\n *     <ExposeRemoteComponent>\n *       <h1>Hello from the remote component!</h1>\n *       <p>This is a remote component that can be used in a host application.</p>\n *     </ExposeRemoteComponent>\n *   );\n * }\n * ```\n */\nexport async function ExposeRemoteComponent({\n  name = '__vercel_remote_component',\n  children,\n}: ExposeRemoteComponentProps): Promise<React.ReactElement> {\n  // access the internal Next.js work store to get the active page and route\n  const { page, route } = workAsyncStorage.getStore() ?? {\n    page: '/',\n    route: '/',\n  };\n\n  // get reference to the manifests from the global scope\n  const self = globalThis as typeof globalThis & {\n    [SERVER_ACTION_MANIFESTS_SINGLETON]?: {\n      clientReferenceManifestsPerPage?: Record<string, Manifest>;\n    };\n    [MANIFESTS_SINGLETON]?: {\n      clientReferenceManifestsPerRoute?: Map<string, Manifest>;\n    };\n    __RSC_MANIFEST?: Record<string, unknown>;\n    __RSC_SERVER_MANIFEST?: Record<string, unknown>;\n  };\n  const manifests =\n    self[MANIFESTS_SINGLETON] ?? self[SERVER_ACTION_MANIFESTS_SINGLETON] ?? {};\n  const manifest =\n    'clientReferenceManifestsPerRoute' in manifests\n      ? manifests.clientReferenceManifestsPerRoute?.get?.(route)\n      : 'clientReferenceManifestsPerPage' in manifests\n        ? manifests.clientReferenceManifestsPerPage?.[route]\n        : undefined;\n\n  // manually handle the internal Next.js manifest\n  self.__RSC_MANIFEST = self.__RSC_MANIFEST || {};\n  self.__RSC_MANIFEST[page] = self.__RSC_MANIFEST[page] || manifest;\n  self.__RSC_SERVER_MANIFEST = self.__RSC_SERVER_MANIFEST || {};\n  self.__RSC_SERVER_MANIFEST[page] =\n    self.__RSC_SERVER_MANIFEST[page] || manifest;\n\n  // get the client and SSR module mapping to be able to use client components in the remote component\n  const ssrModuleMapping = { ...manifest?.ssrModuleMapping };\n\n  // if the remote component is used in a hosting application, we need to mutate the module map to include the zone\n  const clientModules = Object.fromEntries(\n    Object.entries(manifest?.clientModules ?? {}).map(([key, value]) => {\n      // append a prefix to each entry in the module map to include the zone of the remote component\n      const remoteId = `[${PROJECT_ID}] ${value.id}`;\n      ssrModuleMapping[remoteId] = ssrModuleMapping[value.id];\n      // override the original id with the new remote id\n      return [\n        key,\n        {\n          ...value,\n          id: remoteId,\n          // prepend the current zone to the chunks to handle remote component chunk loading in Webpack\n          // this is required to avoid loading the wrong chunk in the host application\n          chunks: value.chunks.map((chunk) => `[${PROJECT_ID}] ${chunk}`),\n        },\n      ];\n    }),\n  );\n\n  // dynamically import the runtime specific RSC rendering functions and client component\n  const [\n    { renderToReadableStream: nextRenderToReadableStream },\n    { renderToReadableStream: legacyRenderToReadableStream },\n  ] = await Promise.all(\n    process.env.TURBOPACK\n      ? [\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-turbopack/server'),\n          ),\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-turbopack/server.edge'),\n          ),\n        ]\n      : [\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-webpack/server'),\n          ),\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-webpack/server.edge'),\n          ),\n        ],\n  );\n  const renderToReadableStream =\n    nextRenderToReadableStream ?? legacyRenderToReadableStream;\n\n  if (typeof renderToReadableStream !== 'function') {\n    throw new RemoteComponentsError(\n      'No valid `renderToReadableStream()` function found. Do you have Next.js installed?',\n    );\n  }\n\n  let error: Error | undefined;\n  // render the wrapped content of this component (children) into an RSC stream\n  const stream = renderToReadableStream(children, clientModules, {\n    onError(e) {\n      error = e;\n    },\n  });\n\n  const data = [];\n  const decoder = new TextDecoder();\n\n  // convert the stream to an array for safe passing to the client\n  for await (const chunk of stream as unknown as AsyncIterable<Uint8Array>) {\n    data.push(decoder.decode(chunk));\n  }\n\n  const runtime = process.env.TURBOPACK ? 'turbopack' : 'webpack';\n  const remoteComponentName = `${name}_${route.replace(/[/[\\].]/g, '_')}`;\n\n  return (\n    // wrap the remote component content into a div to know which part of the HTML belongs to the remote component\n    <div\n      data-bundle={PROJECT_ID}\n      data-route={route}\n      data-runtime={runtime}\n      data-type=\"nextjs\"\n      id={`${remoteComponentName}_ssr`}\n    >\n      <RemoteComponentSharedRemote name={remoteComponentName} />\n      {typeof error !== 'undefined' ? (\n        <>\n          <template\n            data-next-error-message={\n              error instanceof Error ? error.message : String(error)\n            }\n            data-next-error-stack={\n              error instanceof Error ? (error.stack ?? '') : ''\n            }\n          />\n          <Suspense fallback={null}>{children}</Suspense>\n        </>\n      ) : (\n        children\n      )}\n      {/* inject RSC flight data as <script> */}\n      <RemoteComponentData data={data} name={remoteComponentName} />\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/remote/nextjs/app.tsx"],"sourcesContent":["import 'remote-components/remote/defaults/wrapper';\nimport { workAsyncStorage } from 'next/dist/server/app-render/work-async-storage.external';\nimport { Suspense } from 'react';\nimport type { ConsumeLifecycleCallbacks } from '#internal/host/shared/config';\nimport { RemoteComponentSharedRemote } from '#internal/remote/nextjs/app-client';\nimport { DEFAULT_COMPONENT_NAME } from '#internal/runtime/constants';\nimport { RemoteComponentsError } from '#internal/utils/error';\n\ninterface Manifest {\n  clientModules?: Record<\n    string,\n    { id: string; name: string; chunks: string[]; async: boolean }\n  >;\n  moduleLoading: { prefix?: string; crossOrigin?: boolean | null };\n  ssrModuleMapping?: Record<string, unknown>;\n}\n\n// internal Next.js symbol to access the manifest which is stored in the global scope\nconst SERVER_ACTION_MANIFESTS_SINGLETON = Symbol.for(\n  'next.server.action-manifests',\n);\nconst MANIFESTS_SINGLETON = Symbol.for('next.server.manifests');\n\nconst PROJECT_ID =\n  process.env.REMOTE_COMPONENTS_PROJECT_ID ||\n  process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION ||\n  process.env.VERCEL_PROJECT_ID;\n\nasync function tryImport<T>(importer: () => Promise<T>) {\n  try {\n    return (await importer()) as T;\n  } catch {\n    return {} as T;\n  }\n}\n\n// inject the RSC flight data into the HTML response using <script>\n// the RSC flight data is used to hydrate the remote component on the host\n// this approach is similar to an island architecture on the host\n// the remote component is static HTML until it is hydrated using this RSC flight data\nfunction RemoteComponentData({ name, data }: { name: string; data: string[] }) {\n  return (\n    <script id={`${name}_rsc`}>\n      {data\n        .map(\n          (chunk, i) =>\n            // make the data handling somewhat safe\n            `${\n              i === 0 ? `self[\"${name}\"]=self[\"${name}\"]||[];` : ''\n            }self[\"${name}\"].push(${JSON.stringify(chunk)});`,\n        )\n        .join('\\n')}\n    </script>\n  );\n}\n\n/**\n * Props for exposing a Next.js component as a remote component.\n *\n * Extends {@link ConsumeLifecycleCallbacks} so the consuming host can wire up lifecycle\n * events. The `children` prop is the component content to expose (required,\n * unlike host props where children are an optional loading fallback).\n */\nexport interface ExposeRemoteComponentProps extends ConsumeLifecycleCallbacks {\n  /** The name of the remote component. Use a unique name to expose multiple remote components from the same page. */\n  name?: string;\n  /** The content of the remote component. This is the content that will be rendered as the remote component. */\n  children: React.ReactNode;\n}\n\n/**\n * ExposeRemoteComponent is a Next.js component that exposes a remote component\n * that can be used in a host application.\n *\n * @param name - The name of the remote component. Use a unique name to expose multiple remote components from the same page.\n * @param children - The content of the remote component. This is the content that will be rendered as the remote component.\n * @returns A React component that renders the remote component.\n *\n * @example\n *\n * Use the `<ExposeRemoteComponent>` in your Next.js App Router application to expose the children as a remote component:\n *\n * ```tsx\n * import { ExposeRemoteComponent } from 'remote-components/remote/nextjs/app';\n *\n * export default function MyPage() {\n *   return (\n *     <ExposeRemoteComponent>\n *       <h1>Hello from the remote component!</h1>\n *       <p>This is a remote component that can be used in a host application.</p>\n *     </ExposeRemoteComponent>\n *   );\n * }\n * ```\n */\nexport async function ExposeRemoteComponent({\n  name = DEFAULT_COMPONENT_NAME,\n  children,\n}: ExposeRemoteComponentProps): Promise<React.ReactElement> {\n  // access the internal Next.js work store to get the active page and route\n  const { page, route } = workAsyncStorage.getStore() ?? {\n    page: '/',\n    route: '/',\n  };\n\n  // get reference to the manifests from the global scope\n  const self = globalThis as typeof globalThis & {\n    [SERVER_ACTION_MANIFESTS_SINGLETON]?: {\n      clientReferenceManifestsPerPage?: Record<string, Manifest>;\n    };\n    [MANIFESTS_SINGLETON]?: {\n      clientReferenceManifestsPerRoute?: Map<string, Manifest>;\n    };\n    __RSC_MANIFEST?: Record<string, unknown>;\n    __RSC_SERVER_MANIFEST?: Record<string, unknown>;\n  };\n  const manifests =\n    self[MANIFESTS_SINGLETON] ?? self[SERVER_ACTION_MANIFESTS_SINGLETON] ?? {};\n  const manifest =\n    'clientReferenceManifestsPerRoute' in manifests\n      ? manifests.clientReferenceManifestsPerRoute?.get?.(route)\n      : 'clientReferenceManifestsPerPage' in manifests\n        ? manifests.clientReferenceManifestsPerPage?.[route]\n        : undefined;\n\n  // manually handle the internal Next.js manifest\n  self.__RSC_MANIFEST = self.__RSC_MANIFEST || {};\n  self.__RSC_MANIFEST[page] = self.__RSC_MANIFEST[page] || manifest;\n  self.__RSC_SERVER_MANIFEST = self.__RSC_SERVER_MANIFEST || {};\n  self.__RSC_SERVER_MANIFEST[page] =\n    self.__RSC_SERVER_MANIFEST[page] || manifest;\n\n  // get the client and SSR module mapping to be able to use client components in the remote component\n  const ssrModuleMapping = { ...manifest?.ssrModuleMapping };\n\n  // if the remote component is used in a hosting application, we need to mutate the module map to include the zone\n  const clientModules = Object.fromEntries(\n    Object.entries(manifest?.clientModules ?? {}).map(([key, value]) => {\n      // append a prefix to each entry in the module map to include the zone of the remote component\n      const remoteId = `[${PROJECT_ID}] ${value.id}`;\n      ssrModuleMapping[remoteId] = ssrModuleMapping[value.id];\n      // override the original id with the new remote id\n      return [\n        key,\n        {\n          ...value,\n          id: remoteId,\n          // prepend the current zone to the chunks to handle remote component chunk loading in Webpack\n          // this is required to avoid loading the wrong chunk in the host application\n          chunks: value.chunks.map((chunk) => `[${PROJECT_ID}] ${chunk}`),\n        },\n      ];\n    }),\n  );\n\n  // dynamically import the runtime specific RSC rendering functions and client component\n  const [\n    { renderToReadableStream: nextRenderToReadableStream },\n    { renderToReadableStream: legacyRenderToReadableStream },\n  ] = await Promise.all(\n    process.env.TURBOPACK\n      ? [\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-turbopack/server'),\n          ),\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-turbopack/server.edge'),\n          ),\n        ]\n      : [\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-webpack/server'),\n          ),\n          tryImport<RSDWServer>(\n            () => import('react-server-dom-webpack/server.edge'),\n          ),\n        ],\n  );\n  const renderToReadableStream =\n    nextRenderToReadableStream ?? legacyRenderToReadableStream;\n\n  if (typeof renderToReadableStream !== 'function') {\n    throw new RemoteComponentsError(\n      'No valid `renderToReadableStream()` function found. Do you have Next.js installed?',\n    );\n  }\n\n  let error: Error | undefined;\n  // render the wrapped content of this component (children) into an RSC stream\n  const stream = renderToReadableStream(children, clientModules, {\n    onError(e) {\n      error = e;\n    },\n  });\n\n  const data = [];\n  const decoder = new TextDecoder();\n\n  // convert the stream to an array for safe passing to the client\n  for await (const chunk of stream as unknown as AsyncIterable<Uint8Array>) {\n    data.push(decoder.decode(chunk));\n  }\n\n  const runtime = process.env.TURBOPACK ? 'turbopack' : 'webpack';\n  const remoteComponentName = `${name}_${route.replace(/[/[\\].]/g, '_')}`;\n\n  return (\n    // wrap the remote component content into a div to know which part of the HTML belongs to the remote component\n    <div\n      data-bundle={PROJECT_ID}\n      data-route={route}\n      data-runtime={runtime}\n      data-type=\"nextjs\"\n      id={`${remoteComponentName}_ssr`}\n    >\n      <RemoteComponentSharedRemote name={remoteComponentName} />\n      {typeof error !== 'undefined' ? (\n        <>\n          <template\n            data-next-error-message={\n              error instanceof Error ? error.message : String(error)\n            }\n            data-next-error-stack={\n              error instanceof Error ? (error.stack ?? '') : ''\n            }\n          />\n          <Suspense fallback={null}>{children}</Suspense>\n        </>\n      ) : (\n        children\n      )}\n      {/* inject RSC flight data as <script> */}\n      <RemoteComponentData data={data} name={remoteComponentName} />\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "remote-components",
-  "version": "0.2.2",
+  "version": "0.3.1",
   "private": false,
   "description": "Compose remote components at runtime between microfrontends applications.",
   "keywords": [

package/dist/internal/host/nextjs/image-impl.cjs

@@ -1,64 +0,0 @@
-"use strict";
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var image_impl_exports = {};
-__export(image_impl_exports, {
-  imageImpl: () => imageImpl
-});
-module.exports = __toCommonJS(image_impl_exports);
-var import_jsx_runtime = require("react/jsx-runtime");
-var import_polyfill = require("#internal/host/shared/polyfill");
-const getBundleUrl = (bundle) => globalThis.__remote_bundle_url__?.[bundle];
-function createRemoteLoader(bundle, resolveClientUrl) {
-  return ({ src, width, quality }) => {
-    const bundleUrl = getBundleUrl(bundle);
-    const origin = bundleUrl?.origin ?? "";
-    let imageUrl = src;
-    try {
-      const parsed = new URL(src);
-      if (origin && parsed.origin === origin) {
-        imageUrl = parsed.pathname + parsed.search;
-      }
-    } catch {
-    }
-    const { assetPrefix } = /^(?<assetPrefix>.*?)\/_next\//.exec(imageUrl)?.groups ?? {};
-    const url = `${origin}${assetPrefix ?? ""}/_next/image?url=${encodeURIComponent(imageUrl)}&w=${width}&q=${quality ?? 75}`;
-    const remoteSrc = bundleUrl?.href ?? url;
-    return resolveClientUrl?.(remoteSrc, url) ?? url;
-  };
-}
-function imageImpl(ImageComponent, bundle, resolveClientUrl, useRemoteLoader) {
-  const remoteLoader = useRemoteLoader ? createRemoteLoader(bundle, resolveClientUrl) : void 0;
-  const component = function RemoteImage(props) {
-    if (remoteLoader) {
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ImageComponent, { loader: remoteLoader, ...props });
-    }
-    const rawSrc = (0, import_polyfill.applyBundleUrlToImagePropsSrc)(bundle, props.src);
-    const bundleUrl = getBundleUrl(bundle);
-    const remoteSrc = bundleUrl?.href ?? rawSrc;
-    const src = resolveClientUrl?.(remoteSrc, rawSrc) ?? rawSrc;
-    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ImageComponent, { ...props, src });
-  };
-  component.default = component;
-  return component;
-}
-// Annotate the CommonJS export names for ESM import in node:
-0 && (module.exports = {
-  imageImpl
-});
-//# sourceMappingURL=image-impl.cjs.map

package/dist/internal/host/nextjs/image-impl.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/host/nextjs/image-impl.tsx"],"sourcesContent":["import type {\n  default as ImageComponentType,\n  ImageLoaderProps,\n  ImageProps,\n} from 'next/image';\nimport { applyBundleUrlToImagePropsSrc } from '#internal/host/shared/polyfill';\nimport type { ResolveClientUrl } from '#internal/runtime/url/resolve-client-url';\n\nconst getBundleUrl = (bundle: string) =>\n  (\n    globalThis as typeof globalThis & {\n      __remote_bundle_url__?: Record<string, URL>;\n    }\n  ).__remote_bundle_url__?.[bundle];\n\nfunction createRemoteLoader(\n  bundle: string,\n  resolveClientUrl?: ResolveClientUrl,\n) {\n  return ({ src, width, quality }: ImageLoaderProps) => {\n    const bundleUrl = getBundleUrl(bundle);\n    const origin = bundleUrl?.origin ?? '';\n\n    // Use a relative path when src is on the remote origin so the remote's\n    // /_next/image endpoint serves it locally — avoids requiring the remote's\n    // own origin in remotePatterns and works consistently across local/deployed.\n    // Relative paths (common from Next.js static imports) pass through as-is.\n    let imageUrl = src;\n    try {\n      const parsed = new URL(src);\n      if (origin && parsed.origin === origin) {\n        imageUrl = parsed.pathname + parsed.search;\n      }\n    } catch {\n      // src is already a relative path, use as-is\n    }\n\n    const { assetPrefix } =\n      /^(?<assetPrefix>.*?)\\/_next\\//.exec(imageUrl)?.groups ?? {};\n    const url = `${origin}${assetPrefix ?? ''}/_next/image?url=${encodeURIComponent(imageUrl)}&w=${width}&q=${\n      quality ?? 75\n    }`;\n    const remoteSrc = bundleUrl?.href ?? url;\n    return resolveClientUrl?.(remoteSrc, url) ?? url;\n  };\n}\n\nexport function imageImpl(\n  ImageComponent: typeof ImageComponentType,\n  bundle: string,\n  resolveClientUrl?: ResolveClientUrl,\n  useRemoteLoader?: boolean,\n) {\n  const remoteLoader = useRemoteLoader\n    ? createRemoteLoader(bundle, resolveClientUrl)\n    : undefined;\n\n  const component = function RemoteImage(props: ImageProps) {\n    // When using remoteLoader, pass props.src unchanged — the loader receives\n    // the original value (relative path or StaticImageData string) and handles\n    // URL construction and proxying itself. This matches the original working\n    // pattern and avoids unnecessary absolute→relative round-trips.\n    // Without remoteLoader, rewrite src to point at the remote origin and proxy.\n    if (remoteLoader) {\n      return <ImageComponent loader={remoteLoader} {...props} />;\n    }\n    const rawSrc = applyBundleUrlToImagePropsSrc(bundle, props.src);\n    const bundleUrl = getBundleUrl(bundle);\n    const remoteSrc = bundleUrl?.href ?? rawSrc;\n    const src = resolveClientUrl?.(remoteSrc, rawSrc) ?? rawSrc;\n    return <ImageComponent {...props} src={src} />;\n  };\n  component.default = component;\n  return component;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgEa;AA3Db,sBAA8C;AAG9C,MAAM,eAAe,CAAC,WAElB,WAGA,wBAAwB,MAAM;AAElC,SAAS,mBACP,QACA,kBACA;AACA,SAAO,CAAC,EAAE,KAAK,OAAO,QAAQ,MAAwB;AACpD,UAAM,YAAY,aAAa,MAAM;AACrC,UAAM,SAAS,WAAW,UAAU;AAMpC,QAAI,WAAW;AACf,QAAI;AACF,YAAM,SAAS,IAAI,IAAI,GAAG;AAC1B,UAAI,UAAU,OAAO,WAAW,QAAQ;AACtC,mBAAW,OAAO,WAAW,OAAO;AAAA,MACtC;AAAA,IACF,QAAE;AAAA,IAEF;AAEA,UAAM,EAAE,YAAY,IAClB,gCAAgC,KAAK,QAAQ,GAAG,UAAU,CAAC;AAC7D,UAAM,MAAM,GAAG,SAAS,eAAe,sBAAsB,mBAAmB,QAAQ,OAAO,WAC7F,WAAW;AAEb,UAAM,YAAY,WAAW,QAAQ;AACrC,WAAO,mBAAmB,WAAW,GAAG,KAAK;AAAA,EAC/C;AACF;AAEO,SAAS,UACd,gBACA,QACA,kBACA,iBACA;AACA,QAAM,eAAe,kBACjB,mBAAmB,QAAQ,gBAAgB,IAC3C;AAEJ,QAAM,YAAY,SAAS,YAAY,OAAmB;AAMxD,QAAI,cAAc;AAChB,aAAO,4CAAC,kBAAe,QAAQ,cAAe,GAAG,OAAO;AAAA,IAC1D;AACA,UAAM,aAAS,+CAA8B,QAAQ,MAAM,GAAG;AAC9D,UAAM,YAAY,aAAa,MAAM;AACrC,UAAM,YAAY,WAAW,QAAQ;AACrC,UAAM,MAAM,mBAAmB,WAAW,MAAM,KAAK;AACrD,WAAO,4CAAC,kBAAgB,GAAG,OAAO,KAAU;AAAA,EAC9C;AACA,YAAU,UAAU;AACpB,SAAO;AACT;","names":[]}

package/dist/internal/host/nextjs/image-impl.d.ts

@@ -1,10 +0,0 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import ImageComponentType, { ImageProps } from 'next/image';
-import { ResolveClientUrl } from '../../runtime/url/resolve-client-url.js';
-
-declare function imageImpl(ImageComponent: typeof ImageComponentType, bundle: string, resolveClientUrl?: ResolveClientUrl, useRemoteLoader?: boolean): {
-    (props: ImageProps): react_jsx_runtime.JSX.Element;
-    default: /*elided*/ any;
-};
-
-export { imageImpl };

package/dist/internal/host/nextjs/image-impl.js

@@ -1,40 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { applyBundleUrlToImagePropsSrc } from "#internal/host/shared/polyfill";
-const getBundleUrl = (bundle) => globalThis.__remote_bundle_url__?.[bundle];
-function createRemoteLoader(bundle, resolveClientUrl) {
-  return ({ src, width, quality }) => {
-    const bundleUrl = getBundleUrl(bundle);
-    const origin = bundleUrl?.origin ?? "";
-    let imageUrl = src;
-    try {
-      const parsed = new URL(src);
-      if (origin && parsed.origin === origin) {
-        imageUrl = parsed.pathname + parsed.search;
-      }
-    } catch {
-    }
-    const { assetPrefix } = /^(?<assetPrefix>.*?)\/_next\//.exec(imageUrl)?.groups ?? {};
-    const url = `${origin}${assetPrefix ?? ""}/_next/image?url=${encodeURIComponent(imageUrl)}&w=${width}&q=${quality ?? 75}`;
-    const remoteSrc = bundleUrl?.href ?? url;
-    return resolveClientUrl?.(remoteSrc, url) ?? url;
-  };
-}
-function imageImpl(ImageComponent, bundle, resolveClientUrl, useRemoteLoader) {
-  const remoteLoader = useRemoteLoader ? createRemoteLoader(bundle, resolveClientUrl) : void 0;
-  const component = function RemoteImage(props) {
-    if (remoteLoader) {
-      return /* @__PURE__ */ jsx(ImageComponent, { loader: remoteLoader, ...props });
-    }
-    const rawSrc = applyBundleUrlToImagePropsSrc(bundle, props.src);
-    const bundleUrl = getBundleUrl(bundle);
-    const remoteSrc = bundleUrl?.href ?? rawSrc;
-    const src = resolveClientUrl?.(remoteSrc, rawSrc) ?? rawSrc;
-    return /* @__PURE__ */ jsx(ImageComponent, { ...props, src });
-  };
-  component.default = component;
-  return component;
-}
-export {
-  imageImpl
-};
-//# sourceMappingURL=image-impl.js.map

package/dist/internal/host/nextjs/image-impl.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../../src/host/nextjs/image-impl.tsx"],"sourcesContent":["import type {\n  default as ImageComponentType,\n  ImageLoaderProps,\n  ImageProps,\n} from 'next/image';\nimport { applyBundleUrlToImagePropsSrc } from '#internal/host/shared/polyfill';\nimport type { ResolveClientUrl } from '#internal/runtime/url/resolve-client-url';\n\nconst getBundleUrl = (bundle: string) =>\n  (\n    globalThis as typeof globalThis & {\n      __remote_bundle_url__?: Record<string, URL>;\n    }\n  ).__remote_bundle_url__?.[bundle];\n\nfunction createRemoteLoader(\n  bundle: string,\n  resolveClientUrl?: ResolveClientUrl,\n) {\n  return ({ src, width, quality }: ImageLoaderProps) => {\n    const bundleUrl = getBundleUrl(bundle);\n    const origin = bundleUrl?.origin ?? '';\n\n    // Use a relative path when src is on the remote origin so the remote's\n    // /_next/image endpoint serves it locally — avoids requiring the remote's\n    // own origin in remotePatterns and works consistently across local/deployed.\n    // Relative paths (common from Next.js static imports) pass through as-is.\n    let imageUrl = src;\n    try {\n      const parsed = new URL(src);\n      if (origin && parsed.origin === origin) {\n        imageUrl = parsed.pathname + parsed.search;\n      }\n    } catch {\n      // src is already a relative path, use as-is\n    }\n\n    const { assetPrefix } =\n      /^(?<assetPrefix>.*?)\\/_next\\//.exec(imageUrl)?.groups ?? {};\n    const url = `${origin}${assetPrefix ?? ''}/_next/image?url=${encodeURIComponent(imageUrl)}&w=${width}&q=${\n      quality ?? 75\n    }`;\n    const remoteSrc = bundleUrl?.href ?? url;\n    return resolveClientUrl?.(remoteSrc, url) ?? url;\n  };\n}\n\nexport function imageImpl(\n  ImageComponent: typeof ImageComponentType,\n  bundle: string,\n  resolveClientUrl?: ResolveClientUrl,\n  useRemoteLoader?: boolean,\n) {\n  const remoteLoader = useRemoteLoader\n    ? createRemoteLoader(bundle, resolveClientUrl)\n    : undefined;\n\n  const component = function RemoteImage(props: ImageProps) {\n    // When using remoteLoader, pass props.src unchanged — the loader receives\n    // the original value (relative path or StaticImageData string) and handles\n    // URL construction and proxying itself. This matches the original working\n    // pattern and avoids unnecessary absolute→relative round-trips.\n    // Without remoteLoader, rewrite src to point at the remote origin and proxy.\n    if (remoteLoader) {\n      return <ImageComponent loader={remoteLoader} {...props} />;\n    }\n    const rawSrc = applyBundleUrlToImagePropsSrc(bundle, props.src);\n    const bundleUrl = getBundleUrl(bundle);\n    const remoteSrc = bundleUrl?.href ?? rawSrc;\n    const src = resolveClientUrl?.(remoteSrc, rawSrc) ?? rawSrc;\n    return <ImageComponent {...props} src={src} />;\n  };\n  component.default = component;\n  return component;\n}\n"],"mappings":"AAgEa;AA3Db,SAAS,qCAAqC;AAG9C,MAAM,eAAe,CAAC,WAElB,WAGA,wBAAwB,MAAM;AAElC,SAAS,mBACP,QACA,kBACA;AACA,SAAO,CAAC,EAAE,KAAK,OAAO,QAAQ,MAAwB;AACpD,UAAM,YAAY,aAAa,MAAM;AACrC,UAAM,SAAS,WAAW,UAAU;AAMpC,QAAI,WAAW;AACf,QAAI;AACF,YAAM,SAAS,IAAI,IAAI,GAAG;AAC1B,UAAI,UAAU,OAAO,WAAW,QAAQ;AACtC,mBAAW,OAAO,WAAW,OAAO;AAAA,MACtC;AAAA,IACF,QAAE;AAAA,IAEF;AAEA,UAAM,EAAE,YAAY,IAClB,gCAAgC,KAAK,QAAQ,GAAG,UAAU,CAAC;AAC7D,UAAM,MAAM,GAAG,SAAS,eAAe,sBAAsB,mBAAmB,QAAQ,OAAO,WAC7F,WAAW;AAEb,UAAM,YAAY,WAAW,QAAQ;AACrC,WAAO,mBAAmB,WAAW,GAAG,KAAK;AAAA,EAC/C;AACF;AAEO,SAAS,UACd,gBACA,QACA,kBACA,iBACA;AACA,QAAM,eAAe,kBACjB,mBAAmB,QAAQ,gBAAgB,IAC3C;AAEJ,QAAM,YAAY,SAAS,YAAY,OAAmB;AAMxD,QAAI,cAAc;AAChB,aAAO,oBAAC,kBAAe,QAAQ,cAAe,GAAG,OAAO;AAAA,IAC1D;AACA,UAAM,SAAS,8BAA8B,QAAQ,MAAM,GAAG;AAC9D,UAAM,YAAY,aAAa,MAAM;AACrC,UAAM,YAAY,WAAW,QAAQ;AACrC,UAAM,MAAM,mBAAmB,WAAW,MAAM,KAAK;AACrD,WAAO,oBAAC,kBAAgB,GAAG,OAAO,KAAU;AAAA,EAC9C;AACA,YAAU,UAAU;AACpB,SAAO;AACT;","names":[]}