remote-components 0.0.50 → 0.1.0

package/dist/html/remote.cjs

@@ -9,11 +9,38 @@ var __export = (target, all) => {
     __defProp(target, name, { get: all[name], enumerable: true });
 };
 
+// src/shared/constants.ts
+var CORS_DOCS_URL;
+var init_constants = __esm({
+  "src/shared/constants.ts"() {
+    "use strict";
+    CORS_DOCS_URL = "https://vercel.com/docs/remote-components/concepts/cors-external-urls#accessing-cross-site-protected-remote-components";
+  }
+});
+
+// src/shared/client/protected-rc-fallback.ts
+var init_protected_rc_fallback = __esm({
+  "src/shared/client/protected-rc-fallback.ts"() {
+    "use strict";
+    init_constants();
+  }
+});
+
+// src/shared/utils/abort.ts
+var init_abort = __esm({
+  "src/shared/utils/abort.ts"() {
+    "use strict";
+  }
+});
+
 // src/shared/error.ts
 var RemoteComponentsError;
 var init_error = __esm({
   "src/shared/error.ts"() {
     "use strict";
+    init_protected_rc_fallback();
+    init_constants();
+    init_abort();
     RemoteComponentsError = class extends Error {
       code = "REMOTE_COMPONENTS_ERROR";
       constructor(message, options) {
@@ -25,6 +52,9 @@ var init_error = __esm({
 });
 
 // src/shared/utils/logger.ts
+function logWarn(location2, message) {
+  console.warn(`[${PREFIX}:${location2}]: ${message}`);
+}
 function logError(location2, message, cause) {
   console.error(
     new RemoteComponentsError(`[${PREFIX}:${location2}]: ${message}`, {
@@ -32,10 +62,24 @@ function logError(location2, message, cause) {
     })
   );
 }
+function warnCrossOriginFetchError(logLocation, url) {
+  try {
+    const parsed = typeof url === "string" ? new URL(url) : url;
+    if (typeof location === "undefined" || parsed.origin === location.origin) {
+      return;
+    }
+    logWarn(
+      logLocation,
+      `Failed to fetch cross-origin resource "${parsed.href}". If this is a protected deployment, ensure withRemoteComponentsHost middleware is configured in your host and that the remote URL is included in allowedProxyUrls. See: ${CORS_DOCS_URL}`
+    );
+  } catch {
+  }
+}
 var PREFIX, DEBUG;
 var init_logger = __esm({
   "src/shared/utils/logger.ts"() {
     "use strict";
+    init_constants();
     init_error();
     PREFIX = "remote-components";
     DEBUG = typeof window !== "undefined" && localStorage.getItem("RC_DEBUG") === "true";
@@ -47,7 +91,81 @@ var static_loader_exports = {};
 __export(static_loader_exports, {
   loadStaticRemoteComponent: () => loadStaticRemoteComponent
 });
-async function loadStaticRemoteComponent(scripts, url) {
+async function importViaCallback(absoluteSrc, resolveClientUrl) {
+  const resolvedUrl = resolveClientUrl(absoluteSrc) ?? absoluteSrc;
+  const fetchUrl = new URL(resolvedUrl, location.href).href;
+  const response = await fetch(fetchUrl);
+  if (!response.ok)
+    throw new Error(`Proxied fetch failed: ${response.status}`);
+  const content = (await response.text()).replace(/import\.meta\.url/g, JSON.stringify(absoluteSrc)).replace(
+    /\b(from|import)\s*(["'])(\.\.?\/[^"']+)\2/g,
+    (_, keyword, quote, relativePath) => {
+      const absoluteImportUrl = new URL(relativePath, absoluteSrc).href;
+      const resolvedImportUrl = new URL(
+        resolveClientUrl(absoluteImportUrl) ?? absoluteImportUrl,
+        location.href
+      ).href;
+      return `${keyword} ${quote}${resolvedImportUrl}${quote}`;
+    }
+  );
+  const moduleBlobUrl = URL.createObjectURL(
+    new Blob([content], { type: "text/javascript" })
+  );
+  const wrapperContent = [
+    `import*as m from${JSON.stringify(moduleBlobUrl)};`,
+    `globalThis.__rc_module_registry__=globalThis.__rc_module_registry__||{};`,
+    `globalThis.__rc_module_registry__[${JSON.stringify(absoluteSrc)}]=m;`
+  ].join("");
+  const wrapperBlobUrl = URL.createObjectURL(
+    new Blob([wrapperContent], { type: "text/javascript" })
+  );
+  const scriptEl = document.createElement("script");
+  scriptEl.type = "module";
+  scriptEl.src = wrapperBlobUrl;
+  try {
+    await new Promise((resolve, reject) => {
+      scriptEl.onload = () => resolve();
+      scriptEl.onerror = () => reject(new Error(`Failed to load module for ${absoluteSrc}`));
+      document.head.appendChild(scriptEl);
+    });
+  } finally {
+    scriptEl.remove();
+    URL.revokeObjectURL(moduleBlobUrl);
+    URL.revokeObjectURL(wrapperBlobUrl);
+  }
+  const registry = globalThis.__rc_module_registry__;
+  const mod = registry?.[absoluteSrc] ?? {};
+  if (registry)
+    delete registry[absoluteSrc];
+  return mod;
+}
+async function importDirectly(absoluteSrc) {
+  try {
+    return await import(
+      /* @vite-ignore */
+      /* webpackIgnore: true */
+      absoluteSrc
+    );
+  } catch (importError) {
+    if (!absoluteSrc.startsWith("blob:")) {
+      warnCrossOriginFetchError("StaticLoader", absoluteSrc);
+    }
+    throw importError;
+  }
+}
+function resolveScriptSrc(script, url) {
+  const rawSrc = typeof script.getAttribute === "function" ? script.getAttribute("src") ?? script.src : script.src;
+  if (!rawSrc && script.textContent) {
+    return URL.createObjectURL(
+      new Blob(
+        [script.textContent.replace(/import\.meta\.url/g, JSON.stringify(url))],
+        { type: "text/javascript" }
+      )
+    );
+  }
+  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();
@@ -58,26 +176,9 @@ async function loadStaticRemoteComponent(scripts, url) {
   const mountUnmountSets = await Promise.all(
     scripts.map(async (script) => {
       try {
-        let src = typeof script.getAttribute === "function" ? script.getAttribute("src") ?? script.src : script.src;
-        if (!src && script.textContent) {
-          const blob = new Blob(
-            [
-              script.textContent.replace(
-                /import\.meta\.url/g,
-                JSON.stringify(url)
-              )
-            ],
-            {
-              type: "text/javascript"
-            }
-          );
-          src = URL.createObjectURL(blob);
-        }
-        const mod = await import(
-          /* @vite-ignore */
-          /* webpackIgnore: true */
-          new URL(src, url).href
-        );
+        const src = resolveScriptSrc(script, url);
+        const absoluteSrc = new URL(src, url).href;
+        const mod = resolveClientUrl ? await importViaCallback(absoluteSrc, resolveClientUrl) : await importDirectly(absoluteSrc);
         if (src.startsWith("blob:")) {
           URL.revokeObjectURL(src);
         }
@@ -159,6 +260,7 @@ if (typeof HTMLElement !== "undefined") {
         mode: this.getAttribute("mode") === "closed" ? "closed" : "open"
       });
       this.root.innerHTML = html;
+      this.replaceChildren();
       (async () => {
         const { loadStaticRemoteComponent: loadStaticRemoteComponent2 } = await Promise.resolve().then(() => (init_static_loader(), static_loader_exports));
         loadStaticRemoteComponent2(

package/dist/html/remote.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/shared/error.ts","../../src/shared/utils/logger.ts","../../src/shared/client/static-loader.ts","../../src/html/remote/index.tsx"],"sourcesContent":["export class RemoteComponentsError extends Error {\n  code = 'REMOTE_COMPONENTS_ERROR';\n\n  constructor(message: string, options?: { cause?: unknown }) {\n    super(message, options);\n    this.name = 'RemoteComponentsError';\n  }\n}\n\nexport function multipleRemoteComponentsError(url: string | undefined) {\n  return new RemoteComponentsError(\n    `Multiple Remote Components found at \"${url}\". When a page exposes multiple Remote Components you must specify the \"name\" prop to select which one to load.`,\n  );\n}\n\nexport function failedToFetchRemoteComponentError(\n  url: string,\n  { status, statusText }: { status: number; statusText: string },\n  help: string = 'Is the URL correct and accessible?',\n) {\n  return new RemoteComponentsError(\n    `Failed to fetch Remote Component from \"${url}\". ${help}`,\n    { cause: new Error(`${status} ${statusText}`) },\n  );\n}\n","import { RemoteComponentsError } from '#internal/shared/error';\n\ntype LogLocation =\n  | 'ChunkLoader'\n  | 'ComponentLoader'\n  | 'SharedModules'\n  | 'WebpackAdapter'\n  | 'TurbopackModule'\n  | 'StaticLoader'\n  | 'Polyfill'\n  | 'HtmlRemote'\n  | 'HtmlHost'\n  | 'Config'\n  | 'NextAppRouter'\n  | 'NextAppRouterCompat'\n  | 'FetchRemoteComponent';\n\nconst PREFIX = 'remote-components';\nconst DEBUG =\n  typeof window !== 'undefined' && localStorage.getItem('RC_DEBUG') === 'true';\n\nexport function logDebug(location: LogLocation, message: string) {\n  if (DEBUG) {\n    // eslint-disable-next-line no-console\n    console.debug(`[${PREFIX}:${location}]: ${message}`);\n  }\n}\n\nexport function logInfo(location: LogLocation, message: string) {\n  // eslint-disable-next-line no-console\n  console.info(`[${PREFIX}:${location}]: ${message}`);\n}\n\nexport function logWarn(location: LogLocation, message: string) {\n  // eslint-disable-next-line no-console\n  console.warn(`[${PREFIX}:${location}]: ${message}`);\n}\n\nexport function logError(\n  location: LogLocation,\n  message: string,\n  cause?: unknown,\n) {\n  // eslint-disable-next-line no-console\n  console.error(\n    new RemoteComponentsError(`[${PREFIX}:${location}]: ${message}`, {\n      cause,\n    }),\n  );\n}\n","import { logError } from '../utils/logger';\nimport type {\n  MountOrUnmountFunction,\n  RemoteComponentMountUnmount,\n} from './types';\n\nexport async function loadStaticRemoteComponent(\n  scripts: HTMLScriptElement[],\n  url: URL,\n) {\n  const self = globalThis as typeof globalThis & RemoteComponentMountUnmount;\n  if (self.__remote_script_entrypoint_mount__?.[url.href]) {\n    self.__remote_script_entrypoint_mount__[url.href] = new Set();\n  }\n  if (self.__remote_script_entrypoint_unmount__?.[url.href]) {\n    self.__remote_script_entrypoint_unmount__[url.href] = new Set();\n  }\n  const mountUnmountSets = await Promise.all(\n    scripts.map(async (script) => {\n      try {\n        let src =\n          typeof script.getAttribute === 'function'\n            ? (script.getAttribute('src') ?? script.src)\n            : script.src;\n        // if there's no src attribute but there is inline script content, create a blob URL for it\n        if (!src && script.textContent) {\n          const blob = new Blob(\n            [\n              script.textContent.replace(\n                /import\\.meta\\.url/g,\n                JSON.stringify(url),\n              ),\n            ],\n            {\n              type: 'text/javascript',\n            },\n          );\n          src = URL.createObjectURL(blob);\n        }\n        const mod = (await import(\n          /* @vite-ignore */\n          /* webpackIgnore: true */ new URL(src, url).href\n        )) as {\n          mount?: MountOrUnmountFunction;\n          unmount?: MountOrUnmountFunction;\n          default?: {\n            mount?: MountOrUnmountFunction;\n            unmount?: MountOrUnmountFunction;\n          };\n        };\n        // revoke the object URL if we created one\n        if (src.startsWith('blob:')) {\n          URL.revokeObjectURL(src);\n        }\n        if (\n          typeof mod.mount === 'function' ||\n          typeof mod.default?.mount === 'function'\n        ) {\n          if (!self.__remote_script_entrypoint_mount__) {\n            // eslint-disable-next-line camelcase\n            self.__remote_script_entrypoint_mount__ = {};\n          }\n          if (!self.__remote_script_entrypoint_mount__[url.href]) {\n            self.__remote_script_entrypoint_mount__[url.href] = new Set();\n          }\n          self.__remote_script_entrypoint_mount__[url.href]?.add(\n            mod.mount ||\n              mod.default?.mount ||\n              (() => {\n                // noop\n              }),\n          );\n        }\n        if (\n          typeof mod.unmount === 'function' ||\n          typeof mod.default?.unmount === 'function'\n        ) {\n          if (!self.__remote_script_entrypoint_unmount__) {\n            // eslint-disable-next-line camelcase\n            self.__remote_script_entrypoint_unmount__ = {};\n          }\n          if (!self.__remote_script_entrypoint_unmount__[url.href]) {\n            self.__remote_script_entrypoint_unmount__[url.href] = new Set();\n          }\n          self.__remote_script_entrypoint_unmount__[url.href]?.add(\n            mod.unmount ||\n              mod.default?.unmount ||\n              (() => {\n                // noop\n              }),\n          );\n        }\n        return {\n          mount: mod.mount || mod.default?.mount,\n          unmount: mod.unmount || mod.default?.unmount,\n        };\n      } catch (e) {\n        logError(\n          'StaticLoader',\n          `Error loading remote component script from \"${script.src || url.href}\".`,\n          e,\n        );\n        return {\n          mount: undefined,\n          unmount: undefined,\n        };\n      }\n    }),\n  );\n  return mountUnmountSets.reduce(\n    (acc, { mount, unmount }) => {\n      if (typeof mount === 'function') {\n        acc.mount.add(mount);\n      }\n      if (typeof unmount === 'function') {\n        acc.unmount.add(unmount);\n      }\n      return acc;\n    },\n    {\n      mount: new Set<MountOrUnmountFunction>(),\n      unmount: new Set<MountOrUnmountFunction>(),\n    },\n  );\n}\n","import type { MountOrUnmountFunction } from '../../shared/client/types';\nimport { logError } from '../../shared/utils/logger';\n\nif (typeof HTMLElement !== 'undefined') {\n  class RemoteComponent extends HTMLElement {\n    name?: string;\n    root?: ShadowRoot | null = null;\n    unmount?: Set<MountOrUnmountFunction> | null = null;\n\n    constructor() {\n      super();\n\n      const html = this.innerHTML;\n      this.root = this.attachShadow({\n        mode: this.getAttribute('mode') === 'closed' ? 'closed' : 'open',\n      });\n      this.root.innerHTML = html;\n\n      // run the mount functions for any scripts inside the shadow root asynchronously\n      (async () => {\n        const { loadStaticRemoteComponent } = await import(\n          '../../shared/client/static-loader'\n        );\n        loadStaticRemoteComponent(\n          Array.from(this.root?.querySelectorAll('script') ?? []),\n          new URL(location.href),\n        )\n          .then(({ mount, unmount }) => {\n            this.unmount = unmount;\n            return Promise.all(\n              Array.from(mount).map((mountFn) => mountFn(this.root)),\n            );\n          })\n          .catch((e) => {\n            logError('HtmlRemote', 'Error mounting remote component.', e);\n          });\n      })().catch((e) => {\n        logError('HtmlRemote', 'Error mounting remote component.', e);\n      });\n    }\n\n    disconnectedCallback() {\n      // run the unmount functions for any scripts inside the shadow root asynchronously\n      (async () => {\n        if (this.unmount) {\n          await Promise.all(\n            Array.from(this.unmount).map(async (unmount) => {\n              try {\n                await unmount(this.root);\n              } catch (e) {\n                logError('HtmlRemote', 'Error unmounting remote component.', e);\n              }\n            }),\n          );\n        }\n      })().catch((e) => {\n        logError('HtmlRemote', 'Error unmounting remote component.', e);\n      });\n    }\n  }\n\n  // register the custom element\n  customElements.define('remote-component', RemoteComponent);\n}\n"],"mappings":"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","names":["location","loadStaticRemoteComponent"]}
+{"version":3,"sources":["../../src/shared/constants.ts","../../src/shared/client/protected-rc-fallback.ts","../../src/shared/utils/abort.ts","../../src/shared/error.ts","../../src/shared/utils/logger.ts","../../src/shared/client/static-loader.ts","../../src/html/remote/index.tsx"],"sourcesContent":["export const RC_PROTECTED_REMOTE_FETCH_PATHNAME = '/rc-fetch-protected-remote';\n\nexport const CORS_DOCS_URL =\n  'https://vercel.com/docs/remote-components/concepts/cors-external-urls#accessing-cross-site-protected-remote-components';\n","import { RC_PROTECTED_REMOTE_FETCH_PATHNAME } from '#internal/shared/constants';\n\n/**\n * Generates a fallback URL that proxies the request through the host's protected remote fetch endpoint\n */\nexport function generateProtectedRcFallbackSrc(url: string): string {\n  return `${RC_PROTECTED_REMOTE_FETCH_PATHNAME}?url=${encodeURIComponent(url)}`;\n}\n\nexport function isProxiedUrl(url: string): boolean {\n  try {\n    return (\n      new URL(url, location.href).pathname ===\n      RC_PROTECTED_REMOTE_FETCH_PATHNAME\n    );\n  } catch {\n    return false;\n  }\n}\n","/**\n * Type guard to check if an error is an AbortError.\n * Handles cross-environment differences (Node.js, browsers, JSDOM).\n */\nexport function isAbortError(error: unknown): error is DOMException {\n  if (error instanceof DOMException && error.name === 'AbortError') {\n    return true;\n  }\n\n  // Handle Node.js native AbortError which may not be instanceof global DOMException\n  if (\n    error !== null &&\n    typeof error === 'object' &&\n    'name' in error &&\n    error.name === 'AbortError' &&\n    'message' in error &&\n    typeof (error as { message: unknown }).message === 'string'\n  ) {\n    // Additional check: verify it has DOMException-like structure\n    const e = error as { code?: unknown; constructor?: { name?: string } };\n    return typeof e.code === 'number' || e.constructor?.name === 'DOMException';\n  }\n\n  return false;\n}\n","import { isProxiedUrl } from '#internal/shared/client/protected-rc-fallback';\nimport {\n  CORS_DOCS_URL,\n  RC_PROTECTED_REMOTE_FETCH_PATHNAME,\n} from '#internal/shared/constants';\nimport { isAbortError } from '#internal/shared/utils/abort';\n\nexport class RemoteComponentsError extends Error {\n  code = 'REMOTE_COMPONENTS_ERROR';\n\n  constructor(message: string, options?: { cause?: unknown }) {\n    super(message, options);\n    this.name = 'RemoteComponentsError';\n  }\n}\n\nexport function multipleRemoteComponentsError(url: string | undefined) {\n  return new RemoteComponentsError(\n    `Multiple Remote Components found at \"${url}\". When a page exposes multiple Remote Components you must specify the \"name\" prop to select which one to load.`,\n  );\n}\n\nexport function failedToFetchRemoteComponentError(\n  url: string,\n  { status, statusText }: { status: number; statusText: string },\n  help: string = 'Is the URL correct and accessible?',\n) {\n  return new RemoteComponentsError(\n    `Failed to fetch Remote Component from \"${url}\". ${help}`,\n    { cause: new Error(`${status} ${statusText}`) },\n  );\n}\n\nexport async function errorFromFailedFetch(\n  originalUrl: string,\n  resolvedUrl: URL,\n  res: Response | null | undefined,\n): Promise<RemoteComponentsError> {\n  const isProxied = isProxiedUrl(resolvedUrl.href);\n\n  if (isProxied && res) {\n    const body = await res.text().catch(() => '');\n    return failedProxyFetchError(\n      originalUrl,\n      resolvedUrl.href,\n      res.status,\n      body,\n    );\n  }\n\n  const fallback = failedToFetchRemoteComponentError(\n    originalUrl,\n    res ?? { status: 0, statusText: 'No Response' },\n  );\n\n  if (!res) return fallback;\n\n  try {\n    const body = await res.text();\n    const parser = new DOMParser();\n    const doc = parser.parseFromString(body, 'text/html');\n    const errorTemplate = doc.querySelector(\n      'template[data-next-error-message]',\n    );\n    const errorMessage = errorTemplate?.getAttribute('data-next-error-message');\n    if (errorMessage) {\n      const error = new RemoteComponentsError(errorMessage);\n      const errorStack = errorTemplate?.getAttribute('data-next-error-stack');\n      if (errorStack) {\n        error.stack = errorStack;\n      }\n      return error;\n    }\n  } catch (parseError) {\n    // Re-throw abort errors, ignore parse errors\n    if (isAbortError(parseError)) throw parseError;\n  }\n\n  return fallback;\n}\n\nexport function failedProxyFetchError(\n  originalUrl: string,\n  proxyUrl: string,\n  status: number,\n  responseBody?: string,\n): RemoteComponentsError {\n  if (status === 404) {\n    return new RemoteComponentsError(\n      `Could not proxy the request to \"${originalUrl}\" — the proxy endpoint \"${RC_PROTECTED_REMOTE_FETCH_PATHNAME}\" returned 404.\\n\\n` +\n        `The host server needs middleware or a route that handles \"${RC_PROTECTED_REMOTE_FETCH_PATHNAME}\".\\n\\n` +\n        `Proxying requires two pieces:\\n` +\n        `  1. resolveClientUrl={proxyClientRequestsThroughHost} on <RemoteComponent>\\n` +\n        `  2. Middleware or a route for \"${RC_PROTECTED_REMOTE_FETCH_PATHNAME}\" on the host server\\n\\n` +\n        `Docs: ${CORS_DOCS_URL}`,\n    );\n  }\n  if (status === 403) {\n    const detail = responseBody ? ` ${responseBody}` : '';\n    return new RemoteComponentsError(\n      `Proxied request to \"${proxyUrl}\" was forbidden.${detail} ` +\n        `See: ${CORS_DOCS_URL}`,\n    );\n  }\n  return new RemoteComponentsError(\n    `Proxied request for \"${originalUrl}\" via \"${proxyUrl}\" failed with status ${status}. ` +\n      `See: ${CORS_DOCS_URL}`,\n  );\n}\n","import { CORS_DOCS_URL } from '#internal/shared/constants';\nimport { RemoteComponentsError } from '#internal/shared/error';\n\ntype LogLocation =\n  | 'ChunkLoader'\n  | 'ComponentLoader'\n  | 'SharedModules'\n  | 'WebpackAdapter'\n  | 'TurbopackModule'\n  | 'StaticLoader'\n  | 'ScriptLoader'\n  | 'Polyfill'\n  | 'HtmlRemote'\n  | 'HtmlHost'\n  | 'Config'\n  | 'NextAppRouter'\n  | 'NextAppRouterCompat'\n  | 'FetchRemoteComponent';\n\nconst PREFIX = 'remote-components';\nconst DEBUG =\n  typeof window !== 'undefined' && localStorage.getItem('RC_DEBUG') === 'true';\n\nexport function logDebug(location: LogLocation, message: string) {\n  if (DEBUG) {\n    // eslint-disable-next-line no-console\n    console.debug(`[${PREFIX}:${location}]: ${message}`);\n  }\n}\n\nexport function logInfo(location: LogLocation, message: string) {\n  // eslint-disable-next-line no-console\n  console.info(`[${PREFIX}:${location}]: ${message}`);\n}\n\nexport function logWarn(location: LogLocation, message: string) {\n  // eslint-disable-next-line no-console\n  console.warn(`[${PREFIX}:${location}]: ${message}`);\n}\n\nexport function logError(\n  location: LogLocation,\n  message: string,\n  cause?: unknown,\n) {\n  // eslint-disable-next-line no-console\n  console.error(\n    new RemoteComponentsError(`[${PREFIX}:${location}]: ${message}`, {\n      cause,\n    }),\n  );\n}\n\n/**\n * Logs a warning when a cross-origin asset request fails, guiding users\n * to configure the withRemoteComponentsHost middleware on their host.\n */\nexport function warnCrossOriginFetchError(\n  logLocation: LogLocation,\n  url: string | URL,\n): void {\n  try {\n    const parsed = typeof url === 'string' ? new URL(url) : url;\n    if (typeof location === 'undefined' || parsed.origin === location.origin) {\n      return;\n    }\n    logWarn(\n      logLocation,\n      `Failed to fetch cross-origin resource \"${parsed.href}\". ` +\n        'If this is a protected deployment, ensure withRemoteComponentsHost middleware ' +\n        'is configured in your host and that the remote URL is included in allowedProxyUrls. ' +\n        `See: ${CORS_DOCS_URL}`,\n    );\n  } catch {\n    // URL parsing failed — skip the warning\n  }\n}\n","import type { InternalResolveClientUrl } from '#internal/shared/ssr/types';\nimport { logError, warnCrossOriginFetchError } from '../utils/logger';\nimport type {\n  MountOrUnmountFunction,\n  RemoteComponentMountUnmount,\n} from './types';\n\ntype ScriptMod = {\n  mount?: MountOrUnmountFunction;\n  unmount?: MountOrUnmountFunction;\n  default?: {\n    mount?: MountOrUnmountFunction;\n    unmount?: MountOrUnmountFunction;\n  };\n};\n\n/**\n * Fetches an ES module via the resolveClientUrl callback, rewrites its\n * relative imports to also go through the callback, then loads it by injecting a\n * wrapper <script type=\"module\"> tag. The module's namespace is captured via\n * a temporary global and returned.\n *\n * This is needed when a direct import() of a cross-origin module fails due to\n * CORS restrictions or Vercel preview-deployment auth. A simple URL rewrite\n * doesn't work for import() because relative imports inside the module would\n * resolve against the rewritten URL instead of the original remote origin.\n */\nasync function importViaCallback<T>(\n  absoluteSrc: string,\n  resolveClientUrl: InternalResolveClientUrl,\n): Promise<T> {\n  const resolvedUrl = resolveClientUrl(absoluteSrc) ?? absoluteSrc;\n  const fetchUrl = new URL(resolvedUrl, location.href).href;\n  const response = await fetch(fetchUrl);\n  if (!response.ok) throw new Error(`Proxied fetch failed: ${response.status}`);\n\n  // Restore import.meta.url to the original module URL so any code that\n  // relies on it (e.g. for asset resolution) gets the right value.\n  // Rewrite relative imports to absolute URLs resolved through the callback so\n  // that transitive dependencies also bypass CORS/auth.\n  const content = (await response.text())\n    .replace(/import\\.meta\\.url/g, JSON.stringify(absoluteSrc))\n    .replace(\n      /\\b(from|import)\\s*([\"'])(\\.\\.?\\/[^\"']+)\\2/g,\n      (_, keyword, quote, relativePath) => {\n        const absoluteImportUrl = new URL(relativePath, absoluteSrc).href;\n        const resolvedImportUrl = new URL(\n          resolveClientUrl(absoluteImportUrl) ?? absoluteImportUrl,\n          location.href,\n        ).href;\n        return `${keyword} ${quote}${resolvedImportUrl}${quote}`;\n      },\n    );\n  const moduleBlobUrl = URL.createObjectURL(\n    new Blob([content], { type: 'text/javascript' }),\n  );\n  const wrapperContent = [\n    `import*as m from${JSON.stringify(moduleBlobUrl)};`,\n    `globalThis.__rc_module_registry__=globalThis.__rc_module_registry__||{};`,\n    `globalThis.__rc_module_registry__[${JSON.stringify(absoluteSrc)}]=m;`,\n  ].join('');\n  const wrapperBlobUrl = URL.createObjectURL(\n    new Blob([wrapperContent], { type: 'text/javascript' }),\n  );\n  const scriptEl = document.createElement('script');\n  scriptEl.type = 'module';\n  scriptEl.src = wrapperBlobUrl;\n  try {\n    await new Promise<void>((resolve, reject) => {\n      scriptEl.onload = () => resolve();\n      scriptEl.onerror = () =>\n        reject(new Error(`Failed to load module for ${absoluteSrc}`));\n      document.head.appendChild(scriptEl);\n    });\n  } finally {\n    scriptEl.remove();\n    URL.revokeObjectURL(moduleBlobUrl);\n    URL.revokeObjectURL(wrapperBlobUrl);\n  }\n  const registry = (\n    globalThis as unknown as { __rc_module_registry__?: Record<string, T> }\n  ).__rc_module_registry__;\n  const mod = registry?.[absoluteSrc] ?? ({} as T);\n  if (registry) delete registry[absoluteSrc];\n  return mod;\n}\n\nasync function importDirectly<T>(absoluteSrc: string): Promise<T> {\n  try {\n    return (await import(\n      /* @vite-ignore */\n      /* webpackIgnore: true */ absoluteSrc\n    )) as T;\n  } catch (importError) {\n    if (!absoluteSrc.startsWith('blob:')) {\n      warnCrossOriginFetchError('StaticLoader', absoluteSrc);\n    }\n    throw importError;\n  }\n}\n\nfunction resolveScriptSrc(script: HTMLScriptElement, url: URL): string {\n  const rawSrc =\n    typeof script.getAttribute === 'function'\n      ? (script.getAttribute('src') ?? script.src)\n      : script.src;\n  if (!rawSrc && script.textContent) {\n    return URL.createObjectURL(\n      new Blob(\n        [script.textContent.replace(/import\\.meta\\.url/g, JSON.stringify(url))],\n        { type: 'text/javascript' },\n      ),\n    );\n  }\n  return rawSrc;\n}\n\nexport async function loadStaticRemoteComponent(\n  scripts: HTMLScriptElement[],\n  url: URL,\n  resolveClientUrl?: InternalResolveClientUrl,\n) {\n  const self = globalThis as typeof globalThis & RemoteComponentMountUnmount;\n  if (self.__remote_script_entrypoint_mount__?.[url.href]) {\n    self.__remote_script_entrypoint_mount__[url.href] = new Set();\n  }\n  if (self.__remote_script_entrypoint_unmount__?.[url.href]) {\n    self.__remote_script_entrypoint_unmount__[url.href] = new Set();\n  }\n  const mountUnmountSets = await Promise.all(\n    scripts.map(async (script) => {\n      try {\n        const src = resolveScriptSrc(script, url);\n        const absoluteSrc = new URL(src, url).href;\n        const mod: ScriptMod = resolveClientUrl\n          ? await importViaCallback<ScriptMod>(absoluteSrc, resolveClientUrl)\n          : await importDirectly<ScriptMod>(absoluteSrc);\n        // revoke the object URL if we created one for inline script content\n        if (src.startsWith('blob:')) {\n          URL.revokeObjectURL(src);\n        }\n        if (\n          typeof mod.mount === 'function' ||\n          typeof mod.default?.mount === 'function'\n        ) {\n          if (!self.__remote_script_entrypoint_mount__) {\n            // eslint-disable-next-line camelcase\n            self.__remote_script_entrypoint_mount__ = {};\n          }\n          if (!self.__remote_script_entrypoint_mount__[url.href]) {\n            self.__remote_script_entrypoint_mount__[url.href] = new Set();\n          }\n          self.__remote_script_entrypoint_mount__[url.href]?.add(\n            mod.mount ||\n              mod.default?.mount ||\n              (() => {\n                // noop\n              }),\n          );\n        }\n        if (\n          typeof mod.unmount === 'function' ||\n          typeof mod.default?.unmount === 'function'\n        ) {\n          if (!self.__remote_script_entrypoint_unmount__) {\n            // eslint-disable-next-line camelcase\n            self.__remote_script_entrypoint_unmount__ = {};\n          }\n          if (!self.__remote_script_entrypoint_unmount__[url.href]) {\n            self.__remote_script_entrypoint_unmount__[url.href] = new Set();\n          }\n          self.__remote_script_entrypoint_unmount__[url.href]?.add(\n            mod.unmount ||\n              mod.default?.unmount ||\n              (() => {\n                // noop\n              }),\n          );\n        }\n        return {\n          mount: mod.mount || mod.default?.mount,\n          unmount: mod.unmount || mod.default?.unmount,\n        };\n      } catch (e) {\n        logError(\n          'StaticLoader',\n          `Error loading remote component script from \"${script.src || url.href}\".`,\n          e,\n        );\n        return {\n          mount: undefined,\n          unmount: undefined,\n        };\n      }\n    }),\n  );\n  return mountUnmountSets.reduce(\n    (acc, { mount, unmount }) => {\n      if (typeof mount === 'function') {\n        acc.mount.add(mount);\n      }\n      if (typeof unmount === 'function') {\n        acc.unmount.add(unmount);\n      }\n      return acc;\n    },\n    {\n      mount: new Set<MountOrUnmountFunction>(),\n      unmount: new Set<MountOrUnmountFunction>(),\n    },\n  );\n}\n","import type { MountOrUnmountFunction } from '../../shared/client/types';\nimport { logError } from '../../shared/utils/logger';\n\nif (typeof HTMLElement !== 'undefined') {\n  class RemoteComponent extends HTMLElement {\n    name?: string;\n    root?: ShadowRoot | null = null;\n    unmount?: Set<MountOrUnmountFunction> | null = null;\n\n    constructor() {\n      super();\n\n      const html = this.innerHTML;\n      this.root = this.attachShadow({\n        mode: this.getAttribute('mode') === 'closed' ? 'closed' : 'open',\n      });\n      this.root.innerHTML = html;\n      // Clear light DOM — content was copied into the shadow root above.\n      // Without this the original children render twice (once in light DOM,\n      // once in shadow DOM).\n      this.replaceChildren();\n\n      // run the mount functions for any scripts inside the shadow root asynchronously\n      (async () => {\n        const { loadStaticRemoteComponent } = await import(\n          '../../shared/client/static-loader'\n        );\n        loadStaticRemoteComponent(\n          Array.from(this.root?.querySelectorAll('script') ?? []),\n          new URL(location.href),\n        )\n          .then(({ mount, unmount }) => {\n            this.unmount = unmount;\n            return Promise.all(\n              Array.from(mount).map((mountFn) => mountFn(this.root)),\n            );\n          })\n          .catch((e) => {\n            logError('HtmlRemote', 'Error mounting remote component.', e);\n          });\n      })().catch((e) => {\n        logError('HtmlRemote', 'Error mounting remote component.', e);\n      });\n    }\n\n    disconnectedCallback() {\n      // run the unmount functions for any scripts inside the shadow root asynchronously\n      (async () => {\n        if (this.unmount) {\n          await Promise.all(\n            Array.from(this.unmount).map(async (unmount) => {\n              try {\n                await unmount(this.root);\n              } catch (e) {\n                logError('HtmlRemote', 'Error unmounting remote component.', e);\n              }\n            }),\n          );\n        }\n      })().catch((e) => {\n        logError('HtmlRemote', 'Error unmounting remote component.', e);\n      });\n    }\n  }\n\n  // register the custom element\n  customElements.define('remote-component', RemoteComponent);\n}\n"],"mappings":"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","names":["location","loadStaticRemoteComponent"]}

package/dist/html/remote.js

@@ -8,11 +8,38 @@ var __export = (target, all) => {
     __defProp(target, name, { get: all[name], enumerable: true });
 };
 
+// src/shared/constants.ts
+var CORS_DOCS_URL;
+var init_constants = __esm({
+  "src/shared/constants.ts"() {
+    "use strict";
+    CORS_DOCS_URL = "https://vercel.com/docs/remote-components/concepts/cors-external-urls#accessing-cross-site-protected-remote-components";
+  }
+});
+
+// src/shared/client/protected-rc-fallback.ts
+var init_protected_rc_fallback = __esm({
+  "src/shared/client/protected-rc-fallback.ts"() {
+    "use strict";
+    init_constants();
+  }
+});
+
+// src/shared/utils/abort.ts
+var init_abort = __esm({
+  "src/shared/utils/abort.ts"() {
+    "use strict";
+  }
+});
+
 // src/shared/error.ts
 var RemoteComponentsError;
 var init_error = __esm({
   "src/shared/error.ts"() {
     "use strict";
+    init_protected_rc_fallback();
+    init_constants();
+    init_abort();
     RemoteComponentsError = class extends Error {
       code = "REMOTE_COMPONENTS_ERROR";
       constructor(message, options) {
@@ -24,6 +51,9 @@ var init_error = __esm({
 });
 
 // src/shared/utils/logger.ts
+function logWarn(location2, message) {
+  console.warn(`[${PREFIX}:${location2}]: ${message}`);
+}
 function logError(location2, message, cause) {
   console.error(
     new RemoteComponentsError(`[${PREFIX}:${location2}]: ${message}`, {
@@ -31,10 +61,24 @@ function logError(location2, message, cause) {
     })
   );
 }
+function warnCrossOriginFetchError(logLocation, url) {
+  try {
+    const parsed = typeof url === "string" ? new URL(url) : url;
+    if (typeof location === "undefined" || parsed.origin === location.origin) {
+      return;
+    }
+    logWarn(
+      logLocation,
+      `Failed to fetch cross-origin resource "${parsed.href}". If this is a protected deployment, ensure withRemoteComponentsHost middleware is configured in your host and that the remote URL is included in allowedProxyUrls. See: ${CORS_DOCS_URL}`
+    );
+  } catch {
+  }
+}
 var PREFIX, DEBUG;
 var init_logger = __esm({
   "src/shared/utils/logger.ts"() {
     "use strict";
+    init_constants();
     init_error();
     PREFIX = "remote-components";
     DEBUG = typeof window !== "undefined" && localStorage.getItem("RC_DEBUG") === "true";
@@ -46,7 +90,81 @@ var static_loader_exports = {};
 __export(static_loader_exports, {
   loadStaticRemoteComponent: () => loadStaticRemoteComponent
 });
-async function loadStaticRemoteComponent(scripts, url) {
+async function importViaCallback(absoluteSrc, resolveClientUrl) {
+  const resolvedUrl = resolveClientUrl(absoluteSrc) ?? absoluteSrc;
+  const fetchUrl = new URL(resolvedUrl, location.href).href;
+  const response = await fetch(fetchUrl);
+  if (!response.ok)
+    throw new Error(`Proxied fetch failed: ${response.status}`);
+  const content = (await response.text()).replace(/import\.meta\.url/g, JSON.stringify(absoluteSrc)).replace(
+    /\b(from|import)\s*(["'])(\.\.?\/[^"']+)\2/g,
+    (_, keyword, quote, relativePath) => {
+      const absoluteImportUrl = new URL(relativePath, absoluteSrc).href;
+      const resolvedImportUrl = new URL(
+        resolveClientUrl(absoluteImportUrl) ?? absoluteImportUrl,
+        location.href
+      ).href;
+      return `${keyword} ${quote}${resolvedImportUrl}${quote}`;
+    }
+  );
+  const moduleBlobUrl = URL.createObjectURL(
+    new Blob([content], { type: "text/javascript" })
+  );
+  const wrapperContent = [
+    `import*as m from${JSON.stringify(moduleBlobUrl)};`,
+    `globalThis.__rc_module_registry__=globalThis.__rc_module_registry__||{};`,
+    `globalThis.__rc_module_registry__[${JSON.stringify(absoluteSrc)}]=m;`
+  ].join("");
+  const wrapperBlobUrl = URL.createObjectURL(
+    new Blob([wrapperContent], { type: "text/javascript" })
+  );
+  const scriptEl = document.createElement("script");
+  scriptEl.type = "module";
+  scriptEl.src = wrapperBlobUrl;
+  try {
+    await new Promise((resolve, reject) => {
+      scriptEl.onload = () => resolve();
+      scriptEl.onerror = () => reject(new Error(`Failed to load module for ${absoluteSrc}`));
+      document.head.appendChild(scriptEl);
+    });
+  } finally {
+    scriptEl.remove();
+    URL.revokeObjectURL(moduleBlobUrl);
+    URL.revokeObjectURL(wrapperBlobUrl);
+  }
+  const registry = globalThis.__rc_module_registry__;
+  const mod = registry?.[absoluteSrc] ?? {};
+  if (registry)
+    delete registry[absoluteSrc];
+  return mod;
+}
+async function importDirectly(absoluteSrc) {
+  try {
+    return await import(
+      /* @vite-ignore */
+      /* webpackIgnore: true */
+      absoluteSrc
+    );
+  } catch (importError) {
+    if (!absoluteSrc.startsWith("blob:")) {
+      warnCrossOriginFetchError("StaticLoader", absoluteSrc);
+    }
+    throw importError;
+  }
+}
+function resolveScriptSrc(script, url) {
+  const rawSrc = typeof script.getAttribute === "function" ? script.getAttribute("src") ?? script.src : script.src;
+  if (!rawSrc && script.textContent) {
+    return URL.createObjectURL(
+      new Blob(
+        [script.textContent.replace(/import\.meta\.url/g, JSON.stringify(url))],
+        { type: "text/javascript" }
+      )
+    );
+  }
+  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();
@@ -57,26 +175,9 @@ async function loadStaticRemoteComponent(scripts, url) {
   const mountUnmountSets = await Promise.all(
     scripts.map(async (script) => {
       try {
-        let src = typeof script.getAttribute === "function" ? script.getAttribute("src") ?? script.src : script.src;
-        if (!src && script.textContent) {
-          const blob = new Blob(
-            [
-              script.textContent.replace(
-                /import\.meta\.url/g,
-                JSON.stringify(url)
-              )
-            ],
-            {
-              type: "text/javascript"
-            }
-          );
-          src = URL.createObjectURL(blob);
-        }
-        const mod = await import(
-          /* @vite-ignore */
-          /* webpackIgnore: true */
-          new URL(src, url).href
-        );
+        const src = resolveScriptSrc(script, url);
+        const absoluteSrc = new URL(src, url).href;
+        const mod = resolveClientUrl ? await importViaCallback(absoluteSrc, resolveClientUrl) : await importDirectly(absoluteSrc);
         if (src.startsWith("blob:")) {
           URL.revokeObjectURL(src);
         }
@@ -158,6 +259,7 @@ if (typeof HTMLElement !== "undefined") {
         mode: this.getAttribute("mode") === "closed" ? "closed" : "open"
       });
       this.root.innerHTML = html;
+      this.replaceChildren();
       (async () => {
         const { loadStaticRemoteComponent: loadStaticRemoteComponent2 } = await Promise.resolve().then(() => (init_static_loader(), static_loader_exports));
         loadStaticRemoteComponent2(

package/dist/html/remote.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/shared/error.ts","../../src/shared/utils/logger.ts","../../src/shared/client/static-loader.ts","../../src/html/remote/index.tsx"],"sourcesContent":["export class RemoteComponentsError extends Error {\n  code = 'REMOTE_COMPONENTS_ERROR';\n\n  constructor(message: string, options?: { cause?: unknown }) {\n    super(message, options);\n    this.name = 'RemoteComponentsError';\n  }\n}\n\nexport function multipleRemoteComponentsError(url: string | undefined) {\n  return new RemoteComponentsError(\n    `Multiple Remote Components found at \"${url}\". When a page exposes multiple Remote Components you must specify the \"name\" prop to select which one to load.`,\n  );\n}\n\nexport function failedToFetchRemoteComponentError(\n  url: string,\n  { status, statusText }: { status: number; statusText: string },\n  help: string = 'Is the URL correct and accessible?',\n) {\n  return new RemoteComponentsError(\n    `Failed to fetch Remote Component from \"${url}\". ${help}`,\n    { cause: new Error(`${status} ${statusText}`) },\n  );\n}\n","import { RemoteComponentsError } from '#internal/shared/error';\n\ntype LogLocation =\n  | 'ChunkLoader'\n  | 'ComponentLoader'\n  | 'SharedModules'\n  | 'WebpackAdapter'\n  | 'TurbopackModule'\n  | 'StaticLoader'\n  | 'Polyfill'\n  | 'HtmlRemote'\n  | 'HtmlHost'\n  | 'Config'\n  | 'NextAppRouter'\n  | 'NextAppRouterCompat'\n  | 'FetchRemoteComponent';\n\nconst PREFIX = 'remote-components';\nconst DEBUG =\n  typeof window !== 'undefined' && localStorage.getItem('RC_DEBUG') === 'true';\n\nexport function logDebug(location: LogLocation, message: string) {\n  if (DEBUG) {\n    // eslint-disable-next-line no-console\n    console.debug(`[${PREFIX}:${location}]: ${message}`);\n  }\n}\n\nexport function logInfo(location: LogLocation, message: string) {\n  // eslint-disable-next-line no-console\n  console.info(`[${PREFIX}:${location}]: ${message}`);\n}\n\nexport function logWarn(location: LogLocation, message: string) {\n  // eslint-disable-next-line no-console\n  console.warn(`[${PREFIX}:${location}]: ${message}`);\n}\n\nexport function logError(\n  location: LogLocation,\n  message: string,\n  cause?: unknown,\n) {\n  // eslint-disable-next-line no-console\n  console.error(\n    new RemoteComponentsError(`[${PREFIX}:${location}]: ${message}`, {\n      cause,\n    }),\n  );\n}\n","import { logError } from '../utils/logger';\nimport type {\n  MountOrUnmountFunction,\n  RemoteComponentMountUnmount,\n} from './types';\n\nexport async function loadStaticRemoteComponent(\n  scripts: HTMLScriptElement[],\n  url: URL,\n) {\n  const self = globalThis as typeof globalThis & RemoteComponentMountUnmount;\n  if (self.__remote_script_entrypoint_mount__?.[url.href]) {\n    self.__remote_script_entrypoint_mount__[url.href] = new Set();\n  }\n  if (self.__remote_script_entrypoint_unmount__?.[url.href]) {\n    self.__remote_script_entrypoint_unmount__[url.href] = new Set();\n  }\n  const mountUnmountSets = await Promise.all(\n    scripts.map(async (script) => {\n      try {\n        let src =\n          typeof script.getAttribute === 'function'\n            ? (script.getAttribute('src') ?? script.src)\n            : script.src;\n        // if there's no src attribute but there is inline script content, create a blob URL for it\n        if (!src && script.textContent) {\n          const blob = new Blob(\n            [\n              script.textContent.replace(\n                /import\\.meta\\.url/g,\n                JSON.stringify(url),\n              ),\n            ],\n            {\n              type: 'text/javascript',\n            },\n          );\n          src = URL.createObjectURL(blob);\n        }\n        const mod = (await import(\n          /* @vite-ignore */\n          /* webpackIgnore: true */ new URL(src, url).href\n        )) as {\n          mount?: MountOrUnmountFunction;\n          unmount?: MountOrUnmountFunction;\n          default?: {\n            mount?: MountOrUnmountFunction;\n            unmount?: MountOrUnmountFunction;\n          };\n        };\n        // revoke the object URL if we created one\n        if (src.startsWith('blob:')) {\n          URL.revokeObjectURL(src);\n        }\n        if (\n          typeof mod.mount === 'function' ||\n          typeof mod.default?.mount === 'function'\n        ) {\n          if (!self.__remote_script_entrypoint_mount__) {\n            // eslint-disable-next-line camelcase\n            self.__remote_script_entrypoint_mount__ = {};\n          }\n          if (!self.__remote_script_entrypoint_mount__[url.href]) {\n            self.__remote_script_entrypoint_mount__[url.href] = new Set();\n          }\n          self.__remote_script_entrypoint_mount__[url.href]?.add(\n            mod.mount ||\n              mod.default?.mount ||\n              (() => {\n                // noop\n              }),\n          );\n        }\n        if (\n          typeof mod.unmount === 'function' ||\n          typeof mod.default?.unmount === 'function'\n        ) {\n          if (!self.__remote_script_entrypoint_unmount__) {\n            // eslint-disable-next-line camelcase\n            self.__remote_script_entrypoint_unmount__ = {};\n          }\n          if (!self.__remote_script_entrypoint_unmount__[url.href]) {\n            self.__remote_script_entrypoint_unmount__[url.href] = new Set();\n          }\n          self.__remote_script_entrypoint_unmount__[url.href]?.add(\n            mod.unmount ||\n              mod.default?.unmount ||\n              (() => {\n                // noop\n              }),\n          );\n        }\n        return {\n          mount: mod.mount || mod.default?.mount,\n          unmount: mod.unmount || mod.default?.unmount,\n        };\n      } catch (e) {\n        logError(\n          'StaticLoader',\n          `Error loading remote component script from \"${script.src || url.href}\".`,\n          e,\n        );\n        return {\n          mount: undefined,\n          unmount: undefined,\n        };\n      }\n    }),\n  );\n  return mountUnmountSets.reduce(\n    (acc, { mount, unmount }) => {\n      if (typeof mount === 'function') {\n        acc.mount.add(mount);\n      }\n      if (typeof unmount === 'function') {\n        acc.unmount.add(unmount);\n      }\n      return acc;\n    },\n    {\n      mount: new Set<MountOrUnmountFunction>(),\n      unmount: new Set<MountOrUnmountFunction>(),\n    },\n  );\n}\n","import type { MountOrUnmountFunction } from '../../shared/client/types';\nimport { logError } from '../../shared/utils/logger';\n\nif (typeof HTMLElement !== 'undefined') {\n  class RemoteComponent extends HTMLElement {\n    name?: string;\n    root?: ShadowRoot | null = null;\n    unmount?: Set<MountOrUnmountFunction> | null = null;\n\n    constructor() {\n      super();\n\n      const html = this.innerHTML;\n      this.root = this.attachShadow({\n        mode: this.getAttribute('mode') === 'closed' ? 'closed' : 'open',\n      });\n      this.root.innerHTML = html;\n\n      // run the mount functions for any scripts inside the shadow root asynchronously\n      (async () => {\n        const { loadStaticRemoteComponent } = await import(\n          '../../shared/client/static-loader'\n        );\n        loadStaticRemoteComponent(\n          Array.from(this.root?.querySelectorAll('script') ?? []),\n          new URL(location.href),\n        )\n          .then(({ mount, unmount }) => {\n            this.unmount = unmount;\n            return Promise.all(\n              Array.from(mount).map((mountFn) => mountFn(this.root)),\n            );\n          })\n          .catch((e) => {\n            logError('HtmlRemote', 'Error mounting remote component.', e);\n          });\n      })().catch((e) => {\n        logError('HtmlRemote', 'Error mounting remote component.', e);\n      });\n    }\n\n    disconnectedCallback() {\n      // run the unmount functions for any scripts inside the shadow root asynchronously\n      (async () => {\n        if (this.unmount) {\n          await Promise.all(\n            Array.from(this.unmount).map(async (unmount) => {\n              try {\n                await unmount(this.root);\n              } catch (e) {\n                logError('HtmlRemote', 'Error unmounting remote component.', e);\n              }\n            }),\n          );\n        }\n      })().catch((e) => {\n        logError('HtmlRemote', 'Error unmounting remote component.', e);\n      });\n    }\n  }\n\n  // register the custom element\n  customElements.define('remote-component', RemoteComponent);\n}\n"],"mappings":";;;;;;;;;;;AAAA,IAAa;AAAb;AAAA;AAAA;AAAO,IAAM,wBAAN,cAAoC,MAAM;AAAA,MAC/C,OAAO;AAAA,MAEP,YAAY,SAAiB,SAA+B;AAC1D,cAAM,SAAS,OAAO;AACtB,aAAK,OAAO;AAAA,MACd;AAAA,IACF;AAAA;AAAA;;;AC+BO,SAAS,SACdA,WACA,SACA,OACA;AAEA,UAAQ;AAAA,IACN,IAAI,sBAAsB,IAAI,UAAUA,eAAc,WAAW;AAAA,MAC/D;AAAA,IACF,CAAC;AAAA,EACH;AACF;AAjDA,IAiBM,QACA;AAlBN;AAAA;AAAA;AAAA;AAiBA,IAAM,SAAS;AACf,IAAM,QACJ,OAAO,WAAW,eAAe,aAAa,QAAQ,UAAU,MAAM;AAAA;AAAA;;;ACnBxE;AAAA;AAAA;AAAA;AAMA,eAAsB,0BACpB,SACA,KACA;AACA,QAAM,OAAO;AACb,MAAI,KAAK,qCAAqC,IAAI,IAAI,GAAG;AACvD,SAAK,mCAAmC,IAAI,IAAI,IAAI,oBAAI,IAAI;AAAA,EAC9D;AACA,MAAI,KAAK,uCAAuC,IAAI,IAAI,GAAG;AACzD,SAAK,qCAAqC,IAAI,IAAI,IAAI,oBAAI,IAAI;AAAA,EAChE;AACA,QAAM,mBAAmB,MAAM,QAAQ;AAAA,IACrC,QAAQ,IAAI,OAAO,WAAW;AAC5B,UAAI;AACF,YAAI,MACF,OAAO,OAAO,iBAAiB,aAC1B,OAAO,aAAa,KAAK,KAAK,OAAO,MACtC,OAAO;AAEb,YAAI,CAAC,OAAO,OAAO,aAAa;AAC9B,gBAAM,OAAO,IAAI;AAAA,YACf;AAAA,cACE,OAAO,YAAY;AAAA,gBACjB;AAAA,gBACA,KAAK,UAAU,GAAG;AAAA,cACpB;AAAA,YACF;AAAA,YACA;AAAA,cACE,MAAM;AAAA,YACR;AAAA,UACF;AACA,gBAAM,IAAI,gBAAgB,IAAI;AAAA,QAChC;AACA,cAAM,MAAO,MAAM;AAAA;AAAA;AAAA,UAES,IAAI,IAAI,KAAK,GAAG,EAAE;AAAA;AAU9C,YAAI,IAAI,WAAW,OAAO,GAAG;AAC3B,cAAI,gBAAgB,GAAG;AAAA,QACzB;AACA,YACE,OAAO,IAAI,UAAU,cACrB,OAAO,IAAI,SAAS,UAAU,YAC9B;AACA,cAAI,CAAC,KAAK,oCAAoC;AAE5C,iBAAK,qCAAqC,CAAC;AAAA,UAC7C;AACA,cAAI,CAAC,KAAK,mCAAmC,IAAI,IAAI,GAAG;AACtD,iBAAK,mCAAmC,IAAI,IAAI,IAAI,oBAAI,IAAI;AAAA,UAC9D;AACA,eAAK,mCAAmC,IAAI,IAAI,GAAG;AAAA,YACjD,IAAI,SACF,IAAI,SAAS,UACZ,MAAM;AAAA,YAEP;AAAA,UACJ;AAAA,QACF;AACA,YACE,OAAO,IAAI,YAAY,cACvB,OAAO,IAAI,SAAS,YAAY,YAChC;AACA,cAAI,CAAC,KAAK,sCAAsC;AAE9C,iBAAK,uCAAuC,CAAC;AAAA,UAC/C;AACA,cAAI,CAAC,KAAK,qCAAqC,IAAI,IAAI,GAAG;AACxD,iBAAK,qCAAqC,IAAI,IAAI,IAAI,oBAAI,IAAI;AAAA,UAChE;AACA,eAAK,qCAAqC,IAAI,IAAI,GAAG;AAAA,YACnD,IAAI,WACF,IAAI,SAAS,YACZ,MAAM;AAAA,YAEP;AAAA,UACJ;AAAA,QACF;AACA,eAAO;AAAA,UACL,OAAO,IAAI,SAAS,IAAI,SAAS;AAAA,UACjC,SAAS,IAAI,WAAW,IAAI,SAAS;AAAA,QACvC;AAAA,MACF,SAAS,GAAP;AACA;AAAA,UACE;AAAA,UACA,+CAA+C,OAAO,OAAO,IAAI;AAAA,UACjE;AAAA,QACF;AACA,eAAO;AAAA,UACL,OAAO;AAAA,UACP,SAAS;AAAA,QACX;AAAA,MACF;AAAA,IACF,CAAC;AAAA,EACH;AACA,SAAO,iBAAiB;AAAA,IACtB,CAAC,KAAK,EAAE,OAAO,QAAQ,MAAM;AAC3B,UAAI,OAAO,UAAU,YAAY;AAC/B,YAAI,MAAM,IAAI,KAAK;AAAA,MACrB;AACA,UAAI,OAAO,YAAY,YAAY;AACjC,YAAI,QAAQ,IAAI,OAAO;AAAA,MACzB;AACA,aAAO;AAAA,IACT;AAAA,IACA;AAAA,MACE,OAAO,oBAAI,IAA4B;AAAA,MACvC,SAAS,oBAAI,IAA4B;AAAA,IAC3C;AAAA,EACF;AACF;AA5HA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACCA;AAEA,IAAI,OAAO,gBAAgB,aAAa;AACtC,QAAM,wBAAwB,YAAY;AAAA,IACxC;AAAA,IACA,OAA2B;AAAA,IAC3B,UAA+C;AAAA,IAE/C,cAAc;AACZ,YAAM;AAEN,YAAM,OAAO,KAAK;AAClB,WAAK,OAAO,KAAK,aAAa;AAAA,QAC5B,MAAM,KAAK,aAAa,MAAM,MAAM,WAAW,WAAW;AAAA,MAC5D,CAAC;AACD,WAAK,KAAK,YAAY;AAGtB,OAAC,YAAY;AACX,cAAM,EAAE,2BAAAC,2BAA0B,IAAI,MAAM;AAG5C,QAAAA;AAAA,UACE,MAAM,KAAK,KAAK,MAAM,iBAAiB,QAAQ,KAAK,CAAC,CAAC;AAAA,UACtD,IAAI,IAAI,SAAS,IAAI;AAAA,QACvB,EACG,KAAK,CAAC,EAAE,OAAO,QAAQ,MAAM;AAC5B,eAAK,UAAU;AACf,iBAAO,QAAQ;AAAA,YACb,MAAM,KAAK,KAAK,EAAE,IAAI,CAAC,YAAY,QAAQ,KAAK,IAAI,CAAC;AAAA,UACvD;AAAA,QACF,CAAC,EACA,MAAM,CAAC,MAAM;AACZ,mBAAS,cAAc,oCAAoC,CAAC;AAAA,QAC9D,CAAC;AAAA,MACL,GAAG,EAAE,MAAM,CAAC,MAAM;AAChB,iBAAS,cAAc,oCAAoC,CAAC;AAAA,MAC9D,CAAC;AAAA,IACH;AAAA,IAEA,uBAAuB;AAErB,OAAC,YAAY;AACX,YAAI,KAAK,SAAS;AAChB,gBAAM,QAAQ;AAAA,YACZ,MAAM,KAAK,KAAK,OAAO,EAAE,IAAI,OAAO,YAAY;AAC9C,kBAAI;AACF,sBAAM,QAAQ,KAAK,IAAI;AAAA,cACzB,SAAS,GAAP;AACA,yBAAS,cAAc,sCAAsC,CAAC;AAAA,cAChE;AAAA,YACF,CAAC;AAAA,UACH;AAAA,QACF;AAAA,MACF,GAAG,EAAE,MAAM,CAAC,MAAM;AAChB,iBAAS,cAAc,sCAAsC,CAAC;AAAA,MAChE,CAAC;AAAA,IACH;AAAA,EACF;AAGA,iBAAe,OAAO,oBAAoB,eAAe;AAC3D;","names":["location","loadStaticRemoteComponent"]}
+{"version":3,"sources":["../../src/shared/constants.ts","../../src/shared/client/protected-rc-fallback.ts","../../src/shared/utils/abort.ts","../../src/shared/error.ts","../../src/shared/utils/logger.ts","../../src/shared/client/static-loader.ts","../../src/html/remote/index.tsx"],"sourcesContent":["export const RC_PROTECTED_REMOTE_FETCH_PATHNAME = '/rc-fetch-protected-remote';\n\nexport const CORS_DOCS_URL =\n  'https://vercel.com/docs/remote-components/concepts/cors-external-urls#accessing-cross-site-protected-remote-components';\n","import { RC_PROTECTED_REMOTE_FETCH_PATHNAME } from '#internal/shared/constants';\n\n/**\n * Generates a fallback URL that proxies the request through the host's protected remote fetch endpoint\n */\nexport function generateProtectedRcFallbackSrc(url: string): string {\n  return `${RC_PROTECTED_REMOTE_FETCH_PATHNAME}?url=${encodeURIComponent(url)}`;\n}\n\nexport function isProxiedUrl(url: string): boolean {\n  try {\n    return (\n      new URL(url, location.href).pathname ===\n      RC_PROTECTED_REMOTE_FETCH_PATHNAME\n    );\n  } catch {\n    return false;\n  }\n}\n","/**\n * Type guard to check if an error is an AbortError.\n * Handles cross-environment differences (Node.js, browsers, JSDOM).\n */\nexport function isAbortError(error: unknown): error is DOMException {\n  if (error instanceof DOMException && error.name === 'AbortError') {\n    return true;\n  }\n\n  // Handle Node.js native AbortError which may not be instanceof global DOMException\n  if (\n    error !== null &&\n    typeof error === 'object' &&\n    'name' in error &&\n    error.name === 'AbortError' &&\n    'message' in error &&\n    typeof (error as { message: unknown }).message === 'string'\n  ) {\n    // Additional check: verify it has DOMException-like structure\n    const e = error as { code?: unknown; constructor?: { name?: string } };\n    return typeof e.code === 'number' || e.constructor?.name === 'DOMException';\n  }\n\n  return false;\n}\n","import { isProxiedUrl } from '#internal/shared/client/protected-rc-fallback';\nimport {\n  CORS_DOCS_URL,\n  RC_PROTECTED_REMOTE_FETCH_PATHNAME,\n} from '#internal/shared/constants';\nimport { isAbortError } from '#internal/shared/utils/abort';\n\nexport class RemoteComponentsError extends Error {\n  code = 'REMOTE_COMPONENTS_ERROR';\n\n  constructor(message: string, options?: { cause?: unknown }) {\n    super(message, options);\n    this.name = 'RemoteComponentsError';\n  }\n}\n\nexport function multipleRemoteComponentsError(url: string | undefined) {\n  return new RemoteComponentsError(\n    `Multiple Remote Components found at \"${url}\". When a page exposes multiple Remote Components you must specify the \"name\" prop to select which one to load.`,\n  );\n}\n\nexport function failedToFetchRemoteComponentError(\n  url: string,\n  { status, statusText }: { status: number; statusText: string },\n  help: string = 'Is the URL correct and accessible?',\n) {\n  return new RemoteComponentsError(\n    `Failed to fetch Remote Component from \"${url}\". ${help}`,\n    { cause: new Error(`${status} ${statusText}`) },\n  );\n}\n\nexport async function errorFromFailedFetch(\n  originalUrl: string,\n  resolvedUrl: URL,\n  res: Response | null | undefined,\n): Promise<RemoteComponentsError> {\n  const isProxied = isProxiedUrl(resolvedUrl.href);\n\n  if (isProxied && res) {\n    const body = await res.text().catch(() => '');\n    return failedProxyFetchError(\n      originalUrl,\n      resolvedUrl.href,\n      res.status,\n      body,\n    );\n  }\n\n  const fallback = failedToFetchRemoteComponentError(\n    originalUrl,\n    res ?? { status: 0, statusText: 'No Response' },\n  );\n\n  if (!res) return fallback;\n\n  try {\n    const body = await res.text();\n    const parser = new DOMParser();\n    const doc = parser.parseFromString(body, 'text/html');\n    const errorTemplate = doc.querySelector(\n      'template[data-next-error-message]',\n    );\n    const errorMessage = errorTemplate?.getAttribute('data-next-error-message');\n    if (errorMessage) {\n      const error = new RemoteComponentsError(errorMessage);\n      const errorStack = errorTemplate?.getAttribute('data-next-error-stack');\n      if (errorStack) {\n        error.stack = errorStack;\n      }\n      return error;\n    }\n  } catch (parseError) {\n    // Re-throw abort errors, ignore parse errors\n    if (isAbortError(parseError)) throw parseError;\n  }\n\n  return fallback;\n}\n\nexport function failedProxyFetchError(\n  originalUrl: string,\n  proxyUrl: string,\n  status: number,\n  responseBody?: string,\n): RemoteComponentsError {\n  if (status === 404) {\n    return new RemoteComponentsError(\n      `Could not proxy the request to \"${originalUrl}\" — the proxy endpoint \"${RC_PROTECTED_REMOTE_FETCH_PATHNAME}\" returned 404.\\n\\n` +\n        `The host server needs middleware or a route that handles \"${RC_PROTECTED_REMOTE_FETCH_PATHNAME}\".\\n\\n` +\n        `Proxying requires two pieces:\\n` +\n        `  1. resolveClientUrl={proxyClientRequestsThroughHost} on <RemoteComponent>\\n` +\n        `  2. Middleware or a route for \"${RC_PROTECTED_REMOTE_FETCH_PATHNAME}\" on the host server\\n\\n` +\n        `Docs: ${CORS_DOCS_URL}`,\n    );\n  }\n  if (status === 403) {\n    const detail = responseBody ? ` ${responseBody}` : '';\n    return new RemoteComponentsError(\n      `Proxied request to \"${proxyUrl}\" was forbidden.${detail} ` +\n        `See: ${CORS_DOCS_URL}`,\n    );\n  }\n  return new RemoteComponentsError(\n    `Proxied request for \"${originalUrl}\" via \"${proxyUrl}\" failed with status ${status}. ` +\n      `See: ${CORS_DOCS_URL}`,\n  );\n}\n","import { CORS_DOCS_URL } from '#internal/shared/constants';\nimport { RemoteComponentsError } from '#internal/shared/error';\n\ntype LogLocation =\n  | 'ChunkLoader'\n  | 'ComponentLoader'\n  | 'SharedModules'\n  | 'WebpackAdapter'\n  | 'TurbopackModule'\n  | 'StaticLoader'\n  | 'ScriptLoader'\n  | 'Polyfill'\n  | 'HtmlRemote'\n  | 'HtmlHost'\n  | 'Config'\n  | 'NextAppRouter'\n  | 'NextAppRouterCompat'\n  | 'FetchRemoteComponent';\n\nconst PREFIX = 'remote-components';\nconst DEBUG =\n  typeof window !== 'undefined' && localStorage.getItem('RC_DEBUG') === 'true';\n\nexport function logDebug(location: LogLocation, message: string) {\n  if (DEBUG) {\n    // eslint-disable-next-line no-console\n    console.debug(`[${PREFIX}:${location}]: ${message}`);\n  }\n}\n\nexport function logInfo(location: LogLocation, message: string) {\n  // eslint-disable-next-line no-console\n  console.info(`[${PREFIX}:${location}]: ${message}`);\n}\n\nexport function logWarn(location: LogLocation, message: string) {\n  // eslint-disable-next-line no-console\n  console.warn(`[${PREFIX}:${location}]: ${message}`);\n}\n\nexport function logError(\n  location: LogLocation,\n  message: string,\n  cause?: unknown,\n) {\n  // eslint-disable-next-line no-console\n  console.error(\n    new RemoteComponentsError(`[${PREFIX}:${location}]: ${message}`, {\n      cause,\n    }),\n  );\n}\n\n/**\n * Logs a warning when a cross-origin asset request fails, guiding users\n * to configure the withRemoteComponentsHost middleware on their host.\n */\nexport function warnCrossOriginFetchError(\n  logLocation: LogLocation,\n  url: string | URL,\n): void {\n  try {\n    const parsed = typeof url === 'string' ? new URL(url) : url;\n    if (typeof location === 'undefined' || parsed.origin === location.origin) {\n      return;\n    }\n    logWarn(\n      logLocation,\n      `Failed to fetch cross-origin resource \"${parsed.href}\". ` +\n        'If this is a protected deployment, ensure withRemoteComponentsHost middleware ' +\n        'is configured in your host and that the remote URL is included in allowedProxyUrls. ' +\n        `See: ${CORS_DOCS_URL}`,\n    );\n  } catch {\n    // URL parsing failed — skip the warning\n  }\n}\n","import type { InternalResolveClientUrl } from '#internal/shared/ssr/types';\nimport { logError, warnCrossOriginFetchError } from '../utils/logger';\nimport type {\n  MountOrUnmountFunction,\n  RemoteComponentMountUnmount,\n} from './types';\n\ntype ScriptMod = {\n  mount?: MountOrUnmountFunction;\n  unmount?: MountOrUnmountFunction;\n  default?: {\n    mount?: MountOrUnmountFunction;\n    unmount?: MountOrUnmountFunction;\n  };\n};\n\n/**\n * Fetches an ES module via the resolveClientUrl callback, rewrites its\n * relative imports to also go through the callback, then loads it by injecting a\n * wrapper <script type=\"module\"> tag. The module's namespace is captured via\n * a temporary global and returned.\n *\n * This is needed when a direct import() of a cross-origin module fails due to\n * CORS restrictions or Vercel preview-deployment auth. A simple URL rewrite\n * doesn't work for import() because relative imports inside the module would\n * resolve against the rewritten URL instead of the original remote origin.\n */\nasync function importViaCallback<T>(\n  absoluteSrc: string,\n  resolveClientUrl: InternalResolveClientUrl,\n): Promise<T> {\n  const resolvedUrl = resolveClientUrl(absoluteSrc) ?? absoluteSrc;\n  const fetchUrl = new URL(resolvedUrl, location.href).href;\n  const response = await fetch(fetchUrl);\n  if (!response.ok) throw new Error(`Proxied fetch failed: ${response.status}`);\n\n  // Restore import.meta.url to the original module URL so any code that\n  // relies on it (e.g. for asset resolution) gets the right value.\n  // Rewrite relative imports to absolute URLs resolved through the callback so\n  // that transitive dependencies also bypass CORS/auth.\n  const content = (await response.text())\n    .replace(/import\\.meta\\.url/g, JSON.stringify(absoluteSrc))\n    .replace(\n      /\\b(from|import)\\s*([\"'])(\\.\\.?\\/[^\"']+)\\2/g,\n      (_, keyword, quote, relativePath) => {\n        const absoluteImportUrl = new URL(relativePath, absoluteSrc).href;\n        const resolvedImportUrl = new URL(\n          resolveClientUrl(absoluteImportUrl) ?? absoluteImportUrl,\n          location.href,\n        ).href;\n        return `${keyword} ${quote}${resolvedImportUrl}${quote}`;\n      },\n    );\n  const moduleBlobUrl = URL.createObjectURL(\n    new Blob([content], { type: 'text/javascript' }),\n  );\n  const wrapperContent = [\n    `import*as m from${JSON.stringify(moduleBlobUrl)};`,\n    `globalThis.__rc_module_registry__=globalThis.__rc_module_registry__||{};`,\n    `globalThis.__rc_module_registry__[${JSON.stringify(absoluteSrc)}]=m;`,\n  ].join('');\n  const wrapperBlobUrl = URL.createObjectURL(\n    new Blob([wrapperContent], { type: 'text/javascript' }),\n  );\n  const scriptEl = document.createElement('script');\n  scriptEl.type = 'module';\n  scriptEl.src = wrapperBlobUrl;\n  try {\n    await new Promise<void>((resolve, reject) => {\n      scriptEl.onload = () => resolve();\n      scriptEl.onerror = () =>\n        reject(new Error(`Failed to load module for ${absoluteSrc}`));\n      document.head.appendChild(scriptEl);\n    });\n  } finally {\n    scriptEl.remove();\n    URL.revokeObjectURL(moduleBlobUrl);\n    URL.revokeObjectURL(wrapperBlobUrl);\n  }\n  const registry = (\n    globalThis as unknown as { __rc_module_registry__?: Record<string, T> }\n  ).__rc_module_registry__;\n  const mod = registry?.[absoluteSrc] ?? ({} as T);\n  if (registry) delete registry[absoluteSrc];\n  return mod;\n}\n\nasync function importDirectly<T>(absoluteSrc: string): Promise<T> {\n  try {\n    return (await import(\n      /* @vite-ignore */\n      /* webpackIgnore: true */ absoluteSrc\n    )) as T;\n  } catch (importError) {\n    if (!absoluteSrc.startsWith('blob:')) {\n      warnCrossOriginFetchError('StaticLoader', absoluteSrc);\n    }\n    throw importError;\n  }\n}\n\nfunction resolveScriptSrc(script: HTMLScriptElement, url: URL): string {\n  const rawSrc =\n    typeof script.getAttribute === 'function'\n      ? (script.getAttribute('src') ?? script.src)\n      : script.src;\n  if (!rawSrc && script.textContent) {\n    return URL.createObjectURL(\n      new Blob(\n        [script.textContent.replace(/import\\.meta\\.url/g, JSON.stringify(url))],\n        { type: 'text/javascript' },\n      ),\n    );\n  }\n  return rawSrc;\n}\n\nexport async function loadStaticRemoteComponent(\n  scripts: HTMLScriptElement[],\n  url: URL,\n  resolveClientUrl?: InternalResolveClientUrl,\n) {\n  const self = globalThis as typeof globalThis & RemoteComponentMountUnmount;\n  if (self.__remote_script_entrypoint_mount__?.[url.href]) {\n    self.__remote_script_entrypoint_mount__[url.href] = new Set();\n  }\n  if (self.__remote_script_entrypoint_unmount__?.[url.href]) {\n    self.__remote_script_entrypoint_unmount__[url.href] = new Set();\n  }\n  const mountUnmountSets = await Promise.all(\n    scripts.map(async (script) => {\n      try {\n        const src = resolveScriptSrc(script, url);\n        const absoluteSrc = new URL(src, url).href;\n        const mod: ScriptMod = resolveClientUrl\n          ? await importViaCallback<ScriptMod>(absoluteSrc, resolveClientUrl)\n          : await importDirectly<ScriptMod>(absoluteSrc);\n        // revoke the object URL if we created one for inline script content\n        if (src.startsWith('blob:')) {\n          URL.revokeObjectURL(src);\n        }\n        if (\n          typeof mod.mount === 'function' ||\n          typeof mod.default?.mount === 'function'\n        ) {\n          if (!self.__remote_script_entrypoint_mount__) {\n            // eslint-disable-next-line camelcase\n            self.__remote_script_entrypoint_mount__ = {};\n          }\n          if (!self.__remote_script_entrypoint_mount__[url.href]) {\n            self.__remote_script_entrypoint_mount__[url.href] = new Set();\n          }\n          self.__remote_script_entrypoint_mount__[url.href]?.add(\n            mod.mount ||\n              mod.default?.mount ||\n              (() => {\n                // noop\n              }),\n          );\n        }\n        if (\n          typeof mod.unmount === 'function' ||\n          typeof mod.default?.unmount === 'function'\n        ) {\n          if (!self.__remote_script_entrypoint_unmount__) {\n            // eslint-disable-next-line camelcase\n            self.__remote_script_entrypoint_unmount__ = {};\n          }\n          if (!self.__remote_script_entrypoint_unmount__[url.href]) {\n            self.__remote_script_entrypoint_unmount__[url.href] = new Set();\n          }\n          self.__remote_script_entrypoint_unmount__[url.href]?.add(\n            mod.unmount ||\n              mod.default?.unmount ||\n              (() => {\n                // noop\n              }),\n          );\n        }\n        return {\n          mount: mod.mount || mod.default?.mount,\n          unmount: mod.unmount || mod.default?.unmount,\n        };\n      } catch (e) {\n        logError(\n          'StaticLoader',\n          `Error loading remote component script from \"${script.src || url.href}\".`,\n          e,\n        );\n        return {\n          mount: undefined,\n          unmount: undefined,\n        };\n      }\n    }),\n  );\n  return mountUnmountSets.reduce(\n    (acc, { mount, unmount }) => {\n      if (typeof mount === 'function') {\n        acc.mount.add(mount);\n      }\n      if (typeof unmount === 'function') {\n        acc.unmount.add(unmount);\n      }\n      return acc;\n    },\n    {\n      mount: new Set<MountOrUnmountFunction>(),\n      unmount: new Set<MountOrUnmountFunction>(),\n    },\n  );\n}\n","import type { MountOrUnmountFunction } from '../../shared/client/types';\nimport { logError } from '../../shared/utils/logger';\n\nif (typeof HTMLElement !== 'undefined') {\n  class RemoteComponent extends HTMLElement {\n    name?: string;\n    root?: ShadowRoot | null = null;\n    unmount?: Set<MountOrUnmountFunction> | null = null;\n\n    constructor() {\n      super();\n\n      const html = this.innerHTML;\n      this.root = this.attachShadow({\n        mode: this.getAttribute('mode') === 'closed' ? 'closed' : 'open',\n      });\n      this.root.innerHTML = html;\n      // Clear light DOM — content was copied into the shadow root above.\n      // Without this the original children render twice (once in light DOM,\n      // once in shadow DOM).\n      this.replaceChildren();\n\n      // run the mount functions for any scripts inside the shadow root asynchronously\n      (async () => {\n        const { loadStaticRemoteComponent } = await import(\n          '../../shared/client/static-loader'\n        );\n        loadStaticRemoteComponent(\n          Array.from(this.root?.querySelectorAll('script') ?? []),\n          new URL(location.href),\n        )\n          .then(({ mount, unmount }) => {\n            this.unmount = unmount;\n            return Promise.all(\n              Array.from(mount).map((mountFn) => mountFn(this.root)),\n            );\n          })\n          .catch((e) => {\n            logError('HtmlRemote', 'Error mounting remote component.', e);\n          });\n      })().catch((e) => {\n        logError('HtmlRemote', 'Error mounting remote component.', e);\n      });\n    }\n\n    disconnectedCallback() {\n      // run the unmount functions for any scripts inside the shadow root asynchronously\n      (async () => {\n        if (this.unmount) {\n          await Promise.all(\n            Array.from(this.unmount).map(async (unmount) => {\n              try {\n                await unmount(this.root);\n              } catch (e) {\n                logError('HtmlRemote', 'Error unmounting remote component.', e);\n              }\n            }),\n          );\n        }\n      })().catch((e) => {\n        logError('HtmlRemote', 'Error unmounting remote component.', e);\n      });\n    }\n  }\n\n  // register the custom element\n  customElements.define('remote-component', RemoteComponent);\n}\n"],"mappings":"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","names":["location","loadStaticRemoteComponent"]}

package/dist/internal/next/host/app-router-client.cjs

@@ -38,6 +38,7 @@ var import_react = require("react");
 var import_react_dom = require("react-dom");
 var import_app_router_compat = require("#internal/next/host/app-router-compat");
 var import_remote_component_links = require("#internal/next/host/remote-component-links");
+var import_use_resolve_client_url = require("#internal/react/hooks/use-resolve-client-url");
 var import_remote_component = require("#internal/shared/client/remote-component");
 var import_get_client_or_server_url = require("#internal/shared/ssr/get-client-or-server-url");
 var import_utils = require("#internal/shared/utils");
@@ -64,6 +65,7 @@ function RemoteComponentClient({
   remoteShared = {},
   isolate,
   mode = "open",
+  resolveClientUrl: resolveClientUrlProp,
   reset,
   type,
   children
@@ -71,6 +73,7 @@ function RemoteComponentClient({
   const remoteComponentId = (0, import_react.useId)();
   const [component, setComponent] = (0, import_react.useState)(null);
   const url = (0, import_get_client_or_server_url.getClientOrServerUrl)(src, serverUrl);
+  const resolveClientUrl = (0, import_use_resolve_client_url.useResolveClientUrl)(resolveClientUrlProp, url.href);
   const metadataRef = (0, import_react.useRef)({
     name,
     bundle,
@@ -193,7 +196,11 @@ function RemoteComponentClient({
           };
           if (type === "remote-component") {
             setComponent(children);
-            (0, import_remote_component.loadStaticRemoteComponent)(scripts, url).then(({ mount, unmount }) => {
+            (0, import_remote_component.loadStaticRemoteComponent)(
+              scripts,
+              url,
+              resolveClientUrl
+            ).then(({ mount, unmount }) => {
               if (mount.size > 0) {
                 let root = shadowRootRef.current;
                 try {
@@ -246,7 +253,8 @@ function RemoteComponentClient({
               };
             })(),
             remoteShared,
-            container: shadowRootRef.current
+            container: shadowRootRef.current,
+            resolveClientUrl
           });
           metadataRef.current.loading = false;
           if (result.error) {
@@ -274,7 +282,8 @@ function RemoteComponentClient({
     isolate,
     type,
     keySuffix,
-    url
+    url,
+    resolveClientUrl
   ]);
   if (nextData?.buildId === "development" && shadowRootRef.current && isolate !== false && reset && !shadowRootRef.current.querySelector("[data-remote-components-reset]")) {
     const style = document.createElement("style");