@aranova/tracking-next 0.15.0 → 0.16.1

package/dist/index.js

@@ -1273,6 +1273,7 @@ function createTrackingClient(config) {
   return {
     trackEvent,
     flush,
+    flushBeacon: flushOnUnload,
     getSessionId: () => sessionId,
     getVisitorId: () => visitorId,
     destroy: () => {
@@ -1297,9 +1298,17 @@ var ctaClickMetadataSchema = import_zod2.z.object({
     path: import_zod2.z.string()
   }).strict(),
   section: import_zod2.z.string().nullable().optional(),
-  destination_url: import_zod2.z.string().nullable().optional()
+  destination_url: import_zod2.z.string().nullable().optional(),
+  // Set by auto-capture (and available to manual callers): the link target
+  // and a short element descriptor (tag#id) for tying clicks to specific UI.
+  href: import_zod2.z.string().nullable().optional(),
+  element: import_zod2.z.string().nullable().optional()
+}).strict();
+var ctaClickConfigSchema = import_zod2.z.object({
+  autoCapture: import_zod2.z.object({
+    selector: import_zod2.z.string().optional()
+  }).strict().optional()
 }).strict();
-var ctaClickConfigSchema = import_zod2.z.object({}).strict();
 
 // ../tracking-core/src/events/sdk-heartbeat.ts
 var import_zod3 = require("zod");
@@ -1375,31 +1384,44 @@ var multiPageSessionConfigSchema = import_zod6.z.object({
   pageThreshold: import_zod6.z.number().int().min(2)
 }).strict();
 
-// ../tracking-core/src/events/phone-click.ts
+// ../tracking-core/src/events/page-exit.ts
 var import_zod7 = require("zod");
-var phoneClickMetadataSchema = import_zod7.z.object({
-  phone_number: import_zod7.z.string(),
+var pageExitMetadataSchema = import_zod7.z.object({
+  dwell_ms: import_zod7.z.number().int().min(0),
+  // null = left without any scroll signal; floor is 0 so a valid 0% is never
+  // rejected (a single bad field 422s the whole keepalive beacon batch).
+  max_scroll_percent: import_zod7.z.number().int().min(0).max(100).nullable(),
   page: import_zod7.z.object({
     path: import_zod7.z.string()
-  }).strict(),
-  section: import_zod7.z.string().nullable().optional()
+  }).strict()
 }).strict();
-var phoneClickConfigSchema = import_zod7.z.object({}).strict();
+var pageExitConfigSchema = import_zod7.z.object({}).strict();
 
-// ../tracking-core/src/events/scroll-depth.ts
+// ../tracking-core/src/events/phone-click.ts
 var import_zod8 = require("zod");
-var scrollDepthMetadataSchema = import_zod8.z.object({
-  depth_percent: import_zod8.z.number().int().min(1).max(100),
+var phoneClickMetadataSchema = import_zod8.z.object({
+  phone_number: import_zod8.z.string(),
   page: import_zod8.z.object({
     path: import_zod8.z.string()
+  }).strict(),
+  section: import_zod8.z.string().nullable().optional()
+}).strict();
+var phoneClickConfigSchema = import_zod8.z.object({}).strict();
+
+// ../tracking-core/src/events/scroll-depth.ts
+var import_zod9 = require("zod");
+var scrollDepthMetadataSchema = import_zod9.z.object({
+  depth_percent: import_zod9.z.number().int().min(1).max(100),
+  page: import_zod9.z.object({
+    path: import_zod9.z.string()
   }).strict()
 }).strict();
-var scrollDepthConfigSchema = import_zod8.z.object({
-  thresholds: import_zod8.z.array(import_zod8.z.number().int().min(1).max(100)).min(1)
+var scrollDepthConfigSchema = import_zod9.z.object({
+  thresholds: import_zod9.z.array(import_zod9.z.number().int().min(1).max(100)).min(1)
 }).strict();
 
 // ../tracking-core/src/events/specific-page-visit.ts
-var import_zod9 = require("zod");
+var import_zod10 = require("zod");
 var SPECIFIC_PAGE_NAMES = [
   "contact_page",
   "about_page",
@@ -1410,18 +1432,18 @@ var SPECIFIC_PAGE_NAMES = [
   "faq_page",
   "testimonials_page"
 ];
-var specificPageNameSchema = import_zod9.z.enum(SPECIFIC_PAGE_NAMES);
-var specificPageVisitMetadataSchema = import_zod9.z.object({
+var specificPageNameSchema = import_zod10.z.enum(SPECIFIC_PAGE_NAMES);
+var specificPageVisitMetadataSchema = import_zod10.z.object({
   page_name: specificPageNameSchema,
-  page: import_zod9.z.object({
-    path: import_zod9.z.string()
+  page: import_zod10.z.object({
+    path: import_zod10.z.string()
   }).strict()
 }).strict();
-var specificPageVisitConfigSchema = import_zod9.z.object({
-  pages: import_zod9.z.array(
-    import_zod9.z.object({
+var specificPageVisitConfigSchema = import_zod10.z.object({
+  pages: import_zod10.z.array(
+    import_zod10.z.object({
       name: specificPageNameSchema,
-      pathPattern: import_zod9.z.custom((value) => value instanceof RegExp, {
+      pathPattern: import_zod10.z.custom((value) => value instanceof RegExp, {
         message: "pathPattern must be a RegExp"
       })
     }).strict()
@@ -1429,15 +1451,15 @@ var specificPageVisitConfigSchema = import_zod9.z.object({
 }).strict();
 
 // ../tracking-core/src/events/time-on-site.ts
-var import_zod10 = require("zod");
-var timeOnSiteMetadataSchema = import_zod10.z.object({
-  duration_ms: import_zod10.z.number().int().nonnegative(),
-  page: import_zod10.z.object({
-    path: import_zod10.z.string()
+var import_zod11 = require("zod");
+var timeOnSiteMetadataSchema = import_zod11.z.object({
+  duration_ms: import_zod11.z.number().int().nonnegative(),
+  page: import_zod11.z.object({
+    path: import_zod11.z.string()
   }).strict()
 }).strict();
-var timeOnSiteConfigSchema = import_zod10.z.object({
-  thresholdSeconds: import_zod10.z.number().int().positive()
+var timeOnSiteConfigSchema = import_zod11.z.object({
+  thresholdSeconds: import_zod11.z.number().int().positive()
 }).strict();
 
 // ../tracking-core/src/events/registry.ts
@@ -1479,6 +1501,11 @@ var EVENT_REGISTRY = {
     metadataSchema: sdkHeartbeatMetadataSchema,
     configSchema: sdkHeartbeatConfigSchema
   },
+  page_exit: {
+    kind: "automatic",
+    metadataSchema: pageExitMetadataSchema,
+    configSchema: pageExitConfigSchema
+  },
   // --- manual triggers ---
   form_submit: {
     kind: "manual",
@@ -1722,6 +1749,163 @@ function attachFormStart(client, config) {
   };
 }
 
+// ../tracking-core/src/triggers/page-exit.ts
+function attachPageExit(client) {
+  if (typeof window === "undefined" || typeof document === "undefined") {
+    return () => {
+    };
+  }
+  let currentPath2 = window.location.pathname;
+  let activeSince = document.visibilityState === "visible" ? Date.now() : null;
+  let accumulatedMs = 0;
+  let maxScrollPercent = null;
+  let rafId = null;
+  function getScrollPercent() {
+    const doc = document.documentElement;
+    const scrollTop = window.scrollY || doc.scrollTop;
+    const scrollHeight = doc.scrollHeight;
+    const clientHeight = doc.clientHeight;
+    if (scrollHeight <= clientHeight) return 100;
+    return Math.round((scrollTop + clientHeight) / scrollHeight * 100);
+  }
+  function onScroll() {
+    if (rafId !== null) return;
+    rafId = requestAnimationFrame(() => {
+      rafId = null;
+      const percent = getScrollPercent();
+      if (percent >= 1 && (maxScrollPercent === null || percent > maxScrollPercent)) {
+        maxScrollPercent = Math.min(percent, 100);
+      }
+    });
+  }
+  function settledDwellMs() {
+    let total = accumulatedMs;
+    if (activeSince !== null) {
+      total += Date.now() - activeSince;
+    }
+    return Math.max(0, Math.round(total));
+  }
+  function emitSegment(path, flush) {
+    const dwell = settledDwellMs();
+    if (dwell === 0) return;
+    client.trackEvent({
+      eventType: "page_exit",
+      metadata: {
+        dwell_ms: dwell,
+        max_scroll_percent: maxScrollPercent,
+        page: { path }
+      },
+      pageUrl: window.location.href,
+      occurredAt: null
+    });
+    if (flush) {
+      client.flushBeacon();
+    }
+    accumulatedMs = 0;
+    activeSince = document.visibilityState === "visible" ? Date.now() : null;
+  }
+  function onNavigate() {
+    const newPath = window.location.pathname;
+    if (newPath === currentPath2) return;
+    emitSegment(currentPath2, false);
+    currentPath2 = newPath;
+    maxScrollPercent = null;
+    accumulatedMs = 0;
+    activeSince = document.visibilityState === "visible" ? Date.now() : null;
+  }
+  function onVisibilityChange() {
+    if (document.visibilityState === "hidden") {
+      emitSegment(currentPath2, true);
+    } else {
+      activeSince = Date.now();
+    }
+  }
+  function onPageHide() {
+    emitSegment(currentPath2, true);
+  }
+  const originalPushState = history.pushState.bind(history);
+  const originalReplaceState = history.replaceState.bind(history);
+  function patchedPushState(...args) {
+    originalPushState(...args);
+    setTimeout(onNavigate, 0);
+  }
+  function patchedReplaceState(...args) {
+    originalReplaceState(...args);
+    setTimeout(onNavigate, 0);
+  }
+  history.pushState = patchedPushState;
+  history.replaceState = patchedReplaceState;
+  window.addEventListener("popstate", onNavigate);
+  window.addEventListener("scroll", onScroll, { passive: true });
+  document.addEventListener("visibilitychange", onVisibilityChange);
+  window.addEventListener("pagehide", onPageHide);
+  return () => {
+    if (rafId !== null) cancelAnimationFrame(rafId);
+    history.pushState = originalPushState;
+    history.replaceState = originalReplaceState;
+    window.removeEventListener("popstate", onNavigate);
+    window.removeEventListener("scroll", onScroll);
+    document.removeEventListener("visibilitychange", onVisibilityChange);
+    window.removeEventListener("pagehide", onPageHide);
+  };
+}
+
+// ../tracking-core/src/triggers/cta-click-capture.ts
+var DEFAULT_CTA_SELECTOR = "[data-aranova-cta]";
+var CTA_NAME_MAX_LENGTH = 120;
+function describeElement(el) {
+  const tag = el.tagName.toLowerCase();
+  return el.id ? `${tag}#${el.id}` : tag;
+}
+function resolveCtaName(el) {
+  const explicit = el.getAttribute("data-aranova-cta");
+  if (explicit && explicit.trim().length > 0) return explicit.trim();
+  const text = (el.textContent ?? "").trim().replace(/\s+/g, " ");
+  if (text.length > 0) return text.slice(0, CTA_NAME_MAX_LENGTH);
+  return describeElement(el);
+}
+function attachCtaClickCapture(client, config) {
+  if (typeof window === "undefined" || typeof document === "undefined") {
+    return () => {
+    };
+  }
+  const autoCapture = config.autoCapture;
+  if (!autoCapture) {
+    return () => {
+    };
+  }
+  const selector = autoCapture.selector ?? DEFAULT_CTA_SELECTOR;
+  function onClick(event) {
+    const target = event.target;
+    if (!(target instanceof Element)) return;
+    let matched = null;
+    try {
+      matched = target.closest(selector);
+    } catch {
+      return;
+    }
+    if (matched === null) return;
+    const href = matched instanceof HTMLAnchorElement ? matched.href || null : matched.getAttribute("href");
+    client.trackEvent({
+      eventType: "cta_click",
+      metadata: {
+        cta_name: resolveCtaName(matched),
+        page: { path: window.location.pathname },
+        section: matched.getAttribute("data-aranova-section"),
+        destination_url: href,
+        href,
+        element: describeElement(matched)
+      },
+      pageUrl: window.location.href,
+      occurredAt: null
+    });
+  }
+  document.addEventListener("click", onClick, true);
+  return () => {
+    document.removeEventListener("click", onClick, true);
+  };
+}
+
 // ../tracking-core/src/resources/sales/errors.ts
 var AranovaApiError = class extends Error {
   constructor(message, options) {
@@ -1928,42 +2112,42 @@ function createSalesClient(config) {
 }
 
 // ../tracking-core/src/resources/sales/schema.ts
-var import_zod11 = require("zod");
+var import_zod12 = require("zod");
 var SUPPORTED_CURRENCIES = ["USD", "CAD"];
 var TRACKING_ENVIRONMENTS = ["production", "development"];
-var currencySchema = import_zod11.z.enum(SUPPORTED_CURRENCIES);
-var centsSchema = import_zod11.z.number().int().nonnegative();
-var quantitySchema = import_zod11.z.string().regex(/^\d+(\.\d{1,3})?$/);
-var metadataSchema = import_zod11.z.record(import_zod11.z.unknown());
-var saleItemSchema = import_zod11.z.object({
-  external_item_id: import_zod11.z.string().nullable().optional(),
-  name: import_zod11.z.string().nullable().optional(),
-  category: import_zod11.z.string().nullable().optional(),
+var currencySchema = import_zod12.z.enum(SUPPORTED_CURRENCIES);
+var centsSchema = import_zod12.z.number().int().nonnegative();
+var quantitySchema = import_zod12.z.string().regex(/^\d+(\.\d{1,3})?$/);
+var metadataSchema = import_zod12.z.record(import_zod12.z.unknown());
+var saleItemSchema = import_zod12.z.object({
+  external_item_id: import_zod12.z.string().nullable().optional(),
+  name: import_zod12.z.string().nullable().optional(),
+  category: import_zod12.z.string().nullable().optional(),
   quantity: quantitySchema,
   unit_price_cents: centsSchema,
   // Non-negativity validated on the wire — same contract as the other cents
   // fields — and backstopped by the DB CHECK.
   unit_cost_cents: centsSchema.nullable().optional()
 }).strict();
-var saleServiceSchema = import_zod11.z.object({
-  service: import_zod11.z.string(),
+var saleServiceSchema = import_zod12.z.object({
+  service: import_zod12.z.string(),
   amount_cents: centsSchema
 }).strict();
-var customerNameSchema = import_zod11.z.string().max(200);
-var customerPhoneSchema = import_zod11.z.string().max(64);
-var customerEmailSchema = import_zod11.z.string().max(320).email();
+var customerNameSchema = import_zod12.z.string().max(200);
+var customerPhoneSchema = import_zod12.z.string().max(64);
+var customerEmailSchema = import_zod12.z.string().max(320).email();
 function refineServiceXor(val, ctx, { requireAmount }) {
   if (val.services != null) {
     if (val.service != null) {
       ctx.addIssue({
-        code: import_zod11.z.ZodIssueCode.custom,
+        code: import_zod12.z.ZodIssueCode.custom,
         message: "pass either `service` or `services`, not both",
         path: ["services"]
       });
     }
     if (val.services.length === 0) {
       ctx.addIssue({
-        code: import_zod11.z.ZodIssueCode.custom,
+        code: import_zod12.z.ZodIssueCode.custom,
         message: "`services` must not be empty",
         path: ["services"]
       });
@@ -1971,7 +2155,7 @@ function refineServiceXor(val, ctx, { requireAmount }) {
     const keys = val.services.map((s) => s.service);
     if (new Set(keys).size !== keys.length) {
       ctx.addIssue({
-        code: import_zod11.z.ZodIssueCode.custom,
+        code: import_zod12.z.ZodIssueCode.custom,
         message: "`services` must not list the same service more than once",
         path: ["services"]
       });
@@ -1980,7 +2164,7 @@ function refineServiceXor(val, ctx, { requireAmount }) {
       const sum = val.services.reduce((acc, s) => acc + s.amount_cents, 0);
       if (val.amount_total_cents !== sum) {
         ctx.addIssue({
-          code: import_zod11.z.ZodIssueCode.custom,
+          code: import_zod12.z.ZodIssueCode.custom,
           message: "amount_total_cents must equal the sum of the services amounts (omit it to derive it automatically)",
           path: ["amount_total_cents"]
         });
@@ -1988,37 +2172,37 @@ function refineServiceXor(val, ctx, { requireAmount }) {
     }
   } else if (requireAmount && val.amount_total_cents == null) {
     ctx.addIssue({
-      code: import_zod11.z.ZodIssueCode.custom,
+      code: import_zod12.z.ZodIssueCode.custom,
       message: "amount_total_cents is required unless `services` is provided",
       path: ["amount_total_cents"]
     });
   }
 }
-var saleCreateSchema = import_zod11.z.object({
-  external_id: import_zod11.z.string().nullable().optional(),
-  description: import_zod11.z.string().nullable().optional(),
-  service: import_zod11.z.string().nullable().optional(),
-  services: import_zod11.z.array(saleServiceSchema).nullable().optional(),
+var saleCreateSchema = import_zod12.z.object({
+  external_id: import_zod12.z.string().nullable().optional(),
+  description: import_zod12.z.string().nullable().optional(),
+  service: import_zod12.z.string().nullable().optional(),
+  services: import_zod12.z.array(saleServiceSchema).nullable().optional(),
   currency: currencySchema,
   // Optional only because the plural `services` form derives it from the sum
   // (see refineServiceXor); the singular/serviceless path still requires it.
   amount_total_cents: centsSchema.nullable().optional(),
-  occurred_at: import_zod11.z.string().datetime(),
-  environment: import_zod11.z.enum(TRACKING_ENVIRONMENTS).default("production"),
-  items: import_zod11.z.array(saleItemSchema).default([]),
+  occurred_at: import_zod12.z.string().datetime(),
+  environment: import_zod12.z.enum(TRACKING_ENVIRONMENTS).default("production"),
+  items: import_zod12.z.array(saleItemSchema).default([]),
   metadata: metadataSchema.nullable().optional(),
   customer_name: customerNameSchema.nullable().optional(),
   customer_phone: customerPhoneSchema.nullable().optional(),
   customer_email: customerEmailSchema.nullable().optional()
 }).strict().superRefine((val, ctx) => refineServiceXor(val, ctx, { requireAmount: true }));
-var saleUpdateSchema = import_zod11.z.object({
-  description: import_zod11.z.string().nullable().optional(),
-  service: import_zod11.z.string().nullable().optional(),
-  services: import_zod11.z.array(saleServiceSchema).nullable().optional(),
+var saleUpdateSchema = import_zod12.z.object({
+  description: import_zod12.z.string().nullable().optional(),
+  service: import_zod12.z.string().nullable().optional(),
+  services: import_zod12.z.array(saleServiceSchema).nullable().optional(),
   currency: currencySchema.optional(),
   amount_total_cents: centsSchema.optional(),
-  occurred_at: import_zod11.z.string().datetime().optional(),
-  items: import_zod11.z.array(saleItemSchema).optional(),
+  occurred_at: import_zod12.z.string().datetime().optional(),
+  items: import_zod12.z.array(saleItemSchema).optional(),
   metadata: metadataSchema.nullable().optional(),
   customer_name: customerNameSchema.nullable().optional(),
   customer_phone: customerPhoneSchema.nullable().optional(),
@@ -2420,7 +2604,7 @@ function GoogleAdsTracking(props) {
 var import_navigation = require("next/navigation");
 
 // package.json
-var version = "0.15.0";
+var version = "0.16.1";
 
 // src/factory.tsx
 var import_react4 = require("react");
@@ -2513,6 +2697,14 @@ var PhoneField = (0, import_react3.forwardRef)(function PhoneField2({ country, v
 
 // src/factory.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
+function PageViewTracker({ fire }) {
+  const pathname = (0, import_navigation.usePathname)();
+  const searchParams = (0, import_navigation.useSearchParams)();
+  (0, import_react4.useEffect)(() => {
+    fire();
+  }, [pathname, searchParams, fire]);
+  return null;
+}
 function createTracking(options) {
   const { apiKey, endpoint, triggers, environment, gtagIds, debug, phone, conversionConfig } = options;
   if (!apiKey || !endpoint) {
@@ -2539,7 +2731,6 @@ function createTracking(options) {
   const timeOnSiteConfig = triggers.automatic.time_on_site ?? null;
   function TrackingProvider({ children }) {
     const pathname = (0, import_navigation.usePathname)();
-    const searchParams = (0, import_navigation.useSearchParams)();
     const client = (0, import_react4.useMemo)(
       () => createTypedClient(
         getOrCreateTrackingClient({
@@ -2569,7 +2760,7 @@ function createTracking(options) {
       const autoFire = conversionStore ? createConversionAutoFire(conversionStore) : null;
       return (c) => autoFire ? withConversionAutoFire(c, autoFire) : c;
     }, [conversionStore]);
-    (0, import_react4.useEffect)(() => {
+    const firePageView = (0, import_react4.useCallback)(() => {
       const rawClient = getOrCreateTrackingClient({
         apiKey,
         endpoint,
@@ -2581,7 +2772,7 @@ function createTracking(options) {
         debug
       });
       fireManualPageView(wrapClient(rawClient));
-    }, [pathname, searchParams]);
+    }, [wrapClient]);
     const firedPagesRef = (0, import_react4.useRef)(/* @__PURE__ */ new Set());
     (0, import_react4.useEffect)(() => {
       if (!specificPageVisitConfig || pathname === null) return;
@@ -2701,6 +2892,7 @@ function createTracking(options) {
         debug
       });
       const detectorClient = wrapClient(rawClient);
+      detachers.push(attachPageExit(detectorClient));
       const scrollDepth = triggers.automatic.scroll_depth;
       if (scrollDepth) {
         detachers.push(attachScrollDepth(detectorClient, scrollDepth));
@@ -2709,13 +2901,20 @@ function createTracking(options) {
       if (formStart) {
         detachers.push(attachFormStart(detectorClient, formStart));
       }
+      const ctaClick = triggers.manual?.cta_click;
+      if (ctaClick) {
+        detachers.push(attachCtaClickCapture(detectorClient, ctaClick));
+      }
       return () => {
         for (let i = detachers.length - 1; i >= 0; i--) {
           detachers[i]();
         }
       };
     }, []);
-    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(TrackingContext.Provider, { value: client, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PhoneConfigProvider, { value: phone ?? null, children }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(TrackingContext.Provider, { value: client, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react4.Suspense, { fallback: null, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PageViewTracker, { fire: firePageView }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(PhoneConfigProvider, { value: phone ?? null, children })
+    ] });
   }
   function useTracking() {
     const client = (0, import_react4.useContext)(TrackingContext);