remote-components 0.3.7 → 0.4.0

package/dist/{chunk-LCXO7BUY.cjs → chunk-42TVDI3G.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkX6W464D6cjs = require('./chunk-X6W464D6.cjs');
+var _chunkRLI4YTBJcjs = require('./chunk-RLI4YTBJ.cjs');
 
 
 
@@ -17,10 +17,11 @@ async function loadScripts(scripts, resolveClientUrl) {
       return new Promise((resolve, reject) => {
         const newSrc = new URL(
           // remove the remote component bundle name identifier from the script src
-          script.src.replace(_chunkX6W464D6cjs.NEXT_BUNDLE_PATH_RE, "/_next/"),
+          script.src.replace(_chunkRLI4YTBJcjs.NEXT_BUNDLE_PATH_RE, "/_next/"),
           location.origin
         ).href;
-        const resolvedSrc = _nullishCoalesce(_optionalChain([resolveClientUrl, 'optionalCall', _ => _(newSrc)]), () => ( newSrc));
+        const rawResolved = _nullishCoalesce(_optionalChain([resolveClientUrl, 'optionalCall', _ => _(newSrc)]), () => ( newSrc));
+        const resolvedSrc = new URL(rawResolved, location.href).href;
         const alreadyLoaded = Array.from(
           document.querySelectorAll("script[src]")
         ).some((s) => s.src === resolvedSrc);
@@ -54,4 +55,4 @@ async function loadScripts(scripts, resolveClientUrl) {
 
 
 exports.loadScripts = loadScripts;
-//# sourceMappingURL=chunk-LCXO7BUY.cjs.map
+//# sourceMappingURL=chunk-42TVDI3G.cjs.map

package/dist/chunk-42TVDI3G.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/runtime/loaders/script-loader.ts"],"names":[],"mappings":";;;;;;;;;;;;;AAYA,eAAsB,YACpB,SACA,kBACe;AACf,QAAM,QAAQ;AAAA,IACZ,QAAQ,IAAI,CAAC,WAAW;AACtB,aAAO,IAAI,QAAc,CAAC,SAAS,WAAW;AAC5C,cAAM,SAAS,IAAI;AAAA;AAAA,UAEjB,OAAO,IAAI,QAAQ,qBAAqB,SAAS;AAAA,UACjD,SAAS;AAAA,QACX,EAAE;AAMF,cAAM,cAAc,mBAAmB,MAAM,KAAK;AAClD,cAAM,cAAc,IAAI,IAAI,aAAa,SAAS,IAAI,EAAE;AAExD,cAAM,gBAAgB,MAAM;AAAA,UAC1B,SAAS,iBAAoC,aAAa;AAAA,QAC5D,EAAE,KAAK,CAAC,MAAM,EAAE,QAAQ,WAAW;AACnC,YAAI,eAAe;AACjB,kBAAQ;AACR;AAAA,QACF;AAEA,cAAM,YAAY,SAAS,cAAc,QAAQ;AACjD,kBAAU,SAAS,MAAM,QAAQ;AACjC,kBAAU,UAAU,MAAM;AACxB,gBAAM,YAAY,aAAa,WAAW;AAC1C,cAAI,WAAW;AACb,mBAAO,wBAAwB,UAAU,QAAQ,WAAW,CAAC;AAAA,UAC/D,OAAO;AACL,sCAA0B,gBAAgB,MAAM;AAChD;AAAA,cACE,IAAI;AAAA,gBACF,+BAA+B;AAAA,cACjC;AAAA,YACF;AAAA,UACF;AAAA,QACF;AACA,kBAAU,MAAM;AAChB,kBAAU,QAAQ;AAClB,iBAAS,KAAK,YAAY,SAAS;AAAA,MACrC,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AACF","sourcesContent":["import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport { NEXT_BUNDLE_PATH_RE } from '#internal/runtime/patterns';\nimport { isProxiedUrl } from '#internal/runtime/url/protected-rc-fallback';\nimport {\n  failedProxiedAssetError,\n  RemoteComponentsError,\n} from '#internal/utils/error';\nimport { warnCrossOriginFetchError } from '#internal/utils/logger';\n\n/**\n * Loads external scripts for remote components\n */\nexport async function loadScripts(\n  scripts: { src: string }[],\n  resolveClientUrl?: InternalResolveClientUrl,\n): Promise<void> {\n  await Promise.all(\n    scripts.map((script) => {\n      return new Promise<void>((resolve, reject) => {\n        const newSrc = new URL(\n          // remove the remote component bundle name identifier from the script src\n          script.src.replace(NEXT_BUNDLE_PATH_RE, '/_next/'),\n          location.origin,\n        ).href;\n\n        // resolveClientUrl may return a relative URL (e.g. the host-proxy\n        // path \"/rc-fetch-protected-remote?url=...\"). Normalize to absolute\n        // before comparing with s.src, which browsers always expose as\n        // absolute, so the deduplication check works in deployed contexts.\n        const rawResolved = resolveClientUrl?.(newSrc) ?? newSrc;\n        const resolvedSrc = new URL(rawResolved, location.href).href;\n\n        const alreadyLoaded = Array.from(\n          document.querySelectorAll<HTMLScriptElement>('script[src]'),\n        ).some((s) => s.src === resolvedSrc);\n        if (alreadyLoaded) {\n          resolve();\n          return;\n        }\n\n        const newScript = document.createElement('script');\n        newScript.onload = () => resolve();\n        newScript.onerror = () => {\n          const isProxied = isProxiedUrl(resolvedSrc);\n          if (isProxied) {\n            reject(failedProxiedAssetError('script', newSrc, resolvedSrc));\n          } else {\n            warnCrossOriginFetchError('ScriptLoader', newSrc);\n            reject(\n              new RemoteComponentsError(\n                `Failed to load <script src=\"${newSrc}\"> for Remote Component. Check the URL is correct.`,\n              ),\n            );\n          }\n        };\n        newScript.src = resolvedSrc;\n        newScript.async = true;\n        document.head.appendChild(newScript);\n      });\n    }),\n  );\n}\n"]}

package/dist/chunk-5KTAEO52.cjs

@@ -0,0 +1,28 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/host/shared/navigate-event.ts
+var REMOTE_NAVIGATE_EVENT = "remote-components:navigate";
+function parseRemoteNavigateDetail(detail) {
+  try {
+    const parsed = new URL(detail.url, window.location.origin);
+    return {
+      url: detail.url,
+      pathname: parsed.pathname,
+      search: parsed.search,
+      hash: parsed.hash,
+      type: detail.type
+    };
+  } catch (e) {
+    return {
+      url: detail.url,
+      pathname: detail.url,
+      search: "",
+      hash: "",
+      type: detail.type
+    };
+  }
+}
+
+
+
+
+exports.REMOTE_NAVIGATE_EVENT = REMOTE_NAVIGATE_EVENT; exports.parseRemoteNavigateDetail = parseRemoteNavigateDetail;
+//# sourceMappingURL=chunk-5KTAEO52.cjs.map

package/dist/chunk-5KTAEO52.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/host/shared/navigate-event.ts"],"names":[],"mappings":";AAAO,IAAM,wBAAwB;AAqB9B,SAAS,0BACd,QACqB;AACrB,MAAI;AACF,UAAM,SAAS,IAAI,IAAI,OAAO,KAAK,OAAO,SAAS,MAAM;AACzD,WAAO;AAAA,MACL,KAAK,OAAO;AAAA,MACZ,UAAU,OAAO;AAAA,MACjB,QAAQ,OAAO;AAAA,MACf,MAAM,OAAO;AAAA,MACb,MAAM,OAAO;AAAA,IACf;AAAA,EACF,QAAE;AACA,WAAO;AAAA,MACL,KAAK,OAAO;AAAA,MACZ,UAAU,OAAO;AAAA,MACjB,QAAQ;AAAA,MACR,MAAM;AAAA,MACN,MAAM,OAAO;AAAA,IACf;AAAA,EACF;AACF","sourcesContent":["export const REMOTE_NAVIGATE_EVENT = 'remote-components:navigate';\n\nexport interface RemoteNavigateDetail {\n  url: string;\n  type: 'push' | 'replace';\n}\n\n/** Parsed navigation request surfaced to `onRemoteNavigate` / `useRemoteNavigate` callbacks. */\nexport interface RemoteNavigateEvent {\n  /** Raw value from the remote; may be absolute or relative. */\n  url: string;\n  pathname: string;\n  /** Includes leading `?`, or `''` if none. */\n  search: string;\n  /** Includes leading `#`, or `''` if none. */\n  hash: string;\n  /** `'push'` / `'replace'` mirror the remote's history call. */\n  type: 'push' | 'replace';\n}\n\n/** Handles both absolute URLs and relative paths; falls back to pathname-only on parse failure. */\nexport function parseRemoteNavigateDetail(\n  detail: RemoteNavigateDetail,\n): RemoteNavigateEvent {\n  try {\n    const parsed = new URL(detail.url, window.location.origin);\n    return {\n      url: detail.url,\n      pathname: parsed.pathname,\n      search: parsed.search,\n      hash: parsed.hash,\n      type: detail.type,\n    };\n  } catch {\n    return {\n      url: detail.url,\n      pathname: detail.url,\n      search: '',\n      hash: '',\n      type: detail.type,\n    };\n  }\n}\n"]}

package/dist/{chunk-NZAB7REE.js → chunk-5WL3FP4V.js}

@@ -1,14 +1,14 @@
 import {
   loadScripts
-} from "./chunk-SZFCBE54.js";
+} from "./chunk-AKOMV2UF.js";
 import {
   initializeSharedModules,
   setupRemoteScope
-} from "./chunk-QKB74MLO.js";
+} from "./chunk-N3KPUFOB.js";
 import {
   applySharedModules,
   nextClientPagesLoader
-} from "./chunk-52BJ7VFA.js";
+} from "./chunk-MKO52FRO.js";
 import {
   loadStaticRemoteComponent
 } from "./chunk-LQ7VQ74E.js";
@@ -23,7 +23,7 @@ import {
   buildWebpackResolve,
   collapseDoubleSlashes,
   escapeString
-} from "./chunk-SJM7AAGU.js";
+} from "./chunk-SAGYPGIQ.js";
 import {
   RemoteComponentsError,
   logDebug,
@@ -700,4 +700,4 @@ export {
   resolveNameFromSrc,
   bindResolveClientUrl
 };
-//# sourceMappingURL=chunk-NZAB7REE.js.map
+//# sourceMappingURL=chunk-5WL3FP4V.js.map

package/dist/{chunk-SZFCBE54.js → chunk-AKOMV2UF.js}

@@ -1,6 +1,6 @@
 import {
   NEXT_BUNDLE_PATH_RE
-} from "./chunk-SJM7AAGU.js";
+} from "./chunk-SAGYPGIQ.js";
 import {
   RemoteComponentsError,
   failedProxiedAssetError,
@@ -20,7 +20,8 @@ async function loadScripts(scripts, resolveClientUrl) {
           script.src.replace(NEXT_BUNDLE_PATH_RE, "/_next/"),
           location.origin
         ).href;
-        const resolvedSrc = resolveClientUrl?.(newSrc) ?? newSrc;
+        const rawResolved = resolveClientUrl?.(newSrc) ?? newSrc;
+        const resolvedSrc = new URL(rawResolved, location.href).href;
         const alreadyLoaded = Array.from(
           document.querySelectorAll("script[src]")
         ).some((s) => s.src === resolvedSrc);
@@ -54,4 +55,4 @@ async function loadScripts(scripts, resolveClientUrl) {
 export {
   loadScripts
 };
-//# sourceMappingURL=chunk-SZFCBE54.js.map
+//# sourceMappingURL=chunk-AKOMV2UF.js.map

package/dist/chunk-AKOMV2UF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/runtime/loaders/script-loader.ts"],"sourcesContent":["import type { InternalResolveClientUrl } from '#internal/host/server/types';\nimport { NEXT_BUNDLE_PATH_RE } from '#internal/runtime/patterns';\nimport { isProxiedUrl } from '#internal/runtime/url/protected-rc-fallback';\nimport {\n  failedProxiedAssetError,\n  RemoteComponentsError,\n} from '#internal/utils/error';\nimport { warnCrossOriginFetchError } from '#internal/utils/logger';\n\n/**\n * Loads external scripts for remote components\n */\nexport async function loadScripts(\n  scripts: { src: string }[],\n  resolveClientUrl?: InternalResolveClientUrl,\n): Promise<void> {\n  await Promise.all(\n    scripts.map((script) => {\n      return new Promise<void>((resolve, reject) => {\n        const newSrc = new URL(\n          // remove the remote component bundle name identifier from the script src\n          script.src.replace(NEXT_BUNDLE_PATH_RE, '/_next/'),\n          location.origin,\n        ).href;\n\n        // resolveClientUrl may return a relative URL (e.g. the host-proxy\n        // path \"/rc-fetch-protected-remote?url=...\"). Normalize to absolute\n        // before comparing with s.src, which browsers always expose as\n        // absolute, so the deduplication check works in deployed contexts.\n        const rawResolved = resolveClientUrl?.(newSrc) ?? newSrc;\n        const resolvedSrc = new URL(rawResolved, location.href).href;\n\n        const alreadyLoaded = Array.from(\n          document.querySelectorAll<HTMLScriptElement>('script[src]'),\n        ).some((s) => s.src === resolvedSrc);\n        if (alreadyLoaded) {\n          resolve();\n          return;\n        }\n\n        const newScript = document.createElement('script');\n        newScript.onload = () => resolve();\n        newScript.onerror = () => {\n          const isProxied = isProxiedUrl(resolvedSrc);\n          if (isProxied) {\n            reject(failedProxiedAssetError('script', newSrc, resolvedSrc));\n          } else {\n            warnCrossOriginFetchError('ScriptLoader', newSrc);\n            reject(\n              new RemoteComponentsError(\n                `Failed to load <script src=\"${newSrc}\"> for Remote Component. Check the URL is correct.`,\n              ),\n            );\n          }\n        };\n        newScript.src = resolvedSrc;\n        newScript.async = true;\n        document.head.appendChild(newScript);\n      });\n    }),\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAYA,eAAsB,YACpB,SACA,kBACe;AACf,QAAM,QAAQ;AAAA,IACZ,QAAQ,IAAI,CAAC,WAAW;AACtB,aAAO,IAAI,QAAc,CAAC,SAAS,WAAW;AAC5C,cAAM,SAAS,IAAI;AAAA;AAAA,UAEjB,OAAO,IAAI,QAAQ,qBAAqB,SAAS;AAAA,UACjD,SAAS;AAAA,QACX,EAAE;AAMF,cAAM,cAAc,mBAAmB,MAAM,KAAK;AAClD,cAAM,cAAc,IAAI,IAAI,aAAa,SAAS,IAAI,EAAE;AAExD,cAAM,gBAAgB,MAAM;AAAA,UAC1B,SAAS,iBAAoC,aAAa;AAAA,QAC5D,EAAE,KAAK,CAAC,MAAM,EAAE,QAAQ,WAAW;AACnC,YAAI,eAAe;AACjB,kBAAQ;AACR;AAAA,QACF;AAEA,cAAM,YAAY,SAAS,cAAc,QAAQ;AACjD,kBAAU,SAAS,MAAM,QAAQ;AACjC,kBAAU,UAAU,MAAM;AACxB,gBAAM,YAAY,aAAa,WAAW;AAC1C,cAAI,WAAW;AACb,mBAAO,wBAAwB,UAAU,QAAQ,WAAW,CAAC;AAAA,UAC/D,OAAO;AACL,sCAA0B,gBAAgB,MAAM;AAChD;AAAA,cACE,IAAI;AAAA,gBACF,+BAA+B;AAAA,cACjC;AAAA,YACF;AAAA,UACF;AAAA,QACF;AACA,kBAAU,MAAM;AAChB,kBAAU,QAAQ;AAClB,iBAAS,KAAK,YAAY,SAAS;AAAA,MACrC,CAAC;AAAA,IACH,CAAC;AAAA,EACH;AACF;","names":[]}

package/dist/{chunk-I47KE3EC.cjs → chunk-AYC2AWUG.cjs}

@@ -1,14 +1,14 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } } function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } async function _asyncNullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return await rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkLCXO7BUYcjs = require('./chunk-LCXO7BUY.cjs');
+var _chunk42TVDI3Gcjs = require('./chunk-42TVDI3G.cjs');
 
 
 
-var _chunkRJW3EZJPcjs = require('./chunk-RJW3EZJP.cjs');
+var _chunkEYALF655cjs = require('./chunk-EYALF655.cjs');
 
 
 
-var _chunkT64P7BAGcjs = require('./chunk-T64P7BAG.cjs');
+var _chunkJJTCFQHEcjs = require('./chunk-JJTCFQHE.cjs');
 
 
 var _chunkTZT7DLO5cjs = require('./chunk-TZT7DLO5.cjs');
@@ -23,7 +23,7 @@ var _chunkTZT7DLO5cjs = require('./chunk-TZT7DLO5.cjs');
 
 
 
-var _chunkX6W464D6cjs = require('./chunk-X6W464D6.cjs');
+var _chunkRLI4YTBJcjs = require('./chunk-RLI4YTBJ.cjs');
 
 
 
@@ -285,12 +285,12 @@ function toComponentType(value) {
   return value && isComponentType(value) ? value : "unknown";
 }
 function buildMetadata(attrs, url) {
-  const id = attrs.id || _chunkX6W464D6cjs.DEFAULT_COMPONENT_NAME;
-  const bundle = attrs.bundle || process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION || _chunkX6W464D6cjs.DEFAULT_BUNDLE_NAME;
+  const id = attrs.id || _chunkRLI4YTBJcjs.DEFAULT_COMPONENT_NAME;
+  const bundle = attrs.bundle || process.env.NEXT_PUBLIC_MFE_CURRENT_APPLICATION || _chunkRLI4YTBJcjs.DEFAULT_BUNDLE_NAME;
   return {
     name: attrs.name || id.replace(/_ssr$/, ""),
     bundle,
-    route: attrs.route || url.pathname || _chunkX6W464D6cjs.DEFAULT_ROUTE,
+    route: attrs.route || url.pathname || _chunkRLI4YTBJcjs.DEFAULT_ROUTE,
     runtime: toRuntime(attrs.runtime),
     id,
     type: toComponentType(attrs.type)
@@ -329,7 +329,7 @@ function extractRemoteShared(doc, name, nextData) {
 function validateComponentFound(component, rsc, nextData, isRemoteComponent, url, name) {
   if (!component || !(rsc || nextData || isRemoteComponent)) {
     throw new (0, _chunkRUWR74XQcjs.RemoteComponentsError)(
-      `Remote Component not found on ${url}.${name !== _chunkX6W464D6cjs.DEFAULT_COMPONENT_NAME ? ` The name for the <RemoteComponent> is "${name}". Check <RemoteComponent> usage.` : ""} Did you forget to wrap the content in <RemoteComponent>?`
+      `Remote Component not found on ${url}.${name !== _chunkRLI4YTBJcjs.DEFAULT_COMPONENT_NAME ? ` The name for the <RemoteComponent> is "${name}". Check <RemoteComponent> usage.` : ""} Did you forget to wrap the content in <RemoteComponent>?`
     );
   }
 }
@@ -360,7 +360,7 @@ function parseRemoteComponentDocument(doc, name, url) {
       name: resolvedName,
       bundle: _optionalChain([component, 'optionalAccess', _34 => _34.getAttribute, 'call', _35 => _35(DATA_BUNDLE)]) || _optionalChain([nextData, 'optionalAccess', _36 => _36.props, 'access', _37 => _37.__REMOTE_COMPONENT__, 'optionalAccess', _38 => _38.bundle]),
       route: _nullishCoalesce(_optionalChain([component, 'optionalAccess', _39 => _39.getAttribute, 'call', _40 => _40(DATA_ROUTE)]), () => ( _optionalChain([nextData, 'optionalAccess', _41 => _41.page]))),
-      runtime: _nullishCoalesce(_nullishCoalesce(_optionalChain([component, 'optionalAccess', _42 => _42.getAttribute, 'call', _43 => _43(DATA_RUNTIME)]), () => ( _optionalChain([nextData, 'optionalAccess', _44 => _44.props, 'access', _45 => _45.__REMOTE_COMPONENT__, 'optionalAccess', _46 => _46.runtime]))), () => ( _chunkX6W464D6cjs.RUNTIME_SCRIPT)),
+      runtime: _nullishCoalesce(_nullishCoalesce(_optionalChain([component, 'optionalAccess', _42 => _42.getAttribute, 'call', _43 => _43(DATA_RUNTIME)]), () => ( _optionalChain([nextData, 'optionalAccess', _44 => _44.props, 'access', _45 => _45.__REMOTE_COMPONENT__, 'optionalAccess', _46 => _46.runtime]))), () => ( _chunkRLI4YTBJcjs.RUNTIME_SCRIPT)),
       id: _optionalChain([component, 'optionalAccess', _47 => _47.getAttribute, 'call', _48 => _48("id")]),
       type: _optionalChain([component, 'optionalAccess', _49 => _49.getAttribute, 'call', _50 => _50(DATA_TYPE)])
     },
@@ -430,7 +430,7 @@ async function loadRemoteComponent({
         self.__DISABLE_WEBPACK_EXEC__ = {};
       }
       self.__DISABLE_WEBPACK_EXEC__[bundle] = true;
-      await _chunkLCXO7BUYcjs.loadScripts.call(void 0, scripts, resolveClientUrl);
+      await _chunk42TVDI3Gcjs.loadScripts.call(void 0, scripts, resolveClientUrl);
     }
     const hostShared = await shared;
     _chunkRUWR74XQcjs.logDebug.call(void 0, 
@@ -445,7 +445,7 @@ async function loadRemoteComponent({
       "ComponentLoader",
       `Remote shared modules requested: ${JSON.stringify(remoteShared)}`
     );
-    const scope = await _chunkRJW3EZJPcjs.setupRemoteScope.call(void 0, 
+    const scope = await _chunkEYALF655cjs.setupRemoteScope.call(void 0, 
       runtime,
       scripts,
       url,
@@ -453,14 +453,14 @@ async function loadRemoteComponent({
       resolveClientUrl
     );
     if (runtime === "turbopack") {
-      await _chunkRJW3EZJPcjs.initializeSharedModules.call(void 0, 
+      await _chunkEYALF655cjs.initializeSharedModules.call(void 0, 
         scope,
-        _chunkX6W464D6cjs.buildCoreShared.call(void 0, hostShared),
+        _chunkRLI4YTBJcjs.buildCoreShared.call(void 0, hostShared),
         remoteShared
       );
     }
     if (bundle) {
-      const resolve = await _chunkX6W464D6cjs.buildWebpackResolve.call(void 0, 
+      const resolve = await _chunkRLI4YTBJcjs.buildWebpackResolve.call(void 0, 
         hostShared,
         remoteShared,
         bundle,
@@ -473,7 +473,7 @@ async function loadRemoteComponent({
         },
         "ComponentLoader"
       );
-      _chunkT64P7BAGcjs.applySharedModules.call(void 0, bundle, resolve);
+      _chunkJJTCFQHEcjs.applySharedModules.call(void 0, bundle, resolve);
     } else {
       _chunkRUWR74XQcjs.logWarn.call(void 0, 
         "ComponentLoader",
@@ -514,7 +514,7 @@ async function loadRSCComponent(rscName, data) {
   return { component };
 }
 function loadNextPagesComponent(bundle, route, nextData, name, container) {
-  const { Component, App } = _chunkT64P7BAGcjs.nextClientPagesLoader.call(void 0, bundle, route, container);
+  const { Component, App } = _chunkJJTCFQHEcjs.nextClientPagesLoader.call(void 0, bundle, route, container);
   if (!Component) {
     throw new (0, _chunkRUWR74XQcjs.RemoteComponentsError)(
       `Remote Component "${name}" is trying to load the component for route "${route}" but it is not available.`
@@ -571,12 +571,12 @@ async function loadPrepared(input) {
 function buildScriptDescriptors(scripts, url) {
   return scripts.map((script) => {
     const scriptSrc = script.getAttribute("data-src") || script.getAttribute("src") || script.src;
-    const { prefix, id: path } = _nullishCoalesce(_optionalChain([_chunkX6W464D6cjs.REMOTE_COMPONENT_REGEX, 'access', _51 => _51.exec, 'call', _52 => _52(scriptSrc), 'optionalAccess', _53 => _53.groups]), () => ( {
+    const { prefix, id: path } = _nullishCoalesce(_optionalChain([_chunkRLI4YTBJcjs.REMOTE_COMPONENT_REGEX, 'access', _51 => _51.exec, 'call', _52 => _52(scriptSrc), 'optionalAccess', _53 => _53.groups]), () => ( {
       prefix: void 0,
       id: scriptSrc
     }));
     return {
-      src: new URL(_chunkX6W464D6cjs.collapseDoubleSlashes.call(void 0, `${_nullishCoalesce(prefix, () => ( ""))}${path}`), url).href
+      src: new URL(_chunkRLI4YTBJcjs.collapseDoubleSlashes.call(void 0, `${_nullishCoalesce(prefix, () => ( ""))}${path}`), url).href
     };
   });
 }
@@ -609,7 +609,7 @@ async function loadDynamicPath(input) {
     resolveClientUrl,
     container
   } = input;
-  const rscName = _nullishCoalesce(input.rscName, () => ( (parsed.rsc ? `__remote_component_rsc_${_chunkX6W464D6cjs.escapeString.call(void 0, url.href)}_${_chunkX6W464D6cjs.escapeString.call(void 0, parsed.name)}` : void 0)));
+  const rscName = _nullishCoalesce(input.rscName, () => ( (parsed.rsc ? `__remote_component_rsc_${_chunkRLI4YTBJcjs.escapeString.call(void 0, url.href)}_${_chunkRLI4YTBJcjs.escapeString.call(void 0, parsed.name)}` : void 0)));
   const rscData = parsed.rsc ? (parsed.rsc.textContent || "").split("\n").filter(Boolean) : [];
   const result = await loadRemoteComponent({
     url,
@@ -621,7 +621,7 @@ async function loadDynamicPath(input) {
     data: rscData,
     nextData: parsed.nextData,
     scripts: scriptDescriptors,
-    shared: _chunkX6W464D6cjs.buildHostShared.call(void 0, shared, resolveClientUrl),
+    shared: _chunkRLI4YTBJcjs.buildHostShared.call(void 0, shared, resolveClientUrl),
     remoteShared: parsed.remoteShared,
     container,
     resolveClientUrl
@@ -700,4 +700,4 @@ function bindResolveClientUrl(prop, remoteSrc) {
 
 
 exports.fetchWithHooks = fetchWithHooks; exports.getClientOrServerUrl = getClientOrServerUrl; exports.makeReactEmitter = makeReactEmitter; exports.makeEventEmitter = makeEventEmitter; exports.createRSCStream = createRSCStream; exports.preparePipeline = preparePipeline; exports.loadPrepared = loadPrepared; exports.createHostState = createHostState; exports.resolveNameFromSrc = resolveNameFromSrc; exports.bindResolveClientUrl = bindResolveClientUrl;
-//# sourceMappingURL=chunk-I47KE3EC.cjs.map
+//# sourceMappingURL=chunk-AYC2AWUG.cjs.map

package/dist/{chunk-RJW3EZJP.cjs → chunk-EYALF655.cjs}

@@ -8,7 +8,7 @@
 
 
 
-var _chunkX6W464D6cjs = require('./chunk-X6W464D6.cjs');
+var _chunkRLI4YTBJcjs = require('./chunk-RLI4YTBJ.cjs');
 
 
 var _chunkZ2SLBFQLcjs = require('./chunk-Z2SLBFQL.cjs');
@@ -56,12 +56,12 @@ function loadChunkWithScope(scope, chunkId) {
   );
   const self = globalThis;
   const ns = _chunkZ2SLBFQLcjs.getNamespace.call(void 0, );
-  const { bundle, path, prefix } = _chunkX6W464D6cjs.parseRemoteId.call(void 0, chunkId);
+  const { bundle, path, prefix } = _chunkRLI4YTBJcjs.parseRemoteId.call(void 0, chunkId);
   const remoteRuntime = _optionalChain([self, 'access', _5 => _5.__remote_webpack_require__, 'optionalAccess', _6 => _6[_nullishCoalesce(bundle, () => ( "default"))]]) ? _optionalChain([self, 'access', _7 => _7.__remote_webpack_require__, 'access', _8 => _8[_nullishCoalesce(bundle, () => ( "default"))], 'optionalAccess', _9 => _9.type]) || "webpack" : scope.runtime;
-  if (remoteRuntime === _chunkX6W464D6cjs.RUNTIME_WEBPACK) {
+  if (remoteRuntime === _chunkRLI4YTBJcjs.RUNTIME_WEBPACK) {
     return Promise.resolve(void 0);
   }
-  const rawPath = path ? _chunkX6W464D6cjs.collapseDoubleSlashes.call(void 0, `${prefix}${path}`) : "/";
+  const rawPath = path ? _chunkRLI4YTBJcjs.collapseDoubleSlashes.call(void 0, `${prefix}${path}`) : "/";
   const url = new URL(rawPath, scope.url).href;
   if (url.endsWith(".css")) {
     return;
@@ -95,9 +95,9 @@ function loadChunkWithScope(scope, chunkId) {
 function createChunkDispatcher() {
   return function __chunk_dispatcher__(chunkId, scriptBundle) {
     _chunkRUWR74XQcjs.logDebug.call(void 0, "ChunkDispatcher", `Dispatching chunk: "${chunkId}"`);
-    const { bundle } = _chunkX6W464D6cjs.parseRemoteId.call(void 0, chunkId);
+    const { bundle } = _chunkRLI4YTBJcjs.parseRemoteId.call(void 0, chunkId);
     const bundleName = bundle || scriptBundle || "default";
-    const scope = _chunkX6W464D6cjs.getScope.call(void 0, bundleName);
+    const scope = _chunkRLI4YTBJcjs.getScope.call(void 0, bundleName);
     _chunkRUWR74XQcjs.logDebug.call(void 0, 
       "ChunkDispatcher",
       `Scope resolution: bundle="${bundleName}", scope=${_nullishCoalesce(_optionalChain([scope, 'optionalAccess', _12 => _12.scopedName]), () => ( "null"))}`
@@ -207,7 +207,7 @@ async function handleTurbopackChunk(code, scope, url) {
         const baseUrl = url.slice(0, url.indexOf("/_next"));
         const chunkLoadResult = loadChunkWithScope(
           scope,
-          _chunkX6W464D6cjs.formatRemoteId.call(void 0, scope, `${baseUrl}/_next/${id}`)
+          _chunkRLI4YTBJcjs.formatRemoteId.call(void 0, scope, `${baseUrl}/_next/${id}`)
         );
         if (chunkLoadResult) {
           loadChunkPromises.push(chunkLoadResult);
@@ -231,7 +231,7 @@ function requireModule(scope, moduleId, fullId) {
   return handleTurbopackModule(
     scope,
     idStr,
-    _nullishCoalesce(fullId, () => ( _chunkX6W464D6cjs.formatRemoteId.call(void 0, scope, idStr)))
+    _nullishCoalesce(fullId, () => ( _chunkRLI4YTBJcjs.formatRemoteId.call(void 0, scope, idStr)))
   );
 }
 function handleTurbopackModule(scope, moduleId, id) {
@@ -301,7 +301,7 @@ function findModuleInit(modules, moduleId) {
   return void 0;
 }
 function createTurbopackContext(scope, exports, moduleExports, modules, moduleInit, id) {
-  const scopedRequire = (moduleId) => requireModule(scope, moduleId, _chunkX6W464D6cjs.formatRemoteId.call(void 0, scope, String(moduleId)));
+  const scopedRequire = (moduleId) => requireModule(scope, moduleId, _chunkRLI4YTBJcjs.formatRemoteId.call(void 0, scope, String(moduleId)));
   return {
     // HMR not implemented for Remote Components
     k: {
@@ -430,7 +430,7 @@ function createTurbopackContext(scope, exports, moduleExports, modules, moduleIn
           const nextIndex = scriptSrc.indexOf("/_next");
           const baseUrl = nextIndex !== -1 ? scriptSrc.slice(0, nextIndex) : "";
           const chunkUrl = `${baseUrl}/_next/${url}`;
-          return loadChunkWithScope(scope, _chunkX6W464D6cjs.formatRemoteId.call(void 0, scope, chunkUrl));
+          return loadChunkWithScope(scope, _chunkRLI4YTBJcjs.formatRemoteId.call(void 0, scope, chunkUrl));
         }
       }
       throw new Error(
@@ -486,7 +486,7 @@ async function initializeSharedModules(scope, hostShared = {}, remoteShared = {}
         const { default: sharedModuleInitializerInstance } = handleTurbopackModule(
           scope,
           sharedModuleId,
-          _chunkX6W464D6cjs.formatRemoteId.call(void 0, scope, String(sharedModuleInitializerId))
+          _chunkRLI4YTBJcjs.formatRemoteId.call(void 0, scope, String(sharedModuleInitializerId))
         );
         sharedModuleInitializer = sharedModuleInitializerInstance;
       }
@@ -582,14 +582,14 @@ async function setupRemoteScope(runtime, scripts = [], url = new URL(location.hr
   const self = globalThis;
   const ns = _chunkZ2SLBFQLcjs.getNamespace.call(void 0, );
   const bundleName = _nullishCoalesce(bundle, () => ( "default"));
-  const existingScope = _chunkX6W464D6cjs.getScope.call(void 0, bundleName);
+  const existingScope = _chunkRLI4YTBJcjs.getScope.call(void 0, bundleName);
   if (existingScope && existingScope.url.origin === url.origin) {
     _chunkRUWR74XQcjs.logDebug.call(void 0, 
       "WebpackRuntime",
       `Reusing scope "${existingScope.scopedName}" (turbopackModules=${existingScope.turbopackModules.length})`
     );
     existingScope.resolveClientUrl = resolveClientUrl;
-    if (runtime === _chunkX6W464D6cjs.RUNTIME_TURBOPACK) {
+    if (runtime === _chunkRLI4YTBJcjs.RUNTIME_TURBOPACK) {
       await Promise.allSettled(
         scripts.map(
           (script) => script.src ? loadChunkWithScope(existingScope, script.src) : Promise.resolve(void 0)
@@ -598,9 +598,9 @@ async function setupRemoteScope(runtime, scripts = [], url = new URL(location.hr
     }
     return existingScope;
   }
-  const scope = _chunkX6W464D6cjs.createScope.call(void 0, bundleName, url, runtime, resolveClientUrl);
-  _chunkX6W464D6cjs.registerScope.call(void 0, scope);
-  if (runtime === _chunkX6W464D6cjs.RUNTIME_WEBPACK && _optionalChain([self, 'access', _17 => _17.__remote_webpack_require__, 'optionalAccess', _18 => _18[bundleName]])) {
+  const scope = _chunkRLI4YTBJcjs.createScope.call(void 0, bundleName, url, runtime, resolveClientUrl);
+  _chunkRLI4YTBJcjs.registerScope.call(void 0, scope);
+  if (runtime === _chunkRLI4YTBJcjs.RUNTIME_WEBPACK && _optionalChain([self, 'access', _17 => _17.__remote_webpack_require__, 'optionalAccess', _18 => _18[bundleName]])) {
     scope.webpackRequire = self.__remote_webpack_require__[bundleName];
   }
   ns.bundleUrls[bundleName] = url;
@@ -618,7 +618,7 @@ async function setupRemoteScope(runtime, scripts = [], url = new URL(location.hr
     self.__webpack_require__ = createModuleDispatcher(runtime);
     ns.dispatcherRuntime = runtime;
     self.__webpack_require_type__ = runtime;
-    if (self.__remote_webpack_require__ && runtime === _chunkX6W464D6cjs.RUNTIME_TURBOPACK) {
+    if (self.__remote_webpack_require__ && runtime === _chunkRLI4YTBJcjs.RUNTIME_TURBOPACK) {
       self.__remote_webpack_require__[bundleName] = self.__webpack_require__;
       self.__remote_webpack_require__[bundleName].type = "turbopack";
     }
@@ -626,7 +626,7 @@ async function setupRemoteScope(runtime, scripts = [], url = new URL(location.hr
   if (_optionalChain([self, 'access', _19 => _19.__remote_webpack_require__, 'optionalAccess', _20 => _20[bundleName]]) && scope.scopedName !== bundleName) {
     self.__remote_webpack_require__[scope.scopedName] = self.__remote_webpack_require__[bundleName];
   }
-  if (runtime === _chunkX6W464D6cjs.RUNTIME_TURBOPACK) {
+  if (runtime === _chunkRLI4YTBJcjs.RUNTIME_TURBOPACK) {
     const results = await Promise.allSettled(
       scripts.map((script) => {
         if (script.src) {
@@ -649,7 +649,7 @@ async function setupRemoteScope(runtime, scripts = [], url = new URL(location.hr
 function createModuleDispatcher(runtime) {
   return (id) => {
     const self = globalThis;
-    const { bundle, id: moduleId } = _nullishCoalesce(_optionalChain([id, 'access', _21 => _21.match, 'call', _22 => _22(_chunkX6W464D6cjs.REMOTE_COMPONENT_REGEX), 'optionalAccess', _23 => _23.groups]), () => ( {
+    const { bundle, id: moduleId } = _nullishCoalesce(_optionalChain([id, 'access', _21 => _21.match, 'call', _22 => _22(_chunkRLI4YTBJcjs.REMOTE_COMPONENT_REGEX), 'optionalAccess', _23 => _23.groups]), () => ( {
       bundle: "default",
       id
     }));
@@ -660,13 +660,13 @@ function createModuleDispatcher(runtime) {
       `Resolving "${id}" (bundle: "${bundleName}", runtime: "${remoteRuntime}")`
     );
     try {
-      if (remoteRuntime === _chunkX6W464D6cjs.RUNTIME_WEBPACK && bundle && moduleId) {
-        const scope2 = _chunkX6W464D6cjs.getScope.call(void 0, bundle);
+      if (remoteRuntime === _chunkRLI4YTBJcjs.RUNTIME_WEBPACK && bundle && moduleId) {
+        const scope2 = _chunkRLI4YTBJcjs.getScope.call(void 0, bundle);
         if (_optionalChain([scope2, 'optionalAccess', _29 => _29.webpackRequire]))
           return scope2.webpackRequire(moduleId);
         return _optionalChain([self, 'access', _30 => _30.__remote_webpack_require__, 'optionalAccess', _31 => _31[bundle], 'optionalCall', _32 => _32(moduleId)]);
       }
-      const scope = _chunkX6W464D6cjs.getScope.call(void 0, bundleName);
+      const scope = _chunkRLI4YTBJcjs.getScope.call(void 0, bundleName);
       if (scope) {
         return requireModule(scope, _nullishCoalesce(moduleId, () => ( id)), id);
       }
@@ -706,4 +706,4 @@ function createModuleDispatcher(runtime) {
 
 
 exports.initializeSharedModules = initializeSharedModules; exports.setupRemoteScope = setupRemoteScope;
-//# sourceMappingURL=chunk-RJW3EZJP.cjs.map
+//# sourceMappingURL=chunk-EYALF655.cjs.map

package/dist/{chunk-T64P7BAG.cjs → chunk-JJTCFQHE.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
 
-var _chunkX6W464D6cjs = require('./chunk-X6W464D6.cjs');
+var _chunkRLI4YTBJcjs = require('./chunk-RLI4YTBJ.cjs');
 
 
 var _chunkZ2SLBFQLcjs = require('./chunk-Z2SLBFQL.cjs');
@@ -22,7 +22,7 @@ function applySharedModules(bundle, resolve) {
     `Shared modules to resolve: ${Object.keys(resolve)}`
   );
   const self = globalThis;
-  const scope = _chunkX6W464D6cjs.getScope.call(void 0, bundle);
+  const scope = _chunkRLI4YTBJcjs.getScope.call(void 0, bundle);
   const webpackBundle = _nullishCoalesce(_optionalChain([scope, 'optionalAccess', _ => _.webpackRequire]), () => ( _optionalChain([self, 'access', _2 => _2.__remote_webpack_require__, 'optionalAccess', _3 => _3[bundle]])));
   if (webpackBundle) {
     const modulePaths = Object.keys(
@@ -199,4 +199,4 @@ function nextClientPagesLoader(bundle, route, styleContainer = document.head) {
 
 
 exports.applySharedModules = applySharedModules; exports.nextClientPagesLoader = nextClientPagesLoader;
-//# sourceMappingURL=chunk-T64P7BAG.cjs.map
+//# sourceMappingURL=chunk-JJTCFQHE.cjs.map

package/dist/{chunk-52BJ7VFA.js → chunk-MKO52FRO.js}

@@ -1,6 +1,6 @@
 import {
   getScope
-} from "./chunk-SJM7AAGU.js";
+} from "./chunk-SAGYPGIQ.js";
 import {
   getNamespace
 } from "./chunk-D5GNZB6O.js";
@@ -199,4 +199,4 @@ export {
   applySharedModules,
   nextClientPagesLoader
 };
-//# sourceMappingURL=chunk-52BJ7VFA.js.map
+//# sourceMappingURL=chunk-MKO52FRO.js.map

package/dist/{chunk-QKB74MLO.js → chunk-N3KPUFOB.js}

@@ -8,7 +8,7 @@ import {
   getScope,
   parseRemoteId,
   registerScope
-} from "./chunk-SJM7AAGU.js";
+} from "./chunk-SAGYPGIQ.js";
 import {
   getNamespace
 } from "./chunk-D5GNZB6O.js";
@@ -706,4 +706,4 @@ export {
   initializeSharedModules,
   setupRemoteScope
 };
-//# sourceMappingURL=chunk-QKB74MLO.js.map
+//# sourceMappingURL=chunk-N3KPUFOB.js.map

package/dist/chunk-N3SQTOSE.cjs

@@ -0,0 +1,25 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+var _chunk5KTAEO52cjs = require('./chunk-5KTAEO52.cjs');
+
+// src/host/navigation/index.ts
+function onRemoteNavigate(callback) {
+  if (typeof window === "undefined") {
+    return () => {
+    };
+  }
+  const handler = (event) => {
+    const detail = event.detail;
+    callback(_chunk5KTAEO52cjs.parseRemoteNavigateDetail.call(void 0, detail));
+  };
+  window.addEventListener(_chunk5KTAEO52cjs.REMOTE_NAVIGATE_EVENT, handler);
+  return () => {
+    window.removeEventListener(_chunk5KTAEO52cjs.REMOTE_NAVIGATE_EVENT, handler);
+  };
+}
+
+
+
+exports.onRemoteNavigate = onRemoteNavigate;
+//# sourceMappingURL=chunk-N3SQTOSE.cjs.map

package/dist/chunk-N3SQTOSE.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/host/navigation/index.ts"],"names":[],"mappings":";;;;;;AAkCO,SAAS,iBACd,UACY;AACZ,MAAI,OAAO,WAAW,aAAa;AACjC,WAAO,MAAM;AAAA,IAAC;AAAA,EAChB;AACA,QAAM,UAAU,CAAC,UAAiB;AAChC,UAAM,SAAU,MAA4C;AAC5D,aAAS,0BAA0B,MAAM,CAAC;AAAA,EAC5C;AACA,SAAO,iBAAiB,uBAAuB,OAAO;AACtD,SAAO,MAAM;AACX,WAAO,oBAAoB,uBAAuB,OAAO;AAAA,EAC3D;AACF","sourcesContent":["import {\n  parseRemoteNavigateDetail,\n  REMOTE_NAVIGATE_EVENT,\n  type RemoteNavigateDetail,\n  type RemoteNavigateEvent,\n} from '#internal/host/shared/navigate-event';\n\nexport type { RemoteNavigateEvent } from '#internal/host/shared/navigate-event';\n\n/**\n * Subscribe to navigation requests from remote components. One subscription\n * handles every `<ConsumeRemoteComponent>` on the page. SSR-safe: no-op when\n * `window` is undefined.\n *\n * In React, prefer `useRemoteNavigate` from `remote-components/host/react` —\n * it avoids re-registering the listener on every render.\n *\n * @example React Router\n * ```ts\n * useEffect(\n *   () =>\n *     onRemoteNavigate((e) =>\n *       navigate(e.pathname + e.search, { replace: e.type === 'replace' }),\n *     ),\n *   [navigate],\n * );\n * ```\n *\n * @example Plain HTML\n * ```ts\n * // Always replace — the polyfill already pushed/replaced the browser history entry.\n * onRemoteNavigate((e) => window.location.replace(e.url));\n * ```\n */\nexport function onRemoteNavigate(\n  callback: (event: RemoteNavigateEvent) => void,\n): () => void {\n  if (typeof window === 'undefined') {\n    return () => {};\n  }\n  const handler = (event: Event) => {\n    const detail = (event as CustomEvent<RemoteNavigateDetail>).detail;\n    callback(parseRemoteNavigateDetail(detail));\n  };\n  window.addEventListener(REMOTE_NAVIGATE_EVENT, handler);\n  return () => {\n    window.removeEventListener(REMOTE_NAVIGATE_EVENT, handler);\n  };\n}\n"]}

package/dist/{chunk-GBFUPMMI.js → chunk-NN5V3FVD.js}

@@ -7,10 +7,13 @@ import {
   makeReactEmitter,
   preparePipeline,
   resolveNameFromSrc
-} from "./chunk-NZAB7REE.js";
+} from "./chunk-5WL3FP4V.js";
 import {
   loadStaticRemoteComponent
 } from "./chunk-LQ7VQ74E.js";
+import {
+  onRemoteNavigate
+} from "./chunk-RHGEBXPL.js";
 import {
   DEFAULT_COMPONENT_NAME,
   DEFAULT_ROUTE,
@@ -18,7 +21,7 @@ import {
   RUNTIME_WEBPACK,
   attrToProp,
   escapeString
-} from "./chunk-SJM7AAGU.js";
+} from "./chunk-SAGYPGIQ.js";
 import {
   getNamespace
 } from "./chunk-D5GNZB6O.js";
@@ -31,11 +34,11 @@ import {
 // src/host/react/index.tsx
 import {
   startTransition,
-  useEffect,
+  useEffect as useEffect2,
   useId,
   useLayoutEffect as useLayoutEffect2,
   useMemo as useMemo2,
-  useRef as useRef2,
+  useRef as useRef3,
   useState as useState2
 } from "react";
 import { createPortal } from "react-dom";
@@ -159,6 +162,14 @@ function getRemoteComponentHtml(html) {
   return "";
 }
 
+// src/host/react/hooks/use-remote-navigate.ts
+import { useEffect, useRef as useRef2 } from "react";
+function useRemoteNavigate(callback) {
+  const callbackRef = useRef2(callback);
+  callbackRef.current = callback;
+  useEffect(() => onRemoteNavigate((event) => callbackRef.current(event)), []);
+}
+
 // src/host/react/index.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { createElement } from "react";
@@ -206,13 +217,13 @@ function ConsumeRemoteComponent({
     mode,
     keySuffix
   });
-  const htmlRef = useRef2(
+  const htmlRef = useRef3(
     typeof document !== "undefined" ? document.querySelector(
       `[data-remote-component-id="shadowroot_${keySuffix}"]`
     )?.shadowRoot?.innerHTML ?? document.getElementById(`__REMOTE_COMPONENT${name}`)?.innerHTML ?? document.querySelector(`div[data-bundle][data-route][id^="${name}"]`)?.innerHTML ?? document.querySelector("div[data-bundle][data-route]")?.innerHTML : null
   );
-  const endTemplateRef = useRef2(null);
-  const childrenRef = useRef2(
+  const endTemplateRef = useRef3(null);
+  const childrenRef = useRef3(
     typeof document !== "undefined" ? (() => {
       let el = document.querySelector(`template[id="${name}_start"]`);
       const elements = [];
@@ -225,10 +236,10 @@ function ConsumeRemoteComponent({
       return elements;
     })() : []
   );
-  const hostStateRef = useRef2(createHostState());
-  const componentHydrationHtml = useRef2(null);
-  const prevRemoteComponentContainerRef = useRef2(null);
-  const unmountRef = useRef2(null);
+  const hostStateRef = useRef3(createHostState());
+  const componentHydrationHtml = useRef3(null);
+  const prevRemoteComponentContainerRef = useRef3(null);
+  const unmountRef = useRef3(null);
   useLayoutEffect2(() => {
     return () => {
       delete getNamespace().shadowRoots[keySuffix];
@@ -265,7 +276,7 @@ function ConsumeRemoteComponent({
       }
     }
   }, [shadowRoot, remoteComponent, name]);
-  useEffect(() => {
+  useEffect2(() => {
     if (src && src !== hostStateRef.current.prevSrc) {
       const previousSrc = hostStateRef.current.prevSrc;
       const previousName = hostStateRef.current.prevName;
@@ -665,6 +676,7 @@ function ConsumeRemoteComponent({
 }
 
 export {
+  useRemoteNavigate,
   ConsumeRemoteComponent
 };
-//# sourceMappingURL=chunk-GBFUPMMI.js.map
+//# sourceMappingURL=chunk-NN5V3FVD.js.map