@dotcms/analytics 1.1.1-next.3 → 1.1.1-next.4

package/README.md

@@ -262,6 +262,12 @@ When you call `pageView(customData?)`, the SDK **automatically enriches** the ev
         site_key: string;          //    Your site key
         session_id: string;        //    Current session ID
         user_id: string;           //    Anonymous user ID
+        device: {                  // 🤖 AUTOMATIC - Device & Browser Info
+            screen_resolution: string;  // Screen size
+            language: string;           // Browser language
+            viewport_width: string;     // Viewport width
+            viewport_height: string;    // Viewport height
+        }
     },
     events: [{
         event_type: "pageview",
@@ -278,12 +284,6 @@ When you call `pageView(customData?)`, the SDK **automatically enriches** the ev
                 doc_hash: string;      //  URL hash
                 doc_encoding: string;  //  Character encoding
             },
-            device: {              // 🤖 AUTOMATIC - Device & Browser Info
-                screen_resolution: string;  // Screen size
-                language: string;           // Browser language
-                viewport_width: string;     // Viewport width
-                viewport_height: string;    // Viewport height
-            },
             utm?: {                // 🤖 AUTOMATIC - Campaign Tracking (if present in URL)
                 source: string;    //    utm_source
                 medium: string;    //    utm_medium
@@ -319,6 +319,12 @@ When you call `track(eventName, properties)`, the following structure is sent:
         site_key: string;      // Your site key
         session_id: string;    // Current session ID
         user_id: string;       // Anonymous user ID
+        device: {              // 🤖 AUTOMATIC - Device & Browser Info
+            screen_resolution: string;  // Screen size
+            language: string;           // Browser language
+            viewport_width: string;     // Viewport width
+            viewport_height: string;    // Viewport height
+        }
     },
     events: [{
         event_type: string,    // Your custom event name

package/lib/core/plugin/enricher/dot-analytics.enricher.plugin.d.ts

@@ -2,8 +2,8 @@ import { AnalyticsBasePayloadWithContext, AnalyticsTrackPayloadWithContext, DotC
 /**
  * Plugin that enriches the analytics payload data based on the event type.
  * Uses Analytics.js lifecycle events to inject context before processing.
- * The identity plugin runs FIRST to inject context: { session_id, site_auth, user_id }
- * This enricher plugin runs SECOND to add page/device/utm data.
+ * The identity plugin runs FIRST to inject context: { session_id, site_auth, user_id, device }
+ * This enricher plugin runs SECOND to add page/utm/custom data.
  *
  * Returns the final request body structure ready to send to the server.
  */

package/lib/core/plugin/enricher/dot-analytics.enricher.plugin.js

@@ -1,6 +1,6 @@
-import { DotCMSPredefinedEventType as c } from "../../shared/constants/dot-content-analytics.constants.js";
-import { getLocalTime as s, enrichPagePayloadOptimized as d } from "../../shared/dot-content-analytics.utils.js";
-const p = () => ({
+import { DotCMSPredefinedEventType as i } from "../../shared/constants/dot-content-analytics.constants.js";
+import { getLocalTime as c, enrichPagePayloadOptimized as s } from "../../shared/dot-content-analytics.utils.js";
+const m = () => ({
   name: "enrich-dot-analytics",
   /**
    * PAGE VIEW ENRICHMENT - Runs after identity context injection
@@ -10,20 +10,19 @@ const p = () => ({
   "page:dot-analytics": ({
     payload: o
   }) => {
-    const { context: r, page: t, device: e, utm: n, custom: a, local_time: i } = d(o);
-    if (!t || !e)
-      throw new Error("DotCMS Analytics: Missing required page or device data");
+    const { context: a, page: t, utm: e, custom: n, local_time: r } = s(o);
+    if (!t)
+      throw new Error("DotCMS Analytics: Missing required page data");
     return {
-      context: r,
+      context: a,
       events: [
         {
-          event_type: c.PAGEVIEW,
-          local_time: i,
+          event_type: i.PAGEVIEW,
+          local_time: r,
           data: {
             page: t,
-            device: e,
-            ...n && { utm: n },
-            ...a && { custom: a }
+            ...e && { utm: e },
+            ...n && { custom: n }
           }
         }
       ]
@@ -37,12 +36,12 @@ const p = () => ({
   "track:dot-analytics": ({
     payload: o
   }) => {
-    const { event: r, properties: t, context: e } = o, n = s();
+    const { event: a, properties: t, context: e } = o, n = c();
     return {
       context: e,
       events: [
         {
-          event_type: r,
+          event_type: a,
           local_time: n,
           data: {
             custom: t
@@ -53,5 +52,5 @@ const p = () => ({
   }
 });
 export {
-  p as dotAnalyticsEnricherPlugin
+  m as dotAnalyticsEnricherPlugin
 };

package/lib/core/shared/dot-content-analytics.utils.d.ts

@@ -60,6 +60,14 @@ export interface AnalyticsConfigResult {
  * @returns The analytics configuration object
  */
 export declare const getAnalyticsConfig: () => DotCMSAnalyticsConfig;
+/**
+ * Gets current device data for analytics.
+ * Combines static browser data with dynamic viewport information.
+ * Used by the identity plugin to inject device data into context.
+ *
+ * @returns Device data with screen resolution, language, and viewport dimensions
+ */
+export declare const getDeviceDataForContext: () => DotCMSEventDeviceData;
 /**
  * Retrieves the browser event data - optimized but accurate.
  * @internal This function is for internal use only.
@@ -126,7 +134,7 @@ export declare const enrichWithUtmData: <T extends Record<string, unknown>>(payl
  *
  * @param payload - The Analytics.js payload with context already injected by identity plugin
  * @param location - The Location object to extract page data from (defaults to window.location)
- * @returns Enriched payload with page, device, UTM, custom data, and local_time
+ * @returns Enriched payload with page, UTM, custom data, and local_time (device is in context)
  */
 export declare const enrichPagePayloadOptimized: (payload: AnalyticsBasePayloadWithContext, location?: Location) => EnrichedAnalyticsPayload;
 /**

package/lib/core/shared/dot-content-analytics.utils.js

@@ -1,9 +1,9 @@
-import { ANALYTICS_JS_DEFAULT_PROPERTIES as _, SESSION_STORAGE_KEY as S, DEFAULT_SESSION_TIMEOUT_MINUTES as f, USER_ID_KEY as l, EXPECTED_UTM_KEYS as w } from "./constants/dot-content-analytics.constants.js";
+import { ANALYTICS_JS_DEFAULT_PROPERTIES as w, SESSION_STORAGE_KEY as h, DEFAULT_SESSION_TIMEOUT_MINUTES as _, USER_ID_KEY as l, EXPECTED_UTM_KEYS as f } from "./constants/dot-content-analytics.constants.js";
 let g = null, u = null;
 const d = (t) => {
-  const e = Date.now(), s = Math.random().toString(36).substr(2, 9), n = Math.random().toString(36).substr(2, 9);
-  return `${t}_${e}_${s}${n}`;
-}, m = {
+  const e = Date.now(), n = Math.random().toString(36).substr(2, 9), s = Math.random().toString(36).substr(2, 9);
+  return `${t}_${e}_${n}${s}`;
+}, S = {
   getItem: (t) => {
     try {
       return localStorage.getItem(t);
@@ -19,26 +19,26 @@ const d = (t) => {
     }
   }
 }, p = () => {
-  let t = m.getItem(l);
-  return t || (t = d("user"), m.setItem(l, t)), t;
-}, T = (t) => {
-  const e = new Date(t), s = /* @__PURE__ */ new Date(), n = new Date(
+  let t = S.getItem(l);
+  return t || (t = d("user"), S.setItem(l, t)), t;
+}, D = (t) => {
+  const e = new Date(t), n = /* @__PURE__ */ new Date(), s = new Date(
     e.getUTCFullYear(),
     e.getUTCMonth(),
     e.getUTCDate()
-  ), o = new Date(s.getUTCFullYear(), s.getUTCMonth(), s.getUTCDate());
-  return n.getTime() !== o.getTime();
-}, D = () => {
+  ), o = new Date(n.getUTCFullYear(), n.getUTCMonth(), n.getUTCDate());
+  return s.getTime() !== o.getTime();
+}, T = () => {
   const t = Date.now();
   if (typeof window > "u")
     return d("session_fallback");
   try {
-    const e = sessionStorage.getItem(S);
+    const e = sessionStorage.getItem(h);
     if (e) {
-      const { sessionId: o, startTime: r, lastActivity: a } = JSON.parse(e), c = !T(r), i = t - a < f * 60 * 1e3;
+      const { sessionId: o, startTime: r, lastActivity: a } = JSON.parse(e), c = !D(r), i = t - a < _ * 60 * 1e3;
       if (c && i)
         return sessionStorage.setItem(
-          S,
+          h,
           JSON.stringify({
             sessionId: o,
             startTime: r,
@@ -46,91 +46,95 @@ const d = (t) => {
           })
         ), o;
     }
-    const s = d("session"), n = {
-      sessionId: s,
+    const n = d("session"), s = {
+      sessionId: n,
       startTime: t,
       lastActivity: t
     };
-    return sessionStorage.setItem(S, JSON.stringify(n)), s;
+    return sessionStorage.setItem(h, JSON.stringify(s)), n;
   } catch {
     return d("session_fallback");
   }
-}, $ = (t) => {
-  const e = D(), s = p();
+}, U = (t) => {
+  const e = T(), n = p(), s = I();
   return t.debug && console.warn("DotCMS Analytics Identity Context:", {
     sessionId: e,
-    userId: s
+    userId: n
   }), {
     site_auth: t.siteAuth,
     session_id: e,
-    user_id: s
+    user_id: n,
+    device: s
   };
-}, I = () => g || (g = {
+}, m = () => g || (g = {
   user_language: navigator.language,
   doc_encoding: document.characterSet || document.charset,
   screen_resolution: typeof screen < "u" && screen.width && screen.height ? `${screen.width}x${screen.height}` : ""
-}, g), y = (t) => {
+}, g), I = () => {
+  const t = m(), e = window.innerWidth || document.documentElement.clientWidth || 0, n = window.innerHeight || document.documentElement.clientHeight || 0;
+  return {
+    screen_resolution: t.screen_resolution ?? "",
+    language: t.user_language ?? "",
+    viewport_width: String(e),
+    viewport_height: String(n)
+  };
+}, y = (t) => {
   const e = t.search;
   if (u && u.search === e)
     return u.params;
-  const s = new URLSearchParams(e), n = {};
-  return w.forEach((o) => {
-    const r = s.get(o);
+  const n = new URLSearchParams(e), s = {};
+  return f.forEach((o) => {
+    const r = n.get(o);
     if (r) {
       const a = o.replace("utm_", "");
-      n[a] = r;
+      s[a] = r;
     }
-  }), u = { search: e, params: n }, n;
+  }), u = { search: e, params: s }, s;
 }, E = () => {
   try {
-    const t = (/* @__PURE__ */ new Date()).getTimezoneOffset(), e = t > 0 ? "-" : "+", s = Math.abs(t), n = Math.floor(s / 60), o = s % 60;
-    return `${e}${n.toString().padStart(2, "0")}:${o.toString().padStart(2, "0")}`;
+    const t = (/* @__PURE__ */ new Date()).getTimezoneOffset(), e = t > 0 ? "-" : "+", n = Math.abs(t), s = Math.floor(n / 60), o = n % 60;
+    return `${e}${s.toString().padStart(2, "0")}:${o.toString().padStart(2, "0")}`;
   } catch {
     return "+00:00";
   }
-}, O = () => {
+}, C = () => {
   try {
-    const t = /* @__PURE__ */ new Date(), e = E(), s = t.getFullYear(), n = (t.getMonth() + 1).toString().padStart(2, "0"), o = t.getDate().toString().padStart(2, "0"), r = t.getHours().toString().padStart(2, "0"), a = t.getMinutes().toString().padStart(2, "0"), c = t.getSeconds().toString().padStart(2, "0");
-    return `${s}-${n}-${o}T${r}:${a}:${c}${e}`;
+    const t = /* @__PURE__ */ new Date(), e = E(), n = t.getFullYear(), s = (t.getMonth() + 1).toString().padStart(2, "0"), o = t.getDate().toString().padStart(2, "0"), r = t.getHours().toString().padStart(2, "0"), a = t.getMinutes().toString().padStart(2, "0"), c = t.getSeconds().toString().padStart(2, "0");
+    return `${n}-${s}-${o}T${r}:${a}:${c}${e}`;
   } catch {
     return (/* @__PURE__ */ new Date()).toISOString();
   }
-}, C = (t, e = typeof window < "u" ? window.location : {}) => {
-  const s = O(), n = I(), { properties: o } = t, r = {};
-  Object.keys(o).forEach((h) => {
-    _.includes(h) || (r[h] = o[h]);
+}, $ = (t, e = typeof window < "u" ? window.location : {}) => {
+  const n = C(), s = m(), { properties: o } = t, r = {};
+  Object.keys(o).forEach((i) => {
+    w.includes(i) || (r[i] = o[i]);
   });
   const a = {
     url: e.href,
-    doc_encoding: n.doc_encoding,
+    doc_encoding: s.doc_encoding,
     doc_hash: e.hash,
     doc_protocol: e.protocol,
     doc_search: e.search,
     doc_host: e.hostname,
     doc_path: e.pathname,
     title: o.title ?? (document == null ? void 0 : document.title)
-  }, c = {
-    screen_resolution: n.screen_resolution ?? "",
-    language: n.user_language ?? "",
-    viewport_width: String(o.width),
-    viewport_height: String(o.height)
-  }, i = y(e);
+  }, c = y(e);
   return {
     ...t,
     page: a,
-    device: c,
-    ...Object.keys(i).length > 0 && { utm: i },
+    ...Object.keys(c).length > 0 && { utm: c },
     // Only include custom if there are user-provided properties
     ...Object.keys(r).length > 0 && { custom: r },
-    local_time: s
+    local_time: n
   };
 };
 export {
-  C as enrichPagePayloadOptimized,
+  $ as enrichPagePayloadOptimized,
   y as extractUTMParameters,
   d as generateSecureId,
-  $ as getAnalyticsContext,
-  O as getLocalTime,
-  D as getSessionId,
+  U as getAnalyticsContext,
+  I as getDeviceDataForContext,
+  C as getLocalTime,
+  T as getSessionId,
   p as getUserId
 };

package/lib/core/shared/models/data.model.d.ts

@@ -53,6 +53,8 @@ export interface DotCMSAnalyticsEventContext {
     session_id: string;
     /** Unique user identifier */
     user_id: string;
+    /** Device and browser information */
+    device: DotCMSEventDeviceData;
 }
 /**
  * Device and browser information for DotCMS analytics tracking.

package/lib/core/shared/models/event.model.d.ts

@@ -1,4 +1,4 @@
-import { DotCMSEventDeviceData, DotCMSEventPageData, DotCMSEventUtmData } from './data.model';
+import { DotCMSEventPageData, DotCMSEventUtmData } from './data.model';
 import { DotCMSCustomEventType, DotCMSEventType, DotCMSPredefinedEventType } from '../constants/dot-content-analytics.constants';
 /**
  * JSON value type for analytics custom data.
@@ -32,13 +32,11 @@ export interface DotCMSEventBase<TEventType extends DotCMSEventType, TData> {
 }
 /**
  * Data structure for pageview events.
- * Contains page, device, and optional UTM/custom data.
+ * Contains page and optional UTM/custom data.
  */
 export type DotCMSPageViewEventData = {
     /** Page data associated with the event */
     page: DotCMSEventPageData;
-    /** Device and browser information */
-    device: DotCMSEventDeviceData;
     /** UTM parameters for campaign tracking (optional) */
     utm?: DotCMSEventUtmData;
     /** Custom data associated with the event (any valid JSON) */

package/lib/core/shared/models/library.model.d.ts

@@ -1,4 +1,4 @@
-import { DotCMSAnalyticsEventContext, DotCMSEventDeviceData, DotCMSEventPageData, DotCMSEventUtmData } from './data.model';
+import { DotCMSAnalyticsEventContext, DotCMSEventPageData, DotCMSEventUtmData } from './data.model';
 import { JsonObject } from './event.model';
 import { DotCMSAnalyticsRequestBody } from './request.model';
 import { DotCMSCustomEventType } from '../constants';
@@ -117,13 +117,11 @@ export interface AnalyticsBasePayloadWithContext extends AnalyticsBasePayload {
 /**
  * Enriched analytics payload with DotCMS-specific data.
  * This is the result of enriching the base Analytics.js payload with context (from identity plugin)
- * and then adding page, device, UTM, and custom data (from enricher plugin).
+ * and then adding page, UTM, and custom data (from enricher plugin).
  */
 export type EnrichedAnalyticsPayload = AnalyticsBasePayloadWithContext & {
     /** Page data for the current page */
     page: DotCMSEventPageData;
-    /** Device and browser information */
-    device: DotCMSEventDeviceData;
     /** UTM parameters for campaign tracking */
     utm?: DotCMSEventUtmData;
     /** Custom data associated with the event (any valid JSON) */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dotcms/analytics",
-  "version": "1.1.1-next.3",
+  "version": "1.1.1-next.4",
   "description": "Official JavaScript library for Content Analytics with DotCMS.",
   "repository": {
     "type": "git",