@croct/sdk 0.21.0 → 0.22.0

package/apiKey.cjs

@@ -26,10 +26,10 @@ const _ApiKey = class _ApiKey {
     this.privateKey = privateKey;
   }
   static from(apiKey) {
-    if (apiKey instanceof _ApiKey) {
-      return apiKey;
+    if (typeof apiKey === "string") {
+      return _ApiKey.parse(apiKey);
     }
-    return _ApiKey.parse(apiKey);
+    return apiKey;
   }
   static parse(apiKey) {
     const parts = apiKey.split(":");

package/apiKey.js

@@ -4,10 +4,10 @@ const _ApiKey = class _ApiKey {
     this.privateKey = privateKey;
   }
   static from(apiKey) {
-    if (apiKey instanceof _ApiKey) {
-      return apiKey;
+    if (typeof apiKey === "string") {
+      return _ApiKey.parse(apiKey);
     }
-    return _ApiKey.parse(apiKey);
+    return apiKey;
   }
   static parse(apiKey) {
     const parts = apiKey.split(":");

package/constants.cjs

@@ -25,7 +25,7 @@ __export(constants_exports, {
 module.exports = __toCommonJS(constants_exports);
 const BASE_ENDPOINT_URL = "https://api.croct.io";
 const MAX_QUERY_LENGTH = parseInt("<@maxQueryLength@>", 10);
-const VERSION = "0.21.0";
+const VERSION = "0.22.0";
 const CLIENT_LIBRARY = `Croct SDK JS v${VERSION}`;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/constants.d.cts

@@ -1,6 +1,6 @@
 declare const BASE_ENDPOINT_URL = "https://api.croct.io";
 declare const MAX_QUERY_LENGTH: number;
-declare const VERSION = "0.21.0";
-declare const CLIENT_LIBRARY = "Croct SDK JS v0.21.0";
+declare const VERSION = "0.22.0";
+declare const CLIENT_LIBRARY = "Croct SDK JS v0.22.0";
 
 export { BASE_ENDPOINT_URL, CLIENT_LIBRARY, MAX_QUERY_LENGTH, VERSION };

package/constants.d.ts

@@ -1,6 +1,6 @@
 declare const BASE_ENDPOINT_URL = "https://api.croct.io";
 declare const MAX_QUERY_LENGTH: number;
-declare const VERSION = "0.21.0";
-declare const CLIENT_LIBRARY = "Croct SDK JS v0.21.0";
+declare const VERSION = "0.22.0";
+declare const CLIENT_LIBRARY = "Croct SDK JS v0.22.0";
 
 export { BASE_ENDPOINT_URL, CLIENT_LIBRARY, MAX_QUERY_LENGTH, VERSION };

package/constants.js

@@ -1,6 +1,6 @@
 const BASE_ENDPOINT_URL = "https://api.croct.io";
 const MAX_QUERY_LENGTH = parseInt("<@maxQueryLength@>", 10);
-const VERSION = "0.21.0";
+const VERSION = "0.22.0";
 const CLIENT_LIBRARY = `Croct SDK JS v${VERSION}`;
 export {
   BASE_ENDPOINT_URL,

package/container.cjs

@@ -47,6 +47,12 @@ const _Container = class _Container {
   getConfiguration() {
     return this.configuration;
   }
+  getTimeZone() {
+    if (this.timeZone === void 0) {
+      this.timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone ?? null;
+    }
+    return this.timeZone;
+  }
   getEvaluator() {
     if (this.evaluator === void 0) {
       this.evaluator = this.createEvaluator();
@@ -98,7 +104,8 @@ const _Container = class _Container {
       inactivityRetryPolicy: new import_retry.ArbitraryPolicy([3e4, 3e4, 12e4, 12e4, 3e5, 3e5, 9e5]),
       logger: this.getLogger("Tracker"),
       channel: this.getBeaconChannel(),
-      eventMetadata: this.configuration.eventMetadata
+      eventMetadata: this.configuration.eventMetadata,
+      timeZone: this.getTimeZone() ?? void 0
     });
     const queue = this.getBeaconQueue();
     queue.addCallback("halfEmpty", tracker.unsuspend);

package/container.d.cts

@@ -61,8 +61,10 @@ declare class Container {
     private beaconQueue?;
     private removeTokenSyncListener?;
     private readonly eventManager;
+    private timeZone?;
     constructor(configuration: Configuration);
     getConfiguration(): Configuration;
+    getTimeZone(): string | null;
     getEvaluator(): Evaluator;
     private createEvaluator;
     getContentFetcher(): ContentFetcher;

package/container.d.ts

@@ -61,8 +61,10 @@ declare class Container {
     private beaconQueue?;
     private removeTokenSyncListener?;
     private readonly eventManager;
+    private timeZone?;
     constructor(configuration: Configuration);
     getConfiguration(): Configuration;
+    getTimeZone(): string | null;
     getEvaluator(): Evaluator;
     private createEvaluator;
     getContentFetcher(): ContentFetcher;

package/container.js

@@ -25,6 +25,12 @@ const _Container = class _Container {
   getConfiguration() {
     return this.configuration;
   }
+  getTimeZone() {
+    if (this.timeZone === void 0) {
+      this.timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone ?? null;
+    }
+    return this.timeZone;
+  }
   getEvaluator() {
     if (this.evaluator === void 0) {
       this.evaluator = this.createEvaluator();
@@ -76,7 +82,8 @@ const _Container = class _Container {
       inactivityRetryPolicy: new ArbitraryPolicy([3e4, 3e4, 12e4, 12e4, 3e5, 3e5, 9e5]),
       logger: this.getLogger("Tracker"),
       channel: this.getBeaconChannel(),
-      eventMetadata: this.configuration.eventMetadata
+      eventMetadata: this.configuration.eventMetadata,
+      timeZone: this.getTimeZone() ?? void 0
     });
     const queue = this.getBeaconQueue();
     queue.addCallback("halfEmpty", tracker.unsuspend);

package/facade/evaluatorFacade.cjs

@@ -60,8 +60,9 @@ class MinimalContextFactory {
   }
 }
 class TabContextFactory {
-  constructor(tab) {
+  constructor(tab, timeZone) {
     this.tab = tab;
+    this.timeZone = timeZone;
   }
   createContext(attributes) {
     const url = new URL(this.tab.url);
@@ -75,9 +76,8 @@ class TabContextFactory {
       page.referrer = referrer;
     }
     context.page = page;
-    const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone ?? null;
-    if (timeZone !== null) {
-      context.timeZone = timeZone;
+    if (this.timeZone !== void 0) {
+      context.timeZone = this.timeZone;
     }
     if (attributes !== void 0 && Object.keys(attributes).length > 0) {
       context.attributes = attributes;

package/facade/evaluatorFacade.d.cts

@@ -34,7 +34,8 @@ declare class MinimalContextFactory implements ContextFactory {
 }
 declare class TabContextFactory implements ContextFactory {
     private readonly tab;
-    constructor(tab: Tab);
+    private readonly timeZone?;
+    constructor(tab: Tab, timeZone?: string);
     createContext(attributes?: JsonObject): EvaluationContext;
 }
 

package/facade/evaluatorFacade.d.ts

@@ -34,7 +34,8 @@ declare class MinimalContextFactory implements ContextFactory {
 }
 declare class TabContextFactory implements ContextFactory {
     private readonly tab;
-    constructor(tab: Tab);
+    private readonly timeZone?;
+    constructor(tab: Tab, timeZone?: string);
     createContext(attributes?: JsonObject): EvaluationContext;
 }
 

package/facade/evaluatorFacade.js

@@ -36,8 +36,9 @@ class MinimalContextFactory {
   }
 }
 class TabContextFactory {
-  constructor(tab) {
+  constructor(tab, timeZone) {
     this.tab = tab;
+    this.timeZone = timeZone;
   }
   createContext(attributes) {
     const url = new URL(this.tab.url);
@@ -51,9 +52,8 @@ class TabContextFactory {
       page.referrer = referrer;
     }
     context.page = page;
-    const timeZone = Intl.DateTimeFormat().resolvedOptions().timeZone ?? null;
-    if (timeZone !== null) {
-      context.timeZone = timeZone;
+    if (this.timeZone !== void 0) {
+      context.timeZone = this.timeZone;
     }
     if (attributes !== void 0 && Object.keys(attributes).length > 0) {
       context.attributes = attributes;

package/facade/sdkFacade.cjs

@@ -132,7 +132,10 @@ class SdkFacade {
     if (this.evaluatorFacade === void 0) {
       this.evaluatorFacade = new import_evaluatorFacade.EvaluatorFacade({
         evaluator: this.sdk.evaluator,
-        contextFactory: new import_evaluatorFacade.TabContextFactory(this.sdk.context.getTab()),
+        contextFactory: new import_evaluatorFacade.TabContextFactory(
+          this.sdk.context.getTab(),
+          this.sdk.timeZone ?? void 0
+        ),
         cidAssigner: this.sdk.cidAssigner,
         userTokenProvider: this.sdk.userTokenStore
       });
@@ -143,7 +146,10 @@ class SdkFacade {
     if (this.contentFetcherFacade === void 0) {
       this.contentFetcherFacade = new import_contentFetcherFacade.ContentFetcherFacade({
         contentFetcher: this.sdk.contentFetcher,
-        contextFactory: new import_evaluatorFacade.TabContextFactory(this.sdk.context.getTab()),
+        contextFactory: new import_evaluatorFacade.TabContextFactory(
+          this.sdk.context.getTab(),
+          this.sdk.timeZone ?? void 0
+        ),
         cidAssigner: this.sdk.cidAssigner,
         previewTokenProvider: this.sdk.previewTokenStore,
         userTokenProvider: this.sdk.userTokenStore

package/facade/sdkFacade.js

@@ -110,7 +110,10 @@ class SdkFacade {
     if (this.evaluatorFacade === void 0) {
       this.evaluatorFacade = new EvaluatorFacade({
         evaluator: this.sdk.evaluator,
-        contextFactory: new TabContextFactory(this.sdk.context.getTab()),
+        contextFactory: new TabContextFactory(
+          this.sdk.context.getTab(),
+          this.sdk.timeZone ?? void 0
+        ),
         cidAssigner: this.sdk.cidAssigner,
         userTokenProvider: this.sdk.userTokenStore
       });
@@ -121,7 +124,10 @@ class SdkFacade {
     if (this.contentFetcherFacade === void 0) {
       this.contentFetcherFacade = new ContentFetcherFacade({
         contentFetcher: this.sdk.contentFetcher,
-        contextFactory: new TabContextFactory(this.sdk.context.getTab()),
+        contextFactory: new TabContextFactory(
+          this.sdk.context.getTab(),
+          this.sdk.timeZone ?? void 0
+        ),
         cidAssigner: this.sdk.cidAssigner,
         previewTokenProvider: this.sdk.previewTokenStore,
         userTokenProvider: this.sdk.userTokenStore

package/interactionMonitor.cjs

@@ -0,0 +1,181 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var interactionMonitor_exports = {};
+__export(interactionMonitor_exports, {
+  InteractionMonitor: () => InteractionMonitor
+});
+module.exports = __toCommonJS(interactionMonitor_exports);
+var import_eventManager = require('./eventManager.cjs');
+class InteractionMonitor {
+  constructor(options = {}) {
+    this.eventManager = new import_eventManager.SynchronousEventManager();
+    this.lastClickTime = 0;
+    this.enabled = false;
+    this.clickThrottleInterval = options.clickThrottleInterval ?? 500;
+    this.scrollDebounceInterval = options.scrollDebounceInterval ?? 250;
+    this.handleClick = this.handleClick.bind(this);
+    this.handleScroll = this.handleScroll.bind(this);
+  }
+  addListener(type, listener) {
+    this.eventManager.addListener(type, listener);
+  }
+  removeListener(type, listener) {
+    this.eventManager.removeListener(type, listener);
+  }
+  isEnabled() {
+    return this.enabled;
+  }
+  enable() {
+    if (this.enabled) {
+      return;
+    }
+    this.enabled = true;
+    window.addEventListener("click", this.handleClick, true);
+    window.addEventListener("scroll", this.handleScroll, true);
+  }
+  disable() {
+    if (!this.enabled) {
+      return;
+    }
+    this.enabled = false;
+    window.removeEventListener("click", this.handleClick, true);
+    window.removeEventListener("scroll", this.handleScroll, true);
+    this.flushPendingScroll();
+  }
+  handleClick(event) {
+    const currentTime = Date.now();
+    if (currentTime - this.lastClickTime < this.clickThrottleInterval) {
+      return;
+    }
+    this.lastClickTime = currentTime;
+    this.eventManager.dispatch("userClicked", {
+      type: "userClicked",
+      point: {
+        x: Math.max(0, Math.round(event.pageX)),
+        y: Math.max(0, Math.round(event.pageY))
+      },
+      surfaceSize: {
+        width: document.documentElement.scrollWidth,
+        height: document.documentElement.scrollHeight
+      }
+    });
+  }
+  handleScroll() {
+    const currentPosition = {
+      x: Math.max(0, Math.round(window.scrollX)),
+      y: Math.max(0, Math.round(window.scrollY))
+    };
+    if (this.scrollState === void 0) {
+      this.scrollState = {
+        start: currentPosition,
+        lastPosition: currentPosition
+      };
+    } else if (this.hasDirectionChanged(this.scrollState, currentPosition)) {
+      const turningPoint = this.scrollState.lastPosition;
+      this.flushPendingScroll(turningPoint);
+      this.scrollState = {
+        start: turningPoint,
+        lastPosition: currentPosition
+      };
+    } else {
+      this.scrollState.lastPosition = currentPosition;
+    }
+    if (this.scrollDebounceTimer !== void 0) {
+      window.clearTimeout(this.scrollDebounceTimer);
+    }
+    this.scrollDebounceTimer = window.setTimeout(
+      () => this.flushPendingScroll(),
+      this.scrollDebounceInterval
+    );
+  }
+  /**
+   * Determines whether the scroll direction has reversed on either axis.
+   *
+   * It compares two vectors:
+   * - The scroll direction: the overall direction from start to the previous position (start -> previous)
+   * - The movement direction: the direction of the latest movement (previous -> current)
+   *
+   * A reversal is detected when these two vectors point in opposite directions on the same axis.
+   * Axes with no movement (sign = 0) are ignored, so scrolling that simply stops on one axis
+   * without reversing does not trigger a flush.
+   *
+   * Example of vertical reversal:
+   *   start = {y: 0}, previous = {y: 500}, current = {y: 400}
+   *   scrollDirectionY  = sign(500 - 0)   = +1 (downward)
+   *   movementDirectionY = sign(400 - 500) = -1 (upward)
+   *   +1 !== -1 => reversed
+   *
+   * Example of no reversal (same direction):
+   *   start = {y: 0}, previous = {y: 200}, current = {y: 500}
+   *   scrollDirectionY  = sign(200 - 0)   = +1 (downward)
+   *   movementDirectionY = sign(500 - 200) = +1 (downward)
+   *   +1 === +1 => not reversed
+   *
+   * Example of horizontal stop ignored:
+   *   start = {x: 0}, previous = {x: 300}, current = {x: 300}
+   *   scrollDirectionX  = sign(300 - 0)   = +1
+   *   movementDirectionX = sign(300 - 300) = 0 (no movement)
+   *   movementDirectionX is 0 => ignored, not a reversal
+   */
+  hasDirectionChanged(state, current) {
+    const { start, lastPosition: previous } = state;
+    const scrollDirectionX = Math.sign(previous.x - start.x);
+    const scrollDirectionY = Math.sign(previous.y - start.y);
+    const movementDirectionX = Math.sign(current.x - previous.x);
+    const movementDirectionY = Math.sign(current.y - previous.y);
+    return scrollDirectionX !== 0 && movementDirectionX !== 0 && scrollDirectionX !== movementDirectionX || scrollDirectionY !== 0 && movementDirectionY !== 0 && scrollDirectionY !== movementDirectionY;
+  }
+  flushPendingScroll(end) {
+    if (this.scrollDebounceTimer !== void 0) {
+      window.clearTimeout(this.scrollDebounceTimer);
+      this.scrollDebounceTimer = void 0;
+    }
+    if (this.scrollState === void 0) {
+      return;
+    }
+    const { start } = this.scrollState;
+    const destination = end ?? {
+      x: Math.max(0, Math.round(window.scrollX)),
+      y: Math.max(0, Math.round(window.scrollY))
+    };
+    this.scrollState = void 0;
+    if (start.x === destination.x && start.y === destination.y) {
+      return;
+    }
+    this.eventManager.dispatch("userScrolled", {
+      type: "userScrolled",
+      start,
+      end: destination,
+      surfaceSize: {
+        width: document.documentElement.scrollWidth,
+        height: document.documentElement.scrollHeight
+      },
+      // Uses clientWidth/clientHeight instead of innerWidth/innerHeight to get the
+      // layout viewport size, which remains stable regardless of pinch-to-zoom level
+      // on mobile devices.
+      viewportSize: {
+        width: document.documentElement.clientWidth,
+        height: document.documentElement.clientHeight
+      }
+    });
+  }
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  InteractionMonitor
+});

package/interactionMonitor.d.cts

@@ -0,0 +1,64 @@
+import { EventListener } from './eventManager.cjs';
+import { UserClicked, UserScrolled } from './trackingEvents.cjs';
+import './patch.cjs';
+import '@croct/json';
+import './utilityTypes.cjs';
+
+type InteractionEventMap = {
+    userClicked: UserClicked;
+    userScrolled: UserScrolled;
+};
+type Options = {
+    clickThrottleInterval?: number;
+    scrollDebounceInterval?: number;
+};
+declare class InteractionMonitor {
+    private readonly eventManager;
+    private readonly clickThrottleInterval;
+    private readonly scrollDebounceInterval;
+    private lastClickTime;
+    private scrollState?;
+    private scrollDebounceTimer?;
+    private enabled;
+    constructor(options?: Options);
+    addListener<T extends keyof InteractionEventMap>(type: T, listener: EventListener<InteractionEventMap[T]>): void;
+    removeListener<T extends keyof InteractionEventMap>(type: T, listener: EventListener<InteractionEventMap[T]>): void;
+    isEnabled(): boolean;
+    enable(): void;
+    disable(): void;
+    private handleClick;
+    private handleScroll;
+    /**
+     * Determines whether the scroll direction has reversed on either axis.
+     *
+     * It compares two vectors:
+     * - The scroll direction: the overall direction from start to the previous position (start -> previous)
+     * - The movement direction: the direction of the latest movement (previous -> current)
+     *
+     * A reversal is detected when these two vectors point in opposite directions on the same axis.
+     * Axes with no movement (sign = 0) are ignored, so scrolling that simply stops on one axis
+     * without reversing does not trigger a flush.
+     *
+     * Example of vertical reversal:
+     *   start = {y: 0}, previous = {y: 500}, current = {y: 400}
+     *   scrollDirectionY  = sign(500 - 0)   = +1 (downward)
+     *   movementDirectionY = sign(400 - 500) = -1 (upward)
+     *   +1 !== -1 => reversed
+     *
+     * Example of no reversal (same direction):
+     *   start = {y: 0}, previous = {y: 200}, current = {y: 500}
+     *   scrollDirectionY  = sign(200 - 0)   = +1 (downward)
+     *   movementDirectionY = sign(500 - 200) = +1 (downward)
+     *   +1 === +1 => not reversed
+     *
+     * Example of horizontal stop ignored:
+     *   start = {x: 0}, previous = {x: 300}, current = {x: 300}
+     *   scrollDirectionX  = sign(300 - 0)   = +1
+     *   movementDirectionX = sign(300 - 300) = 0 (no movement)
+     *   movementDirectionX is 0 => ignored, not a reversal
+     */
+    private hasDirectionChanged;
+    private flushPendingScroll;
+}
+
+export { InteractionMonitor };

package/interactionMonitor.d.ts

@@ -0,0 +1,64 @@
+import { EventListener } from './eventManager.js';
+import { UserClicked, UserScrolled } from './trackingEvents.js';
+import './patch.js';
+import '@croct/json';
+import './utilityTypes.js';
+
+type InteractionEventMap = {
+    userClicked: UserClicked;
+    userScrolled: UserScrolled;
+};
+type Options = {
+    clickThrottleInterval?: number;
+    scrollDebounceInterval?: number;
+};
+declare class InteractionMonitor {
+    private readonly eventManager;
+    private readonly clickThrottleInterval;
+    private readonly scrollDebounceInterval;
+    private lastClickTime;
+    private scrollState?;
+    private scrollDebounceTimer?;
+    private enabled;
+    constructor(options?: Options);
+    addListener<T extends keyof InteractionEventMap>(type: T, listener: EventListener<InteractionEventMap[T]>): void;
+    removeListener<T extends keyof InteractionEventMap>(type: T, listener: EventListener<InteractionEventMap[T]>): void;
+    isEnabled(): boolean;
+    enable(): void;
+    disable(): void;
+    private handleClick;
+    private handleScroll;
+    /**
+     * Determines whether the scroll direction has reversed on either axis.
+     *
+     * It compares two vectors:
+     * - The scroll direction: the overall direction from start to the previous position (start -> previous)
+     * - The movement direction: the direction of the latest movement (previous -> current)
+     *
+     * A reversal is detected when these two vectors point in opposite directions on the same axis.
+     * Axes with no movement (sign = 0) are ignored, so scrolling that simply stops on one axis
+     * without reversing does not trigger a flush.
+     *
+     * Example of vertical reversal:
+     *   start = {y: 0}, previous = {y: 500}, current = {y: 400}
+     *   scrollDirectionY  = sign(500 - 0)   = +1 (downward)
+     *   movementDirectionY = sign(400 - 500) = -1 (upward)
+     *   +1 !== -1 => reversed
+     *
+     * Example of no reversal (same direction):
+     *   start = {y: 0}, previous = {y: 200}, current = {y: 500}
+     *   scrollDirectionY  = sign(200 - 0)   = +1 (downward)
+     *   movementDirectionY = sign(500 - 200) = +1 (downward)
+     *   +1 === +1 => not reversed
+     *
+     * Example of horizontal stop ignored:
+     *   start = {x: 0}, previous = {x: 300}, current = {x: 300}
+     *   scrollDirectionX  = sign(300 - 0)   = +1
+     *   movementDirectionX = sign(300 - 300) = 0 (no movement)
+     *   movementDirectionX is 0 => ignored, not a reversal
+     */
+    private hasDirectionChanged;
+    private flushPendingScroll;
+}
+
+export { InteractionMonitor };