@codeswayam/analytics 0.1.0 → 0.1.2

package/README.md

@@ -1,6 +1,6 @@
 # @codeswayam/analytics
 
-**Version:** 0.1.0
+**Version:** 0.1.1
 
 Centralized analytics and tracking package for all CodeSwayam applications. A single `<Analytics />` component that loads GTM, GA4, Meta Pixel, Hotjar, and Microsoft Clarity — plus Google Search Console verification — all configurable from the Admin Panel or environment variables.
 

package/dist/Analytics.d.ts

@@ -0,0 +1,63 @@
+export interface AnalyticsConfig {
+    gtmId?: string;
+    ga4Id?: string;
+    metaPixelId?: string;
+    gscVerification?: string;
+    hotjarId?: string;
+    clarityId?: string;
+}
+interface AnalyticsProps extends AnalyticsConfig {
+    appName?: string;
+    consentGranted?: boolean;
+}
+export declare function Analytics({ gtmId, ga4Id, metaPixelId, gscVerification, hotjarId, clarityId, appName, consentGranted, }: AnalyticsProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function trackEvent(eventName: string, eventData?: Record<string, any>): void;
+export declare function trackPageView(url: string): void;
+export declare function usePageTracking(): void;
+export type SaaSConversionEvent = {
+    name: 'signup';
+    props: {
+        method: 'email' | 'google' | 'github';
+    };
+} | {
+    name: 'trial_start';
+    props: {
+        productId: string;
+        planName: string;
+    };
+} | {
+    name: 'subscription_started';
+    props: {
+        productId: string;
+        planName: string;
+        amount: number;
+        currency: string;
+    };
+} | {
+    name: 'credits_purchased';
+    props: {
+        amount: number;
+        packId: string;
+        creditsCount: number;
+    };
+} | {
+    name: 'agent_created';
+    props: {
+        model: string;
+    };
+} | {
+    name: 'automation_created';
+    props: {
+        type: string;
+    };
+};
+export declare function trackConversion<T extends SaaSConversionEvent>(event: T): void;
+declare global {
+    interface Window {
+        dataLayer: any[];
+        fbq: any;
+        gtag: (...args: any[]) => void;
+    }
+}
+export {};
+//# sourceMappingURL=Analytics.d.ts.map

package/dist/Analytics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Analytics.d.ts","sourceRoot":"","sources":["../src/Analytics.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,eAAe;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,cAAe,SAAQ,eAAe;IAC9C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,KAAK,EACL,WAAW,EACX,eAAe,EACf,QAAQ,EACR,SAAS,EACT,OAAO,EACP,cAAqB,GACtB,EAAE,cAAc,kDA8EhB;AAED,wBAAgB,UAAU,CAAC,SAAS,EAAE,MAAM,EAAE,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,QAI5E;AAED,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,QAIxC;AAED,wBAAgB,eAAe,SAO9B;AAED,MAAM,MAAM,mBAAmB,GAC3B;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,KAAK,EAAE;QAAE,MAAM,EAAE,OAAO,GAAG,QAAQ,GAAG,QAAQ,CAAA;KAAE,CAAA;CAAE,GACpE;IAAE,IAAI,EAAE,aAAa,CAAC;IAAC,KAAK,EAAE;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,GACvE;IAAE,IAAI,EAAE,sBAAsB,CAAC;IAAC,KAAK,EAAE;QAAE,SAAS,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,GAClH;IAAE,IAAI,EAAE,mBAAmB,CAAC;IAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,YAAY,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,GAC9F;IAAE,IAAI,EAAE,eAAe,CAAC;IAAC,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,GACnD;IAAE,IAAI,EAAE,oBAAoB,CAAC;IAAC,KAAK,EAAE;QAAE,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;CAAE,CAAC;AAE5D,wBAAgB,eAAe,CAAC,CAAC,SAAS,mBAAmB,EAAE,KAAK,EAAE,CAAC,QAEtE;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,SAAS,EAAE,GAAG,EAAE,CAAC;QACjB,GAAG,EAAE,GAAG,CAAC;QACT,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,IAAI,CAAC;KAChC;CACF"}

package/dist/Analytics.js

@@ -0,0 +1,55 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { usePathname } from 'next/navigation';
+import Script from 'next/script';
+export function Analytics({ gtmId, ga4Id, metaPixelId, gscVerification, hotjarId, clarityId, appName, consentGranted = true, }) {
+    const isTrackingAllowed = consentGranted;
+    if (!gtmId && !ga4Id && !metaPixelId && !hotjarId && !clarityId && !gscVerification)
+        return null;
+    return (_jsxs(_Fragment, { children: [gscVerification && (_jsx("meta", { name: "google-site-verification", content: gscVerification })), isTrackingAllowed && (_jsxs(_Fragment, { children: [gtmId && (_jsxs(_Fragment, { children: [_jsx(Script, { id: "gtm-script", strategy: "afterInteractive", children: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+                new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+                j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+                'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+                })(window,document,'script','dataLayer','${gtmId}');
+                ${appName ? `window.dataLayer=window.dataLayer||[];window.dataLayer.push({'appName':'${appName}'});` : ''}` }), _jsx("noscript", { children: _jsx("iframe", { src: `https://www.googletagmanager.com/ns.html?id=${gtmId}`, height: "0", width: "0", style: { display: 'none', visibility: 'hidden' } }) })] })), ga4Id && !gtmId && (_jsxs(_Fragment, { children: [_jsx(Script, { src: `https://www.googletagmanager.com/gtag/js?id=${ga4Id}`, strategy: "afterInteractive" }), _jsx(Script, { id: "ga4-script", strategy: "afterInteractive", children: `window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}
+                gtag('js',new Date());gtag('config','${ga4Id}',{'send_page_view':true});` })] })), metaPixelId && (_jsxs(_Fragment, { children: [_jsx(Script, { id: "meta-pixel", strategy: "afterInteractive", children: `!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
+                n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
+                n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
+                t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
+                document,'script','https://connect.facebook.net/en_US/fbevents.js');
+                fbq('init','${metaPixelId}');fbq('track','PageView');` }), _jsx("noscript", { children: _jsx("img", { height: "1", width: "1", style: { display: 'none' }, src: `https://www.facebook.com/tr?id=${metaPixelId}&ev=PageView&noscript=1`, alt: "" }) })] })), hotjarId && (_jsx(Script, { id: "hotjar-script", strategy: "afterInteractive", children: `(function(h,o,t,j,a,r){h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+              h._hjSettings={hjid:${hotjarId},hjsv:6};a=o.getElementsByTagName('head')[0];
+              r=o.createElement('script');r.async=1;r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
+              a.appendChild(r);})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');` })), clarityId && (_jsx(Script, { id: "clarity-script", strategy: "afterInteractive", children: `(function(c,l,a,r,i,t,y){c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
+              t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
+              y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
+              })(window,document,"clarity","script","${clarityId}");` }))] }))] }));
+}
+export function trackEvent(eventName, eventData) {
+    if (typeof window === 'undefined')
+        return;
+    if (window.dataLayer)
+        window.dataLayer.push(Object.assign({ event: eventName }, eventData));
+    if (window.fbq)
+        window.fbq('trackCustom', eventName, eventData);
+}
+export function trackPageView(url) {
+    if (typeof window === 'undefined')
+        return;
+    if (window.dataLayer)
+        window.dataLayer.push({ event: 'page_view', page_path: url });
+    if (window.fbq)
+        window.fbq('track', 'PageView');
+}
+export function usePageTracking() {
+    const pathname = usePathname();
+    useEffect(() => {
+        if (!pathname)
+            return;
+        trackPageView(pathname);
+    }, [pathname]);
+}
+export function trackConversion(event) {
+    trackEvent(event.name, event.props);
+}

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+export { Analytics, trackEvent, trackPageView, usePageTracking, trackConversion } from './Analytics';
+export type { AnalyticsConfig, SaaSConversionEvent } from './Analytics';
+export { getAnalyticsConfig, trackServerEvent } from './server';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AACrG,YAAY,EAAE,eAAe,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC"}

package/dist/index.js

@@ -0,0 +1,2 @@
+export { Analytics, trackEvent, trackPageView, usePageTracking, trackConversion } from './Analytics';
+export { getAnalyticsConfig, trackServerEvent } from './server';

package/dist/server.d.ts

@@ -0,0 +1,16 @@
+import type { AnalyticsConfig } from './Analytics';
+/**
+ * Fetch analytics config for a given appId from the core-api.
+ * Call this in your Next.js root layout (server component).
+ *
+ * Usage:
+ *   const config = await getAnalyticsConfig('web');
+ *   <Analytics {...config} appName="web" />
+ */
+export declare function getAnalyticsConfig(appId: string): Promise<AnalyticsConfig>;
+/**
+ * Log server-side events (such as logins, registration, payment verification)
+ * to the core-api backend analytics collector.
+ */
+export declare function trackServerEvent(eventName: string, eventData?: Record<string, any>, userId?: string): Promise<boolean>;
+//# sourceMappingURL=server.d.ts.map

package/dist/server.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../src/server.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAEnD;;;;;;;GAOG;AACH,wBAAsB,kBAAkB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,eAAe,CAAC,CAWhF;AAED;;;GAGG;AACH,wBAAsB,gBAAgB,CACpC,SAAS,EAAE,MAAM,EACjB,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC/B,MAAM,CAAC,EAAE,MAAM,GACd,OAAO,CAAC,OAAO,CAAC,CAmBlB"}

package/dist/server.js

@@ -0,0 +1,47 @@
+/**
+ * Fetch analytics config for a given appId from the core-api.
+ * Call this in your Next.js root layout (server component).
+ *
+ * Usage:
+ *   const config = await getAnalyticsConfig('web');
+ *   <Analytics {...config} appName="web" />
+ */
+export async function getAnalyticsConfig(appId) {
+    const apiUrl = process.env.NEXT_PUBLIC_API_URL || process.env.API_URL || 'http://localhost:3000';
+    try {
+        const res = await fetch(`${apiUrl}/admin/analytics/config/${appId}`, {
+            next: { revalidate: 300 },
+        });
+        if (!res.ok)
+            return {};
+        return res.json();
+    }
+    catch (_a) {
+        return {};
+    }
+}
+/**
+ * Log server-side events (such as logins, registration, payment verification)
+ * to the core-api backend analytics collector.
+ */
+export async function trackServerEvent(eventName, eventData, userId) {
+    const apiUrl = process.env.NEXT_PUBLIC_API_URL || process.env.API_URL || 'http://localhost:3000';
+    try {
+        const res = await fetch(`${apiUrl}/admin/analytics/track`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify({
+                event: eventName,
+                userId,
+                properties: eventData || {},
+                timestamp: new Date().toISOString(),
+            }),
+        });
+        return res.ok;
+    }
+    catch (_a) {
+        return false;
+    }
+}

package/package.json

@@ -1,23 +1,35 @@
 {
   "name": "@codeswayam/analytics",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "Centralized analytics and tracking for CodeSwayam apps",
-  "main": "./src/index.tsx",
-  "types": "./src/index.tsx",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
   "scripts": {
     "build": "tsc",
-    "dev": "tsc --watch"
+    "dev": "tsc --watch",
+    "prepublishOnly": "npm run build"
   },
   "dependencies": {
-    "react": "^19.2.3",
-    "next": "^16.2.4"
+    "react": "^19.2.3"
   },
   "devDependencies": {
     "@types/react": "^19",
     "typescript": "^5"
   },
   "peerDependencies": {
-    "react": "^19.2.3",
-    "next": "^16.2.4"
+    "next": ">=15.0.0",
+    "react": "^19.2.3"
   }
-}
+}

package/src/Analytics.tsx

@@ -1,118 +0,0 @@
-'use client';
-
-import Script from 'next/script';
-
-export interface AnalyticsConfig {
-  gtmId?: string;
-  ga4Id?: string;
-  metaPixelId?: string;
-  gscVerification?: string;
-  hotjarId?: string;
-  clarityId?: string;
-}
-
-interface AnalyticsProps extends AnalyticsConfig {
-  appName?: string;
-}
-
-export function Analytics({
-  gtmId,
-  ga4Id,
-  metaPixelId,
-  gscVerification,
-  hotjarId,
-  clarityId,
-  appName,
-}: AnalyticsProps) {
-  if (!gtmId && !ga4Id && !metaPixelId && !hotjarId && !clarityId) return null;
-
-  return (
-    <>
-      {gscVerification && (
-        <meta name="google-site-verification" content={gscVerification} />
-      )}
-
-      {gtmId && (
-        <>
-          <Script id="gtm-script" strategy="afterInteractive">
-            {`(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
-            new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
-            j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
-            'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
-            })(window,document,'script','dataLayer','${gtmId}');
-            ${appName ? `window.dataLayer=window.dataLayer||[];window.dataLayer.push({'appName':'${appName}'});` : ''}`}
-          </Script>
-          <noscript>
-            <iframe src={`https://www.googletagmanager.com/ns.html?id=${gtmId}`}
-              height="0" width="0" style={{ display: 'none', visibility: 'hidden' }} />
-          </noscript>
-        </>
-      )}
-
-      {ga4Id && !gtmId && (
-        <>
-          <Script src={`https://www.googletagmanager.com/gtag/js?id=${ga4Id}`} strategy="afterInteractive" />
-          <Script id="ga4-script" strategy="afterInteractive">
-            {`window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments);}
-            gtag('js',new Date());gtag('config','${ga4Id}',{'send_page_view':true});`}
-          </Script>
-        </>
-      )}
-
-      {metaPixelId && (
-        <>
-          <Script id="meta-pixel" strategy="afterInteractive">
-            {`!function(f,b,e,v,n,t,s){if(f.fbq)return;n=f.fbq=function(){n.callMethod?
-            n.callMethod.apply(n,arguments):n.queue.push(arguments)};if(!f._fbq)f._fbq=n;
-            n.push=n;n.loaded=!0;n.version='2.0';n.queue=[];t=b.createElement(e);t.async=!0;
-            t.src=v;s=b.getElementsByTagName(e)[0];s.parentNode.insertBefore(t,s)}(window,
-            document,'script','https://connect.facebook.net/en_US/fbevents.js');
-            fbq('init','${metaPixelId}');fbq('track','PageView');`}
-          </Script>
-          <noscript>
-            <img height="1" width="1" style={{ display: 'none' }}
-              src={`https://www.facebook.com/tr?id=${metaPixelId}&ev=PageView&noscript=1`} alt="" />
-          </noscript>
-        </>
-      )}
-
-      {hotjarId && (
-        <Script id="hotjar-script" strategy="afterInteractive">
-          {`(function(h,o,t,j,a,r){h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
-          h._hjSettings={hjid:${hotjarId},hjsv:6};a=o.getElementsByTagName('head')[0];
-          r=o.createElement('script');r.async=1;r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
-          a.appendChild(r);})(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');`}
-        </Script>
-      )}
-
-      {clarityId && (
-        <Script id="clarity-script" strategy="afterInteractive">
-          {`(function(c,l,a,r,i,t,y){c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
-          t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i;
-          y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
-          })(window,document,"clarity","script","${clarityId}");`}
-        </Script>
-      )}
-    </>
-  );
-}
-
-export function trackEvent(eventName: string, eventData?: Record<string, any>) {
-  if (typeof window === 'undefined') return;
-  if (window.dataLayer) window.dataLayer.push({ event: eventName, ...eventData });
-  if (window.fbq) window.fbq('trackCustom', eventName, eventData);
-}
-
-export function trackPageView(url: string) {
-  if (typeof window === 'undefined') return;
-  if (window.dataLayer) window.dataLayer.push({ event: 'page_view', page_path: url });
-  if (window.fbq) window.fbq('track', 'PageView');
-}
-
-declare global {
-  interface Window {
-    dataLayer: any[];
-    fbq: any;
-    gtag: (...args: any[]) => void;
-  }
-}

package/src/index.tsx

@@ -1,3 +0,0 @@
-export { Analytics, trackEvent, trackPageView } from './Analytics';
-export type { AnalyticsConfig } from './Analytics';
-export { getAnalyticsConfig } from './server';

package/src/server.ts

@@ -1,22 +0,0 @@
-import type { AnalyticsConfig } from './Analytics';
-
-/**
- * Fetch analytics config for a given appId from the core-api.
- * Call this in your Next.js root layout (server component).
- *
- * Usage:
- *   const config = await getAnalyticsConfig('web');
- *   <Analytics {...config} appName="web" />
- */
-export async function getAnalyticsConfig(appId: string): Promise<AnalyticsConfig> {
-  const apiUrl = process.env.NEXT_PUBLIC_API_URL || process.env.API_URL || 'http://localhost:3000';
-  try {
-    const res = await fetch(`${apiUrl}/admin/analytics/config/${appId}`, {
-      next: { revalidate: 300 },
-    } as RequestInit);
-    if (!res.ok) return {};
-    return res.json();
-  } catch {
-    return {};
-  }
-}

package/tsconfig.json

@@ -1,18 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2017",
-    "lib": ["dom", "dom.iterable", "esnext"],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "strict": true,
-    "noEmit": true,
-    "esModuleInterop": true,
-    "module": "esnext",
-    "moduleResolution": "bundler",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "react-jsx"
-  },
-  "include": ["src/**/*"],
-  "exclude": ["node_modules"]
-}