remote-components 0.1.0 → 0.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "remote-components",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "private": false,
   "description": "Compose remote components at runtime between microfrontends applications.",
   "keywords": [
@@ -29,183 +29,152 @@
     }
   },
   "exports": {
-    "./html/host": {
-      "import": "./dist/html/host.js",
-      "require": "./dist/html/host.cjs",
-      "default": "./dist/html/host.js"
-    },
-    "./html/remote": {
-      "import": "./dist/html/remote.js",
-      "require": "./dist/html/remote.cjs",
-      "default": "./dist/html/remote.js"
-    },
-    "./next/config": {
-      "import": "./dist/next/config.js",
-      "require": "./dist/next/config.cjs",
-      "default": "./dist/next/config.js"
-    },
-    "./next/middleware": {
-      "import": "./dist/next/proxy.js",
-      "require": "./dist/next/proxy.cjs",
-      "default": "./dist/next/proxy.js"
-    },
-    "./next/proxy": {
-      "import": "./dist/next/proxy.js",
-      "require": "./dist/next/proxy.cjs",
-      "default": "./dist/next/proxy.js"
-    },
-    "./next/host": {
-      "import": "./dist/next/host/app-router-server.js",
-      "require": "./dist/next/host/app-router-server.cjs",
-      "default": "./dist/next/host/app-router-server.js"
-    },
-    "./next/host/client": {
-      "import": "./dist/next/host/client/index.js",
-      "require": "./dist/next/host/client/index.cjs",
-      "default": "./dist/next/host/client/index.js"
-    },
-    "./next/host/pages-router": {
-      "import": "./dist/next/host/pages-router-server.js",
-      "require": "./dist/next/host/pages-router-server.cjs",
-      "default": "./dist/next/host/pages-router-server.js"
-    },
-    "./next/host/pages-router/client": {
-      "import": "./dist/next/host/pages-router-client.js",
-      "require": "./dist/next/host/pages-router-client.cjs",
-      "default": "./dist/next/host/pages-router-client.js"
-    },
-    "./next/remote": {
-      "import": "./dist/next/remote/server.js",
-      "require": "./dist/next/remote/server.cjs",
-      "default": "./dist/next/remote/server.js"
-    },
-    "./next/remote/pages-router": {
-      "import": "./dist/next/remote/pages-router.js",
-      "require": "./dist/next/remote/pages-router.cjs",
-      "default": "./dist/next/remote/pages-router.js"
-    },
-    "./next": {
-      "react-server": {
-        "import": "./dist/next/index.js",
-        "require": "./dist/next/index.cjs",
-        "default": "./dist/next/index.js"
-      },
-      "default": {
-        "import": "./dist/next/host/client/index.js",
-        "require": "./dist/next/host/client/index.cjs",
-        "default": "./dist/next/host/client/index.js"
-      }
-    },
-    "./react": {
-      "import": "./dist/react/index.js",
-      "require": "./dist/react/index.cjs",
-      "default": "./dist/react/index.js"
-    },
-    "./ssr": {
-      "import": "./dist/internal/shared/ssr/fetch-remote-component.js",
-      "require": "./dist/internal/shared/ssr/fetch-remote-component.cjs",
-      "default": "./dist/internal/shared/ssr/fetch-remote-component.js"
-    },
-    "./shared/remote/app": {
-      "import": "./dist/shared/remote/app.js",
-      "require": "./dist/shared/remote/app.cjs",
-      "default": "./dist/shared/remote/app.js"
-    },
-    "./shared/remote/pages": {
-      "import": "./dist/shared/remote/pages.js",
-      "require": "./dist/shared/remote/pages.cjs",
-      "default": "./dist/shared/remote/pages.js"
-    },
-    "./shared/remote/wrapper": {
-      "import": "./dist/shared/remote/wrapper.js",
-      "require": "./dist/shared/remote/wrapper.cjs",
-      "default": "./dist/shared/remote/wrapper.js"
-    },
-    "./shared/host/app": {
-      "import": "./dist/shared/host/app.js",
-      "require": "./dist/shared/host/app.cjs",
-      "default": "./dist/shared/host/app.js"
-    },
-    "./shared/host/pages": {
-      "import": "./dist/shared/host/pages.js",
-      "require": "./dist/shared/host/pages.cjs",
-      "default": "./dist/shared/host/pages.js"
-    },
-    "./shared/host/proxy": {
-      "import": "./dist/shared/host/proxy.js",
-      "require": "./dist/shared/host/proxy.cjs",
-      "default": "./dist/shared/host/proxy.js"
-    },
-    "./webpack": {
-      "import": "./dist/webpack.js",
-      "require": "./dist/webpack.cjs",
-      "default": "./dist/webpack.js"
+    "./host/nextjs/app": {
+      "import": "./dist/host/nextjs/app.js",
+      "require": "./dist/host/nextjs/app.cjs",
+      "default": "./dist/host/nextjs/app.js"
+    },
+    "./host/nextjs/app/client-only": {
+      "import": "./dist/host/nextjs/app/client-only.js",
+      "require": "./dist/host/nextjs/app/client-only.cjs",
+      "default": "./dist/host/nextjs/app/client-only.js"
+    },
+    "./host/nextjs/pages": {
+      "import": "./dist/host/nextjs/pages.js",
+      "require": "./dist/host/nextjs/pages.cjs",
+      "default": "./dist/host/nextjs/pages.js"
+    },
+    "./host/nextjs/pages/client-only": {
+      "import": "./dist/host/nextjs/pages/client-only.js",
+      "require": "./dist/host/nextjs/pages/client-only.cjs",
+      "default": "./dist/host/nextjs/pages/client-only.js"
+    },
+    "./host/react": {
+      "import": "./dist/host/react.js",
+      "require": "./dist/host/react.cjs",
+      "default": "./dist/host/react.js"
+    },
+    "./host/html": {
+      "import": "./dist/host/html.js",
+      "require": "./dist/host/html.cjs",
+      "default": "./dist/host/html.js"
+    },
+    "./remote/nextjs/app": {
+      "import": "./dist/remote/nextjs/app.js",
+      "require": "./dist/remote/nextjs/app.cjs",
+      "default": "./dist/remote/nextjs/app.js"
+    },
+    "./remote/nextjs/pages": {
+      "import": "./dist/remote/nextjs/pages.js",
+      "require": "./dist/remote/nextjs/pages.cjs",
+      "default": "./dist/remote/nextjs/pages.js"
+    },
+    "./remote/html": {
+      "import": "./dist/remote/html.js",
+      "require": "./dist/remote/html.cjs",
+      "default": "./dist/remote/html.js"
+    },
+    "./config/nextjs": {
+      "import": "./dist/config/nextjs.js",
+      "require": "./dist/config/nextjs.cjs",
+      "default": "./dist/config/nextjs.js"
+    },
+    "./config/webpack": {
+      "import": "./dist/config/webpack.js",
+      "require": "./dist/config/webpack.cjs",
+      "default": "./dist/config/webpack.js"
+    },
+    "./host/proxy": {
+      "import": "./dist/host/proxy.js",
+      "require": "./dist/host/proxy.cjs",
+      "default": "./dist/host/proxy.js"
+    },
+    "./host/proxy/client": {
+      "import": "./dist/host/proxy/client.js",
+      "require": "./dist/host/proxy/client.cjs",
+      "default": "./dist/host/proxy/client.js"
+    },
+    "./host/react/context": {
+      "import": "./dist/internal/host/react/context.js",
+      "require": "./dist/internal/host/react/context.cjs",
+      "default": "./dist/internal/host/react/context.js"
+    },
+    "./remote/middleware": {
+      "import": "./dist/remote/middleware.js",
+      "require": "./dist/remote/middleware.cjs",
+      "default": "./dist/remote/middleware.js"
+    },
+    "./host/server": {
+      "import": "./dist/internal/host/server/fetch-remote-component.js",
+      "require": "./dist/internal/host/server/fetch-remote-component.cjs",
+      "default": "./dist/internal/host/server/fetch-remote-component.js"
+    },
+    "./host/proxy/protected-fetch": {
+      "import": "./dist/host/proxy/protected-fetch.js",
+      "require": "./dist/host/proxy/protected-fetch.cjs",
+      "default": "./dist/host/proxy/protected-fetch.js"
+    },
+    "./remote/defaults/wrapper": {
+      "import": "./dist/remote/defaults/wrapper.js",
+      "require": "./dist/remote/defaults/wrapper.cjs",
+      "default": "./dist/remote/defaults/wrapper.js"
     }
   },
   "typesVersions": {
     "*": {
-      "html/host": [
-        "./dist/html/host.d.ts"
-      ],
-      "html/remote": [
-        "./dist/html/remote.d.ts"
-      ],
-      "next/config": [
-        "./dist/next/config.d.ts"
-      ],
-      "next/middleware": [
-        "./dist/next/proxy.d.ts"
+      "host/nextjs/app": [
+        "./dist/host/nextjs/app.d.ts"
       ],
-      "next/proxy": [
-        "./dist/next/proxy.d.ts"
+      "host/nextjs/app/client-only": [
+        "./dist/host/nextjs/app/client-only.d.ts"
       ],
-      "next/host": [
-        "./dist/next/host/app-router-server.d.ts"
+      "host/nextjs/pages": [
+        "./dist/host/nextjs/pages.d.ts"
       ],
-      "next/host/client": [
-        "./dist/next/host/client/index.d.ts"
+      "host/nextjs/pages/client-only": [
+        "./dist/host/nextjs/pages/client-only.d.ts"
       ],
-      "next/host/pages-router": [
-        "./dist/next/host/pages-router-server.d.ts"
+      "host/react": [
+        "./dist/host/react.d.ts"
       ],
-      "next/host/pages-router/client": [
-        "./dist/next/host/pages-router-client.d.ts"
+      "host/html": [
+        "./dist/host/html.d.ts"
       ],
-      "next/remote": [
-        "./dist/next/remote/server.d.ts"
+      "remote/nextjs/app": [
+        "./dist/remote/nextjs/app.d.ts"
       ],
-      "next/remote/pages-router": [
-        "./dist/next/remote/pages-router.d.ts"
+      "remote/nextjs/pages": [
+        "./dist/remote/nextjs/pages.d.ts"
       ],
-      "next": [
-        "./dist/next/index.d.ts"
+      "remote/html": [
+        "./dist/remote/html.d.ts"
       ],
-      "react": [
-        "./dist/react/index.d.ts"
+      "config/nextjs": [
+        "./dist/config/nextjs.d.ts"
       ],
-      "./ssr": [
-        "./dist/internal/shared/ssr/fetch-remote-component.d.ts"
+      "config/webpack": [
+        "./dist/config/webpack.d.ts"
       ],
-      "shared/remote/app": [
-        "./dist/shared/remote/app.d.ts"
+      "host/proxy": [
+        "./dist/host/proxy.d.ts"
       ],
-      "shared/remote/pages": [
-        "./dist/shared/remote/pages.d.ts"
+      "host/proxy/client": [
+        "./dist/host/proxy/client.d.ts"
       ],
-      "shared/remote/wrapper": [
-        "./dist/shared/remote/wrapper.d.ts"
+      "host/react/context": [
+        "./dist/internal/host/react/context.d.ts"
       ],
-      "shared/host/app": [
-        "./dist/shared/host/app.d.ts"
+      "remote/middleware": [
+        "./dist/remote/middleware.d.ts"
       ],
-      "shared/host/pages": [
-        "./dist/shared/host/pages.d.ts"
+      "host/server": [
+        "./dist/internal/host/server/fetch-remote-component.d.ts"
       ],
-      "shared/host/proxy": [
-        "./dist/shared/host/proxy.d.ts"
+      "host/proxy/protected-fetch": [
+        "./dist/host/proxy/protected-fetch.d.ts"
       ],
-      "webpack": [
-        "./dist/webpack.d.ts"
+      "remote/defaults/wrapper": [
+        "./dist/remote/defaults/wrapper.d.ts"
       ]
     }
   },

package/dist/component-loader-76eb1b8b.d.ts

@@ -1,200 +0,0 @@
-import { I as InternalResolveClientUrl } from './proxy-through-host-a676a522.js';
-import * as react from 'react';
-
-interface RemoteComponentMetadata {
-    bundle: string;
-    route: string;
-    runtime: 'webpack' | 'turbopack' | 'script';
-    id: string;
-    type: 'nextjs' | 'remote-component' | 'unknown';
-}
-/**
- * Options object passed to hook functions containing abort capabilities.
- * Uses standard AbortController/AbortSignal for compatibility with Web APIs.
- *
- * @example
- * // Abort on redirect
- * component.onResponse = (url, response, { signal, abort }) => {
- *   if (response.redirected) {
- *     abort();
- *   }
- * };
- *
- * @example
- * // Check if already aborted
- * component.onRequest = (url, init, { signal }) => {
- *   if (signal.aborted) return;
- *   // ...
- * };
- *
- * @example
- * // Pass signal to fetch or other APIs
- * component.onRequest = async (url, init, { signal }) => {
- *   const data = await fetch('/api/check', { signal });
- *   // ...
- * };
- */
-interface HookOptions {
-    /** Standard AbortSignal - can be passed to fetch and other Web APIs */
-    signal: AbortSignal;
-    /** Abort loading - prevents further processing and DOM attachment */
-    abort(reason?: unknown): void;
-}
-/**
- * Hook function that intercepts remote component fetch requests.
- * Can be used to modify request options, provide a custom response, inspect the request,
- * or abort loading.
- *
- * @param url - The URL being fetched
- * @param init - The fetch init options being used
- * @param options - Options object containing the abort signal
- * @returns Optional Response to use instead of fetching, or void/undefined to proceed with normal fetch
- *
- * @example
- * // Log all remote component requests
- * const onRequest = async (url, init, { abort }) => {
- *   console.log('Fetching remote component from:', url.href);
- * };
- *
- * @example
- * // Add custom headers
- * const onRequest = async (url, init) => {
- *   (init.headers as Headers).set('X-Custom-Header', 'value');
- * };
- *
- * @example
- * // Provide a cached response
- * const onRequest = async (url) => {
- *   const cached = cache.get(url.href);
- *   if (cached) {
- *     return new Response(cached);
- *   }
- * };
- *
- * @example
- * // Block certain domains
- * const onRequest = async (url, init, { abort }) => {
- *   if (isBlockedDomain(url)) {
- *     abort('Domain is blocked');
- *   }
- * };
- */
-type OnRequestHook = (url: URL, init: RequestInit, options: HookOptions) => Promise<Response | undefined> | Response | undefined;
-/**
- * Hook function that is called after a remote component fetch completes.
- * Can be used to inspect the response, check for redirects, transform the response,
- * or abort loading.
- *
- * @param url - The original URL that was requested
- * @param response - The Response object from the fetch
- * @param options - Options object containing the abort signal
- * @returns Optional Response to use instead of the original, or void/undefined to use the original response
- *
- * @example
- * // Check for redirects and abort
- * const onResponse = async (url, response, { abort }) => {
- *   if (response.redirected) {
- *     console.log(`Redirected from ${url.href} to ${response.url}`);
- *     abort();
- *   }
- * };
- *
- * @example
- * // Cache the response
- * const onResponse = async (url, response) => {
- *   const cloned = response.clone();
- *   cache.set(url.href, await cloned.text());
- * };
- *
- * @example
- * // Transform the response
- * const onResponse = async (url, response) => {
- *   const text = await response.text();
- *   const modified = text.replace(/foo/g, 'bar');
- *   return new Response(modified, response);
- * };
- *
- * @example
- * // Abort on redirect to legacy routes
- * const onResponse = async (url, response, { abort }) => {
- *   if (response.redirected && isLegacyRoute(response.url)) {
- *     window.location.href = toLegacyUrl(response.url);
- *     abort(); // Abort rendering - no flash!
- *   }
- * };
- */
-type OnResponseHook = (url: URL, response: Response, options: HookOptions) => Promise<Response | undefined> | Response | undefined;
-
-interface RemoteComponentProps {
-    /** The src provided to the `<RemoteComponent>` component. May be relative or absolute URL. */
-    src: string;
-    /** The src converted to a URL object. For relative URLs, the VERCEL_URL is used as the origin. */
-    serverUrl: string;
-    name: string;
-    bundle: string;
-    route?: string;
-    runtime?: RemoteComponentMetadata['runtime'];
-    data: string[];
-    nextData?: {
-        props: {
-            pageProps: Record<string, unknown>;
-        };
-        buildId?: string;
-    } | null;
-    scripts?: {
-        src: string;
-    }[];
-    links?: Record<string, string | boolean | undefined>[];
-    remoteShared?: Record<string, string>;
-    isolate?: boolean;
-    mode?: 'open' | 'closed';
-    reset?: boolean;
-    type?: RemoteComponentMetadata['type'];
-    children: react.ReactNode;
-}
-interface GlobalScope {
-    __DISABLE_WEBPACK_EXEC__?: Record<string, boolean>;
-    __webpack_chunk_load__?: (chunkId: string, scriptBundle?: string) => Promise<unknown> | undefined;
-    __original_webpack_chunk_load__?: (chunkId: string, scriptBundle?: string) => Promise<unknown> | undefined;
-    __webpack_require__?: (id: string) => unknown;
-    __webpack_get_script_filename__?: (id: string) => string | null | undefined;
-    __original_webpack_require__?: (id: string) => unknown;
-    __remote_webpack_require__?: Record<string, ((remoteId: string | number) => unknown) & {
-        c?: Record<string | number, {
-            id: string;
-            parents: string[];
-            children: string[];
-        }>;
-        m?: Record<string | number, (module: {
-            exports: unknown;
-        }) => void>;
-        type?: 'turbopack' | 'webpack' | 'script';
-    }>;
-    __webpack_require_type__?: RemoteComponentMetadata['runtime'];
-    __remote_shared_modules__?: Record<string, Record<string, unknown>>;
-    __remote_bundle_url__?: Record<string, string | URL>;
-    __remote_components_turbopack_chunk_loader_promise__?: Record<string, Promise<unknown>>;
-    __remote_components_turbopack_modules__?: Record<string, Record<string, unknown>>;
-    __remote_components_turbopack_global__?: Record<string, unknown>;
-    [key: string]: unknown;
-}
-interface LoaderResult {
-    component: react.ReactNode;
-    error?: Error;
-}
-type MountOrUnmountFunction = (el?: ShadowRoot | DocumentFragment | HTMLElement | HTMLCollection | null) => Promise<void> | void;
-
-type LoadRemoteComponentProps = Pick<RemoteComponentProps, 'name' | 'bundle' | 'route' | 'runtime' | 'data' | 'nextData' | 'scripts'> & {
-    url: URL;
-    shared: Promise<Record<string, (bundle?: string) => Promise<unknown>>> | Record<string, (bundle?: string) => Promise<unknown>>;
-    remoteShared: Record<string, string>;
-    container?: HTMLHeadElement | ShadowRoot | null;
-    rscName?: string;
-    resolveClientUrl?: InternalResolveClientUrl;
-};
-/**
- * Main loader function that orchestrates the component loading process
- */
-declare function loadRemoteComponent({ url, name, rscName, bundle, route, runtime, data, nextData, scripts, shared, remoteShared, container, resolveClientUrl, }: LoadRemoteComponentProps): Promise<LoaderResult>;
-
-export { GlobalScope as G, HookOptions as H, LoadRemoteComponentProps as L, MountOrUnmountFunction as M, OnRequestHook as O, RemoteComponentProps as R, OnResponseHook as a, LoaderResult as b, loadRemoteComponent as l };