@appxiom/4react 0.1.6 → 0.1.8

package/README.md

@@ -17,7 +17,7 @@
 
 ## Requirements
 
-- React 18 or later.
+- React 18 or React 19.
 - A browser environment. The SDK uses browser APIs and must not run during server-side rendering.
 - Node.js 18 or later for package installation and builds.
 
@@ -90,7 +90,7 @@ ax.reportCustomIssue('Payment failed', 'Gateway timed out.', severity, {
 
 After initialization, the integration adds automatic browser-side observation for React hook activity. It records lifecycle activity associated with `useEffect`, `useLayoutEffect`, `useState`, `useReducer`, `useMemo`, and `useCallback`. It also tracks `useRef` instances for leak analysis.
 
-Initialize the package before rendering the application so the instrumentation is available when components begin rendering. These integrations are installed once per page and do not require component-level wrappers or hooks.
+Initialize the package before rendering the application so the instrumentation is available when components begin rendering. These integrations are installed once per page and do not require component-level wrappers or hooks. React 18 and React 19 use different internal dispatcher locations; `@appxiom/4react` resolves the compatible location automatically.
 
 ## Vite
 

package/lifecycle/patch.js

@@ -4,6 +4,7 @@
 import React from 'react';
 import { AX } from '@appxiom/core';
 import { useRefLeakTracker } from '../memory/ax-react-useref-leak.js';
+import { getDispatcherSlot, getReactInternals } from './react-internals.js';
 
 function emitLifecycleEvent(name, payload = {}) {
   try {
@@ -105,7 +106,7 @@ function getBestFrame(stack) {
 }
 
 function getComponentName() {
-  const internals = React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
+  const internals = getReactInternals(React);
 
   try {
     const reactStack = internals?.getCurrentStack?.();
@@ -147,17 +148,24 @@ function wrapHook(dispatcher, name, wrapper) {
  * Dispatcher patch (THIS is the critical layer)
  * ----------------------------------------------------- */
 function patchDispatcher() {
-  const internals =
-    React.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE;
+  const internals = getReactInternals(React);
+  const dispatcherSlot = getDispatcherSlot(internals);
 
-  if (internals.__AX_DISPATCHER_PATCHED__) return;
-  internals.__AX_DISPATCHER_PATCHED__ = true;
+  if (!internals || !dispatcherSlot) return;
 
-  let currentDispatcher = internals.H;
+  if (internals?.__AX_DISPATCHER_PATCHED__) return;
+  try {
+    internals.__AX_DISPATCHER_PATCHED__ = true;
+  } catch {
+    return;
+  }
 
-  Object.defineProperty(internals, 'H', {
-    configurable: true,
-    get() {
+  let currentDispatcher = dispatcherSlot.target[dispatcherSlot.key];
+
+  try {
+    Object.defineProperty(dispatcherSlot.target, dispatcherSlot.key, {
+      configurable: true,
+      get() {
       const dispatcher = currentDispatcher;
 
       if (!dispatcher || dispatcher.__AX_PATCHED__) {
@@ -276,12 +284,17 @@ function patchDispatcher() {
         return original.apply(ctx, args);
       });
 
-      return dispatcher;
-    },
-    set(v) {
-      currentDispatcher = v;
-    },
-  });
+        return dispatcher;
+      },
+      set(v) {
+        currentDispatcher = v;
+      },
+    });
+  } catch {
+    try {
+      internals.__AX_DISPATCHER_PATCHED__ = false;
+    } catch {}
+  }
 }
 
 /* -------------------------------------------------------

package/lifecycle/react-internals.js

@@ -0,0 +1,19 @@
+export function getReactInternals(react) {
+  return react?.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE
+    || react?.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED
+    || null;
+}
+
+export function getDispatcherSlot(internals) {
+  if (!internals) return null;
+
+  if ('H' in internals) {
+    return { target: internals, key: 'H' };
+  }
+
+  if (internals.ReactCurrentDispatcher) {
+    return { target: internals.ReactCurrentDispatcher, key: 'current' };
+  }
+
+  return null;
+}

package/package.json

@@ -3,8 +3,8 @@
   "description": "React integration layer for Appxiom Web Observability SDK",
   "license": "UNLICENSED",
   "author": "BasilGregory Software Labs Private Limited",
-  "homepage": "https://appxiom.io",
-  "version": "0.1.6",
+  "homepage": "https://www.appxiom.com",
+  "version": "0.1.8",
   "publishConfig": {
     "access": "public"
   },
@@ -29,10 +29,11 @@
     "LICENSE"
   ],
   "scripts": {
-    "check:files": "test -f index.js && test -f core/ax-react.js && test -f lifecycle/patch.js && test -f memory/ax-react-useref-leak.js",
+    "check:files": "test -f index.js && test -f core/ax-react.js && test -f lifecycle/patch.js && test -f lifecycle/react-internals.js && test -f memory/ax-react-useref-leak.js",
+    "check:react-compat": "node test/react-internals.test.js",
     "check:types": "tsc --project test/types/tsconfig.json --noEmit",
     "pack:dry-run": "npm pack --dry-run",
-    "prepublishOnly": "npm run check:files && npm run pack:dry-run"
+    "prepublishOnly": "npm run check:files && npm run check:react-compat && npm run pack:dry-run"
   },
   "sideEffects": true,
   "main": "index.js",
@@ -44,7 +45,7 @@
     "typescript": "^5.9.3"
   },
   "peerDependencies": {
-    "react": ">=18"
+    "react": "^18.0.0 || ^19.0.0"
   },
   "keywords": [
     "appxiom",