@frontegg/react-hooks 7.105.0 → 7.106.0-alpha.0

package/FronteggProvider/FronteggProvider.js

@@ -1,11 +1,13 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 const _excluded = ["authenticatedUrl", "signUpSuccessUrl", "openAppUrl"];
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import React, { useCallback, useMemo, useRef, useState } from 'react';
 import { createStore } from '@frontegg/redux-store';
 import { ContextHolder } from '@frontegg/rest-api';
 import { Provider } from '../FronteggStoreContext';
 import { useAuth, useAuthRoutes } from '../auth';
+import { getCurrentUri } from '../common/patchHistoryEvents';
+import { useSubscribeToLocationChanges } from '../common/useSubscribeToLocationChanges';
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
@@ -21,34 +23,16 @@ const HideChildrenIfFronteggRoutes = ({
   basename
 }) => {
   const routes = useAuthRoutes();
-  const uriRef = useRef(window.location.pathname);
-  const animationFrameRef = useRef(0);
+  const fullUriRef = useRef(getCurrentUri());
   const [uri, setUri] = useState(window.location.pathname);
-  const checker = useCallback(() => {
-    if (uriRef.current !== window.location.pathname) {
-      uriRef.current = window.location.pathname;
-      setUri(document.location.pathname);
+  const syncUri = useCallback(() => {
+    const currentFullUri = getCurrentUri();
+    if (fullUriRef.current !== currentFullUri) {
+      fullUriRef.current = currentFullUri;
+      setUri(window.location.pathname);
     }
-    animationFrameRef.current = window.requestAnimationFrame(checker);
   }, []);
-  useEffect(() => {
-    document.addEventListener('frontegg_onRedirectTo_fired', () => {
-      if (uriRef.current !== window.location.pathname) {
-        uriRef.current = window.location.pathname;
-        setUri(document.location.pathname);
-      }
-    });
-    window.addEventListener('popstate', () => {
-      if (uriRef.current !== window.location.pathname) {
-        uriRef.current = window.location.pathname;
-        setUri(document.location.pathname);
-      }
-    });
-    animationFrameRef.current = window.requestAnimationFrame(checker);
-    return () => {
-      window.cancelAnimationFrame(animationFrameRef.current);
-    };
-  }, [checker, setUri]);
+  useSubscribeToLocationChanges(syncUri);
   const calculatedBasename = basename ? basename.endsWith('/') ? basename.substring(0, basename.length - 1) : '' : '';
   const {
       // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/common/index.d.ts

@@ -22,3 +22,5 @@ export declare const ShadowDomContext: import("react").Context<ShadowDomContextD
 export declare const useShadowDom: () => DomContext;
 export declare const useRootState: () => FronteggState["root"];
 export * from './CustomComponentHolder';
+export * from './patchHistoryEvents';
+export * from './useSubscribeToLocationChanges';

package/common/index.js

@@ -46,4 +46,6 @@ export const useShadowDom = () => {
 export const useRootState = () => {
   return useSnapshot(useStore().store.root);
 };
-export * from './CustomComponentHolder';
+export * from './CustomComponentHolder';
+export * from './patchHistoryEvents';
+export * from './useSubscribeToLocationChanges';

package/common/patchHistoryEvents.d.ts

@@ -0,0 +1,41 @@
+export declare const FRONTEGG_LOCATION_CHANGE: "frontegg_locationchange";
+/**
+ * Returns the full client-side URL (pathname + search + hash).
+ * Used as the change-detection fingerprint so that URL changes
+ * in any segment (path, query, hash) are captured.
+ */
+export declare function getCurrentUri(): string;
+/**
+ * Monkey-patches `history.pushState` and `history.replaceState` to dispatch
+ * a {@link FRONTEGG_LOCATION_CHANGE} event so components can react to
+ * programmatic navigation without polling.
+ *
+ * @returns `true` if the patch was applied (or was already applied),
+ *          `false` if patching failed (e.g. non-writable History methods
+ *          in hardened/frozen environments).
+ *
+ * Idempotent across multiple bundle instances — patch state is stored on
+ * `window` via `Symbol.for`, so even if several copies of this module are
+ * loaded (microfrontends, version mismatches, local dev) the History API
+ * is only patched once.
+ *
+ * Limitation: if another library overwrites `history.pushState`/`replaceState`
+ * AFTER this patch runs, the custom event will stop firing.
+ */
+export declare function patchHistoryEvents(): boolean;
+/**
+ * Subscribes `callback` to all location-change sources:
+ *
+ *  1. `popstate`                     — browser back/forward
+ *  2. `hashchange`                   — hash fragment changes
+ *  3. `frontegg_onRedirectTo_fired`  — Frontegg internal redirects
+ *  4. `FRONTEGG_LOCATION_CHANGE`     — our patched pushState/replaceState
+ *  5. Low-frequency polling fallback — only enabled when the History patch
+ *     fails (non-writable / hardened environment)
+ *
+ * Calls `callback` once after setup to catch navigations that occurred
+ * between render and listener registration.
+ *
+ * @returns A cleanup function that removes all listeners and timers.
+ */
+export declare function subscribeToLocationChanges(callback: () => void): () => void;

package/common/patchHistoryEvents.js

@@ -0,0 +1,114 @@
+export const FRONTEGG_LOCATION_CHANGE = 'frontegg_locationchange';
+const PATCH_STATE_KEY = Symbol.for('frontegg.history.patch');
+const FALLBACK_POLL_MS = 1000;
+/**
+ * Returns the full client-side URL (pathname + search + hash).
+ * Used as the change-detection fingerprint so that URL changes
+ * in any segment (path, query, hash) are captured.
+ */
+export function getCurrentUri() {
+  return window.location.pathname + window.location.search + window.location.hash;
+}
+
+/**
+ * Monkey-patches `history.pushState` and `history.replaceState` to dispatch
+ * a {@link FRONTEGG_LOCATION_CHANGE} event so components can react to
+ * programmatic navigation without polling.
+ *
+ * @returns `true` if the patch was applied (or was already applied),
+ *          `false` if patching failed (e.g. non-writable History methods
+ *          in hardened/frozen environments).
+ *
+ * Idempotent across multiple bundle instances — patch state is stored on
+ * `window` via `Symbol.for`, so even if several copies of this module are
+ * loaded (microfrontends, version mismatches, local dev) the History API
+ * is only patched once.
+ *
+ * Limitation: if another library overwrites `history.pushState`/`replaceState`
+ * AFTER this patch runs, the custom event will stop firing.
+ */
+export function patchHistoryEvents() {
+  var _win$PATCH_STATE_KEY;
+  if (typeof window === 'undefined') {
+    return false;
+  }
+  const win = window;
+  if ((_win$PATCH_STATE_KEY = win[PATCH_STATE_KEY]) != null && _win$PATCH_STATE_KEY.patched) {
+    return true;
+  }
+  const originalPushState = window.history.pushState;
+  const originalReplaceState = window.history.replaceState;
+  const wrappedPushState = function (...args) {
+    const result = originalPushState.apply(this, args);
+    window.dispatchEvent(new Event(FRONTEGG_LOCATION_CHANGE));
+    return result;
+  };
+  const wrappedReplaceState = function (...args) {
+    const result = originalReplaceState.apply(this, args);
+    window.dispatchEvent(new Event(FRONTEGG_LOCATION_CHANGE));
+    return result;
+  };
+  try {
+    window.history.pushState = wrappedPushState;
+    window.history.replaceState = wrappedReplaceState;
+
+    // Verify assignments took effect (non-writable properties silently fail in non-strict mode)
+    if (window.history.pushState === originalPushState || window.history.replaceState === originalReplaceState) {
+      window.history.pushState = originalPushState;
+      window.history.replaceState = originalReplaceState;
+      return false;
+    }
+  } catch {
+    // history methods may be non-writable in hardened environments — rollback any partial patch
+    try {
+      window.history.pushState = originalPushState;
+      window.history.replaceState = originalReplaceState;
+    } catch {
+      /* best-effort rollback */
+    }
+    return false;
+  }
+  win[PATCH_STATE_KEY] = {
+    patched: true,
+    originalPushState,
+    originalReplaceState
+  };
+  return true;
+}
+
+/**
+ * Subscribes `callback` to all location-change sources:
+ *
+ *  1. `popstate`                     — browser back/forward
+ *  2. `hashchange`                   — hash fragment changes
+ *  3. `frontegg_onRedirectTo_fired`  — Frontegg internal redirects
+ *  4. `FRONTEGG_LOCATION_CHANGE`     — our patched pushState/replaceState
+ *  5. Low-frequency polling fallback — only enabled when the History patch
+ *     fails (non-writable / hardened environment)
+ *
+ * Calls `callback` once after setup to catch navigations that occurred
+ * between render and listener registration.
+ *
+ * @returns A cleanup function that removes all listeners and timers.
+ */
+export function subscribeToLocationChanges(callback) {
+  const patched = patchHistoryEvents();
+  document.addEventListener('frontegg_onRedirectTo_fired', callback);
+  window.addEventListener('popstate', callback);
+  window.addEventListener('hashchange', callback);
+  window.addEventListener(FRONTEGG_LOCATION_CHANGE, callback);
+  let fallbackInterval;
+  if (!patched) {
+    fallbackInterval = setInterval(callback, FALLBACK_POLL_MS);
+  }
+  callback();
+  return () => {
+    document.removeEventListener('frontegg_onRedirectTo_fired', callback);
+    window.removeEventListener('popstate', callback);
+    window.removeEventListener('hashchange', callback);
+    window.removeEventListener(FRONTEGG_LOCATION_CHANGE, callback);
+    if (fallbackInterval !== undefined) {
+      clearInterval(fallbackInterval);
+    }
+  };
+}

package/common/useSubscribeToLocationChanges.d.ts

@@ -0,0 +1,8 @@
+/**
+ * React hook that subscribes to all location-change sources and calls
+ * `callback` whenever the URL changes.
+ *
+ * Delegates to {@link subscribeToLocationChanges} inside a `useEffect`
+ * so the subscription lifecycle is tied to the component mount/unmount cycle.
+ */
+export declare function useSubscribeToLocationChanges(callback: () => void): void;

package/common/useSubscribeToLocationChanges.js

@@ -0,0 +1,16 @@
+import { useEffect } from 'react';
+import { subscribeToLocationChanges } from './patchHistoryEvents';
+
+/**
+ * React hook that subscribes to all location-change sources and calls
+ * `callback` whenever the URL changes.
+ *
+ * Delegates to {@link subscribeToLocationChanges} inside a `useEffect`
+ * so the subscription lifecycle is tied to the component mount/unmount cycle.
+ */
+export function useSubscribeToLocationChanges(callback) {
+  useEffect(() => {
+    const unsubscribe = subscribeToLocationChanges(callback);
+    return unsubscribe;
+  }, [callback]);
+}

package/index.js

@@ -1,4 +1,4 @@
-/** @license Frontegg v7.105.0
+/** @license Frontegg v7.106.0-alpha.0
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/node/FronteggProvider/FronteggProvider.js

@@ -12,6 +12,8 @@ var _reduxStore = require("@frontegg/redux-store");
 var _restApi = require("@frontegg/rest-api");
 var _FronteggStoreContext = require("../FronteggStoreContext");
 var _auth = require("../auth");
+var _patchHistoryEvents = require("../common/patchHistoryEvents");
+var _useSubscribeToLocationChanges = require("../common/useSubscribeToLocationChanges");
 var _jsxRuntime = require("react/jsx-runtime");
 const _excluded = ["authenticatedUrl", "signUpSuccessUrl", "openAppUrl"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -28,34 +30,16 @@ const HideChildrenIfFronteggRoutes = ({
   basename
 }) => {
   const routes = (0, _auth.useAuthRoutes)();
-  const uriRef = (0, _react.useRef)(window.location.pathname);
-  const animationFrameRef = (0, _react.useRef)(0);
+  const fullUriRef = (0, _react.useRef)((0, _patchHistoryEvents.getCurrentUri)());
   const [uri, setUri] = (0, _react.useState)(window.location.pathname);
-  const checker = (0, _react.useCallback)(() => {
-    if (uriRef.current !== window.location.pathname) {
-      uriRef.current = window.location.pathname;
-      setUri(document.location.pathname);
+  const syncUri = (0, _react.useCallback)(() => {
+    const currentFullUri = (0, _patchHistoryEvents.getCurrentUri)();
+    if (fullUriRef.current !== currentFullUri) {
+      fullUriRef.current = currentFullUri;
+      setUri(window.location.pathname);
     }
-    animationFrameRef.current = window.requestAnimationFrame(checker);
   }, []);
-  (0, _react.useEffect)(() => {
-    document.addEventListener('frontegg_onRedirectTo_fired', () => {
-      if (uriRef.current !== window.location.pathname) {
-        uriRef.current = window.location.pathname;
-        setUri(document.location.pathname);
-      }
-    });
-    window.addEventListener('popstate', () => {
-      if (uriRef.current !== window.location.pathname) {
-        uriRef.current = window.location.pathname;
-        setUri(document.location.pathname);
-      }
-    });
-    animationFrameRef.current = window.requestAnimationFrame(checker);
-    return () => {
-      window.cancelAnimationFrame(animationFrameRef.current);
-    };
-  }, [checker, setUri]);
+  (0, _useSubscribeToLocationChanges.useSubscribeToLocationChanges)(syncUri);
   const calculatedBasename = basename ? basename.endsWith('/') ? basename.substring(0, basename.length - 1) : '' : '';
   const {
       // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/node/common/index.js

@@ -28,6 +28,30 @@ Object.keys(_CustomComponentHolder).forEach(function (key) {
     }
   });
 });
+var _patchHistoryEvents = require("./patchHistoryEvents");
+Object.keys(_patchHistoryEvents).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _patchHistoryEvents[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _patchHistoryEvents[key];
+    }
+  });
+});
+var _useSubscribeToLocationChanges = require("./useSubscribeToLocationChanges");
+Object.keys(_useSubscribeToLocationChanges).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _useSubscribeToLocationChanges[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useSubscribeToLocationChanges[key];
+    }
+  });
+});
 const _excluded = ["urlStrategy", "onRedirectTo", "renderByRoute", "customLoader", "customStyles", "contextOptions"];
 const ShadowDomContext = /*#__PURE__*/(0, _react.createContext)({});
 exports.ShadowDomContext = ShadowDomContext;

package/node/common/patchHistoryEvents.js

@@ -0,0 +1,124 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.FRONTEGG_LOCATION_CHANGE = void 0;
+exports.getCurrentUri = getCurrentUri;
+exports.patchHistoryEvents = patchHistoryEvents;
+exports.subscribeToLocationChanges = subscribeToLocationChanges;
+const FRONTEGG_LOCATION_CHANGE = 'frontegg_locationchange';
+exports.FRONTEGG_LOCATION_CHANGE = FRONTEGG_LOCATION_CHANGE;
+const PATCH_STATE_KEY = Symbol.for('frontegg.history.patch');
+const FALLBACK_POLL_MS = 1000;
+/**
+ * Returns the full client-side URL (pathname + search + hash).
+ * Used as the change-detection fingerprint so that URL changes
+ * in any segment (path, query, hash) are captured.
+ */
+function getCurrentUri() {
+  return window.location.pathname + window.location.search + window.location.hash;
+}
+
+/**
+ * Monkey-patches `history.pushState` and `history.replaceState` to dispatch
+ * a {@link FRONTEGG_LOCATION_CHANGE} event so components can react to
+ * programmatic navigation without polling.
+ *
+ * @returns `true` if the patch was applied (or was already applied),
+ *          `false` if patching failed (e.g. non-writable History methods
+ *          in hardened/frozen environments).
+ *
+ * Idempotent across multiple bundle instances — patch state is stored on
+ * `window` via `Symbol.for`, so even if several copies of this module are
+ * loaded (microfrontends, version mismatches, local dev) the History API
+ * is only patched once.
+ *
+ * Limitation: if another library overwrites `history.pushState`/`replaceState`
+ * AFTER this patch runs, the custom event will stop firing.
+ */
+function patchHistoryEvents() {
+  var _win$PATCH_STATE_KEY;
+  if (typeof window === 'undefined') {
+    return false;
+  }
+  const win = window;
+  if ((_win$PATCH_STATE_KEY = win[PATCH_STATE_KEY]) != null && _win$PATCH_STATE_KEY.patched) {
+    return true;
+  }
+  const originalPushState = window.history.pushState;
+  const originalReplaceState = window.history.replaceState;
+  const wrappedPushState = function (...args) {
+    const result = originalPushState.apply(this, args);
+    window.dispatchEvent(new Event(FRONTEGG_LOCATION_CHANGE));
+    return result;
+  };
+  const wrappedReplaceState = function (...args) {
+    const result = originalReplaceState.apply(this, args);
+    window.dispatchEvent(new Event(FRONTEGG_LOCATION_CHANGE));
+    return result;
+  };
+  try {
+    window.history.pushState = wrappedPushState;
+    window.history.replaceState = wrappedReplaceState;
+
+    // Verify assignments took effect (non-writable properties silently fail in non-strict mode)
+    if (window.history.pushState === originalPushState || window.history.replaceState === originalReplaceState) {
+      window.history.pushState = originalPushState;
+      window.history.replaceState = originalReplaceState;
+      return false;
+    }
+  } catch {
+    // history methods may be non-writable in hardened environments — rollback any partial patch
+    try {
+      window.history.pushState = originalPushState;
+      window.history.replaceState = originalReplaceState;
+    } catch {
+      /* best-effort rollback */
+    }
+    return false;
+  }
+  win[PATCH_STATE_KEY] = {
+    patched: true,
+    originalPushState,
+    originalReplaceState
+  };
+  return true;
+}
+
+/**
+ * Subscribes `callback` to all location-change sources:
+ *
+ *  1. `popstate`                     — browser back/forward
+ *  2. `hashchange`                   — hash fragment changes
+ *  3. `frontegg_onRedirectTo_fired`  — Frontegg internal redirects
+ *  4. `FRONTEGG_LOCATION_CHANGE`     — our patched pushState/replaceState
+ *  5. Low-frequency polling fallback — only enabled when the History patch
+ *     fails (non-writable / hardened environment)
+ *
+ * Calls `callback` once after setup to catch navigations that occurred
+ * between render and listener registration.
+ *
+ * @returns A cleanup function that removes all listeners and timers.
+ */
+function subscribeToLocationChanges(callback) {
+  const patched = patchHistoryEvents();
+  document.addEventListener('frontegg_onRedirectTo_fired', callback);
+  window.addEventListener('popstate', callback);
+  window.addEventListener('hashchange', callback);
+  window.addEventListener(FRONTEGG_LOCATION_CHANGE, callback);
+  let fallbackInterval;
+  if (!patched) {
+    fallbackInterval = setInterval(callback, FALLBACK_POLL_MS);
+  }
+  callback();
+  return () => {
+    document.removeEventListener('frontegg_onRedirectTo_fired', callback);
+    window.removeEventListener('popstate', callback);
+    window.removeEventListener('hashchange', callback);
+    window.removeEventListener(FRONTEGG_LOCATION_CHANGE, callback);
+    if (fallbackInterval !== undefined) {
+      clearInterval(fallbackInterval);
+    }
+  };
+}

package/node/common/useSubscribeToLocationChanges.js

@@ -0,0 +1,21 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useSubscribeToLocationChanges = useSubscribeToLocationChanges;
+var _react = require("react");
+var _patchHistoryEvents = require("./patchHistoryEvents");
+/**
+ * React hook that subscribes to all location-change sources and calls
+ * `callback` whenever the URL changes.
+ *
+ * Delegates to {@link subscribeToLocationChanges} inside a `useEffect`
+ * so the subscription lifecycle is tied to the component mount/unmount cycle.
+ */
+function useSubscribeToLocationChanges(callback) {
+  (0, _react.useEffect)(() => {
+    const unsubscribe = (0, _patchHistoryEvents.subscribeToLocationChanges)(callback);
+    return unsubscribe;
+  }, [callback]);
+}

package/node/index.js

@@ -1,4 +1,4 @@
-/** @license Frontegg v7.105.0
+/** @license Frontegg v7.106.0-alpha.0
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/package.json

@@ -1,13 +1,13 @@
 {
   "name": "@frontegg/react-hooks",
-  "version": "7.105.0",
+  "version": "7.106.0-alpha.0",
   "main": "./node/index.js",
   "license": "MIT",
   "author": "Frontegg LTD",
   "dependencies": {
     "@babel/runtime": "^7.18.6",
-    "@frontegg/redux-store": "7.105.0",
-    "@frontegg/types": "7.105.0",
+    "@frontegg/redux-store": "7.106.0-alpha.0",
+    "@frontegg/types": "7.106.0-alpha.0",
     "@types/react": "*",
     "@types/react-is": "^17.0.7",
     "get-value": "^3.0.1",