remote-components 0.3.2 → 0.3.4

package/dist/host/html.js

@@ -183,7 +183,7 @@ var init_logger = __esm({
     init_constants();
     init_error();
     PREFIX = "remote-components";
-    DEBUG = typeof window !== "undefined" && localStorage.getItem("RC_DEBUG") === "true";
+    DEBUG = typeof window !== "undefined" && localStorage.getItem("RC_DEBUG") === "true" || typeof process !== "undefined" && process.env.RC_DEBUG === "true";
   }
 });
 
@@ -218,6 +218,152 @@ var init_constants2 = __esm({
   }
 });
 
+// src/runtime/namespace.ts
+function getNamespace() {
+  const g = globalThis;
+  const existing = g.__remote_components__;
+  if (existing) {
+    return existing;
+  }
+  const ns = {
+    scopes: /* @__PURE__ */ new Map(),
+    chunkCache: {},
+    mountFns: {},
+    unmountFns: {},
+    bundleUrls: {},
+    moduleRegistry: {},
+    dispatcherRuntime: void 0,
+    hostSharedModules: {},
+    cssCache: {},
+    shadowRoots: {}
+  };
+  const nsRecord = ns;
+  for (const { global, prop } of LEGACY_ALIASES) {
+    const legacyValue = g[global];
+    if (legacyValue != null) {
+      nsRecord[prop] = legacyValue;
+    }
+    g[global] = ns[prop];
+  }
+  const gRecord = g;
+  for (const key of Object.keys(gRecord)) {
+    if (key.startsWith(SHADOW_ROOT_PREFIX)) {
+      const suffix = key.slice(SHADOW_ROOT_PREFIX.length);
+      ns.shadowRoots[suffix] = gRecord[key];
+      delete gRecord[key];
+    }
+  }
+  g.__remote_components__ = ns;
+  return ns;
+}
+var SHADOW_ROOT_PREFIX, LEGACY_ALIASES;
+var init_namespace = __esm({
+  "src/runtime/namespace.ts"() {
+    "use strict";
+    SHADOW_ROOT_PREFIX = "__remote_components_shadowroot_";
+    LEGACY_ALIASES = [
+      { global: "__remote_component_scopes__", prop: "scopes" },
+      {
+        global: "__remote_components_turbopack_chunk_loader_promise__",
+        prop: "chunkCache"
+      },
+      { global: "__remote_script_entrypoint_mount__", prop: "mountFns" },
+      { global: "__remote_script_entrypoint_unmount__", prop: "unmountFns" },
+      { global: "__remote_bundle_url__", prop: "bundleUrls" },
+      { global: "__rc_module_registry__", prop: "moduleRegistry" },
+      {
+        global: "__remote_component_host_shared_modules__",
+        prop: "hostSharedModules"
+      },
+      { global: "__remote_next_css__", prop: "cssCache" }
+    ];
+  }
+});
+
+// src/runtime/patterns.ts
+function collapseDoubleSlashes(path) {
+  return path.replace(DOUBLE_SLASH_RE, "/");
+}
+var REMOTE_COMPONENT_REGEX, NEXT_BUNDLE_PATH_RE, DOUBLE_SLASH_RE;
+var init_patterns = __esm({
+  "src/runtime/patterns.ts"() {
+    "use strict";
+    REMOTE_COMPONENT_REGEX = /(?<prefix>.*?)\[(?<bundle>[^\]]+)\](?:%20| )(?<id>.+)/;
+    NEXT_BUNDLE_PATH_RE = /\/_next\/\[.+\](?:%20| )/;
+    DOUBLE_SLASH_RE = /(?<!:)\/\//g;
+  }
+});
+
+// src/runtime/turbopack/remote-scope.ts
+function getRegistry() {
+  return getNamespace().scopes;
+}
+function createScope(name, url, runtime, resolveClientUrl) {
+  const isCrossOrigin = url.origin !== location.origin;
+  const scopedName = computeScopedName(name, {
+    remoteHost: url.host,
+    isCrossOrigin
+  });
+  const globalKey = getBundleKey(scopedName);
+  return {
+    name,
+    scopedName,
+    globalKey,
+    url,
+    runtime,
+    resolveClientUrl,
+    moduleCache: {},
+    sharedModules: {},
+    moduleGlobal: {},
+    turbopackModules: []
+  };
+}
+function registerScope(scope) {
+  const registry = getRegistry();
+  registry.set(scope.scopedName, scope);
+  if (scope.scopedName !== scope.name) {
+    const existing = registry.get(scope.name);
+    if (existing && existing.scopedName !== scope.scopedName) {
+      logWarn(
+        "RemoteScope",
+        `Plain name "${scope.name}" already registered by scope "${existing.scopedName}" \u2014 overwriting with "${scope.scopedName}". Static hosts will only resolve the latest one.`
+      );
+    }
+    registry.set(scope.name, scope);
+  }
+  logDebug(
+    "RemoteScope",
+    `Registered scope "${scope.scopedName}" (${registry.size} total)`
+  );
+}
+function getScope(name) {
+  return getRegistry().get(name);
+}
+function formatRemoteId(scope, path) {
+  return `[${scope.scopedName}] ${path}`;
+}
+function parseRemoteId(id) {
+  const groups = REMOTE_COMPONENT_REGEX.exec(id)?.groups;
+  if (groups?.bundle && groups.id) {
+    return {
+      bundle: groups.bundle,
+      path: groups.id,
+      prefix: groups.prefix ?? ""
+    };
+  }
+  return { bundle: "default", path: id, prefix: "" };
+}
+var init_remote_scope = __esm({
+  "src/runtime/turbopack/remote-scope.ts"() {
+    "use strict";
+    init_constants2();
+    init_namespace();
+    init_patterns();
+    init_utils();
+    init_logger();
+  }
+});
+
 // src/config/webpack/apply-shared-modules.ts
 function applySharedModules(bundle, resolve) {
   logDebug(
@@ -229,13 +375,15 @@ function applySharedModules(bundle, resolve) {
     `Shared modules to resolve: ${Object.keys(resolve)}`
   );
   const self = globalThis;
-  if (self.__remote_webpack_require__?.[bundle]) {
+  const scope = getScope(bundle);
+  const webpackBundle = scope?.webpackRequire ?? self.__remote_webpack_require__?.[bundle];
+  if (webpackBundle) {
     const modulePaths = Object.keys(
-      self.__remote_webpack_module_map__?.[bundle] ?? self.__remote_webpack_require__[bundle].m ?? {}
+      self.__remote_webpack_module_map__?.[bundle] ?? webpackBundle.m ?? {}
     );
     logDebug(
       "SharedModules",
-      `Available module paths in __remote_webpack_require__[${bundle}]: ${modulePaths}`
+      `Available module paths for bundle "${bundle}": ${modulePaths}`
     );
     for (const [key, value] of Object.entries(resolve)) {
       const exactIds = modulePaths.filter((p) => p === key);
@@ -247,7 +395,6 @@ function applySharedModules(bundle, resolve) {
         );
       }
       for (const id of ids) {
-        const webpackBundle = self.__remote_webpack_require__[bundle];
         if (webpackBundle.m) {
           const resolvedId = self.__remote_webpack_module_map__?.[bundle]?.[id] ? `${self.__remote_webpack_module_map__[bundle][id]}` : id;
           if (resolvedId !== id) {
@@ -282,6 +429,7 @@ var DEDUPLICATION_SKIPPED;
 var init_apply_shared_modules = __esm({
   "src/config/webpack/apply-shared-modules.ts"() {
     "use strict";
+    init_remote_scope();
     init_logger();
     DEDUPLICATION_SKIPPED = "shared module deduplication skipped. The remote may load its own copy of shared dependencies.";
   }
@@ -353,10 +501,8 @@ function nextClientPagesLoader(bundle, route, styleContainer = document.head) {
     ];
     const { default: Component } = componentLoader();
     const { default: App } = appLoader();
-    if (!self.__remote_next_css__) {
-      self.__remote_next_css__ = {};
-    }
-    if (!self.__remote_next_css__[bundle]) {
+    const cssCache = getNamespace().cssCache;
+    if (!cssCache[bundle]) {
       const cssRE = /\.s?css$/;
       Object.keys(self.__remote_webpack_require__?.[bundle]?.m ?? {}).filter((id) => cssRE.test(id)).forEach((id) => {
         self.__remote_webpack_require__?.[bundle]?.(id);
@@ -374,15 +520,15 @@ function nextClientPagesLoader(bundle, route, styleContainer = document.head) {
         node.remove();
         node = nextCss.previousSibling;
       }
-      self.__remote_next_css__[bundle] = elements;
+      cssCache[bundle] = elements;
     }
     if (styleContainer) {
-      const elements = self.__remote_next_css__[bundle];
+      const elements = cssCache[bundle];
       elements.forEach((el) => {
         styleContainer.appendChild(el.cloneNode(true));
       });
     } else {
-      const elements = self.__remote_next_css__[bundle];
+      const elements = cssCache[bundle];
       elements.forEach((el) => {
         document.head.appendChild(el);
       });
@@ -401,96 +547,11 @@ function nextClientPagesLoader(bundle, route, styleContainer = document.head) {
 var init_next_client_pages_loader = __esm({
   "src/config/webpack/next-client-pages-loader.ts"() {
     "use strict";
+    init_namespace();
     init_error();
   }
 });
 
-// src/runtime/patterns.ts
-function collapseDoubleSlashes(path) {
-  return path.replace(DOUBLE_SLASH_RE, "/");
-}
-var REMOTE_COMPONENT_REGEX, NEXT_BUNDLE_PATH_RE, DOUBLE_SLASH_RE;
-var init_patterns = __esm({
-  "src/runtime/patterns.ts"() {
-    "use strict";
-    REMOTE_COMPONENT_REGEX = /(?<prefix>.*?)\[(?<bundle>[^\]]+)\](?:%20| )(?<id>.+)/;
-    NEXT_BUNDLE_PATH_RE = /\/_next\/\[.+\](?:%20| )/;
-    DOUBLE_SLASH_RE = /(?<!:)\/\//g;
-  }
-});
-
-// src/runtime/turbopack/remote-scope.ts
-function getRegistry() {
-  const self = globalThis;
-  if (!self.__remote_component_scopes__) {
-    self.__remote_component_scopes__ = /* @__PURE__ */ new Map();
-  }
-  return self.__remote_component_scopes__;
-}
-function createScope(name, url, runtime, resolveClientUrl) {
-  const isCrossOrigin = url.origin !== location.origin;
-  const scopedName = computeScopedName(name, {
-    remoteHost: url.host,
-    isCrossOrigin
-  });
-  const globalKey = getBundleKey(scopedName);
-  return {
-    name,
-    scopedName,
-    globalKey,
-    url,
-    runtime,
-    resolveClientUrl,
-    moduleCache: {},
-    sharedModules: {},
-    moduleGlobal: {}
-  };
-}
-function registerScope(scope) {
-  const registry = getRegistry();
-  registry.set(scope.scopedName, scope);
-  if (scope.scopedName !== scope.name) {
-    const existing = registry.get(scope.name);
-    if (existing && existing.scopedName !== scope.scopedName) {
-      logWarn(
-        "RemoteScope",
-        `Plain name "${scope.name}" already registered by scope "${existing.scopedName}" \u2014 overwriting with "${scope.scopedName}". Static hosts will only resolve the latest one.`
-      );
-    }
-    registry.set(scope.name, scope);
-  }
-  logDebug(
-    "RemoteScope",
-    `Registered scope "${scope.scopedName}" (${registry.size} total)`
-  );
-}
-function getScope(name) {
-  return getRegistry().get(name);
-}
-function formatRemoteId(scope, path) {
-  return `[${scope.scopedName}] ${path}`;
-}
-function parseRemoteId(id) {
-  const groups = REMOTE_COMPONENT_REGEX.exec(id)?.groups;
-  if (groups?.bundle && groups.id) {
-    return {
-      bundle: groups.bundle,
-      path: groups.id,
-      prefix: groups.prefix ?? ""
-    };
-  }
-  return { bundle: "default", path: id, prefix: "" };
-}
-var init_remote_scope = __esm({
-  "src/runtime/turbopack/remote-scope.ts"() {
-    "use strict";
-    init_constants2();
-    init_patterns();
-    init_utils();
-    init_logger();
-  }
-});
-
 // src/host/shared/remote-image-loader.ts
 function createRemoteImageLoader(bundle, resolveClientUrl) {
   const loader = Object.assign(
@@ -523,9 +584,9 @@ var init_remote_image_loader = __esm({
 // src/host/shared/polyfill.tsx
 import { jsx } from "react/jsx-runtime";
 function sharedPolyfills(shared, resolveClientUrl) {
-  const self = globalThis;
+  const hostShared = getNamespace().hostSharedModules;
   const polyfill = {
-    "next/dist/client/components/navigation": self.__remote_component_host_shared_modules__?.["next/navigation"] ?? shared?.["next/navigation"] ?? (() => Promise.resolve({
+    "next/dist/client/components/navigation": hostShared["next/navigation"] ?? shared?.["next/navigation"] ?? (() => Promise.resolve({
       useRouter() {
         return {
           push: (routerUrl) => {
@@ -556,7 +617,7 @@ function sharedPolyfills(shared, resolveClientUrl) {
       },
       __esModule: true
     })),
-    "next/dist/client/app-dir/link": self.__remote_component_host_shared_modules__?.["next/link"] ?? shared?.["next/link"] ?? (() => Promise.resolve({
+    "next/dist/client/app-dir/link": hostShared["next/link"] ?? shared?.["next/link"] ?? (() => Promise.resolve({
       default: ({
         scroll: _,
         replace,
@@ -606,7 +667,7 @@ function sharedPolyfills(shared, resolveClientUrl) {
       },
       __esModule: true
     })),
-    "next/dist/client/app-dir/form": self.__remote_component_host_shared_modules__?.["next/form"] ?? shared?.["next/form"] ?? (() => Promise.resolve({
+    "next/dist/client/app-dir/form": hostShared["next/form"] ?? shared?.["next/form"] ?? (() => Promise.resolve({
       default: () => {
         throw new Error("Next.js <Form> component not implemented");
       },
@@ -617,17 +678,17 @@ function sharedPolyfills(shared, resolveClientUrl) {
     // This gives us full next/image fidelity (fill, priority, srcSet, blur
     // placeholders, error handling) while routing image optimization through the
     // remote app's /_next/image endpoint.
-    "next/dist/shared/lib/image-loader": self.__remote_component_host_shared_modules__?.["next/dist/shared/lib/image-loader"] ?? shared?.["next/dist/shared/lib/image-loader"] ?? ((bundle) => Promise.resolve({
+    "next/dist/shared/lib/image-loader": hostShared["next/dist/shared/lib/image-loader"] ?? shared?.["next/dist/shared/lib/image-loader"] ?? ((bundle) => Promise.resolve({
       default: createRemoteImageLoader(bundle, resolveClientUrl),
       __esModule: true
     })),
-    "next/dist/client/script": self.__remote_component_host_shared_modules__?.["next/script"] ?? shared?.["next/script"] ?? (() => Promise.resolve({
+    "next/dist/client/script": hostShared["next/script"] ?? shared?.["next/script"] ?? (() => Promise.resolve({
       // TODO: implement <Script> component for non-Next.js host applications
       // do not throw an error for now
       default: () => null,
       __esModule: true
     })),
-    "next/router": self.__remote_component_host_shared_modules__?.["next/router"] ?? shared?.["next/router"] ?? (() => (
+    "next/router": hostShared["next/router"] ?? shared?.["next/router"] ?? (() => (
       // TODO: incomplete implementation
       Promise.resolve({
         useRouter() {
@@ -666,7 +727,78 @@ var init_polyfill = __esm({
   "src/host/shared/polyfill.tsx"() {
     "use strict";
     init_remote_image_loader();
+    init_namespace();
+    init_logger();
+  }
+});
+
+// src/host/shared/shared-module-resolver.ts
+function buildCoreShared(userShared) {
+  return {
+    react: async () => (await import("react")).default,
+    "react-dom": async () => (await import("react-dom")).default,
+    "react/jsx-dev-runtime": async () => (await import("react/jsx-dev-runtime")).default,
+    "react/jsx-runtime": async () => (await import("react/jsx-runtime")).default,
+    "react-dom/client": async () => (await import("react-dom/client")).default,
+    ...userShared
+  };
+}
+function buildHostShared(userShared, resolveClientUrl, options) {
+  const self = globalThis;
+  const result = {
+    ...sharedPolyfills(userShared, resolveClientUrl),
+    ...self.__remote_component_host_shared_modules__,
+    ...userShared
+  };
+  if (options?.includeRemoteComponentShared) {
+    Object.assign(result, self.__remote_component_shared__);
+  }
+  return result;
+}
+async function buildWebpackResolve(hostShared, remoteShared, bundle, reactModules, callerTag = "SharedModuleResolver") {
+  const resolve = {
+    ...reactModules,
+    ...Object.entries(remoteShared).reduce(
+      (acc, [key, value]) => {
+        if (typeof hostShared[value] !== "undefined") {
+          acc[key.replace(/^\(ssr\)\/(?<relative>\.\/)?/, "")] = hostShared[value];
+        } else {
+          logDebug(
+            callerTag,
+            `Remote requests "${value}" but host doesn't provide it`
+          );
+        }
+        return acc;
+      },
+      {}
+    )
+  };
+  await Promise.all(
+    Object.entries(resolve).map(async ([key, value]) => {
+      if (typeof value === "function") {
+        resolve[key] = await value(bundle);
+      }
+      return Promise.resolve(value);
+    })
+  );
+  return resolve;
+}
+var CORE_REACT_PATH_MAP, VENDOR_SHARED;
+var init_shared_module_resolver = __esm({
+  "src/host/shared/shared-module-resolver.ts"() {
+    "use strict";
+    init_polyfill();
     init_logger();
+    CORE_REACT_PATH_MAP = {
+      react: "/react/index.js",
+      "react/jsx-dev-runtime": "/react/jsx-dev-runtime.js",
+      "react/jsx-runtime": "/react/jsx-runtime.js",
+      "react-dom": "/react-dom/index.js",
+      "react-dom/client": "/react-dom/client.js"
+    };
+    VENDOR_SHARED = Object.fromEntries(
+      Object.entries(CORE_REACT_PATH_MAP).filter(([key]) => key !== "react-dom/client").map(([key, path]) => [key, `'${path}'`])
+    );
   }
 });
 
@@ -681,6 +813,13 @@ async function loadScripts(scripts, resolveClientUrl) {
           location.origin
         ).href;
         const resolvedSrc = resolveClientUrl?.(newSrc) ?? newSrc;
+        const alreadyLoaded = Array.from(
+          document.querySelectorAll("script[src]")
+        ).some((s) => s.src === resolvedSrc);
+        if (alreadyLoaded) {
+          resolve();
+          return;
+        }
         const newScript = document.createElement("script");
         newScript.onload = () => resolve();
         newScript.onerror = () => {
@@ -762,34 +901,19 @@ async function webpackRuntime(bundle, shared, remoteShared, resolveClientUrl) {
       ];
     });
     await loadScripts(scriptSrcs, resolveClientUrl);
-    const hostShared = {
-      ...sharedPolyfills(shared, resolveClientUrl),
-      ...self.__remote_component_host_shared_modules__,
-      ...shared
-    };
-    const resolve = {
-      "/react/index.js": (await import("react")).default,
-      "/react/jsx-dev-runtime.js": (await import("react/jsx-dev-runtime")).default,
-      "/react/jsx-runtime.js": (await import("react/jsx-runtime")).default,
-      "/react-dom/index.js": (await import("react-dom")).default,
-      "/react-dom/client.js": (await import("react-dom/client")).default,
-      ...Object.entries(remoteShared ?? {}).reduce(
-        (acc, [key, value]) => {
-          if (typeof hostShared[value] !== "undefined") {
-            acc[key.replace(/^\(ssr\)\/(?<relative>\.\/)?/, "")] = hostShared[value];
-          }
-          return acc;
-        },
-        {}
-      )
-    };
-    await Promise.all(
-      Object.entries(resolve).map(async ([key, value]) => {
-        if (typeof value === "function") {
-          resolve[key] = await value(remoteBundle);
-        }
-        return Promise.resolve(value);
-      })
+    const hostShared = buildHostShared(shared, resolveClientUrl);
+    const resolve = await buildWebpackResolve(
+      hostShared,
+      remoteShared ?? {},
+      remoteBundle,
+      {
+        "/react/index.js": (await import("react")).default,
+        "/react/jsx-dev-runtime.js": (await import("react/jsx-dev-runtime")).default,
+        "/react/jsx-runtime.js": (await import("react/jsx-runtime")).default,
+        "/react-dom/index.js": (await import("react-dom")).default,
+        "/react-dom/client.js": (await import("react-dom/client")).default
+      },
+      "WebpackRuntime"
     );
     applySharedModules(remoteBundle, resolve);
   }
@@ -806,7 +930,7 @@ var init_webpack = __esm({
     "use strict";
     init_apply_shared_modules();
     init_next_client_pages_loader();
-    init_polyfill();
+    init_shared_module_resolver();
     init_script_loader();
     init_patterns();
     init_error();
@@ -814,15 +938,31 @@ var init_webpack = __esm({
 });
 
 // src/runtime/turbopack/patterns.ts
-var REMOTE_SHARED_MARKER_RE, REMOTE_SHARED_ASSIGNMENT_RE, ASYNC_MODULE_LOADER_RE, ASYNC_MODULE_RESOLVE_RE, ASYNC_MODULE_ALL_RE, TURBOPACK_GLOBAL_RE;
+function stripQuotes(value) {
+  if (value.startsWith('"') && value.endsWith('"')) {
+    return value.slice(1, -1);
+  }
+  return value;
+}
+function extractGroup(re, input, group) {
+  const raw = re.exec(input)?.groups?.[group];
+  return raw ? stripQuotes(raw) : void 0;
+}
+var MODULE_ID_PATTERN, REMOTE_SHARED_MARKER_RE, REMOTE_SHARED_ASSIGNMENT_RE, ASYNC_MODULE_LOADER_RE, ASYNC_MODULE_CALLBACK_RE, TURBOPACK_GLOBAL_RE;
 var init_patterns2 = __esm({
   "src/runtime/turbopack/patterns.ts"() {
     "use strict";
+    MODULE_ID_PATTERN = '"[^"]+"|[0-9]+';
     REMOTE_SHARED_MARKER_RE = /(?:self|[a-z])\.TURBOPACK_REMOTE_SHARED/;
-    REMOTE_SHARED_ASSIGNMENT_RE = /\.TURBOPACK_REMOTE_SHARED=await (?:__turbopack_context__|[a-z])\.A\((?<sharedModuleId>[0-9]+)\)/;
-    ASYNC_MODULE_LOADER_RE = /(?:__turbopack_context__|e)\.A\((?<asyncSharedModuleId>[0-9]+)\)/;
-    ASYNC_MODULE_RESOLVE_RE = /(?<ctx>__turbopack_context__|e)=>\{\k<ctx>\.v\((?<inner>parentImport|e)=>Promise\.resolve\(\)\.then\(\(\)=>\k<inner>\((?<sharedModuleId>[0-9]+)\)\)\)\}/;
-    ASYNC_MODULE_ALL_RE = /(?<ctx>__turbopack_context__|e)=>\{\k<ctx>\.v\((?<vCb>parentImport|t)=>Promise\.all\(\["[^"]+"\]\.map\((?<mapCb>chunk|t)=>\k<ctx>\.l\(\k<mapCb>\)\)\)\.then\(\(\)=>\k<vCb>\((?<sharedModuleId>[0-9]+)\)\)\)\}/;
+    REMOTE_SHARED_ASSIGNMENT_RE = new RegExp(
+      `\\.TURBOPACK_REMOTE_SHARED\\s*=\\s*await (?:__turbopack_context__|[a-z])\\.A\\((?<sharedModuleId>${MODULE_ID_PATTERN})\\)`
+    );
+    ASYNC_MODULE_LOADER_RE = new RegExp(
+      `(?:__turbopack_context__|e)\\.A\\((?<asyncSharedModuleId>${MODULE_ID_PATTERN})\\)`
+    );
+    ASYNC_MODULE_CALLBACK_RE = new RegExp(
+      `(?:parentImport|[a-z])\\((?<sharedModuleId>${MODULE_ID_PATTERN})\\)`
+    );
     TURBOPACK_GLOBAL_RE = /(?:globalThis|self)\s*(?:\.TURBOPACK|\[\s*["']TURBOPACK["']\s*\])/;
   }
 });
@@ -834,6 +974,7 @@ function loadChunkWithScope(scope, chunkId) {
     `loadChunkWithScope: "${chunkId}" (scope: "${scope.scopedName}")`
   );
   const self = globalThis;
+  const ns = getNamespace();
   const { bundle, path, prefix } = parseRemoteId(chunkId);
   const remoteRuntime = self.__remote_webpack_require__?.[bundle ?? "default"] ? self.__remote_webpack_require__[bundle ?? "default"]?.type || "webpack" : scope.runtime;
   if (remoteRuntime === RUNTIME_WEBPACK) {
@@ -844,35 +985,31 @@ function loadChunkWithScope(scope, chunkId) {
   if (url.endsWith(".css")) {
     return;
   }
-  if (!self.__remote_components_turbopack_chunk_loader_promise__) {
-    self.__remote_components_turbopack_chunk_loader_promise__ = {};
-  }
-  if (self.__remote_components_turbopack_chunk_loader_promise__[url]) {
-    return self.__remote_components_turbopack_chunk_loader_promise__[url];
+  if (ns.chunkCache[url]) {
+    logDebug("ChunkLoader", `Cache hit for "${chunkId}" (url="${url}")`);
+    return ns.chunkCache[url];
   }
   const resolvedUrl = scope.resolveClientUrl?.(url) ?? url;
   if (resolvedUrl !== url) {
     logDebug("ChunkLoader", `Proxied chunk URL: "${url}" \u2192 "${resolvedUrl}"`);
   }
-  self.__remote_components_turbopack_chunk_loader_promise__[url] = new Promise(
-    (resolve, reject) => {
-      fetch(resolvedUrl).then((res) => res.text()).then((code) => {
-        const hasTurbopack = TURBOPACK_GLOBAL_RE.test(code);
-        if (hasTurbopack) {
-          return handleTurbopackChunk(code, scope, url);
-        }
-      }).then(resolve).catch((error) => {
-        const isProxied = isProxiedUrl(resolvedUrl);
-        if (isProxied) {
-          reject(failedProxiedAssetError("chunk", url, resolvedUrl));
-        } else {
-          warnCrossOriginFetchError("ChunkLoader", url);
-          reject(error);
-        }
-      });
-    }
-  );
-  return self.__remote_components_turbopack_chunk_loader_promise__[url];
+  ns.chunkCache[url] = new Promise((resolve, reject) => {
+    fetch(resolvedUrl).then((res) => res.text()).then((code) => {
+      const hasTurbopack = TURBOPACK_GLOBAL_RE.test(code);
+      if (hasTurbopack) {
+        return handleTurbopackChunk(code, scope, url);
+      }
+    }).then(resolve).catch((error) => {
+      const isProxied = isProxiedUrl(resolvedUrl);
+      if (isProxied) {
+        reject(failedProxiedAssetError("chunk", url, resolvedUrl));
+      } else {
+        warnCrossOriginFetchError("ChunkLoader", url);
+        reject(error);
+      }
+    });
+  });
+  return ns.chunkCache[url];
 }
 function createChunkDispatcher() {
   return function __chunk_dispatcher__(chunkId, scriptBundle) {
@@ -921,19 +1058,39 @@ async function handleTurbopackChunk(code, scope, url) {
     `//# sourceMappingURL=${new URL(".", new URL(url, scope.url)).href}$1$2.js.map`
   );
   if (!self[`TURBOPACK_${globalKey}`]) {
-    const chunkData = [];
-    const turbopackObject = {
-      push: (item) => {
-        if (Array.isArray(item)) {
-          chunkData.push(item);
-        } else {
-          chunkData.push([item]);
+    const wrapPush = (target) => {
+      const originalPush = target.push;
+      if (typeof originalPush !== "function")
+        return target;
+      target.push = (...items) => {
+        for (const item of items) {
+          if (Array.isArray(item)) {
+            for (const entry of item) {
+              scope.turbopackModules.push(entry);
+            }
+          } else {
+            scope.turbopackModules.push(item);
+          }
         }
-        return chunkData.length;
-      },
-      __chunks__: chunkData
+        return originalPush.apply(target, items);
+      };
+      return target;
     };
-    self[`TURBOPACK_${globalKey}`] = turbopackObject;
+    const globalProp = `TURBOPACK_${globalKey}`;
+    let currentValue = wrapPush([]);
+    Object.defineProperty(self, globalProp, {
+      get() {
+        return currentValue;
+      },
+      set(newValue) {
+        if (newValue && typeof newValue === "object") {
+          wrapPush(newValue);
+        }
+        currentValue = newValue;
+      },
+      configurable: true,
+      enumerable: true
+    });
   }
   await new Promise((scriptResolve, scriptReject) => {
     const blob = new Blob([transformedCode], {
@@ -985,6 +1142,7 @@ var init_chunk_loader = __esm({
   "src/runtime/turbopack/chunk-loader.ts"() {
     "use strict";
     init_constants2();
+    init_namespace();
     init_patterns();
     init_protected_rc_fallback();
     init_error();
@@ -996,13 +1154,13 @@ var init_chunk_loader = __esm({
 
 // src/runtime/turbopack/shared-modules.ts
 function getTurbopackModules(scope) {
+  if (scope.turbopackModules.length > 0) {
+    return scope.turbopackModules;
+  }
   const self = globalThis;
   const raw = self[`TURBOPACK_${scope.globalKey}`];
   if (!raw)
     return void 0;
-  if (typeof raw === "object" && "__chunks__" in raw) {
-    return raw.__chunks__.flat();
-  }
   if (Array.isArray(raw)) {
     return raw.flat();
   }
@@ -1026,7 +1184,11 @@ async function initializeSharedModules(scope, hostShared = {}, remoteShared = {}
     if (sharedModuleInitializerIndex > 0) {
       const sharedModuleInitializerCode = allModules[sharedModuleInitializerIndex].toString();
       const sharedModuleInitializerId = allModules[sharedModuleInitializerIndex - 1];
-      const { sharedModuleId } = REMOTE_SHARED_ASSIGNMENT_RE.exec(sharedModuleInitializerCode)?.groups ?? {};
+      const sharedModuleId = extractGroup(
+        REMOTE_SHARED_ASSIGNMENT_RE,
+        sharedModuleInitializerCode,
+        "sharedModuleId"
+      );
       if (sharedModuleId) {
         const { default: sharedModuleInitializerInstance } = handleTurbopackModule(
           scope,
@@ -1084,20 +1246,22 @@ async function initializeSharedModules(scope, hostShared = {}, remoteShared = {}
 }
 function extractSharedModuleIds(shared, scope) {
   return Object.entries(shared).filter(([, value]) => typeof value === "function").reduce((acc, [key, value]) => {
-    const { asyncSharedModuleId } = ASYNC_MODULE_LOADER_RE.exec(value.toString())?.groups ?? {};
+    const asyncSharedModuleId = extractGroup(
+      ASYNC_MODULE_LOADER_RE,
+      value.toString(),
+      "asyncSharedModuleId"
+    );
     if (asyncSharedModuleId) {
-      const asyncSharedModuleIdNumber = Number(asyncSharedModuleId);
-      let asyncSharedModule;
-      const turbopackModules = getTurbopackModules(scope) ?? [];
-      const asyncSharedModuleIdIndex = turbopackModules.indexOf(
-        asyncSharedModuleIdNumber
+      const asyncSharedModule = findModuleInit(
+        getTurbopackModules(scope),
+        asyncSharedModuleId
       );
-      if (asyncSharedModuleIdIndex !== -1 && typeof turbopackModules[asyncSharedModuleIdIndex + 1] === "function") {
-        asyncSharedModule = turbopackModules[asyncSharedModuleIdIndex + 1];
-      }
       if (asyncSharedModule) {
-        const asyncSharedModuleCode = asyncSharedModule.toString();
-        const { sharedModuleId } = ASYNC_MODULE_RESOLVE_RE.exec(asyncSharedModuleCode)?.groups ?? ASYNC_MODULE_ALL_RE.exec(asyncSharedModuleCode)?.groups ?? {};
+        const sharedModuleId = extractGroup(
+          ASYNC_MODULE_CALLBACK_RE,
+          asyncSharedModule.toString(),
+          "sharedModuleId"
+        );
         acc[sharedModuleId ?? asyncSharedModuleId] = key.replace(
           "__remote_shared_module_",
           ""
@@ -1137,10 +1301,8 @@ function requireModule(scope, moduleId, fullId) {
   if (scope.moduleCache[idStr])
     return scope.moduleCache[idStr];
   const sharedModule = getSharedModule(scope, moduleId);
-  if (sharedModule) {
-    scope.moduleCache[idStr] = sharedModule;
+  if (sharedModule)
     return sharedModule;
-  }
   return handleTurbopackModule(
     scope,
     idStr,
@@ -1148,19 +1310,10 @@ function requireModule(scope, moduleId, fullId) {
   );
 }
 function handleTurbopackModule(scope, moduleId, id) {
-  const self = globalThis;
   if (scope.moduleCache[moduleId]) {
     return scope.moduleCache[moduleId];
   }
-  const raw = self[`TURBOPACK_${scope.globalKey}`];
-  let modules;
-  if (raw && typeof raw === "object" && "__chunks__" in raw) {
-    modules = raw.__chunks__.flat();
-  } else if (Array.isArray(raw)) {
-    modules = raw.flat();
-  } else {
-    modules = raw;
-  }
+  const modules = getTurbopackModules(scope);
   if (!modules) {
     logError(
       "TurbopackModule",
@@ -1210,9 +1363,17 @@ function findModuleInit(modules, moduleId) {
   if (idx >= 0) {
     return flat.slice(idx + 1).find((e) => typeof e === "function");
   }
-  return flat.find(
-    (e) => Boolean(e && typeof e === "object" && moduleId in e)
-  )?.[moduleId];
+  for (const entry of flat) {
+    if (!entry || typeof entry !== "object")
+      continue;
+    const obj = entry;
+    if (moduleId in obj)
+      return obj[moduleId];
+    const prefixKey = Object.keys(obj).find((k) => k.startsWith(moduleId));
+    if (prefixKey)
+      return obj[prefixKey];
+  }
+  return void 0;
 }
 function createTurbopackContext(scope, exports, moduleExports, modules, moduleInit, id) {
   const scopedRequire = (moduleId) => requireModule(scope, moduleId, formatRemoteId(scope, String(moduleId)));
@@ -1291,7 +1452,10 @@ function createTurbopackContext(scope, exports, moduleExports, modules, moduleIn
       }
       if (typeof mod !== "object" || mod === null) {
         mod = { default: mod };
-      } else if (!("default" in mod) && mod.toString() !== "[object Module]") {
+      } else if (!("default" in mod) && // ES module namespace objects have a null prototype, so calling
+      // mod.toString() directly throws. Use Object.prototype.toString
+      // to safely detect them.
+      Object.prototype.toString.call(mod) !== "[object Module]") {
         try {
           mod.default = mod;
         } catch {
@@ -1364,21 +1528,38 @@ var init_module = __esm({
   }
 });
 
-// src/runtime/turbopack/webpack-runtime.ts
-async function setupWebpackRuntime(runtime, scripts = [], url = new URL(location.href), bundle, shared = {}, remoteShared = {}, resolveClientUrl) {
+// src/runtime/turbopack/remote-scope-setup.ts
+async function setupRemoteScope(runtime, scripts = [], url = new URL(location.href), bundle, resolveClientUrl) {
   const self = globalThis;
+  const ns = getNamespace();
   const bundleName = bundle ?? "default";
+  const existingScope = getScope(bundleName);
+  if (existingScope && existingScope.url.origin === url.origin) {
+    logDebug(
+      "WebpackRuntime",
+      `Reusing scope "${existingScope.scopedName}" (turbopackModules=${existingScope.turbopackModules.length})`
+    );
+    existingScope.resolveClientUrl = resolveClientUrl;
+    if (runtime === RUNTIME_TURBOPACK) {
+      await Promise.allSettled(
+        scripts.map(
+          (script) => script.src ? loadChunkWithScope(existingScope, script.src) : Promise.resolve(void 0)
+        )
+      );
+    }
+    return existingScope;
+  }
   const scope = createScope(bundleName, url, runtime, resolveClientUrl);
   registerScope(scope);
-  if (!self.__remote_bundle_url__) {
-    self.__remote_bundle_url__ = {};
+  if (runtime === RUNTIME_WEBPACK && self.__remote_webpack_require__?.[bundleName]) {
+    scope.webpackRequire = self.__remote_webpack_require__[bundleName];
   }
-  self.__remote_bundle_url__[bundleName] = url;
+  ns.bundleUrls[bundleName] = url;
   if (scope.scopedName !== bundleName) {
-    self.__remote_bundle_url__[scope.scopedName] = url;
+    ns.bundleUrls[scope.scopedName] = url;
   }
   self.__webpack_get_script_filename__ = () => null;
-  const willCreateDispatchers = typeof self.__webpack_require__ !== "function" || self.__webpack_require_type__ !== "turbopack";
+  const willCreateDispatchers = typeof self.__webpack_require__ !== "function" || ns.dispatcherRuntime !== "turbopack";
   if (willCreateDispatchers) {
     if (!self.__original_webpack_require__ && !self.__original_webpack_chunk_load__) {
       self.__original_webpack_chunk_load__ = self.__webpack_chunk_load__;
@@ -1386,6 +1567,7 @@ async function setupWebpackRuntime(runtime, scripts = [], url = new URL(location
     }
     self.__webpack_chunk_load__ = createChunkDispatcher();
     self.__webpack_require__ = createModuleDispatcher(runtime);
+    ns.dispatcherRuntime = runtime;
     self.__webpack_require_type__ = runtime;
     if (self.__remote_webpack_require__ && runtime === RUNTIME_TURBOPACK) {
       self.__remote_webpack_require__[bundleName] = self.__webpack_require__;
@@ -1413,15 +1595,7 @@ async function setupWebpackRuntime(runtime, scripts = [], url = new URL(location
       }
     }
   }
-  const coreShared = {
-    react: async () => (await import("react")).default,
-    "react-dom": async () => (await import("react-dom")).default,
-    "react/jsx-dev-runtime": async () => (await import("react/jsx-dev-runtime")).default,
-    "react/jsx-runtime": async () => (await import("react/jsx-runtime")).default,
-    "react-dom/client": async () => (await import("react-dom/client")).default,
-    ...shared
-  };
-  await initializeSharedModules(scope, coreShared, remoteShared);
+  return scope;
 }
 function createModuleDispatcher(runtime) {
   return (id) => {
@@ -1438,6 +1612,9 @@ function createModuleDispatcher(runtime) {
     );
     try {
       if (remoteRuntime === RUNTIME_WEBPACK && bundle && moduleId) {
+        const scope2 = getScope(bundle);
+        if (scope2?.webpackRequire)
+          return scope2.webpackRequire(moduleId);
         return self.__remote_webpack_require__?.[bundle]?.(moduleId);
       }
       const scope = getScope(bundleName);
@@ -1475,17 +1652,17 @@ function createModuleDispatcher(runtime) {
     }
   };
 }
-var init_webpack_runtime = __esm({
-  "src/runtime/turbopack/webpack-runtime.ts"() {
+var init_remote_scope_setup = __esm({
+  "src/runtime/turbopack/remote-scope-setup.ts"() {
     "use strict";
     init_constants2();
+    init_namespace();
     init_patterns();
     init_error();
     init_logger();
     init_chunk_loader();
     init_module();
     init_remote_scope();
-    init_shared_modules();
   }
 });
 
@@ -1496,36 +1673,28 @@ __export(turbopack_exports, {
 });
 async function turbopackRuntime(url, bundle, shared, remoteShared, resolveClientUrl) {
   const self = globalThis;
-  const hostShared = {
-    ...sharedPolyfills(shared, resolveClientUrl),
-    ...self.__remote_component_host_shared_modules__,
-    ...shared,
-    ...self.__remote_component_shared__
-  };
-  await setupWebpackRuntime(
-    "turbopack",
-    [],
-    url,
-    bundle,
-    hostShared,
-    remoteShared,
-    resolveClientUrl
-  );
+  const hostShared = buildHostShared(shared, resolveClientUrl, {
+    includeRemoteComponentShared: true
+  });
+  await setupRemoteScope("turbopack", [], url, bundle, resolveClientUrl);
   const {
     default: { createFromReadableStream }
   } = await import("react-server-dom-webpack/client.browser");
-  function preloadScripts(scripts, __) {
-    return setupWebpackRuntime(
+  async function preloadScripts(scripts, __) {
+    const scope = await setupRemoteScope(
       "turbopack",
       scripts.map((script) => ({
         src: script.getAttribute("src") || script.getAttribute("data-src") || script.src
       })),
       url,
       bundle,
-      hostShared,
-      remoteShared,
       resolveClientUrl
     );
+    await initializeSharedModules(
+      scope,
+      buildCoreShared(hostShared),
+      remoteShared ?? {}
+    );
   }
   return {
     self,
@@ -1540,8 +1709,9 @@ var init_turbopack = __esm({
     "use strict";
     init_apply_shared_modules();
     init_next_client_pages_loader();
-    init_polyfill();
-    init_webpack_runtime();
+    init_shared_module_resolver();
+    init_remote_scope_setup();
+    init_shared_modules();
   }
 });
 
@@ -1588,10 +1758,9 @@ async function importViaCallback(absoluteSrc, resolveClientUrl) {
     URL.revokeObjectURL(moduleBlobUrl);
     URL.revokeObjectURL(wrapperBlobUrl);
   }
-  const registry = globalThis.__rc_module_registry__;
-  const mod = registry?.[absoluteSrc] ?? {};
-  if (registry)
-    delete registry[absoluteSrc];
+  const registry = getNamespace().moduleRegistry;
+  const mod = registry[absoluteSrc] ?? {};
+  delete registry[absoluteSrc];
   return mod;
 }
 async function importDirectly(absoluteSrc) {
@@ -1621,12 +1790,12 @@ function resolveScriptSrc(script, url) {
   return rawSrc;
 }
 async function loadStaticRemoteComponent(scripts, url, resolveClientUrl) {
-  const self = globalThis;
-  if (self.__remote_script_entrypoint_mount__?.[url.href]) {
-    self.__remote_script_entrypoint_mount__[url.href] = /* @__PURE__ */ new Set();
+  const ns = getNamespace();
+  if (ns.mountFns[url.href]) {
+    ns.mountFns[url.href] = /* @__PURE__ */ new Set();
   }
-  if (self.__remote_script_entrypoint_unmount__?.[url.href]) {
-    self.__remote_script_entrypoint_unmount__[url.href] = /* @__PURE__ */ new Set();
+  if (ns.unmountFns[url.href]) {
+    ns.unmountFns[url.href] = /* @__PURE__ */ new Set();
   }
   const mountUnmountSets = await Promise.all(
     scripts.map(async (script) => {
@@ -1638,25 +1807,19 @@ async function loadStaticRemoteComponent(scripts, url, resolveClientUrl) {
           URL.revokeObjectURL(src);
         }
         if (typeof mod.mount === "function" || typeof mod.default?.mount === "function") {
-          if (!self.__remote_script_entrypoint_mount__) {
-            self.__remote_script_entrypoint_mount__ = {};
-          }
-          if (!self.__remote_script_entrypoint_mount__[url.href]) {
-            self.__remote_script_entrypoint_mount__[url.href] = /* @__PURE__ */ new Set();
+          if (!ns.mountFns[url.href]) {
+            ns.mountFns[url.href] = /* @__PURE__ */ new Set();
           }
-          self.__remote_script_entrypoint_mount__[url.href]?.add(
+          ns.mountFns[url.href]?.add(
             mod.mount || mod.default?.mount || (() => {
             })
           );
         }
         if (typeof mod.unmount === "function" || typeof mod.default?.unmount === "function") {
-          if (!self.__remote_script_entrypoint_unmount__) {
-            self.__remote_script_entrypoint_unmount__ = {};
+          if (!ns.unmountFns[url.href]) {
+            ns.unmountFns[url.href] = /* @__PURE__ */ new Set();
           }
-          if (!self.__remote_script_entrypoint_unmount__[url.href]) {
-            self.__remote_script_entrypoint_unmount__[url.href] = /* @__PURE__ */ new Set();
-          }
-          self.__remote_script_entrypoint_unmount__[url.href]?.add(
+          ns.unmountFns[url.href]?.add(
             mod.unmount || mod.default?.unmount || (() => {
             })
           );
@@ -1697,6 +1860,7 @@ async function loadStaticRemoteComponent(scripts, url, resolveClientUrl) {
 var init_static_loader = __esm({
   "src/runtime/loaders/static-loader.ts"() {
     "use strict";
+    init_namespace();
     init_logger();
   }
 });
@@ -1817,8 +1981,8 @@ function resolveNameFromSrc(src, defaultName) {
 // src/host/html/index.tsx
 init_constants2();
 
-// src/runtime/html/apply-origin.ts
-var tagNames = [
+// src/runtime/html/html-spec.ts
+var ORIGIN_REWRITE_TAGS = [
   "img",
   "source",
   "video",
@@ -1829,10 +1993,37 @@ var tagNames = [
   "script",
   "link"
 ];
+var ID_SUFFIX_RSC = "_rsc";
+var ID_SUFFIX_SSR = "_ssr";
+var ID_SUFFIX_SHARED = "_shared";
+var DATA_BUNDLE = "data-bundle";
+var DATA_ROUTE = "data-route";
+var DATA_RUNTIME = "data-runtime";
+var DATA_TYPE = "data-type";
+var DATA_SRC = "data-src";
+var DATA_REMOTE_COMPONENTS_SHARED = "data-remote-components-shared";
+var TAG_REMOTE_COMPONENT = "remote-component";
+var NEXT_DATA_ID = "__NEXT_DATA__";
+var REMOTE_NEXT_DATA_ID = "__REMOTE_NEXT_DATA__";
+var NEXT_CONTAINER_ID = "__next";
+
+// src/runtime/html/rewrite-srcset.ts
+function rewriteSrcset(srcset, base, resolve) {
+  return srcset.split(",").map((entry) => {
+    const [url, descriptor] = entry.trim().split(/\s+/);
+    if (!url)
+      return entry;
+    const absoluteUrl = new URL(url, base).href;
+    const resolvedUrl = resolve ? resolve(absoluteUrl) : absoluteUrl;
+    return descriptor ? `${resolvedUrl} ${descriptor}` : resolvedUrl;
+  }).join(", ");
+}
+
+// src/runtime/html/apply-origin.ts
 function applyOriginToNodes(doc, url, resolveClientUrl) {
   if (url.origin !== location.origin) {
     const nodes = doc.querySelectorAll(
-      tagNames.map(
+      ORIGIN_REWRITE_TAGS.map(
         (type) => `${type}[src],${type}[srcset],${type}[href],${type}[imagesrcset]`
       ).join(",")
     );
@@ -1850,29 +2041,17 @@ function applyOriginToNodes(doc, url, resolveClientUrl) {
         );
       }
       if (node.hasAttribute("srcset")) {
-        const srcSet = node.getAttribute("srcset")?.split(",").map((entry) => {
-          const [urlPart, descriptor] = entry.trim().split(/\s+/);
-          if (!urlPart)
-            return entry;
-          const absoluteUrl = new URL(urlPart, url).href;
-          const resolvedUrl = resolveClientUrl?.(absoluteUrl) ?? absoluteUrl;
-          return descriptor ? `${resolvedUrl} ${descriptor}` : resolvedUrl;
-        }).join(", ");
-        if (srcSet) {
-          node.setAttribute("srcset", srcSet);
+        const raw = node.getAttribute("srcset");
+        if (raw) {
+          const resolve = resolveClientUrl ? (abs) => resolveClientUrl(abs) ?? abs : void 0;
+          node.setAttribute("srcset", rewriteSrcset(raw, url, resolve));
         }
       }
       if (node.hasAttribute("imagesrcset")) {
-        const srcSet = node.getAttribute("imagesrcset")?.split(",").map((entry) => {
-          const [urlPart, descriptor] = entry.trim().split(/\s+/);
-          if (!urlPart)
-            return entry;
-          const absoluteUrl = new URL(urlPart, url).href;
-          const resolvedUrl = resolveClientUrl?.(absoluteUrl) ?? absoluteUrl;
-          return descriptor ? `${resolvedUrl} ${descriptor}` : resolvedUrl;
-        }).join(", ");
-        if (srcSet) {
-          node.setAttribute("imagesrcset", srcSet);
+        const raw = node.getAttribute("imagesrcset");
+        if (raw) {
+          const resolve = resolveClientUrl ? (abs) => resolveClientUrl(abs) ?? abs : void 0;
+          node.setAttribute("imagesrcset", rewriteSrcset(raw, url, resolve));
         }
       }
     });
@@ -1918,26 +2097,28 @@ function buildMetadata(attrs, url) {
 // src/runtime/html/parse-remote-html.ts
 init_error();
 function validateSingleComponent(doc, name, url) {
-  if (doc.querySelectorAll("div[data-bundle][data-route]").length > 1 && !doc.querySelector(`div[data-bundle][data-route][id^="${name}"]`) || doc.querySelectorAll("remote-component:not([src])").length > 1 && !doc.querySelector(`remote-component[name="${name}"]`)) {
+  if (doc.querySelectorAll(`div[${DATA_BUNDLE}][${DATA_ROUTE}]`).length > 1 && !doc.querySelector(
+    `div[${DATA_BUNDLE}][${DATA_ROUTE}][id^="${name}"]`
+  ) || doc.querySelectorAll(`${TAG_REMOTE_COMPONENT}:not([src])`).length > 1 && !doc.querySelector(`${TAG_REMOTE_COMPONENT}[name="${name}"]`)) {
     throw multipleRemoteComponentsError(url);
   }
 }
 function findComponentElement(doc, name) {
-  return doc.querySelector(`div[data-bundle][data-route][id^="${name}"]`) ?? doc.querySelector("div[data-bundle][data-route]") ?? doc.querySelector("div#__next") ?? doc.querySelector(`remote-component[name="${name}"]:not([src])`) ?? doc.querySelector("remote-component:not([src])");
+  return doc.querySelector(`div[${DATA_BUNDLE}][${DATA_ROUTE}][id^="${name}"]`) ?? doc.querySelector(`div[${DATA_BUNDLE}][${DATA_ROUTE}]`) ?? doc.querySelector(`div#${NEXT_CONTAINER_ID}`) ?? doc.querySelector(`${TAG_REMOTE_COMPONENT}[name="${name}"]:not([src])`) ?? doc.querySelector(`${TAG_REMOTE_COMPONENT}:not([src])`);
 }
 function parseNextData(doc) {
   return JSON.parse(
-    (doc.querySelector("#__NEXT_DATA__") ?? doc.querySelector("#__REMOTE_NEXT_DATA__"))?.textContent ?? "null"
+    (doc.querySelector(`#${NEXT_DATA_ID}`) ?? doc.querySelector(`#${REMOTE_NEXT_DATA_ID}`))?.textContent ?? "null"
   );
 }
 function resolveComponentName(component, nextData, fallbackName) {
-  const isRemoteComponent = component?.tagName.toLowerCase() === "remote-component";
-  const name = component?.getAttribute("id")?.replace(/_ssr$/, "") || isRemoteComponent && component?.getAttribute("name") || (nextData ? "__next" : fallbackName);
+  const isRemoteComponent = component?.tagName.toLowerCase() === TAG_REMOTE_COMPONENT;
+  const name = component?.getAttribute("id")?.replace(new RegExp(`${ID_SUFFIX_SSR}$`), "") || isRemoteComponent && component?.getAttribute("name") || (nextData ? "__next" : fallbackName);
   return { name, isRemoteComponent };
 }
 function extractRemoteShared(doc, name, nextData) {
   const remoteSharedEl = doc.querySelector(
-    `#${name}_shared[data-remote-components-shared]`
+    `#${name}${ID_SUFFIX_SHARED}[${DATA_REMOTE_COMPONENTS_SHARED}]`
   );
   const remoteShared = nextData?.props.__REMOTE_COMPONENT__?.shared ?? (JSON.parse(remoteSharedEl?.textContent ?? "{}") ?? {});
   remoteSharedEl?.remove();
@@ -1958,7 +2139,7 @@ function extractLinks(doc, component) {
 function extractScripts(doc, component, isRemoteComponent) {
   return Array.from(
     (isRemoteComponent ? component : doc).querySelectorAll(
-      "script[src],script[data-src]"
+      `script[src],script[${DATA_SRC}]`
     )
   );
 }
@@ -1971,15 +2152,15 @@ function parseRemoteComponentDocument(doc, name, url) {
     nextData,
     name
   );
-  const rsc = doc.querySelector(`#${resolvedName}_rsc`);
+  const rsc = doc.querySelector(`#${resolvedName}${ID_SUFFIX_RSC}`);
   const metadata = buildMetadata(
     {
       name: resolvedName,
-      bundle: component?.getAttribute("data-bundle") || nextData?.props.__REMOTE_COMPONENT__?.bundle,
-      route: component?.getAttribute("data-route") ?? nextData?.page,
-      runtime: component?.getAttribute("data-runtime") ?? nextData?.props.__REMOTE_COMPONENT__?.runtime ?? RUNTIME_SCRIPT,
+      bundle: component?.getAttribute(DATA_BUNDLE) || nextData?.props.__REMOTE_COMPONENT__?.bundle,
+      route: component?.getAttribute(DATA_ROUTE) ?? nextData?.page,
+      runtime: component?.getAttribute(DATA_RUNTIME) ?? nextData?.props.__REMOTE_COMPONENT__?.runtime ?? RUNTIME_SCRIPT,
       id: component?.getAttribute("id"),
-      type: component?.getAttribute("data-type")
+      type: component?.getAttribute(DATA_TYPE)
     },
     url
   );
@@ -2007,6 +2188,9 @@ function parseRemoteComponentDocument(doc, name, url) {
   };
 }
 
+// src/host/html/index.tsx
+init_namespace();
+
 // src/runtime/rsc.ts
 import { ReadableStream } from "web-streams-polyfill";
 function fixPayload(payload) {
@@ -2027,6 +2211,18 @@ function fixPayload(payload) {
     }
   }
 }
+function buildRSCChunks(rscName, data) {
+  const chunks = [];
+  for (const chunk of data) {
+    for (const line of chunk.split("\n")) {
+      const match = /\.push\("(?<rsc>.*)"\);$/.exec(line);
+      if (match?.groups?.rsc) {
+        chunks.push(JSON.parse(`"${match.groups.rsc}"`));
+      }
+    }
+  }
+  return chunks;
+}
 function createRSCStream(rscName, data) {
   return new ReadableStream({
     type: "bytes",
@@ -2034,16 +2230,11 @@ function createRSCStream(rscName, data) {
       const encoder = new TextEncoder();
       const self = globalThis;
       if (data.length > 0) {
-        data.forEach((chunk) => {
-          const lines = chunk.split("\n");
-          for (const line of lines) {
-            const match = /\.push\("(?<rsc>.*)"\);$/.exec(line);
-            if (match?.groups?.rsc) {
-              self[rscName] = self[rscName] ?? [];
-              self[rscName].push(JSON.parse(`"${match.groups.rsc}"`));
-            }
-          }
-        });
+        const parsed = buildRSCChunks(rscName, data);
+        if (parsed.length > 0) {
+          self[rscName] = self[rscName] ?? [];
+          self[rscName].push(...parsed);
+        }
       }
       const allChunks = (self[rscName] ?? [`0:[null]
 `]).join("");
@@ -2419,11 +2610,7 @@ if (typeof HTMLElement !== "undefined") {
       this.name = resolvedName;
       this.bundle = parsedMetadata.bundle;
       if (url) {
-        const self2 = globalThis;
-        if (!self2.__remote_bundle_url__) {
-          self2.__remote_bundle_url__ = {};
-        }
-        self2.__remote_bundle_url__[this.bundle] = url;
+        getNamespace().bundleUrls[this.bundle] = url;
       }
       const metadataEl = document.createElement("script");
       metadataEl.type = "application/json";
@@ -2447,22 +2634,22 @@ if (typeof HTMLElement !== "undefined") {
       if (this.hostState.prevIsRemoteComponent) {
         if (this.hostState.prevUrl) {
           const prevUrl = this.hostState.prevUrl;
-          const self2 = globalThis;
-          if (self2.__remote_script_entrypoint_unmount__?.[prevUrl.href]) {
+          const nsUnmount = getNamespace();
+          if (nsUnmount.unmountFns[prevUrl.href]) {
             await Promise.all(
-              Array.from(
-                self2.__remote_script_entrypoint_unmount__[prevUrl.href] ?? []
-              ).map(async (unmount) => {
-                try {
-                  await unmount(this.root);
-                } catch (e) {
-                  logError(
-                    "HtmlHost",
-                    `Error while calling unmount() for Remote Component from ${prevUrl.href}.`,
-                    e
-                  );
+              Array.from(nsUnmount.unmountFns[prevUrl.href] ?? []).map(
+                async (unmount) => {
+                  try {
+                    await unmount(this.root);
+                  } catch (e) {
+                    logError(
+                      "HtmlHost",
+                      `Error while calling unmount() for Remote Component from ${prevUrl.href}.`,
+                      e
+                    );
+                  }
                 }
-              })
+              )
             );
             if (!isCurrentLoad()) {
               return abandonLoad();
@@ -2753,21 +2940,21 @@ if (typeof HTMLElement !== "undefined") {
         if (this.fouc) {
           this.root.removeChild(this.fouc);
         }
-      } else if (self.__remote_script_entrypoint_mount__?.[url.href]) {
+      } else if (getNamespace().mountFns[url.href]) {
         await Promise.all(
-          Array.from(
-            self.__remote_script_entrypoint_mount__[url.href] ?? []
-          ).map(async (mount) => {
-            try {
-              await mount(this.root);
-            } catch (e) {
-              logError(
-                "HtmlHost",
-                `Error while calling mount() for Remote Component from ${url.href}.`,
-                e
-              );
+          Array.from(getNamespace().mountFns[url.href] ?? []).map(
+            async (mount) => {
+              try {
+                await mount(this.root);
+              } catch (e) {
+                logError(
+                  "HtmlHost",
+                  `Error while calling mount() for Remote Component from ${url.href}.`,
+                  e
+                );
+              }
             }
-          })
+          )
         );
         this.dispatchLifecycleEvent("load", { src: this.src });
       } else {
@@ -2781,14 +2968,9 @@ if (typeof HTMLElement !== "undefined") {
   customElements.define("remote-component", RemoteComponent);
 }
 function registerSharedModules(modules = {}) {
-  const self = globalThis;
-  if (!self.__remote_component_host_shared_modules__) {
-    self.__remote_component_host_shared_modules__ = {};
-  }
+  const ns = getNamespace();
   Object.entries(modules).forEach(([key, value]) => {
-    if (self.__remote_component_host_shared_modules__) {
-      self.__remote_component_host_shared_modules__[key] = value;
-    }
+    ns.hostSharedModules[key] = value;
   });
 }
 export {