@cronitorio/cronitor-rum-nextjs 0.1.0 → 0.2.1

package/README.md

@@ -1,5 +1,7 @@
 # Cronitor RUM Next.js integration
 
+> **Important:** As of version 0.2.0 of this package only Next.js 13 or later will be supported. For previous versions of Next.js please install version 0.1.0 of this package.
+
 Official [Cronitor Real User Monitoring](https://cronitor.io/real-user-monitoring) integration for Next.js.
 
 ## Quickstart
@@ -51,7 +53,9 @@ import { useCronitor } from '@cronitorio/cronitor-rum-nextjs';
 function CustomApp({ Component, pageProps }) {
   
   useCronitor('YOUR_SITE_ID', {
-    debug: true
+    debug: true,
+    environment: "staging",
+    includeURLQueryParams: ["tab", "pageNum"]
   });
 
   return <Component {...pageProps} />;
@@ -63,6 +67,14 @@ export default CustomApp;
 
 ## Changelog
 
+### 0.2.1
+
+- Update cronitor-rum-js lib.
+
+### 0.2.0
+
+- Support new Next.js 13 'app' directory and client-only components.
+
 ### 0.1.0
 
 - Initial open source release.

package/dist/index.d.ts

@@ -5,4 +5,4 @@ import * as Cronitor from '@cronitorio/cronitor-rum-js';
  * @param clientKey the client key for the Cronitor site.
  * @param config the Cronitor tracker configuration object.
  */
-export declare const useCronitor: (clientKey: string, config?: Cronitor.CronitorRUMConfig) => typeof Cronitor;
+export declare function useCronitor(clientKey: string, config?: Cronitor.CronitorRUMConfig): typeof Cronitor;

package/dist/index.js

@@ -1,7 +1,12 @@
 "use strict";
+'use client';
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -21,7 +26,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useCronitor = void 0;
 const Cronitor = __importStar(require("@cronitorio/cronitor-rum-js"));
-const router_1 = require("next/router");
+const navigation_1 = require("next/navigation");
 const react_1 = require("react");
 /**
  * React hook for automatically tracking navigation changes on Next.js apps.
@@ -29,20 +34,17 @@ const react_1 = require("react");
  * @param clientKey the client key for the Cronitor site.
  * @param config the Cronitor tracker configuration object.
  */
-const useCronitor = (clientKey, config = {}) => {
-    const router = (0, router_1.useRouter)();
+function useCronitor(clientKey, config = {}) {
+    const pathname = (0, navigation_1.usePathname)();
+    const searchParams = (0, navigation_1.useSearchParams)();
     (0, react_1.useEffect)(() => {
         Cronitor.load(clientKey, config);
-        // Trigger initial page view
+    }, []);
+    (0, react_1.useEffect)(() => {
         Cronitor.track('Pageview');
-        // Add on route change handler for client-side navigation
-        const handleRouteChange = () => Cronitor.track('Pageview');
-        router.events.on('routeChangeComplete', handleRouteChange);
-        return () => {
-            router.events.off('routeChangeComplete', handleRouteChange);
-        };
-    }, [clientKey]);
+    }, [pathname, searchParams]);
     return Cronitor;
-};
+}
 exports.useCronitor = useCronitor;
+;
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAAA,sEAAwD;AACxD,wCAAwC;AACxC,iCAAkC;AAElC;;;;;GAKG;AACI,MAAM,WAAW,GAAG,CAAC,SAAiB,EAAE,SAAqC,EAAE,EAAE,EAAE;IACxF,MAAM,MAAM,GAAG,IAAA,kBAAS,GAAE,CAAC;IAE3B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;QAEjC,4BAA4B;QAC5B,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;QAE3B,yDAAyD;QACzD,MAAM,iBAAiB,GAAG,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;QAE3D,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,qBAAqB,EAAE,iBAAiB,CAAC,CAAC;QAE3D,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,qBAAqB,EAAE,iBAAiB,CAAC,CAAC;QAC9D,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AApBW,QAAA,WAAW,eAoBtB"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;AAEb,sEAAwD;AACxD,gDAA+D;AAC/D,iCAAkC;AAElC;;;;;GAKG;AACH,SAAgB,WAAW,CAAC,SAAiB,EAAE,SAAqC,EAAE;IACpF,MAAM,QAAQ,GAAG,IAAA,wBAAW,GAAE,CAAC;IAC/B,MAAM,YAAY,GAAG,IAAA,4BAAe,GAAE,CAAC;IAEvC,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,QAAQ,CAAC,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;IACnC,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;IAC7B,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC,CAAC;IAE7B,OAAO,QAAQ,CAAC;AAClB,CAAC;AAbD,kCAaC;AAAA,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cronitorio/cronitor-rum-nextjs",
-  "version": "0.1.0",
+  "version": "0.2.1",
   "description": "Official Cronitor integration for Next.js",
   "repository": {
     "type": "git",
@@ -29,20 +29,20 @@
     "lint": "tslint -p tsconfig.json"
   },
   "peerDependencies": {
-    "next": "^10 || ^11 || ^12 || ^13",
-    "react": "^16 || ^17 || ^18"
+    "next": "^13",
+    "react": "^18"
   },
   "dependencies": {
-    "@cronitorio/cronitor-rum-js": "^0.1.0"
+    "@cronitorio/cronitor-rum-js": "^0.2.0"
   },
   "devDependencies": {
-    "@types/react": "^17.0.20",
-    "next": "^11.1.2",
-    "prettier": "^2.2.1",
-    "react": "^17.0.2",
+    "@types/react": "^18.0.27",
+    "next": "^13.1.4",
+    "prettier": "^2.8.3",
+    "react": "^18.2.0",
     "tslint": "^6.1.3",
     "tslint-config-prettier": "^1.18.0",
-    "typescript": "^4.0.5"
+    "typescript": "^4.9.4"
   },
   "bugs": {
     "url": "https://github.com/cronitorio/cronitor-rum-nextjs/issues"