dinou 4.0.13 → 4.0.14

package/CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/).
 
+## [4.0.14] - 2026-06-29
+### Added
+- **Soft Redirects**: Exposes the SPA transition navigation internally via `window.__DINOU_ROUTER_NAVIGATE__` to enable smooth client-side redirects from both Server Functions and RSC payloads, keeping the React client state intact and preventing full browser page reloads.
+### Fixed
+- **External Links Interception**: Restored native browser navigation for external domains, protocol-relative links (`//...`), and special protocols (`mailto:`, `tel:`, etc.) by preventing the SPA router from capturing or prefetching non-internal routes.
+
 ## [4.0.13] - 2026-06-29
 
 ### Added

package/dinou/core/client-error-webpack.jsx

@@ -9,7 +9,7 @@ import {
 import { createFromFetch } from "react-server-dom-webpack/client";
 import { hydrateRoot } from "react-dom/client";
 import { RouterContext } from "./navigation.js";
-import { resolveUrl } from "./navigation-utils.js";
+import { resolveUrl, isExternalUrl } from "./navigation-utils.js";
 
 // ====================================================================
 // 1. GLOBAL STATE (Outside the component)
@@ -167,7 +167,7 @@ function Router() {
       }
 
       const href = anchor.getAttribute("href");
-      if (!href || href.startsWith("mailto:") || href.startsWith("tel:"))
+      if (!href || href.startsWith("mailto:") || href.startsWith("tel:") || isExternalUrl(href))
         return;
 
       // We use the unified helper

package/dinou/core/client-error.jsx

@@ -9,7 +9,7 @@ import {
 import { createFromFetch } from "@roggc/react-server-dom-esm/client";
 import { hydrateRoot } from "react-dom/client";
 import { RouterContext } from "./navigation.js";
-import { resolveUrl } from "./navigation-utils.js";
+import { resolveUrl, isExternalUrl } from "./navigation-utils.js";
 
 // ====================================================================
 // 1. GLOBAL STATE (Outside the component)
@@ -167,7 +167,7 @@ function Router() {
       }
 
       const href = anchor.getAttribute("href");
-      if (!href || href.startsWith("mailto:") || href.startsWith("tel:"))
+      if (!href || href.startsWith("mailto:") || href.startsWith("tel:") || isExternalUrl(href))
         return;
 
       // We use the unified helper

package/dinou/core/client-redirect.jsx

@@ -1,15 +1,22 @@
 // dinou/core/client-redirect.jsx
 "use client";
 
-import { useEffect } from "react";
 import { useRouter } from "./navigation.js";
 
 export function ClientRedirect({ to }) {
   const router = useRouter();
 
-  useEffect(() => {
-    router.replace(to);
-  }, [to, router]);
+  if (typeof window !== "undefined") {
+    Promise.resolve().then(() => {
+      if (window.__DINOU_ROUTER_NAVIGATE__) {
+        window.__DINOU_ROUTER_NAVIGATE__(to, { replace: true });
+      } else {
+        router.replace(to);
+      }
+    });
+    // Suspend to prevent React from committing this intermediate page
+    throw new Promise(() => {});
+  }
 
   return null;
 }

package/dinou/core/client-webpack.jsx

@@ -9,7 +9,7 @@ import {
 import { createFromFetch } from "react-server-dom-webpack/client";
 import { hydrateRoot } from "react-dom/client";
 import { RouterContext } from "./navigation.js";
-import { resolveUrl } from "./navigation-utils.js";
+import { resolveUrl, isExternalUrl } from "./navigation-utils.js";
 
 // ====================================================================
 // 1. GLOBAL STATE (Outside the component)
@@ -68,10 +68,13 @@ const getRSCPayload = (rscKey, isPrefetch = false) => {
     fetch(payloadUrl).then((res) => {
       if (res.headers.has("x-rsc-redirect")) {
         const redirectUrl = res.headers.get("x-rsc-redirect");
+        cache.delete(url);
         if (!isPrefetch) {
-          window.location.href = redirectUrl;
-        } else {
-          cache.delete(url);
+          if (window.__DINOU_ROUTER_NAVIGATE__) {
+            window.__DINOU_ROUTER_NAVIGATE__(redirectUrl, { replace: true });
+          } else {
+            window.location.href = redirectUrl;
+          }
         }
         // Return a promise that never resolves to avoid React Server DOM throwing "Connection closed"
         return new Promise(() => {});
@@ -93,18 +96,6 @@ function Router() {
   const [isPending, startTransition] = useTransition();
   const [version, setVersion] = useState(0);
 
-  // 🔌 EFFECT 1: Expose Global Prefetch
-  useEffect(() => {
-    window.__DINOU_PREFETCH__ = (url) => {
-      // 🛡️ PREFETCH PROTECTION: If it's a local hash, do nothing
-      if (isHashChangeOnly(url)) return;
-      getRSCPayload(url, true);
-    };
-
-    // Hydration
-    document.body.setAttribute("data-hydrated", "true");
-  }, []); // Only on mount
-
   // 🧭 NAVIGATE FUNCTION (Core Logic)
   const navigate = (href, options = {}) => {
     const finalPath = resolveUrl(href, window.location.pathname);
@@ -150,6 +141,26 @@ function Router() {
     });
   };
 
+  // 🔌 EFFECT 1: Expose Global Prefetch & Navigation
+  useEffect(() => {
+    window.__DINOU_PREFETCH__ = (url) => {
+      // 🛡️ PREFETCH PROTECTION: If it's a local hash, do nothing
+      if (isHashChangeOnly(url)) return;
+      getRSCPayload(url, true);
+    };
+
+    window.__DINOU_ROUTER_NAVIGATE__ = navigate;
+
+    // Hydration
+    document.body.setAttribute("data-hydrated", "true");
+
+    return () => {
+      if (window.__DINOU_ROUTER_NAVIGATE__ === navigate) {
+        window.__DINOU_ROUTER_NAVIGATE__ = undefined;
+      }
+    };
+  }, [navigate]);
+
   const back = () => window.history.back();
   const forward = () => window.history.forward();
   const refresh = () => {
@@ -188,7 +199,7 @@ function Router() {
       }
 
       const href = anchor.getAttribute("href");
-      if (!href || href.startsWith("mailto:") || href.startsWith("tel:"))
+      if (!href || href.startsWith("mailto:") || href.startsWith("tel:") || isExternalUrl(href))
         return;
 
       // We use the unified helper

package/dinou/core/client.jsx

@@ -10,7 +10,7 @@ import {
 import { createFromFetch } from "@roggc/react-server-dom-esm/client";
 import { hydrateRoot } from "react-dom/client";
 import { RouterContext } from "./navigation.js";
-import { resolveUrl } from "./navigation-utils.js";
+import { resolveUrl, isExternalUrl } from "./navigation-utils.js";
 
 // ====================================================================
 // 1. GLOBAL STATE (Outside the component)
@@ -69,10 +69,13 @@ const getRSCPayload = (rscKey, isPrefetch = false) => {
     fetch(payloadUrl).then((res) => {
       if (res.headers.has("x-rsc-redirect")) {
         const redirectUrl = res.headers.get("x-rsc-redirect");
+        cache.delete(url);
         if (!isPrefetch) {
-          window.location.href = redirectUrl;
-        } else {
-          cache.delete(url);
+          if (window.__DINOU_ROUTER_NAVIGATE__) {
+            window.__DINOU_ROUTER_NAVIGATE__(redirectUrl, { replace: true });
+          } else {
+            window.location.href = redirectUrl;
+          }
         }
         // Return a promise that never resolves to avoid React Server DOM throwing "Connection closed"
         return new Promise(() => {});
@@ -94,18 +97,6 @@ function Router() {
   const [isPending, startTransition] = useTransition();
   const [version, setVersion] = useState(0);
 
-  // 🔌 EFFECT 1: Expose Global Prefetch
-  useEffect(() => {
-    window.__DINOU_PREFETCH__ = (url) => {
-      // 🛡️ PREFETCH PROTECTION: If it's a local hash, do nothing
-      if (isHashChangeOnly(url)) return;
-      getRSCPayload(url, true);
-    };
-
-    // Hydration
-    document.body.setAttribute("data-hydrated", "true");
-  }, []); // Only on mount
-
   // 🧭 NAVIGATE FUNCTION (Core Logic)
   const navigate = (href, options = {}) => {
     const finalPath = resolveUrl(href, window.location.pathname);
@@ -151,6 +142,26 @@ function Router() {
     });
   };
 
+  // 🔌 EFFECT 1: Expose Global Prefetch & Navigation
+  useEffect(() => {
+    window.__DINOU_PREFETCH__ = (url) => {
+      // 🛡️ PREFETCH PROTECTION: If it's a local hash, do nothing
+      if (isHashChangeOnly(url)) return;
+      getRSCPayload(url, true);
+    };
+
+    window.__DINOU_ROUTER_NAVIGATE__ = navigate;
+
+    // Hydration
+    document.body.setAttribute("data-hydrated", "true");
+
+    return () => {
+      if (window.__DINOU_ROUTER_NAVIGATE__ === navigate) {
+        window.__DINOU_ROUTER_NAVIGATE__ = undefined;
+      }
+    };
+  }, [navigate]);
+
   const back = () => window.history.back();
   const forward = () => window.history.forward();
   const refresh = () => {
@@ -189,7 +200,7 @@ function Router() {
       }
 
       const href = anchor.getAttribute("href");
-      if (!href || href.startsWith("mailto:") || href.startsWith("tel:"))
+      if (!href || href.startsWith("mailto:") || href.startsWith("tel:") || isExternalUrl(href))
         return;
 
       // We use the unified helper

package/dinou/core/link.jsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useRouter, usePathname } from "./navigation.js";
-import { resolveUrl } from "./navigation-utils.js";
+import { resolveUrl, isExternalUrl } from "./navigation-utils.js";
 
 export function Link({
   href,
@@ -15,14 +15,14 @@ export function Link({
   const resolvedHref = resolveUrl(href, pathname);
 
   const handlePrefetch = () => {
-    if (!prefetch || !href || fresh) return;
+    if (!prefetch || !href || fresh || isExternalUrl(href)) return;
     if (window.__DINOU_PREFETCH__) {
       window.__DINOU_PREFETCH__(resolvedHref);
     }
   };
 
   const handleClick = (e) => {
-    if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) return;
+    if (e.metaKey || e.ctrlKey || e.shiftKey || e.altKey || isExternalUrl(href)) return;
 
     e.preventDefault();
     push(href, { fresh });

package/dinou/core/navigation-utils.js

@@ -1,4 +1,35 @@
+export function isExternalUrl(href) {
+  if (!href) return false;
+
+  // Protocol-relative (e.g. //google.com)
+  if (href.startsWith("//")) {
+    return true;
+  }
+
+  // Absolute with protocol (e.g. https://google.com)
+  if (href.includes("://")) {
+    try {
+      const origin = typeof window !== "undefined" ? window.location.origin : "http://localhost";
+      const url = new URL(href, origin);
+      return url.origin !== origin;
+    } catch (e) {
+      return true;
+    }
+  }
+
+  // Other protocols (mailto:, tel:, javascript:, etc.)
+  if (/^[a-zA-Z0-9+-.]+:[^//]/.test(href) || href.startsWith("mailto:") || href.startsWith("tel:") || href.startsWith("javascript:")) {
+    return true;
+  }
+
+  return false;
+}
+
 export function resolveUrl(href, currentPathname) {
+  if (isExternalUrl(href)) {
+    return href;
+  }
+
   const origin = typeof window !== "undefined" ? window.location.origin : "http://localhost";
 
   if (href.startsWith("/") || href.includes("://")) {

package/dinou/core/server-function-proxy-webpack.js

@@ -4,6 +4,16 @@ function isSafeRedirect(url) {
   return typeof url === "string" && url.startsWith("/") && !url.startsWith("//");
 }
 
+function executeRedirect(url) {
+  const safeUrl = isSafeRedirect(url) ? url : "/";
+  const isInternal = safeUrl.startsWith("/") && !safeUrl.startsWith("//");
+  if (isInternal && typeof window !== "undefined" && window.__DINOU_ROUTER_NAVIGATE__) {
+    window.__DINOU_ROUTER_NAVIGATE__(safeUrl);
+  } else if (typeof window !== "undefined") {
+    window.location.href = safeUrl;
+  }
+}
+
 function createServerFunctionProxy(id) {
   return new Proxy(() => { }, {
     apply: async (_target, _thisArg, args) => {
@@ -37,8 +47,8 @@ function createServerFunctionProxy(id) {
       // Check header first
       const redirectUrl = res.headers.get("X-Dinou-Redirect");
       if (redirectUrl) {
-        window.location.href = isSafeRedirect(redirectUrl) ? redirectUrl : "/";
-        return new Promise(() => { });
+        executeRedirect(redirectUrl);
+        return Promise.resolve();
       }
 
       const contentType = res.headers.get("content-type") || "";
@@ -54,8 +64,8 @@ function createServerFunctionProxy(id) {
       if (contentType.includes("application/json")) {
         const data = await res.json();
         if (data && data.redirect) {
-          window.location.href = isSafeRedirect(data.redirect) ? data.redirect : "/";
-          return new Promise(() => { });
+          executeRedirect(data.redirect);
+          return Promise.resolve();
         }
         return data;
       }
@@ -82,7 +92,7 @@ function createServerFunctionProxy(id) {
                         const payload = JSON.parse(buffer.slice(2));
                         if (payload.type === "redirect") {
                           isRedirecting = true;
-                          window.location.href = isSafeRedirect(payload.url) ? payload.url : "/";
+                          executeRedirect(payload.url);
                         } else if (payload.type === "cookie") {
                           document.cookie = payload.cookie;
                         }
@@ -119,7 +129,7 @@ function createServerFunctionProxy(id) {
                         const payload = JSON.parse(line.slice(2));
                         if (payload.type === "redirect") {
                           isRedirecting = true;
-                          window.location.href = isSafeRedirect(payload.url) ? payload.url : "/";
+                          executeRedirect(payload.url);
                         } else if (payload.type === "cookie") {
                           document.cookie = payload.cookie;
                         }
@@ -130,18 +140,14 @@ function createServerFunctionProxy(id) {
                       cleanChunk += line + "\n";
                     }
                   }
-
                   if (cleanChunk) {
                     controller.enqueue(encoder.encode(cleanChunk));
                   }
                 }
               }
+              controller.close();
             } catch (err) {
               controller.error(err);
-            } finally {
-              if (!isRedirecting) {
-                controller.close();
-              }
             }
           },
         });

package/dinou/core/server-function-proxy.js

@@ -5,6 +5,16 @@ function isSafeRedirect(url) {
   return typeof url === "string" && url.startsWith("/") && !url.startsWith("//");
 }
 
+function executeRedirect(url) {
+  const safeUrl = isSafeRedirect(url) ? url : "/";
+  const isInternal = safeUrl.startsWith("/") && !safeUrl.startsWith("//");
+  if (isInternal && typeof window !== "undefined" && window.__DINOU_ROUTER_NAVIGATE__) {
+    window.__DINOU_ROUTER_NAVIGATE__(safeUrl);
+  } else if (typeof window !== "undefined") {
+    window.location.href = safeUrl;
+  }
+}
+
 export function createServerFunctionProxy(id) {
   return new Proxy(() => {}, {
     apply: async (_target, _thisArg, args) => {
@@ -38,8 +48,8 @@ export function createServerFunctionProxy(id) {
       // Check header first
       const redirectUrl = res.headers.get("X-Dinou-Redirect");
       if (redirectUrl) {
-        window.location.href = isSafeRedirect(redirectUrl) ? redirectUrl : "/";
-        return new Promise(() => {});
+        executeRedirect(redirectUrl);
+        return Promise.resolve();
       }
 
       const contentType = res.headers.get("content-type") || "";
@@ -55,8 +65,8 @@ export function createServerFunctionProxy(id) {
       if (contentType.includes("application/json")) {
         const data = await res.json();
         if (data && data.redirect) {
-          window.location.href = isSafeRedirect(data.redirect) ? data.redirect : "/";
-          return new Promise(() => {});
+          executeRedirect(data.redirect);
+          return Promise.resolve();
         }
         return data;
       }
@@ -83,7 +93,7 @@ export function createServerFunctionProxy(id) {
                         const payload = JSON.parse(buffer.slice(2));
                         if (payload.type === "redirect") {
                           isRedirecting = true;
-                          window.location.href = isSafeRedirect(payload.url) ? payload.url : "/";
+                          executeRedirect(payload.url);
                         } else if (payload.type === "cookie") {
                           document.cookie = payload.cookie;
                         }
@@ -120,7 +130,7 @@ export function createServerFunctionProxy(id) {
                         const payload = JSON.parse(line.slice(2));
                         if (payload.type === "redirect") {
                           isRedirecting = true;
-                          window.location.href = isSafeRedirect(payload.url) ? payload.url : "/";
+                          executeRedirect(payload.url);
                         } else if (payload.type === "cookie") {
                           document.cookie = payload.cookie;
                         }
@@ -137,12 +147,9 @@ export function createServerFunctionProxy(id) {
                   }
                 }
               }
+              controller.close();
             } catch (err) {
               controller.error(err);
-            } finally {
-              if (!isRedirecting) {
-                controller.close();
-              }
             }
           },
         });

package/dinou/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dinou-ejected",
-  "version": "4.0.13",
+  "version": "4.0.14",
   "main": "index.js",
   "private": true,
   "exports": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dinou",
-  "version": "4.0.13",
+  "version": "4.0.14",
   "description": "Full-Stack React 19 framework with React Server Components, Server Functions, and Streaming SSR.",
   "main": "index.js",
   "bin": {