remote-components 0.0.47 → 0.0.49

package/dist/next/host/client/index.d.ts

@@ -1,7 +1,7 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { RemoteComponentProps } from '../../../react/index.js';
-import '../../../component-loader-26b1f55e.js';
+import '../../../component-loader-1838f572.js';
 
 /**
  * RemoteComponent - Client-side component for rendering remote components

package/dist/next/host/client/index.js

@@ -585,6 +585,18 @@ async function loadScripts(scripts) {
   );
 }
 
+// src/shared/utils/abort.ts
+function isAbortError(error) {
+  if (error instanceof DOMException && error.name === "AbortError") {
+    return true;
+  }
+  if (error !== null && typeof error === "object" && "name" in error && error.name === "AbortError" && "message" in error && typeof error.message === "string") {
+    const e = error;
+    return typeof e.code === "number" || e.constructor?.name === "DOMException";
+  }
+  return false;
+}
+
 // src/shared/ssr/fetch-with-protected-rc-fallback.ts
 var RC_PROTECTED_REMOTE_FETCH_PATHNAME = "/rc-fetch-protected-remote";
 async function fetchWithProtectedRcFallback(url, init) {
@@ -592,13 +604,17 @@ async function fetchWithProtectedRcFallback(url, init) {
     const res = await fetch(url, init);
     return res;
   } catch (error) {
+    if (isAbortError(error)) {
+      throw error;
+    }
     if (typeof document === "object" && typeof document.location === "object" && document.location.origin !== new URL(url).origin) {
       logInfo(
         "FetchRemoteComponent",
         "Request failed due to CORS, attempting to fetch it via the withRemoteComponentsHost proxy."
       );
       const proxiedRes = await fetch(
-        `${RC_PROTECTED_REMOTE_FETCH_PATHNAME}?url=${url}`
+        `${RC_PROTECTED_REMOTE_FETCH_PATHNAME}?url=${url}`,
+        init?.signal ? { signal: init.signal } : void 0
       );
       if (proxiedRes.status === 200) {
         return proxiedRes;
@@ -1577,17 +1593,27 @@ function remoteFetchHeaders() {
 
 // src/shared/ssr/fetch-with-hooks.ts
 async function fetchWithHooks(url, additionalInit, options = {}) {
-  const { onRequest, onResponse } = options;
+  const {
+    onRequest,
+    onResponse,
+    abortController = new AbortController()
+  } = options;
+  const signal = abortController.signal;
+  const hookOptions = {
+    signal,
+    abort: (reason) => abortController.abort(reason)
+  };
   const init = {
     method: "GET",
     headers: remoteFetchHeaders(),
+    signal,
     ...additionalInit
   };
-  let res = await onRequest?.(url, init);
+  let res = await onRequest?.(url, init, hookOptions);
   if (!res) {
     res = await fetchWithProtectedRcFallback(url, init);
   }
-  const transformedRes = await onResponse?.(url, res);
+  const transformedRes = await onResponse?.(url, res, hookOptions);
   if (transformedRes) {
     res = transformedRes;
   }
@@ -1796,14 +1822,16 @@ function RemoteComponent({
             const fetchInit = {
               credentials
             };
+            const abortController = new AbortController();
             const res = await fetchWithHooks(url, fetchInit, {
               onRequest,
-              onResponse
+              onResponse,
+              abortController
             });
-            if (!res.ok) {
+            if (!res || !res.ok) {
               let error = failedToFetchRemoteComponentError(
                 url.href,
-                res
+                res ?? new Response(null, { status: 0 })
               );
               try {
                 const body = await res.text();
@@ -1824,7 +1852,9 @@ function RemoteComponent({
                     error.stack = errorStack;
                   }
                 }
-              } catch {
+              } catch (parseError) {
+                if (isAbortError(parseError))
+                  throw parseError;
               }
               throw error;
             }
@@ -2096,6 +2126,9 @@ function RemoteComponent({
             }
           }
         } catch (error) {
+          if (isAbortError(error)) {
+            return;
+          }
           setRemoteComponent(error);
           onError?.(error);
         }