remote-components 0.1.0 → 0.2.0

package/dist/{next/host/pages-router-server.js → host/nextjs/pages.js}

@@ -1,14 +1,18 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import "remote-components/remote/defaults/wrapper";
 import * as Form from "next/form";
 import * as Image from "next/image";
 import * as Link from "next/link";
 import * as Router from "next/router";
 import * as Script from "next/script";
 import { useEffect } from "react";
-import { shared as _shared } from "remote-components/shared/host/pages";
-import { RemoteComponentsError } from "#internal/shared/client/remote-component";
-import { fetchRemoteComponent } from "#internal/shared/ssr/fetch-remote-component";
-import { RemoteComponent as RemoteComponentReact } from "#remote-components/react/index";
+import { ConsumeRemoteComponent as ConsumeRemoteComponentReact } from "remote-components/host/react";
+import { imageImpl } from "#internal/host/nextjs/image-impl";
+import { createNextImageSharedEntries } from "#internal/host/nextjs/image-shared";
+import { fetchRemoteComponent } from "#internal/host/server/fetch-remote-component";
+import { bindResolveClientUrl } from "#internal/runtime/url/default-resolve-client-url";
+import { RemoteComponentsError } from "#internal/utils/error";
+import { shared as _shared } from "#remote-components/host/defaults/pages";
 const navigationImpl = {
   useRouter: () => Router.useRouter(),
   useSearchParams: () => {
@@ -20,24 +24,14 @@ const navigationImpl = {
   }
 };
 const sharedCache = /* @__PURE__ */ new Map();
-const shared = (bundle) => {
-  if (sharedCache.has(bundle)) {
-    return sharedCache.get(bundle);
-  }
-  const remoteLoader = ({ src, width, quality }) => {
-    const self2 = globalThis;
-    const { assetPrefix } = /^(?<assetPrefix>.*?)\/_next\//.exec(src)?.groups ?? {};
-    return `${self2.__remote_bundle_url__?.[bundle]?.origin ?? ""}${assetPrefix}/_next/image?url=${encodeURIComponent(src)}&w=${width}&q=${quality || 75}`;
-  };
-  const imageImpl = (ImageComponent) => {
-    function RemoteImage(props) {
-      return /* @__PURE__ */ jsx(ImageComponent, { loader: remoteLoader, ...props });
+const shared = (bundle, resolveClientUrl) => {
+  if (!resolveClientUrl) {
+    if (sharedCache.has(bundle)) {
+      return sharedCache.get(bundle);
     }
-    RemoteImage.default = RemoteImage;
-    RemoteImage.getImageProps = Image.getImageProps;
-    return RemoteImage;
-  };
-  return {
+  }
+  const ImageComponent = Image.default.default ?? Image.default;
+  const result = {
     // polyfill Next.js App Router client API (minimal)
     // some API methods are not available when using a Next.js Pages Router application as host
     "next/navigation": () => Promise.resolve(navigationImpl),
@@ -48,26 +42,18 @@ const shared = (bundle) => {
     "next/form": () => Promise.resolve(Form.default),
     "next/dist/client/script": () => Promise.resolve(Script.default),
     "next/script": () => Promise.resolve(Script.default),
-    "next/dist/client/image-component": () => Promise.resolve({
-      // @ts-expect-error default.default
-      // eslint-disable-next-line
-      Image: imageImpl(Image.default.default ?? Image.default)
-    }),
-    "next/dist/api/image": () => Promise.resolve({
-      // @ts-expect-error default.default
-      // eslint-disable-next-line
-      default: imageImpl(Image.default.default ?? Image.default),
-      getImageProps: Image.getImageProps
-    }),
     "next/router": () => Promise.resolve(Router),
     ..._shared,
-    // always override next/image to use the remote loader
-    "next/image": () => Promise.resolve(
-      // @ts-expect-error default.default
-      // eslint-disable-next-line
-      imageImpl(Image.default.default ?? Image.default)
+    // Always override Next.js image modules to use the bundle URL rewriter.
+    ...createNextImageSharedEntries(
+      () => imageImpl(ImageComponent, bundle, resolveClientUrl, true),
+      { getImageProps: Image.getImageProps }
     )
   };
+  if (!resolveClientUrl) {
+    sharedCache.set(bundle, result);
+  }
+  return result;
 };
 const REMOTE_COMPONENT_STORE = Symbol("REMOTE_COMPONENT_STORE");
 const REMOTE_COMPONENT_KEY = "__REMOTE_COMPONENT_KEY__";
@@ -90,20 +76,23 @@ function getComponent(key) {
   self[REMOTE_COMPONENT_STORE]?.delete(key);
   return component;
 }
-function RemoteComponent(props) {
+function ConsumeRemoteComponent(props) {
   const remoteComponent = typeof document !== "undefined" ? null : (
     // retrieve the HTML from the global store
     getComponent(
       props[REMOTE_COMPONENT_KEY] ?? "__vercel_remote_component"
     )
   );
+  const src = typeof props.src === "string" ? props.src : props.src.href;
+  const resolveClientUrl = props.resolveClientUrl ? bindResolveClientUrl(props.resolveClientUrl, src) : void 0;
+  const sharedResult = shared(props.bundle ?? "default", resolveClientUrl);
   useEffect(() => {
     const clientSelf = globalThis;
-    clientSelf.__remote_component_shared__ = shared(props.bundle ?? "default");
-  }, [props.bundle]);
+    clientSelf.__remote_component_shared__ = sharedResult;
+  }, [sharedResult]);
   if (!props[REMOTE_COMPONENT_KEY]) {
     return /* @__PURE__ */ jsx(
-      RemoteComponentReact,
+      ConsumeRemoteComponentReact,
       {
         isolate: props.isolate,
         mode: props.mode,
@@ -116,14 +105,14 @@ function RemoteComponent(props) {
         onResponse: props.onResponse,
         resolveClientUrl: props.resolveClientUrl,
         reset: props.reset,
-        shared: shared(props.bundle ?? "default"),
+        shared: sharedResult,
         src: props.src,
         children: props.children
       }
     );
   }
   return /* @__PURE__ */ jsx(
-    RemoteComponentReact,
+    ConsumeRemoteComponentReact,
     {
       isolate: props.isolate,
       mode: props.mode,
@@ -136,16 +125,16 @@ function RemoteComponent(props) {
       onResponse: props.onResponse,
       resolveClientUrl: props.resolveClientUrl,
       reset: props.reset,
-      shared: shared(props.bundle ?? "default"),
+      shared: sharedResult,
       src: props.src,
       children: remoteComponent
     }
   );
 }
-async function getRemoteComponentProps(src, options) {
+async function getConsumeRemoteComponentProps(src, options) {
   if (typeof document !== "undefined") {
     throw new RemoteComponentsError(
-      "`getRemoteComponentProps()` can only be used on the server side."
+      "`getConsumeRemoteComponentProps()` can only be used on the server side."
     );
   }
   const {
@@ -198,7 +187,7 @@ async function getRemoteComponentProps(src, options) {
   };
 }
 export {
-  RemoteComponent,
-  getRemoteComponentProps
+  ConsumeRemoteComponent,
+  getConsumeRemoteComponentProps
 };
-//# sourceMappingURL=pages-router-server.js.map
+//# sourceMappingURL=pages.js.map

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

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

package/dist/{internal/shared/client/proxy-through-host.cjs → host/proxy/client.cjs}

@@ -16,17 +16,24 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var proxy_through_host_exports = {};
-__export(proxy_through_host_exports, {
-  proxyClientRequestsThroughHost: () => proxyClientRequestsThroughHost,
-  withRemoteSrc: () => withRemoteSrc
+
+// src/host/proxy/client.ts
+var client_exports = {};
+__export(client_exports, {
+  routeThroughHostProxy: () => routeThroughHostProxy
 });
-module.exports = __toCommonJS(proxy_through_host_exports);
-var import_protected_rc_fallback = require("./protected-rc-fallback");
-function withRemoteSrc(resolveClientUrl, remoteSrc) {
-  return (url) => resolveClientUrl(remoteSrc, url);
+module.exports = __toCommonJS(client_exports);
+
+// src/utils/constants.ts
+var RC_PROTECTED_REMOTE_FETCH_PATHNAME = "/rc-fetch-protected-remote";
+
+// src/runtime/url/protected-rc-fallback.ts
+function generateProtectedRcFallbackSrc(url) {
+  return `${RC_PROTECTED_REMOTE_FETCH_PATHNAME}?url=${encodeURIComponent(url)}`;
 }
-const proxyClientRequestsThroughHost = (remoteSrc, url) => {
+
+// src/host/proxy/client.ts
+var routeThroughHostProxy = (remoteSrc, url) => {
   if (typeof location === "undefined") {
     return void 0;
   }
@@ -37,7 +44,7 @@ const proxyClientRequestsThroughHost = (remoteSrc, url) => {
   try {
     const parsed = new URL(url, location.href);
     if (parsed.origin === remoteOrigin) {
-      return (0, import_protected_rc_fallback.generateProtectedRcFallbackSrc)(url);
+      return generateProtectedRcFallbackSrc(url);
     }
   } catch {
   }
@@ -45,7 +52,6 @@ const proxyClientRequestsThroughHost = (remoteSrc, url) => {
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  proxyClientRequestsThroughHost,
-  withRemoteSrc
+  routeThroughHostProxy
 });
-//# sourceMappingURL=proxy-through-host.cjs.map
+//# sourceMappingURL=client.cjs.map

package/dist/host/proxy/client.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/host/proxy/client.ts","../../../src/utils/constants.ts","../../../src/runtime/url/protected-rc-fallback.ts"],"sourcesContent":["import { generateProtectedRcFallbackSrc } from '../../runtime/url/protected-rc-fallback';\n\n/**\n * Called before each asset fetch (scripts, styles, chunks, images) for a remote component.\n * Return a rewritten URL string to redirect the fetch, or undefined to use the original URL.\n *\n * @param remoteSrc - The `src` of the remote component\n * @param url - The asset URL about to be fetched\n */\nexport type ResolveClientUrl = (\n  remoteSrc: string,\n  url: string,\n) => string | undefined;\n\n/**\n * A `ResolveClientUrl` that routes cross-origin remote component asset requests\n * through the host's `/rc-fetch-protected-remote` endpoint. Same-origin URLs pass through unchanged.\n *\n * Use this on Vercel preview deployments where deployment protection would otherwise\n * block direct cross-origin fetches — routing through the host means requests carry\n * the host's auth cookies.\n *\n * Requires `withRemoteComponentsHostProxy` on the host side to handle the proxied requests.\n *\n * @example\n * ```tsx\n * import { routeThroughHostProxy } from 'remote-components/host/proxy/client';\n *\n * <ConsumeRemoteComponent\n *   src=\"https://remote-app.com/components/header\"\n *   resolveClientUrl={routeThroughHostProxy}\n * />\n * ```\n */\nexport const routeThroughHostProxy: ResolveClientUrl = (remoteSrc, url) => {\n  if (typeof location === 'undefined') {\n    return undefined;\n  }\n  const remoteOrigin = new URL(remoteSrc, location.href).origin;\n  if (remoteOrigin === location.origin) {\n    return undefined;\n  }\n  try {\n    const parsed = new URL(url, location.href);\n    if (parsed.origin === remoteOrigin) {\n      return generateProtectedRcFallbackSrc(url);\n    }\n  } catch {\n    // If URL parsing fails, return undefined to use the original\n  }\n  return undefined;\n};\n","export const RC_PROTECTED_REMOTE_FETCH_PATHNAME = '/rc-fetch-protected-remote';\n\nexport const MISSING_SHARED_MODULES_MESSAGE =\n  'Remote Components shared modules not found. Did you forget to wrap your config with `withRemoteComponentsConfig` on both host and 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/utils/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"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAO,IAAM,qCAAqC;;;ACK3C,SAAS,+BAA+B,KAAqB;AAClE,SAAO,GAAG,0CAA0C,mBAAmB,GAAG;AAC5E;;;AF2BO,IAAM,wBAA0C,CAAC,WAAW,QAAQ;AACzE,MAAI,OAAO,aAAa,aAAa;AACnC,WAAO;AAAA,EACT;AACA,QAAM,eAAe,IAAI,IAAI,WAAW,SAAS,IAAI,EAAE;AACvD,MAAI,iBAAiB,SAAS,QAAQ;AACpC,WAAO;AAAA,EACT;AACA,MAAI;AACF,UAAM,SAAS,IAAI,IAAI,KAAK,SAAS,IAAI;AACzC,QAAI,OAAO,WAAW,cAAc;AAClC,aAAO,+BAA+B,GAAG;AAAA,IAC3C;AAAA,EACF,QAAE;AAAA,EAEF;AACA,SAAO;AACT;","names":[]}

package/dist/host/proxy/client.d.ts

@@ -0,0 +1,31 @@
+/**
+ * Called before each asset fetch (scripts, styles, chunks, images) for a remote component.
+ * Return a rewritten URL string to redirect the fetch, or undefined to use the original URL.
+ *
+ * @param remoteSrc - The `src` of the remote component
+ * @param url - The asset URL about to be fetched
+ */
+type ResolveClientUrl = (remoteSrc: string, url: string) => string | undefined;
+/**
+ * A `ResolveClientUrl` that routes cross-origin remote component asset requests
+ * through the host's `/rc-fetch-protected-remote` endpoint. Same-origin URLs pass through unchanged.
+ *
+ * Use this on Vercel preview deployments where deployment protection would otherwise
+ * block direct cross-origin fetches — routing through the host means requests carry
+ * the host's auth cookies.
+ *
+ * Requires `withRemoteComponentsHostProxy` on the host side to handle the proxied requests.
+ *
+ * @example
+ * ```tsx
+ * import { routeThroughHostProxy } from 'remote-components/host/proxy/client';
+ *
+ * <ConsumeRemoteComponent
+ *   src="https://remote-app.com/components/header"
+ *   resolveClientUrl={routeThroughHostProxy}
+ * />
+ * ```
+ */
+declare const routeThroughHostProxy: ResolveClientUrl;
+
+export { ResolveClientUrl, routeThroughHostProxy };

package/dist/host/proxy/client.js

@@ -0,0 +1,30 @@
+// src/utils/constants.ts
+var RC_PROTECTED_REMOTE_FETCH_PATHNAME = "/rc-fetch-protected-remote";
+
+// src/runtime/url/protected-rc-fallback.ts
+function generateProtectedRcFallbackSrc(url) {
+  return `${RC_PROTECTED_REMOTE_FETCH_PATHNAME}?url=${encodeURIComponent(url)}`;
+}
+
+// src/host/proxy/client.ts
+var routeThroughHostProxy = (remoteSrc, url) => {
+  if (typeof location === "undefined") {
+    return void 0;
+  }
+  const remoteOrigin = new URL(remoteSrc, location.href).origin;
+  if (remoteOrigin === location.origin) {
+    return void 0;
+  }
+  try {
+    const parsed = new URL(url, location.href);
+    if (parsed.origin === remoteOrigin) {
+      return generateProtectedRcFallbackSrc(url);
+    }
+  } catch {
+  }
+  return void 0;
+};
+export {
+  routeThroughHostProxy
+};
+//# sourceMappingURL=client.js.map

package/dist/host/proxy/client.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/utils/constants.ts","../../../src/runtime/url/protected-rc-fallback.ts","../../../src/host/proxy/client.ts"],"sourcesContent":["export const RC_PROTECTED_REMOTE_FETCH_PATHNAME = '/rc-fetch-protected-remote';\n\nexport const MISSING_SHARED_MODULES_MESSAGE =\n  'Remote Components shared modules not found. Did you forget to wrap your config with `withRemoteComponentsConfig` on both host and 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/utils/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","import { generateProtectedRcFallbackSrc } from '../../runtime/url/protected-rc-fallback';\n\n/**\n * Called before each asset fetch (scripts, styles, chunks, images) for a remote component.\n * Return a rewritten URL string to redirect the fetch, or undefined to use the original URL.\n *\n * @param remoteSrc - The `src` of the remote component\n * @param url - The asset URL about to be fetched\n */\nexport type ResolveClientUrl = (\n  remoteSrc: string,\n  url: string,\n) => string | undefined;\n\n/**\n * A `ResolveClientUrl` that routes cross-origin remote component asset requests\n * through the host's `/rc-fetch-protected-remote` endpoint. Same-origin URLs pass through unchanged.\n *\n * Use this on Vercel preview deployments where deployment protection would otherwise\n * block direct cross-origin fetches — routing through the host means requests carry\n * the host's auth cookies.\n *\n * Requires `withRemoteComponentsHostProxy` on the host side to handle the proxied requests.\n *\n * @example\n * ```tsx\n * import { routeThroughHostProxy } from 'remote-components/host/proxy/client';\n *\n * <ConsumeRemoteComponent\n *   src=\"https://remote-app.com/components/header\"\n *   resolveClientUrl={routeThroughHostProxy}\n * />\n * ```\n */\nexport const routeThroughHostProxy: ResolveClientUrl = (remoteSrc, url) => {\n  if (typeof location === 'undefined') {\n    return undefined;\n  }\n  const remoteOrigin = new URL(remoteSrc, location.href).origin;\n  if (remoteOrigin === location.origin) {\n    return undefined;\n  }\n  try {\n    const parsed = new URL(url, location.href);\n    if (parsed.origin === remoteOrigin) {\n      return generateProtectedRcFallbackSrc(url);\n    }\n  } catch {\n    // If URL parsing fails, return undefined to use the original\n  }\n  return undefined;\n};\n"],"mappings":";AAAO,IAAM,qCAAqC;;;ACK3C,SAAS,+BAA+B,KAAqB;AAClE,SAAO,GAAG,0CAA0C,mBAAmB,GAAG;AAC5E;;;AC2BO,IAAM,wBAA0C,CAAC,WAAW,QAAQ;AACzE,MAAI,OAAO,aAAa,aAAa;AACnC,WAAO;AAAA,EACT;AACA,QAAM,eAAe,IAAI,IAAI,WAAW,SAAS,IAAI,EAAE;AACvD,MAAI,iBAAiB,SAAS,QAAQ;AACpC,WAAO;AAAA,EACT;AACA,MAAI;AACF,UAAM,SAAS,IAAI,IAAI,KAAK,SAAS,IAAI;AACzC,QAAI,OAAO,WAAW,cAAc;AAClC,aAAO,+BAA+B,GAAG;AAAA,IAC3C;AAAA,EACF,QAAE;AAAA,EAEF;AACA,SAAO;AACT;","names":[]}

package/dist/{shared/host/proxy.cjs → host/proxy/protected-fetch.cjs}

@@ -16,13 +16,13 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var proxy_exports = {};
-__export(proxy_exports, {
+var protected_fetch_exports = {};
+__export(protected_fetch_exports, {
   handleProtectedRemoteFetchRequest: () => handleProtectedRemoteFetchRequest
 });
-module.exports = __toCommonJS(proxy_exports);
-var import_constants = require("#internal/shared/constants");
-var import_fetch_headers = require("#internal/shared/ssr/fetch-headers");
+module.exports = __toCommonJS(protected_fetch_exports);
+var import_fetch_headers = require("#internal/host/server/fetch-headers");
+var import_constants = require("#internal/utils/constants");
 async function handleProtectedRemoteFetchRequest(requestUrl, options) {
   const url = new URL(requestUrl, "https://fallback.com");
   if (url.pathname !== import_constants.RC_PROTECTED_REMOTE_FETCH_PATHNAME) {
@@ -105,4 +105,4 @@ async function handleProtectedRemoteFetchRequest(requestUrl, options) {
 0 && (module.exports = {
   handleProtectedRemoteFetchRequest
 });
-//# sourceMappingURL=proxy.cjs.map
+//# sourceMappingURL=protected-fetch.cjs.map

package/dist/host/proxy/protected-fetch.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/host/proxy/protected-fetch.ts"],"sourcesContent":["/**\n * Proxy utilities for host applications that consume remote components.\n *\n * Hosts do NOT handle CORS - that's the remote's responsibility.\n * Hosts only handle protected fetch proxying.\n */\n\nimport { remoteFetchHeaders } from '#internal/host/server/fetch-headers';\nimport {\n  CORS_DOCS_URL,\n  RC_PROTECTED_REMOTE_FETCH_PATHNAME,\n} from '#internal/utils/constants';\n\nexport interface HostProxyOptions {\n  /**\n   * List of allowed URL patterns (as regex strings) that can be proxied.\n   * These patterns are combined with REMOTE_COMPONENTS_ALLOWED_PROXY_URLS env var if both are set.\n   * If neither is set, all URLs are blocked.\n   */\n  allowedProxyUrls?: string[];\n}\n\n/**\n * Handles protected remote component fetch requests by proxying them with\n * authentication headers. This is needed for accessing Vercel-protected remote\n * component deployments from client-side code.\n *\n * @param requestUrl - The full request URL\n * @param options - Host proxy configuration options\n * @returns Response object if this is a protected fetch request, or null if not\n */\nexport async function handleProtectedRemoteFetchRequest(\n  requestUrl: string,\n  options?: HostProxyOptions,\n): Promise<Response | null> {\n  const url = new URL(requestUrl, 'https://fallback.com');\n\n  if (url.pathname !== RC_PROTECTED_REMOTE_FETCH_PATHNAME) {\n    return null;\n  }\n\n  const targetUrl = url.searchParams.get('url');\n  if (!targetUrl) {\n    return new Response('Bad request, missing url query param', {\n      status: 400,\n    });\n  }\n\n  // Only allow http/https URLs to prevent SSRF via file://, data:, etc.\n  let parsedTargetUrl: URL;\n  try {\n    parsedTargetUrl = new URL(targetUrl);\n  } catch {\n    return new Response('Bad request: invalid URL', { status: 400 });\n  }\n\n  if (\n    parsedTargetUrl.protocol !== 'https:' &&\n    parsedTargetUrl.protocol !== 'http:'\n  ) {\n    return new Response('Bad request: only http/https URLs are supported', {\n      status: 400,\n    });\n  }\n\n  const envPatterns = process.env.REMOTE_COMPONENTS_ALLOWED_PROXY_URLS?.split(\n    ',',\n  ).map((p) => p.trim());\n  const optionPatterns = options?.allowedProxyUrls;\n\n  // Combine both sources if both are specified\n  const allowedPatterns = [...(optionPatterns || []), ...(envPatterns || [])];\n\n  if (allowedPatterns.length === 0) {\n    return new Response(\n      `Forbidden: no allowedProxyUrls or REMOTE_COMPONENTS_ALLOWED_PROXY_URLS configured. ` +\n        `See: ${CORS_DOCS_URL}`,\n      {\n        status: 403,\n      },\n    );\n  }\n\n  // Validate the target URL against allowed patterns to prevent SSRF.\n  // matchTarget is origin + pathname (no query string or fragment).\n  const matchTarget = parsedTargetUrl.origin + parsedTargetUrl.pathname;\n  const isUrlAllowed = allowedPatterns.some((pattern) => {\n    try {\n      const anchored = pattern.startsWith('^') ? pattern : `^${pattern}`;\n      const bounded = anchored.endsWith('$') ? anchored : `${anchored}(/|$)`;\n      const regex = new RegExp(bounded);\n      return regex.test(matchTarget);\n    } catch (error) {\n      console.error(\n        `Invalid regex pattern in allowedProxyUrls: ${pattern}`,\n        error,\n      );\n      return false;\n    }\n  });\n\n  if (!isUrlAllowed) {\n    return new Response(\n      `Forbidden: origin \"${parsedTargetUrl.origin}\" does not match any allowedProxyUrls. ` +\n        `Add a matching pattern to REMOTE_COMPONENTS_ALLOWED_PROXY_URLS or the allowedProxyUrls option. ` +\n        `See: ${CORS_DOCS_URL}`,\n      {\n        status: 403,\n      },\n    );\n  }\n\n  // Fetch the remote resource\n  const response = await fetch(targetUrl, { headers: remoteFetchHeaders() });\n\n  // Only forward safe headers — no set-cookie, CORS, or encoding headers.\n  // content-length is excluded because fetch() auto-decompresses the upstream\n  // response, making the original content-length incorrect for the decoded body.\n  const SAFE_HEADERS = [\n    'content-type',\n    'cache-control',\n    'etag',\n    'last-modified',\n  ] as const;\n  const headers = new Headers();\n  for (const name of SAFE_HEADERS) {\n    const value = response.headers.get(name);\n    if (value) {\n      headers.set(name, value);\n    }\n  }\n\n  return new Response(response.body, {\n    status: response.status,\n    statusText: response.statusText,\n    headers,\n  });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA,2BAAmC;AACnC,uBAGO;AAoBP,eAAsB,kCACpB,YACA,SAC0B;AAC1B,QAAM,MAAM,IAAI,IAAI,YAAY,sBAAsB;AAEtD,MAAI,IAAI,aAAa,qDAAoC;AACvD,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,IAAI,aAAa,IAAI,KAAK;AAC5C,MAAI,CAAC,WAAW;AACd,WAAO,IAAI,SAAS,wCAAwC;AAAA,MAC1D,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAGA,MAAI;AACJ,MAAI;AACF,sBAAkB,IAAI,IAAI,SAAS;AAAA,EACrC,QAAE;AACA,WAAO,IAAI,SAAS,4BAA4B,EAAE,QAAQ,IAAI,CAAC;AAAA,EACjE;AAEA,MACE,gBAAgB,aAAa,YAC7B,gBAAgB,aAAa,SAC7B;AACA,WAAO,IAAI,SAAS,mDAAmD;AAAA,MACrE,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAEA,QAAM,cAAc,QAAQ,IAAI,sCAAsC;AAAA,IACpE;AAAA,EACF,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC;AACrB,QAAM,iBAAiB,SAAS;AAGhC,QAAM,kBAAkB,CAAC,GAAI,kBAAkB,CAAC,GAAI,GAAI,eAAe,CAAC,CAAE;AAE1E,MAAI,gBAAgB,WAAW,GAAG;AAChC,WAAO,IAAI;AAAA,MACT,2FACU;AAAA,MACV;AAAA,QACE,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAIA,QAAM,cAAc,gBAAgB,SAAS,gBAAgB;AAC7D,QAAM,eAAe,gBAAgB,KAAK,CAAC,YAAY;AACrD,QAAI;AACF,YAAM,WAAW,QAAQ,WAAW,GAAG,IAAI,UAAU,IAAI;AACzD,YAAM,UAAU,SAAS,SAAS,GAAG,IAAI,WAAW,GAAG;AACvD,YAAM,QAAQ,IAAI,OAAO,OAAO;AAChC,aAAO,MAAM,KAAK,WAAW;AAAA,IAC/B,SAAS,OAAP;AACA,cAAQ;AAAA,QACN,8CAA8C;AAAA,QAC9C;AAAA,MACF;AACA,aAAO;AAAA,IACT;AAAA,EACF,CAAC;AAED,MAAI,CAAC,cAAc;AACjB,WAAO,IAAI;AAAA,MACT,sBAAsB,gBAAgB,oJAE5B;AAAA,MACV;AAAA,QACE,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAGA,QAAM,WAAW,MAAM,MAAM,WAAW,EAAE,aAAS,yCAAmB,EAAE,CAAC;AAKzE,QAAM,eAAe;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACA,QAAM,UAAU,IAAI,QAAQ;AAC5B,aAAW,QAAQ,cAAc;AAC/B,UAAM,QAAQ,SAAS,QAAQ,IAAI,IAAI;AACvC,QAAI,OAAO;AACT,cAAQ,IAAI,MAAM,KAAK;AAAA,IACzB;AAAA,EACF;AAEA,SAAO,IAAI,SAAS,SAAS,MAAM;AAAA,IACjC,QAAQ,SAAS;AAAA,IACjB,YAAY,SAAS;AAAA,IACrB;AAAA,EACF,CAAC;AACH;","names":[]}

package/dist/{shared/host/proxy.js → host/proxy/protected-fetch.js}

@@ -1,8 +1,8 @@
+import { remoteFetchHeaders } from "#internal/host/server/fetch-headers";
 import {
   CORS_DOCS_URL,
   RC_PROTECTED_REMOTE_FETCH_PATHNAME
-} from "#internal/shared/constants";
-import { remoteFetchHeaders } from "#internal/shared/ssr/fetch-headers";
+} from "#internal/utils/constants";
 async function handleProtectedRemoteFetchRequest(requestUrl, options) {
   const url = new URL(requestUrl, "https://fallback.com");
   if (url.pathname !== RC_PROTECTED_REMOTE_FETCH_PATHNAME) {
@@ -84,4 +84,4 @@ async function handleProtectedRemoteFetchRequest(requestUrl, options) {
 export {
   handleProtectedRemoteFetchRequest
 };
-//# sourceMappingURL=proxy.js.map
+//# sourceMappingURL=protected-fetch.js.map

package/dist/host/proxy/protected-fetch.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/host/proxy/protected-fetch.ts"],"sourcesContent":["/**\n * Proxy utilities for host applications that consume remote components.\n *\n * Hosts do NOT handle CORS - that's the remote's responsibility.\n * Hosts only handle protected fetch proxying.\n */\n\nimport { remoteFetchHeaders } from '#internal/host/server/fetch-headers';\nimport {\n  CORS_DOCS_URL,\n  RC_PROTECTED_REMOTE_FETCH_PATHNAME,\n} from '#internal/utils/constants';\n\nexport interface HostProxyOptions {\n  /**\n   * List of allowed URL patterns (as regex strings) that can be proxied.\n   * These patterns are combined with REMOTE_COMPONENTS_ALLOWED_PROXY_URLS env var if both are set.\n   * If neither is set, all URLs are blocked.\n   */\n  allowedProxyUrls?: string[];\n}\n\n/**\n * Handles protected remote component fetch requests by proxying them with\n * authentication headers. This is needed for accessing Vercel-protected remote\n * component deployments from client-side code.\n *\n * @param requestUrl - The full request URL\n * @param options - Host proxy configuration options\n * @returns Response object if this is a protected fetch request, or null if not\n */\nexport async function handleProtectedRemoteFetchRequest(\n  requestUrl: string,\n  options?: HostProxyOptions,\n): Promise<Response | null> {\n  const url = new URL(requestUrl, 'https://fallback.com');\n\n  if (url.pathname !== RC_PROTECTED_REMOTE_FETCH_PATHNAME) {\n    return null;\n  }\n\n  const targetUrl = url.searchParams.get('url');\n  if (!targetUrl) {\n    return new Response('Bad request, missing url query param', {\n      status: 400,\n    });\n  }\n\n  // Only allow http/https URLs to prevent SSRF via file://, data:, etc.\n  let parsedTargetUrl: URL;\n  try {\n    parsedTargetUrl = new URL(targetUrl);\n  } catch {\n    return new Response('Bad request: invalid URL', { status: 400 });\n  }\n\n  if (\n    parsedTargetUrl.protocol !== 'https:' &&\n    parsedTargetUrl.protocol !== 'http:'\n  ) {\n    return new Response('Bad request: only http/https URLs are supported', {\n      status: 400,\n    });\n  }\n\n  const envPatterns = process.env.REMOTE_COMPONENTS_ALLOWED_PROXY_URLS?.split(\n    ',',\n  ).map((p) => p.trim());\n  const optionPatterns = options?.allowedProxyUrls;\n\n  // Combine both sources if both are specified\n  const allowedPatterns = [...(optionPatterns || []), ...(envPatterns || [])];\n\n  if (allowedPatterns.length === 0) {\n    return new Response(\n      `Forbidden: no allowedProxyUrls or REMOTE_COMPONENTS_ALLOWED_PROXY_URLS configured. ` +\n        `See: ${CORS_DOCS_URL}`,\n      {\n        status: 403,\n      },\n    );\n  }\n\n  // Validate the target URL against allowed patterns to prevent SSRF.\n  // matchTarget is origin + pathname (no query string or fragment).\n  const matchTarget = parsedTargetUrl.origin + parsedTargetUrl.pathname;\n  const isUrlAllowed = allowedPatterns.some((pattern) => {\n    try {\n      const anchored = pattern.startsWith('^') ? pattern : `^${pattern}`;\n      const bounded = anchored.endsWith('$') ? anchored : `${anchored}(/|$)`;\n      const regex = new RegExp(bounded);\n      return regex.test(matchTarget);\n    } catch (error) {\n      console.error(\n        `Invalid regex pattern in allowedProxyUrls: ${pattern}`,\n        error,\n      );\n      return false;\n    }\n  });\n\n  if (!isUrlAllowed) {\n    return new Response(\n      `Forbidden: origin \"${parsedTargetUrl.origin}\" does not match any allowedProxyUrls. ` +\n        `Add a matching pattern to REMOTE_COMPONENTS_ALLOWED_PROXY_URLS or the allowedProxyUrls option. ` +\n        `See: ${CORS_DOCS_URL}`,\n      {\n        status: 403,\n      },\n    );\n  }\n\n  // Fetch the remote resource\n  const response = await fetch(targetUrl, { headers: remoteFetchHeaders() });\n\n  // Only forward safe headers — no set-cookie, CORS, or encoding headers.\n  // content-length is excluded because fetch() auto-decompresses the upstream\n  // response, making the original content-length incorrect for the decoded body.\n  const SAFE_HEADERS = [\n    'content-type',\n    'cache-control',\n    'etag',\n    'last-modified',\n  ] as const;\n  const headers = new Headers();\n  for (const name of SAFE_HEADERS) {\n    const value = response.headers.get(name);\n    if (value) {\n      headers.set(name, value);\n    }\n  }\n\n  return new Response(response.body, {\n    status: response.status,\n    statusText: response.statusText,\n    headers,\n  });\n}\n"],"mappings":"AAOA,SAAS,0BAA0B;AACnC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAoBP,eAAsB,kCACpB,YACA,SAC0B;AAC1B,QAAM,MAAM,IAAI,IAAI,YAAY,sBAAsB;AAEtD,MAAI,IAAI,aAAa,oCAAoC;AACvD,WAAO;AAAA,EACT;AAEA,QAAM,YAAY,IAAI,aAAa,IAAI,KAAK;AAC5C,MAAI,CAAC,WAAW;AACd,WAAO,IAAI,SAAS,wCAAwC;AAAA,MAC1D,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAGA,MAAI;AACJ,MAAI;AACF,sBAAkB,IAAI,IAAI,SAAS;AAAA,EACrC,QAAE;AACA,WAAO,IAAI,SAAS,4BAA4B,EAAE,QAAQ,IAAI,CAAC;AAAA,EACjE;AAEA,MACE,gBAAgB,aAAa,YAC7B,gBAAgB,aAAa,SAC7B;AACA,WAAO,IAAI,SAAS,mDAAmD;AAAA,MACrE,QAAQ;AAAA,IACV,CAAC;AAAA,EACH;AAEA,QAAM,cAAc,QAAQ,IAAI,sCAAsC;AAAA,IACpE;AAAA,EACF,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,CAAC;AACrB,QAAM,iBAAiB,SAAS;AAGhC,QAAM,kBAAkB,CAAC,GAAI,kBAAkB,CAAC,GAAI,GAAI,eAAe,CAAC,CAAE;AAE1E,MAAI,gBAAgB,WAAW,GAAG;AAChC,WAAO,IAAI;AAAA,MACT,2FACU;AAAA,MACV;AAAA,QACE,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAIA,QAAM,cAAc,gBAAgB,SAAS,gBAAgB;AAC7D,QAAM,eAAe,gBAAgB,KAAK,CAAC,YAAY;AACrD,QAAI;AACF,YAAM,WAAW,QAAQ,WAAW,GAAG,IAAI,UAAU,IAAI;AACzD,YAAM,UAAU,SAAS,SAAS,GAAG,IAAI,WAAW,GAAG;AACvD,YAAM,QAAQ,IAAI,OAAO,OAAO;AAChC,aAAO,MAAM,KAAK,WAAW;AAAA,IAC/B,SAAS,OAAP;AACA,cAAQ;AAAA,QACN,8CAA8C;AAAA,QAC9C;AAAA,MACF;AACA,aAAO;AAAA,IACT;AAAA,EACF,CAAC;AAED,MAAI,CAAC,cAAc;AACjB,WAAO,IAAI;AAAA,MACT,sBAAsB,gBAAgB,oJAE5B;AAAA,MACV;AAAA,QACE,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAGA,QAAM,WAAW,MAAM,MAAM,WAAW,EAAE,SAAS,mBAAmB,EAAE,CAAC;AAKzE,QAAM,eAAe;AAAA,IACnB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACA,QAAM,UAAU,IAAI,QAAQ;AAC5B,aAAW,QAAQ,cAAc;AAC/B,UAAM,QAAQ,SAAS,QAAQ,IAAI,IAAI;AACvC,QAAI,OAAO;AACT,cAAQ,IAAI,MAAM,KAAK;AAAA,IACzB;AAAA,EACF;AAEA,SAAO,IAAI,SAAS,SAAS,MAAM;AAAA,IACjC,QAAQ,SAAS;AAAA,IACjB,YAAY,SAAS;AAAA,IACrB;AAAA,EACF,CAAC;AACH;","names":[]}

package/dist/{next → host}/proxy.cjs

@@ -17,98 +17,15 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// src/next/proxy/index.ts
+// src/host/proxy/index.ts
 var proxy_exports = {};
 __export(proxy_exports, {
-  withRemoteComponents: () => withRemoteComponents,
-  withRemoteComponentsHost: () => withRemoteComponentsHost
+  withConsumeRemoteComponentsProxy: () => withConsumeRemoteComponentsProxy
 });
 module.exports = __toCommonJS(proxy_exports);
-
-// src/next/proxy/withRemoteComponents.ts
 var import_server = require("next/server");
 
-// src/shared/remote/proxy.ts
-function getHeader(headers, name) {
-  if (headers instanceof Headers) {
-    return headers.get(name) ?? void 0;
-  }
-  const value = headers[name];
-  return Array.isArray(value) ? value[0] : value;
-}
-function getCorsHeaders(options, requestHeaders) {
-  if (options === false) {
-    return {};
-  }
-  const originHeader = getHeader(requestHeaders, "origin");
-  const refererHeader = getHeader(requestHeaders, "referer");
-  const origin = originHeader ?? (refererHeader ? new URL(refererHeader).origin : "*");
-  const ALLOWED_ORIGINS = (process.env.REMOTE_COMPONENTS_ALLOWED_ORIGINS || (Array.isArray(options?.origin) ? options.origin.join(",") : options?.origin) || "*").split(",").map((allowedOrigin) => allowedOrigin.trim());
-  const isAllowed = ALLOWED_ORIGINS.includes("*") || ALLOWED_ORIGINS.includes(origin);
-  const allowedHeaders = process.env.REMOTE_COMPONENTS_ALLOW_HEADERS || (Array.isArray(options?.headers) ? options.headers.map((h) => h.trim()).join(",") : options?.headers) || getHeader(requestHeaders, "access-control-request-headers");
-  const CORS_HEADERS = isAllowed ? {
-    "Access-Control-Allow-Origin": origin,
-    "Access-Control-Allow-Methods": process.env.REMOTE_COMPONENTS_ALLOW_METHODS || (Array.isArray(options?.method) ? options.method.map((m) => m.trim()).join(",") : options?.method) || "GET,HEAD,POST,PUT,PATCH,DELETE,OPTIONS",
-    ...allowedHeaders ? { "Access-Control-Allow-Headers": allowedHeaders } : {},
-    ...process.env.REMOTE_COMPONENTS_ALLOW_CREDENTIALS || options?.credentials ? {
-      "Access-Control-Allow-Credentials": process.env.REMOTE_COMPONENTS_ALLOW_CREDENTIALS || "true"
-    } : {},
-    "Access-Control-Max-Age": options?.maxAge || "600",
-    Vary: "Origin"
-  } : {};
-  return CORS_HEADERS;
-}
-function getSecurityHeaders() {
-  return {
-    "Content-Security-Policy": "frame-ancestors 'none'",
-    "X-Frame-Options": "DENY"
-  };
-}
-function handleCorsPreflightRequest(method, headers, options) {
-  if (method !== "OPTIONS" || options === false) {
-    return null;
-  }
-  const corsHeaders = getCorsHeaders(options, headers);
-  return new Response(void 0, {
-    status: 200,
-    headers: { ...corsHeaders, ...getSecurityHeaders() }
-  });
-}
-
-// src/next/proxy/withRemoteComponents.ts
-function withRemoteComponents(proxy, options) {
-  return async (request) => {
-    const preflightResponse = handleCorsPreflightRequest(
-      request.method,
-      request.headers,
-      options?.cors
-    );
-    if (preflightResponse) {
-      return preflightResponse;
-    }
-    const response = typeof proxy === "function" ? await proxy(request) : import_server.NextResponse.next();
-    if (options?.cors !== false) {
-      const corsHeaders = getCorsHeaders(options?.cors, request.headers);
-      Object.entries(corsHeaders).forEach(
-        ([k, v]) => response.headers.set(k, v)
-      );
-    }
-    const securityHeaders = getSecurityHeaders();
-    Object.entries(securityHeaders).forEach(
-      ([k, v]) => response.headers.set(k, v)
-    );
-    return response;
-  };
-}
-
-// src/next/proxy/withRemoteComponentsHost.ts
-var import_server2 = require("next/server");
-
-// src/shared/constants.ts
-var RC_PROTECTED_REMOTE_FETCH_PATHNAME = "/rc-fetch-protected-remote";
-var CORS_DOCS_URL = "https://vercel.com/docs/remote-components/concepts/cors-external-urls#accessing-cross-site-protected-remote-components";
-
-// src/shared/ssr/fetch-headers.ts
+// src/host/server/fetch-headers.ts
 function remoteFetchHeaders() {
   return {
     /**
@@ -124,7 +41,11 @@ function remoteFetchHeaders() {
   };
 }
 
-// src/shared/host/proxy.ts
+// src/utils/constants.ts
+var RC_PROTECTED_REMOTE_FETCH_PATHNAME = "/rc-fetch-protected-remote";
+var CORS_DOCS_URL = "https://vercel.com/docs/remote-components/concepts/cors-external-urls#accessing-cross-site-protected-remote-components";
+
+// src/host/proxy/protected-fetch.ts
 async function handleProtectedRemoteFetchRequest(requestUrl, options) {
   const url = new URL(requestUrl, "https://fallback.com");
   if (url.pathname !== RC_PROTECTED_REMOTE_FETCH_PATHNAME) {
@@ -204,8 +125,8 @@ async function handleProtectedRemoteFetchRequest(requestUrl, options) {
   });
 }
 
-// src/next/proxy/withRemoteComponentsHost.ts
-function withRemoteComponentsHost(proxy, options) {
+// src/host/proxy/index.ts
+function withConsumeRemoteComponentsProxy(proxy, options) {
   return async (request) => {
     const protectedFetchResponse = await handleProtectedRemoteFetchRequest(
       request.url,
@@ -214,12 +135,11 @@ function withRemoteComponentsHost(proxy, options) {
     if (protectedFetchResponse) {
       return protectedFetchResponse;
     }
-    return typeof proxy === "function" ? await proxy(request) : import_server2.NextResponse.next();
+    return typeof proxy === "function" ? await proxy(request) : import_server.NextResponse.next();
   };
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  withRemoteComponents,
-  withRemoteComponentsHost
+  withConsumeRemoteComponentsProxy
 });
 //# sourceMappingURL=proxy.cjs.map

package/dist/host/proxy.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/host/proxy/index.ts","../../src/host/server/fetch-headers.ts","../../src/utils/constants.ts","../../src/host/proxy/protected-fetch.ts"],"sourcesContent":["import { type NextRequest, NextResponse } from 'next/server';\nimport {\n  type HostProxyOptions,\n  handleProtectedRemoteFetchRequest,\n} from './protected-fetch';\n\n/**\n * Wraps a Next.js proxy handler to add remote component support:\n * handles cross-origin asset fetches via the `/rc-fetch-protected-remote` endpoint,\n * then falls through to your proxy handler (or `NextResponse.next()`) for all other requests.\n *\n * Add `/rc-fetch-protected-remote` to your proxy/middleware matchers to activate it.\n *\n * @param proxy - Optional Next.js proxy handler to run for non-remote-component requests\n * @param options - Configuration options for SSRF protection\n */\nexport function withConsumeRemoteComponentsProxy(\n  proxy?: (request: NextRequest) => NextResponse | Promise<NextResponse>,\n  options?: HostProxyOptions,\n) {\n  return async (request: NextRequest) => {\n    // Check if this is a protected remote fetch request\n    const protectedFetchResponse = await handleProtectedRemoteFetchRequest(\n      request.url,\n      options,\n    );\n\n    if (protectedFetchResponse) {\n      return protectedFetchResponse;\n    }\n\n    return typeof proxy === 'function'\n      ? await proxy(request)\n      : NextResponse.next();\n  };\n}\n\nexport type { HostProxyOptions } from './protected-fetch';\n","/**\n * The headers to use when fetching the remote component.\n */\nexport function remoteFetchHeaders() {\n  return {\n    /**\n     * Authenticates deployment protection for the remote. Needed for SSR and SSG clients.\n     * If the remote component uses vercel deployment protection, ensure the host and remote vercel\n     * projects share a common automation bypass secret, and the shared secret is used as the\n     * VERCEL_AUTOMATION_BYPASS_SECRET env var in the host project.\n     */\n    ...(typeof process === 'object' &&\n    typeof process.env === 'object' &&\n    typeof process.env.VERCEL_AUTOMATION_BYPASS_SECRET === 'string'\n      ? {\n          'x-vercel-protection-bypass':\n            process.env.VERCEL_AUTOMATION_BYPASS_SECRET,\n        }\n      : {}),\n    Accept: 'text/html',\n  };\n}\n","export const RC_PROTECTED_REMOTE_FETCH_PATHNAME = '/rc-fetch-protected-remote';\n\nexport const MISSING_SHARED_MODULES_MESSAGE =\n  'Remote Components shared modules not found. Did you forget to wrap your config with `withRemoteComponentsConfig` on both host and 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","/**\n * Proxy utilities for host applications that consume remote components.\n *\n * Hosts do NOT handle CORS - that's the remote's responsibility.\n * Hosts only handle protected fetch proxying.\n */\n\nimport { remoteFetchHeaders } from '#internal/host/server/fetch-headers';\nimport {\n  CORS_DOCS_URL,\n  RC_PROTECTED_REMOTE_FETCH_PATHNAME,\n} from '#internal/utils/constants';\n\nexport interface HostProxyOptions {\n  /**\n   * List of allowed URL patterns (as regex strings) that can be proxied.\n   * These patterns are combined with REMOTE_COMPONENTS_ALLOWED_PROXY_URLS env var if both are set.\n   * If neither is set, all URLs are blocked.\n   */\n  allowedProxyUrls?: string[];\n}\n\n/**\n * Handles protected remote component fetch requests by proxying them with\n * authentication headers. This is needed for accessing Vercel-protected remote\n * component deployments from client-side code.\n *\n * @param requestUrl - The full request URL\n * @param options - Host proxy configuration options\n * @returns Response object if this is a protected fetch request, or null if not\n */\nexport async function handleProtectedRemoteFetchRequest(\n  requestUrl: string,\n  options?: HostProxyOptions,\n): Promise<Response | null> {\n  const url = new URL(requestUrl, 'https://fallback.com');\n\n  if (url.pathname !== RC_PROTECTED_REMOTE_FETCH_PATHNAME) {\n    return null;\n  }\n\n  const targetUrl = url.searchParams.get('url');\n  if (!targetUrl) {\n    return new Response('Bad request, missing url query param', {\n      status: 400,\n    });\n  }\n\n  // Only allow http/https URLs to prevent SSRF via file://, data:, etc.\n  let parsedTargetUrl: URL;\n  try {\n    parsedTargetUrl = new URL(targetUrl);\n  } catch {\n    return new Response('Bad request: invalid URL', { status: 400 });\n  }\n\n  if (\n    parsedTargetUrl.protocol !== 'https:' &&\n    parsedTargetUrl.protocol !== 'http:'\n  ) {\n    return new Response('Bad request: only http/https URLs are supported', {\n      status: 400,\n    });\n  }\n\n  const envPatterns = process.env.REMOTE_COMPONENTS_ALLOWED_PROXY_URLS?.split(\n    ',',\n  ).map((p) => p.trim());\n  const optionPatterns = options?.allowedProxyUrls;\n\n  // Combine both sources if both are specified\n  const allowedPatterns = [...(optionPatterns || []), ...(envPatterns || [])];\n\n  if (allowedPatterns.length === 0) {\n    return new Response(\n      `Forbidden: no allowedProxyUrls or REMOTE_COMPONENTS_ALLOWED_PROXY_URLS configured. ` +\n        `See: ${CORS_DOCS_URL}`,\n      {\n        status: 403,\n      },\n    );\n  }\n\n  // Validate the target URL against allowed patterns to prevent SSRF.\n  // matchTarget is origin + pathname (no query string or fragment).\n  const matchTarget = parsedTargetUrl.origin + parsedTargetUrl.pathname;\n  const isUrlAllowed = allowedPatterns.some((pattern) => {\n    try {\n      const anchored = pattern.startsWith('^') ? pattern : `^${pattern}`;\n      const bounded = anchored.endsWith('$') ? anchored : `${anchored}(/|$)`;\n      const regex = new RegExp(bounded);\n      return regex.test(matchTarget);\n    } catch (error) {\n      console.error(\n        `Invalid regex pattern in allowedProxyUrls: ${pattern}`,\n        error,\n      );\n      return false;\n    }\n  });\n\n  if (!isUrlAllowed) {\n    return new Response(\n      `Forbidden: origin \"${parsedTargetUrl.origin}\" does not match any allowedProxyUrls. ` +\n        `Add a matching pattern to REMOTE_COMPONENTS_ALLOWED_PROXY_URLS or the allowedProxyUrls option. ` +\n        `See: ${CORS_DOCS_URL}`,\n      {\n        status: 403,\n      },\n    );\n  }\n\n  // Fetch the remote resource\n  const response = await fetch(targetUrl, { headers: remoteFetchHeaders() });\n\n  // Only forward safe headers — no set-cookie, CORS, or encoding headers.\n  // content-length is excluded because fetch() auto-decompresses the upstream\n  // response, making the original content-length incorrect for the decoded body.\n  const SAFE_HEADERS = [\n    'content-type',\n    'cache-control',\n    'etag',\n    'last-modified',\n  ] as const;\n  const headers = new Headers();\n  for (const name of SAFE_HEADERS) {\n    const value = response.headers.get(name);\n    if (value) {\n      headers.set(name, value);\n    }\n  }\n\n  return new Response(response.body, {\n    status: response.status,\n    statusText: response.statusText,\n    headers,\n  });\n}\n"],"mappings":"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","names":[]}

package/dist/host/proxy.d.ts

@@ -0,0 +1,30 @@
+import { NextRequest, NextResponse } from 'next/server';
+
+/**
+ * Proxy utilities for host applications that consume remote components.
+ *
+ * Hosts do NOT handle CORS - that's the remote's responsibility.
+ * Hosts only handle protected fetch proxying.
+ */
+interface HostProxyOptions {
+    /**
+     * List of allowed URL patterns (as regex strings) that can be proxied.
+     * These patterns are combined with REMOTE_COMPONENTS_ALLOWED_PROXY_URLS env var if both are set.
+     * If neither is set, all URLs are blocked.
+     */
+    allowedProxyUrls?: string[];
+}
+
+/**
+ * Wraps a Next.js proxy handler to add remote component support:
+ * handles cross-origin asset fetches via the `/rc-fetch-protected-remote` endpoint,
+ * then falls through to your proxy handler (or `NextResponse.next()`) for all other requests.
+ *
+ * Add `/rc-fetch-protected-remote` to your proxy/middleware matchers to activate it.
+ *
+ * @param proxy - Optional Next.js proxy handler to run for non-remote-component requests
+ * @param options - Configuration options for SSRF protection
+ */
+declare function withConsumeRemoteComponentsProxy(proxy?: (request: NextRequest) => NextResponse | Promise<NextResponse>, options?: HostProxyOptions): (request: NextRequest) => Promise<Response>;
+
+export { HostProxyOptions, withConsumeRemoteComponentsProxy };