@neowhale/storefront 0.2.13 → 0.2.20

package/dist/react/index.js

@@ -1,5 +1,5 @@
-import { PixelManager } from '../chunk-NLH3W6JA.js';
-import { WhaleClient } from '../chunk-M2MR6C55.js';
+import { PixelManager } from '../chunk-PXS2DPVL.js';
+import { resilientSend, WhaleClient } from '../chunk-3Q7CPJBA.js';
 import { createContext, useContext, useRef, useCallback, useEffect, useState, useMemo } from 'react';
 import { usePathname } from 'next/navigation';
 import { createStore } from 'zustand/vanilla';
@@ -10,7 +10,7 @@ import { ThemeProvider } from '@neowhale/ui';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 var WhaleContext = createContext(null);
-function createCartStore(client, storagePrefix, onAddToCart, onRemoveFromCart) {
+function createCartStore(client, storagePrefix, onAddToCart, onRemoveFromCart, onCartChange) {
   return createStore()(
     persist(
       (set, get) => ({
@@ -98,6 +98,8 @@ function createCartStore(client, storagePrefix, onAddToCart, onRemoveFromCart) {
             }
             await get().syncCart();
             onAddToCart?.(productId, productName || "", quantity, unitPrice || 0, tier);
+            const state = get();
+            if (state.cartId) onCartChange?.(state.cartId, state.total, state.itemCount);
           } finally {
             set({ cartLoading: false, addItemInFlight: false });
           }
@@ -109,6 +111,8 @@ function createCartStore(client, storagePrefix, onAddToCart, onRemoveFromCart) {
             if (!cartId) return;
             await client.updateCartItem(cartId, itemId, quantity);
             await get().syncCart();
+            const state = get();
+            if (state.cartId) onCartChange?.(state.cartId, state.total, state.itemCount);
           } finally {
             set({ cartLoading: false });
           }
@@ -124,6 +128,8 @@ function createCartStore(client, storagePrefix, onAddToCart, onRemoveFromCart) {
             if (item) {
               onRemoveFromCart?.(item.product_id, productName || item.product_name);
             }
+            const state = get();
+            if (state.cartId) onCartChange?.(state.cartId, state.total, state.itemCount);
           } finally {
             set({ cartLoading: false });
           }
@@ -237,6 +243,12 @@ function createAuthStore(client, storagePrefix) {
             set({ authLoading: false });
           }
         },
+        updateProfile: async (data) => {
+          const customer = get().customer;
+          if (!customer?.id) throw new Error("Not authenticated");
+          const updated = await client.updateProfile(customer.id, data);
+          set({ customer: updated });
+        },
         restoreSession: async () => {
           const { sessionToken, sessionExpiresAt, customer } = get();
           if (!sessionToken || !sessionExpiresAt) return;
@@ -297,6 +309,38 @@ function createAuthStore(client, storagePrefix) {
   );
 }
 var SESSION_KEY_SUFFIX = "-analytics-session";
+var VISITOR_KEY_SUFFIX = "-visitor-id";
+function parseMarketingParams() {
+  if (typeof window === "undefined") return {};
+  const params = new URLSearchParams(window.location.search);
+  const result = {};
+  for (const key of ["utm_source", "utm_medium", "utm_campaign", "utm_content", "utm_term", "gclid", "fbclid"]) {
+    const val = params.get(key);
+    if (val) result[key] = val;
+  }
+  return result;
+}
+function getVisitorId(prefix) {
+  const key = `${prefix}${VISITOR_KEY_SUFFIX}`;
+  try {
+    const existing = localStorage.getItem(key);
+    if (existing) return existing;
+  } catch {
+  }
+  const id = `v-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
+  try {
+    localStorage.setItem(key, id);
+  } catch {
+  }
+  return id;
+}
+function detectDevice() {
+  if (typeof navigator === "undefined") return "unknown";
+  const ua = navigator.userAgent;
+  if (/Mobi|Android/i.test(ua)) return "mobile";
+  if (/Tablet|iPad/i.test(ua)) return "tablet";
+  return "desktop";
+}
 function useAnalytics() {
   const ctx = useContext(WhaleContext);
   if (!ctx) throw new Error("useAnalytics must be used within <WhaleProvider>");
@@ -319,9 +363,15 @@ function useAnalytics() {
       } catch {
       }
       try {
+        const marketing = parseMarketingParams();
+        const visitorId = getVisitorId(config.storagePrefix);
         const session = await client.createSession({
+          visitor_id: visitorId,
           user_agent: navigator.userAgent,
-          referrer: document.referrer || void 0
+          referrer: document.referrer || void 0,
+          page_url: window.location.href,
+          device: detectDevice(),
+          ...marketing
         });
         if (session?.id) {
           localStorage.setItem(sessionKey, JSON.stringify({ id: session.id, createdAt: Date.now() }));
@@ -346,10 +396,12 @@ function useAnalytics() {
       pixelManager?.track(eventType, { ...data, eventID: eventId });
       try {
         const sessionId = await getOrCreateSession();
+        const visitorId = getVisitorId(config.storagePrefix);
         await client.trackEvent({
           session_id: sessionId,
           event_type: eventType,
-          event_data: { ...data, event_id: eventId }
+          event_data: { ...data, event_id: eventId },
+          visitor_id: visitorId
         });
       } catch {
       }
@@ -368,9 +420,38 @@ function useAnalytics() {
     },
     [client, getOrCreateSession, trackingEnabled]
   );
+  const updateSessionCart = useCallback(
+    async (cartId, cartTotal, cartItemCount) => {
+      if (!trackingEnabled) return;
+      try {
+        const sessionId = await getOrCreateSession();
+        if (sessionId.startsWith("local-")) return;
+        await client.updateSession(sessionId, {
+          cart_id: cartId,
+          cart_total: cartTotal,
+          cart_item_count: cartItemCount,
+          status: "carting"
+        });
+      } catch {
+      }
+    },
+    [client, getOrCreateSession, trackingEnabled]
+  );
+  const updateSessionOrder = useCallback(
+    async (orderId) => {
+      if (!trackingEnabled) return;
+      try {
+        const sessionId = await getOrCreateSession();
+        if (sessionId.startsWith("local-")) return;
+        await client.updateSession(sessionId, { order_id: orderId, status: "converted" });
+      } catch {
+      }
+    },
+    [client, getOrCreateSession, trackingEnabled]
+  );
   const trackPageView = useCallback(
     (url, referrer) => {
-      track("page_view", { url, referrer });
+      track("page_view", { url, referrer, page_url: url });
     },
     [track]
   );
@@ -427,6 +508,8 @@ function useAnalytics() {
     trackAddToCart,
     trackRemoveFromCart,
     linkCustomer,
+    updateSessionCart,
+    updateSessionOrder,
     getOrCreateSession,
     /** Whether tracking is globally enabled for this storefront */
     trackingEnabled,
@@ -444,6 +527,7 @@ function useAuth() {
     isAuthenticated: s.isSessionValid(),
     sendCode: s.sendOTP,
     verifyCode: s.verifyOTP,
+    updateProfile: s.updateProfile,
     restoreSession: s.restoreSession,
     logout: s.logout,
     fetchCustomer: s.fetchCustomer
@@ -463,7 +547,8 @@ function AnalyticsTracker({ pathname }) {
     if (pathname === prevPathname.current) return;
     const referrer = prevPathname.current || (typeof document !== "undefined" ? document.referrer : "");
     prevPathname.current = pathname;
-    trackPageView(pathname, referrer || void 0);
+    const fullUrl = typeof window !== "undefined" ? window.location.href : pathname;
+    trackPageView(fullUrl, referrer || void 0);
   }, [pathname, trackPageView, trackingEnabled]);
   useEffect(() => {
     if (!trackingEnabled) return;
@@ -557,6 +642,983 @@ function PixelInitializer({ onReady, onTheme }) {
   }, [ctx, onReady, onTheme]);
   return null;
 }
+
+// src/behavioral/tracker.ts
+var SCROLL_MILESTONES = [25, 50, 75, 100];
+var TIME_MILESTONES = [30, 60, 120, 300];
+var MOUSE_THROTTLE_MS = 200;
+var MOUSE_BUFFER_MAX = 100;
+var RAGE_CLICK_COUNT = 3;
+var RAGE_CLICK_RADIUS = 50;
+var RAGE_CLICK_WINDOW_MS = 2e3;
+var MAX_CLICK_HISTORY = 10;
+var BehavioralTracker = class {
+  constructor(config) {
+    this.buffer = [];
+    this.pageUrl = "";
+    this.pagePath = "";
+    this.flushTimer = null;
+    this.scrollMilestones = /* @__PURE__ */ new Set();
+    this.timeMilestones = /* @__PURE__ */ new Set();
+    this.timeTimers = [];
+    this.exitIntentFired = false;
+    this.startTime = 0;
+    this.clickHistory = [];
+    this.mouseBuffer = [];
+    this.lastMouseTime = 0;
+    this.listeners = [];
+    this.observer = null;
+    this.sentinels = [];
+    // ---------------------------------------------------------------------------
+    // Event handlers (arrow functions for stable `this`)
+    // ---------------------------------------------------------------------------
+    this.handleClick = (e) => {
+      const me = e;
+      const target = me.target;
+      if (!target) return;
+      const now2 = Date.now();
+      const x = me.clientX;
+      const y = me.clientY;
+      this.clickHistory.push({ x, y, t: now2 });
+      if (this.clickHistory.length > MAX_CLICK_HISTORY) {
+        this.clickHistory.shift();
+      }
+      const tag = target.tagName?.toLowerCase() ?? "";
+      const rawText = target.textContent ?? "";
+      const text = rawText.trim().slice(0, 50);
+      this.push({
+        data_type: "click",
+        data: {
+          tag,
+          text,
+          selector: this.getSelector(target),
+          x,
+          y,
+          timestamp: now2
+        },
+        page_url: this.pageUrl,
+        page_path: this.pagePath
+      });
+      this.detectRageClick(x, y, now2);
+    };
+    this.handleMouseMove = (e) => {
+      const me = e;
+      const now2 = Date.now();
+      if (now2 - this.lastMouseTime < MOUSE_THROTTLE_MS) return;
+      this.lastMouseTime = now2;
+      this.mouseBuffer.push({ x: me.clientX, y: me.clientY, t: now2 });
+      if (this.mouseBuffer.length > MOUSE_BUFFER_MAX) {
+        this.mouseBuffer.shift();
+      }
+    };
+    this.handleMouseOut = (e) => {
+      const me = e;
+      if (this.exitIntentFired) return;
+      if (me.clientY > 0) return;
+      if (me.relatedTarget !== null) return;
+      this.exitIntentFired = true;
+      this.push({
+        data_type: "exit_intent",
+        data: {
+          time_on_page_ms: Date.now() - this.startTime,
+          timestamp: Date.now()
+        },
+        page_url: this.pageUrl,
+        page_path: this.pagePath
+      });
+    };
+    this.handleCopy = () => {
+      const selection = window.getSelection();
+      const length = selection?.toString().length ?? 0;
+      this.push({
+        data_type: "copy",
+        data: {
+          text_length: length,
+          timestamp: Date.now()
+        },
+        page_url: this.pageUrl,
+        page_path: this.pagePath
+      });
+    };
+    this.handleVisibilityChange = () => {
+      if (document.visibilityState !== "hidden") return;
+      const timeSpent = Date.now() - this.startTime;
+      this.push({
+        data_type: "page_exit",
+        data: {
+          time_spent_ms: timeSpent,
+          timestamp: Date.now()
+        },
+        page_url: this.pageUrl,
+        page_path: this.pagePath
+      });
+      this.flushMouseBuffer();
+      this.flush();
+    };
+    this.config = {
+      sendBatch: config.sendBatch,
+      sessionId: config.sessionId,
+      visitorId: config.visitorId,
+      flushIntervalMs: config.flushIntervalMs ?? 1e4,
+      maxBufferSize: config.maxBufferSize ?? 500
+    };
+  }
+  start() {
+    this.startTime = Date.now();
+    this.addListener(document, "click", this.handleClick);
+    this.addListener(document, "mousemove", this.handleMouseMove);
+    this.addListener(document, "mouseout", this.handleMouseOut);
+    this.addListener(document, "copy", this.handleCopy);
+    this.addListener(document, "visibilitychange", this.handleVisibilityChange);
+    this.setupScrollTracking();
+    this.setupTimeMilestones();
+    this.flushTimer = setInterval(() => this.flush(), this.config.flushIntervalMs);
+  }
+  stop() {
+    for (const [target, event, handler] of this.listeners) {
+      target.removeEventListener(event, handler, { capture: true });
+    }
+    this.listeners = [];
+    if (this.flushTimer !== null) {
+      clearInterval(this.flushTimer);
+      this.flushTimer = null;
+    }
+    this.clearTimeMilestones();
+    this.cleanupScrollTracking();
+    this.flushMouseBuffer();
+    this.flush();
+  }
+  setPageContext(url, path) {
+    this.flushMouseBuffer();
+    this.flush();
+    this.pageUrl = url;
+    this.pagePath = path;
+    this.scrollMilestones.clear();
+    this.timeMilestones.clear();
+    this.exitIntentFired = false;
+    this.startTime = Date.now();
+    this.clickHistory = [];
+    this.clearTimeMilestones();
+    this.cleanupScrollTracking();
+    this.setupTimeMilestones();
+    requestAnimationFrame(() => this.setupScrollTracking());
+  }
+  // ---------------------------------------------------------------------------
+  // Buffer management
+  // ---------------------------------------------------------------------------
+  push(event) {
+    this.buffer.push(event);
+    if (this.buffer.length >= this.config.maxBufferSize) {
+      this.flush();
+    }
+  }
+  flush() {
+    if (this.buffer.length === 0) return;
+    const batch = {
+      session_id: this.config.sessionId,
+      visitor_id: this.config.visitorId,
+      events: this.buffer
+    };
+    this.buffer = [];
+    this.config.sendBatch(batch).catch(() => {
+    });
+  }
+  addListener(target, event, handler) {
+    target.addEventListener(event, handler, { passive: true, capture: true });
+    this.listeners.push([target, event, handler]);
+  }
+  // ---------------------------------------------------------------------------
+  // Scroll tracking with IntersectionObserver
+  // ---------------------------------------------------------------------------
+  setupScrollTracking() {
+    if (typeof IntersectionObserver === "undefined") return;
+    this.observer = new IntersectionObserver(
+      (entries) => {
+        for (const entry of entries) {
+          if (!entry.isIntersecting) continue;
+          const milestone = Number(entry.target.getAttribute("data-scroll-milestone"));
+          if (isNaN(milestone) || this.scrollMilestones.has(milestone)) continue;
+          this.scrollMilestones.add(milestone);
+          this.push({
+            data_type: "scroll_depth",
+            data: {
+              depth_percent: milestone,
+              timestamp: Date.now()
+            },
+            page_url: this.pageUrl,
+            page_path: this.pagePath
+          });
+        }
+      },
+      { threshold: 0 }
+    );
+    const docHeight = document.documentElement.scrollHeight;
+    for (const pct of SCROLL_MILESTONES) {
+      const sentinel = document.createElement("div");
+      sentinel.setAttribute("data-scroll-milestone", String(pct));
+      sentinel.style.position = "absolute";
+      sentinel.style.left = "0";
+      sentinel.style.width = "1px";
+      sentinel.style.height = "1px";
+      sentinel.style.pointerEvents = "none";
+      sentinel.style.opacity = "0";
+      sentinel.style.top = `${docHeight * pct / 100 - 1}px`;
+      document.body.appendChild(sentinel);
+      this.sentinels.push(sentinel);
+      this.observer.observe(sentinel);
+    }
+  }
+  cleanupScrollTracking() {
+    if (this.observer) {
+      this.observer.disconnect();
+      this.observer = null;
+    }
+    for (const sentinel of this.sentinels) {
+      sentinel.remove();
+    }
+    this.sentinels = [];
+  }
+  // ---------------------------------------------------------------------------
+  // Time milestones
+  // ---------------------------------------------------------------------------
+  setupTimeMilestones() {
+    for (const seconds of TIME_MILESTONES) {
+      const timer = setTimeout(() => {
+        if (this.timeMilestones.has(seconds)) return;
+        this.timeMilestones.add(seconds);
+        this.push({
+          data_type: "time_on_page",
+          data: {
+            milestone_seconds: seconds,
+            timestamp: Date.now()
+          },
+          page_url: this.pageUrl,
+          page_path: this.pagePath
+        });
+      }, seconds * 1e3);
+      this.timeTimers.push(timer);
+    }
+  }
+  clearTimeMilestones() {
+    for (const timer of this.timeTimers) {
+      clearTimeout(timer);
+    }
+    this.timeTimers = [];
+  }
+  // ---------------------------------------------------------------------------
+  // Rage click detection
+  // ---------------------------------------------------------------------------
+  detectRageClick(x, y, now2) {
+    const windowStart = now2 - RAGE_CLICK_WINDOW_MS;
+    const nearby = this.clickHistory.filter((c) => {
+      if (c.t < windowStart) return false;
+      const dx = c.x - x;
+      const dy = c.y - y;
+      return Math.sqrt(dx * dx + dy * dy) <= RAGE_CLICK_RADIUS;
+    });
+    if (nearby.length >= RAGE_CLICK_COUNT) {
+      this.push({
+        data_type: "rage_click",
+        data: {
+          x,
+          y,
+          click_count: nearby.length,
+          timestamp: now2
+        },
+        page_url: this.pageUrl,
+        page_path: this.pagePath
+      });
+      this.clickHistory = [];
+    }
+  }
+  // ---------------------------------------------------------------------------
+  // Mouse buffer flush
+  // ---------------------------------------------------------------------------
+  flushMouseBuffer() {
+    if (this.mouseBuffer.length === 0) return;
+    this.push({
+      data_type: "mouse_movement",
+      data: {
+        points: [...this.mouseBuffer],
+        timestamp: Date.now()
+      },
+      page_url: this.pageUrl,
+      page_path: this.pagePath
+    });
+    this.mouseBuffer = [];
+  }
+  // ---------------------------------------------------------------------------
+  // CSS selector helper
+  // ---------------------------------------------------------------------------
+  getSelector(el) {
+    const parts = [];
+    let current = el;
+    let depth = 0;
+    while (current && depth < 3) {
+      let segment = current.tagName.toLowerCase();
+      if (current.id) {
+        segment += `#${current.id}`;
+      } else if (current.classList.length > 0) {
+        segment += `.${Array.from(current.classList).join(".")}`;
+      }
+      parts.unshift(segment);
+      current = current.parentElement;
+      depth++;
+    }
+    return parts.join(" > ");
+  }
+};
+
+// src/react/components/behavioral-tracker.tsx
+var SESSION_KEY_SUFFIX2 = "-analytics-session";
+var VISITOR_KEY_SUFFIX2 = "-visitor-id";
+var MAX_SESSION_WAIT_MS = 1e4;
+var SESSION_POLL_MS = 500;
+function BehavioralTrackerComponent({ pathname }) {
+  const ctx = useContext(WhaleContext);
+  const trackerRef = useRef(null);
+  const initRef = useRef(false);
+  useEffect(() => {
+    if (!ctx || !ctx.config.trackingEnabled) return;
+    if (typeof window === "undefined") return;
+    const { config } = ctx;
+    let cancelled = false;
+    let pollTimer = null;
+    const startTime = Date.now();
+    const readSessionId = () => {
+      const key = `${config.storagePrefix}${SESSION_KEY_SUFFIX2}`;
+      try {
+        const raw = localStorage.getItem(key);
+        if (raw) {
+          const stored = JSON.parse(raw);
+          return stored.id ?? null;
+        }
+      } catch {
+      }
+      return null;
+    };
+    const readVisitorId = () => {
+      const key = `${config.storagePrefix}${VISITOR_KEY_SUFFIX2}`;
+      try {
+        const existing = localStorage.getItem(key);
+        if (existing) return existing;
+      } catch {
+      }
+      const id = `v-${Date.now()}-${Math.random().toString(36).slice(2, 10)}`;
+      try {
+        localStorage.setItem(key, id);
+      } catch {
+      }
+      return id;
+    };
+    const tryInit = () => {
+      if (cancelled) return;
+      const sessionId = readSessionId();
+      if (!sessionId) {
+        if (Date.now() - startTime < MAX_SESSION_WAIT_MS) {
+          pollTimer = setTimeout(tryInit, SESSION_POLL_MS);
+        }
+        return;
+      }
+      initRef.current = true;
+      const visitorId = readVisitorId();
+      const baseUrl = config.proxyPath;
+      const endpoint = `${baseUrl}/v1/stores/${config.storeId}/storefront/behavioral`;
+      const sendBatch = async (batch) => {
+        await resilientSend(endpoint, batch, {
+          "Content-Type": "application/json",
+          "x-api-key": config.apiKey
+        });
+      };
+      const tracker = new BehavioralTracker({ sendBatch, sessionId, visitorId });
+      tracker.start();
+      trackerRef.current = tracker;
+    };
+    tryInit();
+    return () => {
+      cancelled = true;
+      if (pollTimer) clearTimeout(pollTimer);
+      if (trackerRef.current) {
+        trackerRef.current.stop();
+        trackerRef.current = null;
+      }
+    };
+  }, []);
+  useEffect(() => {
+    if (!trackerRef.current || !pathname) return;
+    const url = typeof window !== "undefined" ? window.location.href : pathname;
+    trackerRef.current.setPageContext(url, pathname);
+  }, [pathname]);
+  return null;
+}
+
+// src/fingerprint/collector.ts
+async function sha256(input) {
+  const data = new TextEncoder().encode(input);
+  const hash = await crypto.subtle.digest("SHA-256", data);
+  return Array.from(new Uint8Array(hash)).map((b) => b.toString(16).padStart(2, "0")).join("");
+}
+async function getCanvasFingerprint() {
+  try {
+    const canvas = document.createElement("canvas");
+    canvas.width = 256;
+    canvas.height = 256;
+    const ctx = canvas.getContext("2d");
+    if (!ctx) return "";
+    const gradient = ctx.createLinearGradient(0, 0, 256, 256);
+    gradient.addColorStop(0, "#ff6b35");
+    gradient.addColorStop(0.5, "#1a73e8");
+    gradient.addColorStop(1, "#34a853");
+    ctx.fillStyle = gradient;
+    ctx.fillRect(0, 0, 256, 256);
+    ctx.fillStyle = "#ffffff";
+    ctx.font = "18px Arial";
+    ctx.textBaseline = "top";
+    ctx.fillText("WhaleTools", 10, 10);
+    ctx.beginPath();
+    ctx.arc(128, 128, 60, 0, Math.PI * 2);
+    ctx.strokeStyle = "#fbbc04";
+    ctx.lineWidth = 3;
+    ctx.stroke();
+    ctx.beginPath();
+    ctx.moveTo(0, 0);
+    ctx.lineTo(256, 256);
+    ctx.strokeStyle = "#ea4335";
+    ctx.lineWidth = 2;
+    ctx.stroke();
+    const dataUrl = canvas.toDataURL();
+    return sha256(dataUrl);
+  } catch {
+    return "";
+  }
+}
+async function getWebGLFingerprint() {
+  try {
+    const canvas = document.createElement("canvas");
+    const gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
+    if (!gl || !(gl instanceof WebGLRenderingContext)) return "";
+    const ext = gl.getExtension("WEBGL_debug_renderer_info");
+    const renderer = ext ? gl.getParameter(ext.UNMASKED_RENDERER_WEBGL) : "unknown";
+    const vendor = ext ? gl.getParameter(ext.UNMASKED_VENDOR_WEBGL) : "unknown";
+    const version = gl.getParameter(gl.VERSION);
+    const combined = `${renderer}|${vendor}|${version}`;
+    return sha256(combined);
+  } catch {
+    return "";
+  }
+}
+async function getAudioFingerprint() {
+  try {
+    const AudioCtx = window.OfflineAudioContext || window.webkitOfflineAudioContext;
+    if (!AudioCtx) return "";
+    const context = new AudioCtx(1, 44100, 44100);
+    const oscillator = context.createOscillator();
+    oscillator.type = "triangle";
+    oscillator.frequency.setValueAtTime(1e4, context.currentTime);
+    const compressor = context.createDynamicsCompressor();
+    compressor.threshold.setValueAtTime(-50, context.currentTime);
+    compressor.knee.setValueAtTime(40, context.currentTime);
+    compressor.ratio.setValueAtTime(12, context.currentTime);
+    compressor.attack.setValueAtTime(0, context.currentTime);
+    compressor.release.setValueAtTime(0.25, context.currentTime);
+    oscillator.connect(compressor);
+    compressor.connect(context.destination);
+    oscillator.start(0);
+    const buffer = await context.startRendering();
+    const samples = buffer.getChannelData(0).slice(0, 100);
+    const sampleStr = Array.from(samples).map((s) => s.toString()).join(",");
+    return sha256(sampleStr);
+  } catch {
+    return "";
+  }
+}
+async function collectFingerprint() {
+  const [canvas_fingerprint, webgl_fingerprint, audio_fingerprint] = await Promise.all([
+    getCanvasFingerprint(),
+    getWebGLFingerprint(),
+    getAudioFingerprint()
+  ]);
+  const screen_resolution = `${window.screen.width}x${window.screen.height}`;
+  const platform = navigator.platform || "";
+  const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone || "";
+  const language = navigator.language || "";
+  const hardware_concurrency = navigator.hardwareConcurrency || 0;
+  const device_memory = navigator.deviceMemory ?? null;
+  const color_depth = window.screen.colorDepth;
+  const pixel_ratio = window.devicePixelRatio || 1;
+  const touch_support = "ontouchstart" in window || navigator.maxTouchPoints > 0 || navigator.msMaxTouchPoints > 0;
+  const cookie_enabled = navigator.cookieEnabled;
+  const do_not_track = navigator.doNotTrack ?? null;
+  const fingerprintSource = [
+    canvas_fingerprint,
+    webgl_fingerprint,
+    audio_fingerprint,
+    screen_resolution,
+    platform,
+    timezone,
+    language,
+    String(hardware_concurrency)
+  ].join("|");
+  const fingerprint_id = await sha256(fingerprintSource);
+  return {
+    fingerprint_id,
+    canvas_fingerprint,
+    webgl_fingerprint,
+    audio_fingerprint,
+    screen_resolution,
+    platform,
+    timezone,
+    language,
+    hardware_concurrency,
+    device_memory,
+    color_depth,
+    pixel_ratio,
+    touch_support,
+    cookie_enabled,
+    do_not_track
+  };
+}
+
+// src/react/components/fingerprint-collector.tsx
+var SESSION_KEY_SUFFIX3 = "-analytics-session";
+function FingerprintCollector() {
+  const ctx = useContext(WhaleContext);
+  const sent = useRef(false);
+  useEffect(() => {
+    if (!ctx || sent.current) return;
+    if (!ctx.config.trackingEnabled) return;
+    if (typeof window === "undefined") return;
+    sent.current = true;
+    const { config, client } = ctx;
+    const prefix = config.storagePrefix;
+    const fpKey = `${prefix}-fingerprint-sent`;
+    const linkFingerprintToSession = (fingerprintId) => {
+      try {
+        const sessionRaw = localStorage.getItem(`${prefix}${SESSION_KEY_SUFFIX3}`);
+        if (sessionRaw) {
+          const session = JSON.parse(sessionRaw);
+          client.updateSession(session.id, { fingerprint_id: fingerprintId }).catch(() => {
+          });
+        }
+      } catch {
+      }
+    };
+    const existing = localStorage.getItem(fpKey);
+    if (existing) {
+      linkFingerprintToSession(existing);
+      return;
+    }
+    collectFingerprint().then(async (fp) => {
+      const baseUrl = config.proxyPath;
+      const url = `${baseUrl}/v1/stores/${config.storeId}/storefront/fingerprints`;
+      await resilientSend(url, fp, {
+        "Content-Type": "application/json",
+        "x-api-key": config.apiKey
+      }).catch(() => {
+      });
+      localStorage.setItem(fpKey, fp.fingerprint_id);
+      linkFingerprintToSession(fp.fingerprint_id);
+    }).catch(() => {
+    });
+  }, [ctx]);
+  return null;
+}
+
+// src/recording/recorder.ts
+function now() {
+  return Date.now();
+}
+function throttle(fn, ms) {
+  let last = 0;
+  let timer = null;
+  const throttled = (...args) => {
+    const elapsed = now() - last;
+    if (elapsed >= ms) {
+      last = now();
+      fn(...args);
+    } else if (!timer) {
+      timer = setTimeout(() => {
+        last = now();
+        timer = null;
+        fn(...args);
+      }, ms - elapsed);
+    }
+  };
+  return throttled;
+}
+function shortSelector(el) {
+  if (el.id) return `#${el.id}`;
+  let sel = el.tagName.toLowerCase();
+  if (el.className && typeof el.className === "string") {
+    const cls = el.className.trim().split(/\s+/).slice(0, 2).join(".");
+    if (cls) sel += `.${cls}`;
+  }
+  return sel;
+}
+var SessionRecorder = class {
+  constructor(config) {
+    this.events = [];
+    this.sequence = 0;
+    this.observer = null;
+    this.flushTimer = null;
+    this.listeners = [];
+    this.started = false;
+    this.flushing = false;
+    /** Pending mutations collected within the current animation frame. */
+    this.pendingMutations = [];
+    this.mutationRafId = null;
+    this.config = {
+      sendChunk: config.sendChunk,
+      flushIntervalMs: config.flushIntervalMs ?? 5e3,
+      maxChunkSize: config.maxChunkSize ?? 200
+    };
+  }
+  // -----------------------------------------------------------------------
+  // Public API
+  // -----------------------------------------------------------------------
+  start() {
+    if (this.started) return;
+    this.started = true;
+    this.captureFullSnapshot();
+    this.setupMutationObserver();
+    this.setupEventListeners();
+    this.flushTimer = setInterval(() => {
+      void this.flush();
+    }, this.config.flushIntervalMs);
+  }
+  stop() {
+    if (!this.started) return;
+    this.started = false;
+    if (this.observer) {
+      this.observer.disconnect();
+      this.observer = null;
+    }
+    if (this.mutationRafId !== null) {
+      cancelAnimationFrame(this.mutationRafId);
+      this.mutationRafId = null;
+    }
+    for (const [target, event, handler, options] of this.listeners) {
+      target.removeEventListener(event, handler, options);
+    }
+    this.listeners = [];
+    if (this.flushTimer !== null) {
+      clearInterval(this.flushTimer);
+      this.flushTimer = null;
+    }
+    void this.flush();
+  }
+  // -----------------------------------------------------------------------
+  // Full Snapshot (type 0)
+  // -----------------------------------------------------------------------
+  captureFullSnapshot() {
+    const tree = this.serializeNode(document.documentElement);
+    this.push({
+      type: 0,
+      timestamp: now(),
+      data: {
+        href: location.href,
+        width: window.innerWidth,
+        height: window.innerHeight,
+        tree: tree ?? {}
+      }
+    });
+  }
+  serializeNode(node) {
+    if (node.nodeType === Node.ELEMENT_NODE) {
+      const el = node;
+      const tag = el.tagName.toLowerCase();
+      if (tag === "script" || tag === "noscript") return null;
+      const attrs = {};
+      for (const attr of Array.from(el.attributes)) {
+        if (attr.name === "value" && el instanceof HTMLInputElement && el.type === "password") {
+          continue;
+        }
+        attrs[attr.name] = attr.value;
+      }
+      const children = [];
+      for (const child of Array.from(el.childNodes)) {
+        const serialized = this.serializeNode(child);
+        if (serialized) children.push(serialized);
+      }
+      return { tag, attrs, children };
+    }
+    if (node.nodeType === Node.TEXT_NODE) {
+      const text = node.textContent || "";
+      if (!text.trim()) return null;
+      return { text };
+    }
+    return null;
+  }
+  // -----------------------------------------------------------------------
+  // Mutation Observer (type 1)
+  // -----------------------------------------------------------------------
+  setupMutationObserver() {
+    this.observer = new MutationObserver((mutations) => {
+      this.pendingMutations.push(...mutations);
+      if (this.mutationRafId === null) {
+        this.mutationRafId = requestAnimationFrame(() => {
+          this.processMutations(this.pendingMutations);
+          this.pendingMutations = [];
+          this.mutationRafId = null;
+        });
+      }
+    });
+    this.observer.observe(document.documentElement, {
+      childList: true,
+      attributes: true,
+      characterData: true,
+      subtree: true,
+      attributeOldValue: false
+    });
+  }
+  processMutations(mutations) {
+    const ts = now();
+    const adds = [];
+    const removes = [];
+    const attrs = [];
+    const texts = [];
+    for (const m of mutations) {
+      if (m.type === "childList") {
+        for (const node of Array.from(m.addedNodes)) {
+          if (node.nodeType === Node.ELEMENT_NODE || node.nodeType === Node.TEXT_NODE) {
+            const serialized = this.serializeNode(node);
+            if (serialized) {
+              adds.push({
+                parentSelector: m.target.nodeType === Node.ELEMENT_NODE ? shortSelector(m.target) : null,
+                node: serialized
+              });
+            }
+          }
+        }
+        for (const node of Array.from(m.removedNodes)) {
+          removes.push({
+            parentSelector: m.target.nodeType === Node.ELEMENT_NODE ? shortSelector(m.target) : null,
+            tag: node.nodeType === Node.ELEMENT_NODE ? node.tagName.toLowerCase() : "#text"
+          });
+        }
+      } else if (m.type === "attributes" && m.target.nodeType === Node.ELEMENT_NODE) {
+        const el = m.target;
+        const name = m.attributeName || "";
+        attrs.push({
+          selector: shortSelector(el),
+          name,
+          value: el.getAttribute(name)
+        });
+      } else if (m.type === "characterData") {
+        texts.push({
+          parentSelector: m.target.parentElement ? shortSelector(m.target.parentElement) : null,
+          value: (m.target.textContent || "").slice(0, 200)
+        });
+      }
+    }
+    if (adds.length || removes.length || attrs.length || texts.length) {
+      this.push({
+        type: 1,
+        timestamp: ts,
+        data: {
+          adds: adds.length ? adds : void 0,
+          removes: removes.length ? removes : void 0,
+          attrs: attrs.length ? attrs : void 0,
+          texts: texts.length ? texts : void 0
+        }
+      });
+    }
+  }
+  // -----------------------------------------------------------------------
+  // Event Listeners (types 2–5)
+  // -----------------------------------------------------------------------
+  setupEventListeners() {
+    const onMouseMove = throttle(((e) => {
+      this.push({
+        type: 2,
+        timestamp: now(),
+        data: { source: "move", x: e.clientX, y: e.clientY }
+      });
+    }), 100);
+    const onClick = ((e) => {
+      const target = e.target;
+      this.push({
+        type: 2,
+        timestamp: now(),
+        data: {
+          source: "click",
+          x: e.clientX,
+          y: e.clientY,
+          target: target ? shortSelector(target) : null
+        }
+      });
+    });
+    this.addListener(document, "mousemove", onMouseMove, { passive: true, capture: true });
+    this.addListener(document, "click", onClick, { passive: true, capture: true });
+    const onScroll = throttle(((e) => {
+      const target = e.target;
+      if (target === document || target === document.documentElement || target === window) {
+        this.push({
+          type: 3,
+          timestamp: now(),
+          data: { target: "window", x: window.scrollX, y: window.scrollY }
+        });
+      } else if (target instanceof Element) {
+        this.push({
+          type: 3,
+          timestamp: now(),
+          data: {
+            target: shortSelector(target),
+            x: target.scrollLeft,
+            y: target.scrollTop
+          }
+        });
+      }
+    }), 200);
+    this.addListener(document, "scroll", onScroll, { passive: true, capture: true });
+    const onInput = ((e) => {
+      const target = e.target;
+      if (!(target instanceof HTMLInputElement || target instanceof HTMLTextAreaElement || target instanceof HTMLSelectElement)) {
+        return;
+      }
+      const isPassword = target instanceof HTMLInputElement && target.type === "password";
+      this.push({
+        type: 4,
+        timestamp: now(),
+        data: {
+          selector: shortSelector(target),
+          tag: target.tagName.toLowerCase(),
+          inputType: target instanceof HTMLInputElement ? target.type : void 0,
+          value: isPassword ? "***" : (target.value || "").slice(0, 100)
+        }
+      });
+    });
+    this.addListener(document, "input", onInput, { passive: true, capture: true });
+    this.addListener(document, "change", onInput, { passive: true, capture: true });
+    const onResize = throttle((() => {
+      this.push({
+        type: 5,
+        timestamp: now(),
+        data: { width: window.innerWidth, height: window.innerHeight }
+      });
+    }), 500);
+    this.addListener(window, "resize", onResize, { passive: true });
+    const onVisibility = (() => {
+      if (document.visibilityState === "hidden") {
+        void this.flush();
+      }
+    });
+    this.addListener(document, "visibilitychange", onVisibility);
+  }
+  // -----------------------------------------------------------------------
+  // Event buffer & flushing
+  // -----------------------------------------------------------------------
+  push(event) {
+    if (!this.started) return;
+    this.events.push(event);
+    if (this.events.length >= this.config.maxChunkSize) {
+      void this.flush();
+    }
+  }
+  async flush() {
+    if (this.events.length === 0) return;
+    if (this.flushing) return;
+    this.flushing = true;
+    const chunk = this.events;
+    this.events = [];
+    const seq = this.sequence++;
+    try {
+      await this.config.sendChunk(chunk, seq);
+    } catch {
+    } finally {
+      this.flushing = false;
+    }
+  }
+  // -----------------------------------------------------------------------
+  // Listener bookkeeping
+  // -----------------------------------------------------------------------
+  addListener(target, event, handler, options) {
+    target.addEventListener(event, handler, options);
+    this.listeners.push([target, event, handler, options]);
+  }
+};
+
+// src/react/components/session-recorder.tsx
+var SESSION_KEY_SUFFIX4 = "-analytics-session";
+var VISITOR_KEY_SUFFIX3 = "-visitor-id";
+var MAX_SESSION_WAIT_MS2 = 1e4;
+var SESSION_POLL_MS2 = 500;
+function SessionRecorderComponent() {
+  const ctx = useContext(WhaleContext);
+  const recorderRef = useRef(null);
+  const sampledRef = useRef(null);
+  const initRef = useRef(false);
+  useEffect(() => {
+    if (!ctx || initRef.current) return;
+    if (!ctx.config.trackingEnabled) return;
+    if (typeof window === "undefined") return;
+    if (sampledRef.current === null) {
+      sampledRef.current = Math.random() < ctx.config.recordingRate;
+    }
+    if (!sampledRef.current) return;
+    const { config } = ctx;
+    const prefix = config.storagePrefix;
+    let cancelled = false;
+    let pollTimer = null;
+    const startTime = Date.now();
+    const tryInit = () => {
+      if (cancelled) return;
+      let sessionId = null;
+      try {
+        const sessionRaw = localStorage.getItem(`${prefix}${SESSION_KEY_SUFFIX4}`);
+        if (sessionRaw) {
+          const session = JSON.parse(sessionRaw);
+          sessionId = session.id || null;
+        }
+      } catch {
+      }
+      if (!sessionId) {
+        if (Date.now() - startTime < MAX_SESSION_WAIT_MS2) {
+          pollTimer = setTimeout(tryInit, SESSION_POLL_MS2);
+          return;
+        }
+        return;
+      }
+      initRef.current = true;
+      const visitorId = (() => {
+        try {
+          return localStorage.getItem(`${prefix}${VISITOR_KEY_SUFFIX3}`) || "unknown";
+        } catch {
+          return "unknown";
+        }
+      })();
+      const baseUrl = config.proxyPath;
+      const url = `${baseUrl}/v1/stores/${config.storeId}/storefront/recordings`;
+      const sid = sessionId;
+      const recorder = new SessionRecorder({
+        sendChunk: async (events, sequence) => {
+          await resilientSend(url, {
+            session_id: sid,
+            visitor_id: visitorId,
+            events,
+            sequence,
+            started_at: sequence === 0 ? (/* @__PURE__ */ new Date()).toISOString() : void 0
+          }, {
+            "Content-Type": "application/json",
+            "x-api-key": config.apiKey
+          });
+        }
+      });
+      recorder.start();
+      recorderRef.current = recorder;
+    };
+    tryInit();
+    return () => {
+      cancelled = true;
+      if (pollTimer) clearTimeout(pollTimer);
+      if (recorderRef.current) {
+        recorderRef.current.stop();
+        recorderRef.current = null;
+      }
+    };
+  }, []);
+  return null;
+}
 function envBool(name) {
   if (typeof process === "undefined") return void 0;
   const raw = process.env[name];
@@ -615,7 +1677,39 @@ function WhaleProvider({
       gatewayUrl: resolvedConfig.gatewayUrl,
       proxyPath: resolvedConfig.proxyPath
     });
-    const cartStore = createCartStore(client, resolvedConfig.storagePrefix);
+    const readSessionId = () => {
+      try {
+        const raw = localStorage.getItem(`${resolvedConfig.storagePrefix}-analytics-session`);
+        if (!raw) return void 0;
+        const stored = JSON.parse(raw);
+        if (Date.now() - stored.createdAt < resolvedConfig.sessionTtl) return stored.id;
+      } catch {
+      }
+      return void 0;
+    };
+    const syncCartToSession = (cartId, total, itemCount) => {
+      const sid = readSessionId();
+      if (sid && !sid.startsWith("local-")) {
+        client.updateSession(sid, {
+          cart_id: cartId,
+          cart_total: total,
+          cart_item_count: itemCount,
+          status: "carting"
+        }).catch(() => {
+        });
+      }
+    };
+    const onAddToCart = resolvedConfig.trackingEnabled ? (productId, productName, quantity, price, tier) => {
+      const sid = readSessionId();
+      if (sid) client.trackEvent({ session_id: sid, event_type: "add_to_cart", event_data: { product_id: productId, product_name: productName, quantity, price, tier } }).catch(() => {
+      });
+    } : void 0;
+    const onRemoveFromCart = resolvedConfig.trackingEnabled ? (productId, productName) => {
+      const sid = readSessionId();
+      if (sid) client.trackEvent({ session_id: sid, event_type: "remove_from_cart", event_data: { product_id: productId, product_name: productName } }).catch(() => {
+      });
+    } : void 0;
+    const cartStore = createCartStore(client, resolvedConfig.storagePrefix, onAddToCart, onRemoveFromCart, syncCartToSession);
     const authStore = createAuthStore(client, resolvedConfig.storagePrefix);
     return {
       client,
@@ -639,6 +1733,9 @@ function WhaleProvider({
     /* @__PURE__ */ jsx(CartInitializer, {}),
     /* @__PURE__ */ jsx(AnalyticsTracker, { pathname }),
     /* @__PURE__ */ jsx(PixelInitializer, { onReady: handlePixelReady, onTheme: handleTheme }),
+    /* @__PURE__ */ jsx(BehavioralTrackerComponent, { pathname }),
+    /* @__PURE__ */ jsx(FingerprintCollector, {}),
+    /* @__PURE__ */ jsx(SessionRecorderComponent, {}),
     children
   ] }) });
 }
@@ -762,12 +1859,12 @@ function useCheckout() {
       setLoading(false);
     }
   }, [ctx.client, session]);
-  const complete = useCallback(async (payment) => {
+  const complete = useCallback(async (payment, opts) => {
     if (!session) throw new Error("No active checkout session");
     setLoading(true);
     setError(null);
     try {
-      const order = await ctx.client.completeCheckout(session.id, payment);
+      const order = await ctx.client.completeCheckout(session.id, payment, opts);
       setSession(null);
       return order;
     } catch (err) {
@@ -921,7 +2018,11 @@ function useLoyalty() {
     await refresh();
     return result;
   }, [customer?.id, ctx.client, refresh]);
-  return { account, rewards, transactions, loading, error, refresh, redeemReward };
+  const fetchProductsByCategory = useCallback(async (category, locationId, tier) => {
+    const res = await ctx.client.listLoyaltyProducts({ category, location_id: locationId, tier });
+    return res.data;
+  }, [ctx.client]);
+  return { account, rewards, transactions, loading, error, refresh, redeemReward, fetchProductsByCategory };
 }
 function useReviews(productId) {
   const ctx = useContext(WhaleContext);
@@ -1149,9 +2250,9 @@ function useShipping() {
   }, [ctx.client]);
   return { methods, rates, loading, error, refreshMethods, calculateRates };
 }
-function useCoupons() {
+function useDeals() {
   const ctx = useContext(WhaleContext);
-  if (!ctx) throw new Error("useCoupons must be used within <WhaleProvider>");
+  if (!ctx) throw new Error("useDeals must be used within <WhaleProvider>");
   const [validation, setValidation] = useState(null);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState(null);
@@ -1159,7 +2260,7 @@ function useCoupons() {
     setLoading(true);
     setError(null);
     try {
-      const result = await ctx.client.validateCoupon(code, cartId ? { cart_id: cartId } : void 0);
+      const result = await ctx.client.validateDeal(code, cartId ? { cart_id: cartId } : void 0);
       setValidation(result);
       return result;
     } catch (err) {
@@ -1175,7 +2276,7 @@ function useCoupons() {
     setLoading(true);
     setError(null);
     try {
-      const cart = await ctx.client.applyCoupon(cartId, code);
+      const cart = await ctx.client.applyDeal(cartId, code);
       return cart;
     } catch (err) {
       const e = err instanceof Error ? err : new Error(String(err));
@@ -1189,7 +2290,7 @@ function useCoupons() {
     setLoading(true);
     setError(null);
     try {
-      const cart = await ctx.client.removeCoupon(cartId);
+      const cart = await ctx.client.removeDeal(cartId);
       setValidation(null);
       return cart;
     } catch (err) {
@@ -1206,16 +2307,133 @@ function useCoupons() {
   }, []);
   return { validation, loading, error, validate, apply, remove, clear };
 }
+var useCoupons = useDeals;
+function useReferral() {
+  const ctx = useContext(WhaleContext);
+  if (!ctx) throw new Error("useReferral must be used within <WhaleProvider>");
+  const customer = useStore(ctx.authStore, (s) => s.customer);
+  const [status, setStatus] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState(null);
+  const refresh = useCallback(async () => {
+    if (!customer?.id) {
+      setStatus(null);
+      return;
+    }
+    setLoading(true);
+    setError(null);
+    try {
+      const result = await ctx.client.getReferralStatus(customer.id);
+      setStatus(result);
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error(String(err)));
+    } finally {
+      setLoading(false);
+    }
+  }, [customer?.id, ctx.client]);
+  useEffect(() => {
+    refresh();
+  }, [refresh]);
+  const enroll = useCallback(async () => {
+    if (!customer?.id) throw new Error("Not authenticated");
+    setLoading(true);
+    setError(null);
+    try {
+      const result = await ctx.client.enrollReferral(customer.id);
+      await refresh();
+      return result;
+    } catch (err) {
+      const e = err instanceof Error ? err : new Error(String(err));
+      setError(e);
+      throw e;
+    } finally {
+      setLoading(false);
+    }
+  }, [customer?.id, ctx.client, refresh]);
+  const attributeReferral = useCallback(
+    async (code) => {
+      if (!customer?.id) throw new Error("Not authenticated");
+      setLoading(true);
+      setError(null);
+      try {
+        const result = await ctx.client.attributeReferral(customer.id, code);
+        await refresh();
+        return result;
+      } catch (err) {
+        const e = err instanceof Error ? err : new Error(String(err));
+        setError(e);
+        throw e;
+      } finally {
+        setLoading(false);
+      }
+    },
+    [customer?.id, ctx.client, refresh]
+  );
+  useEffect(() => {
+    if (!customer?.id || !status || status.referred_by) return;
+    if (typeof window === "undefined") return;
+    const params = new URLSearchParams(window.location.search);
+    const code = params.get("code") || localStorage.getItem("whale_ref_code");
+    if (!code) return;
+    ctx.client.attributeReferral(customer.id, code).then(() => {
+      localStorage.removeItem("whale_ref_code");
+      refresh();
+    }).catch(() => {
+    });
+  }, [customer?.id, status, ctx.client, refresh]);
+  const share = useCallback(async () => {
+    if (!status?.share_url) throw new Error("Not enrolled in referral program");
+    const shareData = {
+      title: "Check this out!",
+      text: `Use my referral code ${status.referral_code} for rewards!`,
+      url: status.share_url
+    };
+    if (typeof navigator !== "undefined" && navigator.share) {
+      try {
+        await navigator.share(shareData);
+        return;
+      } catch {
+      }
+    }
+    if (typeof navigator !== "undefined" && navigator.clipboard) {
+      await navigator.clipboard.writeText(status.share_url);
+    }
+  }, [status]);
+  return {
+    status,
+    loading,
+    error,
+    enroll,
+    refresh,
+    share,
+    attributeReferral,
+    referralCode: status?.referral_code ?? null,
+    shareUrl: status?.share_url ?? null,
+    isEnrolled: status?.enrolled ?? false,
+    referredBy: status?.referred_by ?? null
+  };
+}
+function trackClick(tracking, label, url, position) {
+  if (!tracking?.gatewayUrl || !tracking?.code) return;
+  const body = JSON.stringify({ label, url, position });
+  if (typeof navigator !== "undefined" && navigator.sendBeacon) {
+    navigator.sendBeacon(
+      `${tracking.gatewayUrl}/q/${encodeURIComponent(tracking.code)}/click`,
+      new Blob([body], { type: "application/json" })
+    );
+  }
+}
 function SectionRenderer({
   section,
   data,
-  theme
+  theme,
+  tracking
 }) {
   const [showCOA, setShowCOA] = useState(false);
   const el = (() => {
     switch (section.type) {
       case "hero":
-        return /* @__PURE__ */ jsx(HeroSection, { section, theme });
+        return /* @__PURE__ */ jsx(HeroSection, { section, theme, tracking });
       case "text":
         return /* @__PURE__ */ jsx(TextSection, { section, theme });
       case "image":
@@ -1225,15 +2443,17 @@ function SectionRenderer({
       case "gallery":
         return /* @__PURE__ */ jsx(GallerySection, { section, theme });
       case "cta":
-        return /* @__PURE__ */ jsx(CTASection, { section, theme });
+        return /* @__PURE__ */ jsx(CTASection, { section, theme, tracking });
       case "stats":
         return /* @__PURE__ */ jsx(StatsSection, { section, theme });
       case "product_card":
-        return /* @__PURE__ */ jsx(ProductCardSection, { section, data, theme });
+        return /* @__PURE__ */ jsx(ProductCardSection, { section, data, theme, tracking });
       case "coa_viewer":
-        return /* @__PURE__ */ jsx(COAViewerSection, { section, data, theme, onShowCOA: () => setShowCOA(true) });
+        return /* @__PURE__ */ jsx(COAViewerSection, { section, data, theme, onShowCOA: () => setShowCOA(true), tracking });
       case "social_links":
         return /* @__PURE__ */ jsx(SocialLinksSection, { section, theme });
+      case "lead_capture":
+        return /* @__PURE__ */ jsx(LeadCaptureSection, { section, data, theme });
       case "divider":
         return /* @__PURE__ */ jsx(DividerSection, { theme });
       default:
@@ -1245,7 +2465,7 @@ function SectionRenderer({
     showCOA && data?.coa && /* @__PURE__ */ jsx(COAModal, { coa: data.coa, theme, onClose: () => setShowCOA(false) })
   ] });
 }
-function HeroSection({ section, theme }) {
+function HeroSection({ section, theme, tracking }) {
   const { title, subtitle, background_image, cta_text, cta_url } = section.content;
   return /* @__PURE__ */ jsxs(
     "div",
@@ -1287,6 +2507,7 @@ function HeroSection({ section, theme }) {
             "a",
             {
               href: cta_url,
+              onClick: () => trackClick(tracking, cta_text, cta_url),
               style: {
                 display: "inline-block",
                 padding: "0.875rem 2rem",
@@ -1372,7 +2593,7 @@ function GallerySection({ section, theme }) {
     }
   ) }, i)) }) });
 }
-function CTASection({ section, theme }) {
+function CTASection({ section, theme, tracking }) {
   const { buttons } = section.content;
   if (!buttons || buttons.length === 0) return null;
   return /* @__PURE__ */ jsx("div", { style: { padding: "2rem 1.5rem", maxWidth: 480, margin: "0 auto", display: "flex", flexDirection: "column", gap: "0.75rem" }, children: buttons.map((btn, i) => {
@@ -1381,6 +2602,7 @@ function CTASection({ section, theme }) {
       "a",
       {
         href: btn.url,
+        onClick: () => trackClick(tracking, btn.text, btn.url, i),
         style: {
           display: "block",
           width: "100%",
@@ -1452,7 +2674,7 @@ function StatsSection({ section, theme }) {
     }, children: stat.label })
   ] }, i)) }) });
 }
-function ProductCardSection({ section, data, theme }) {
+function ProductCardSection({ section, data, theme, tracking }) {
   const product = data?.product;
   const c = section.content;
   const name = c.name || product?.name || "";
@@ -1468,6 +2690,7 @@ function ProductCardSection({ section, data, theme }) {
         "a",
         {
           href: url,
+          onClick: () => trackClick(tracking, "View Product", url),
           style: {
             display: "block",
             width: "100%",
@@ -1492,7 +2715,8 @@ function COAViewerSection({
   section,
   data,
   theme,
-  onShowCOA
+  onShowCOA,
+  tracking
 }) {
   const coa = data?.coa;
   const c = section.content;
@@ -1513,10 +2737,200 @@ function COAViewerSection({
     display: "block",
     boxSizing: "border-box"
   };
+  const buttonLabel = c.button_text || "View Lab Results";
   if (coa.viewer_url) {
-    return /* @__PURE__ */ jsx("div", { style: { padding: "1.5rem", maxWidth: 480, margin: "0 auto" }, children: /* @__PURE__ */ jsx("a", { href: coa.viewer_url, target: "_blank", rel: "noopener noreferrer", style: buttonStyle, children: c.button_text || "View Lab Results" }) });
+    return /* @__PURE__ */ jsx("div", { style: { padding: "1.5rem", maxWidth: 480, margin: "0 auto" }, children: /* @__PURE__ */ jsx(
+      "a",
+      {
+        href: coa.viewer_url,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        onClick: () => trackClick(tracking, buttonLabel, coa.viewer_url),
+        style: buttonStyle,
+        children: buttonLabel
+      }
+    ) });
   }
-  return /* @__PURE__ */ jsx("div", { style: { padding: "1.5rem", maxWidth: 480, margin: "0 auto" }, children: /* @__PURE__ */ jsx("button", { onClick: onShowCOA, style: buttonStyle, children: c.button_text || "View Lab Results" }) });
+  return /* @__PURE__ */ jsx("div", { style: { padding: "1.5rem", maxWidth: 480, margin: "0 auto" }, children: /* @__PURE__ */ jsx("button", { onClick: () => {
+    trackClick(tracking, buttonLabel, coa.url);
+    onShowCOA();
+  }, style: buttonStyle, children: buttonLabel }) });
+}
+function LeadCaptureSection({ section, data, theme }) {
+  const c = section.content;
+  const [firstName, setFirstName] = useState("");
+  const [email, setEmail] = useState("");
+  const [status, setStatus] = useState("idle");
+  const [errorMsg, setErrorMsg] = useState("");
+  const gatewayUrl = c.gateway_url || data.gatewayUrl || "https://whale-gateway.fly.dev";
+  const storeId = c.store_id || data.store?.id;
+  const slug = c.landing_page_slug || data.landing_page?.slug;
+  async function handleSubmit(e) {
+    e.preventDefault();
+    if (!email || !storeId) return;
+    setStatus("loading");
+    setErrorMsg("");
+    try {
+      const res = await fetch(`${gatewayUrl}/v1/stores/${storeId}/storefront/leads`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          email,
+          first_name: firstName || void 0,
+          source: c.source || "landing_page",
+          landing_page_slug: slug || void 0,
+          tags: c.tags || void 0
+        })
+      });
+      if (!res.ok) {
+        const body = await res.json().catch(() => ({}));
+        throw new Error(body?.error?.message || "Something went wrong. Please try again.");
+      }
+      setStatus("success");
+    } catch (err) {
+      setErrorMsg(err instanceof Error ? err.message : "Something went wrong. Please try again.");
+      setStatus("error");
+    }
+  }
+  const heading = c.heading || "get 10% off your first visit.";
+  const subtitle = c.subtitle || "drop your email and we will send you the code.";
+  const buttonText = c.button_text || "Claim My Discount";
+  const successHeading = c.success_heading || "You\u2019re in!";
+  const successMessage = c.success_message || "Check your inbox for the discount code.";
+  const inputStyle = {
+    flex: 1,
+    minWidth: 0,
+    padding: "0.875rem 1rem",
+    background: theme.surface,
+    border: `1px solid ${theme.fg}15`,
+    color: theme.fg,
+    fontSize: "0.95rem",
+    fontWeight: 300,
+    outline: "none",
+    boxSizing: "border-box",
+    fontFamily: "inherit",
+    transition: "border-color 0.2s"
+  };
+  return /* @__PURE__ */ jsxs("div", { style: { padding: "3.5rem 1.5rem", maxWidth: 560, margin: "0 auto" }, children: [
+    /* @__PURE__ */ jsx("style", { children: `@keyframes lc-spin { to { transform: rotate(360deg) } }` }),
+    /* @__PURE__ */ jsx("div", { style: {
+      background: theme.surface,
+      border: `1px solid ${theme.fg}12`,
+      padding: "clamp(2rem, 6vw, 3rem)"
+    }, children: status === "success" ? /* @__PURE__ */ jsxs("div", { style: { textAlign: "center" }, children: [
+      /* @__PURE__ */ jsx("h2", { style: {
+        fontSize: "clamp(1.5rem, 5vw, 2rem)",
+        fontWeight: 300,
+        fontFamily: theme.fontDisplay || "inherit",
+        margin: "0 0 0.75rem",
+        lineHeight: 1.2,
+        letterSpacing: "-0.02em",
+        color: theme.fg
+      }, children: successHeading }),
+      /* @__PURE__ */ jsx("p", { style: {
+        fontSize: "0.9rem",
+        color: `${theme.fg}99`,
+        margin: "0 0 1.5rem",
+        lineHeight: 1.6,
+        fontWeight: 300
+      }, children: successMessage }),
+      c.coupon_code && /* @__PURE__ */ jsx("div", { style: {
+        display: "inline-block",
+        padding: "0.75rem 2rem",
+        background: `${theme.fg}08`,
+        border: `1px dashed ${theme.fg}30`,
+        fontSize: "clamp(1.25rem, 4vw, 1.75rem)",
+        fontWeight: 500,
+        fontFamily: "monospace",
+        letterSpacing: "0.12em",
+        color: theme.accent
+      }, children: c.coupon_code })
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs("div", { style: { textAlign: "center", marginBottom: "clamp(1.5rem, 4vw, 2rem)" }, children: [
+        /* @__PURE__ */ jsx("h2", { style: {
+          fontSize: "clamp(1.5rem, 5vw, 2.25rem)",
+          fontWeight: 300,
+          fontFamily: theme.fontDisplay || "inherit",
+          margin: "0 0 0.5rem",
+          lineHeight: 1.15,
+          letterSpacing: "-0.02em",
+          color: theme.fg
+        }, children: heading }),
+        /* @__PURE__ */ jsx("p", { style: {
+          fontSize: "0.85rem",
+          color: theme.accent,
+          margin: 0,
+          lineHeight: 1.6,
+          textTransform: "uppercase",
+          letterSpacing: "0.15em"
+        }, children: subtitle })
+      ] }),
+      /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, style: { display: "flex", flexDirection: "column", gap: "0.75rem" }, children: [
+        /* @__PURE__ */ jsxs("div", { style: { display: "flex", gap: "0.75rem", flexWrap: "wrap" }, children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "text",
+              placeholder: "First name",
+              value: firstName,
+              onChange: (e) => setFirstName(e.target.value),
+              style: inputStyle
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "email",
+              placeholder: "Email address",
+              value: email,
+              onChange: (e) => setEmail(e.target.value),
+              required: true,
+              style: inputStyle
+            }
+          )
+        ] }),
+        status === "error" && errorMsg && /* @__PURE__ */ jsx("p", { style: { fontSize: "0.8rem", color: "#e55", margin: 0, fontWeight: 400 }, children: errorMsg }),
+        /* @__PURE__ */ jsxs(
+          "button",
+          {
+            type: "submit",
+            disabled: status === "loading",
+            style: {
+              width: "100%",
+              padding: "0.875rem",
+              background: theme.fg,
+              color: theme.bg,
+              border: "none",
+              fontSize: "0.85rem",
+              fontWeight: 500,
+              cursor: status === "loading" ? "wait" : "pointer",
+              letterSpacing: "0.08em",
+              textTransform: "uppercase",
+              fontFamily: "inherit",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              gap: "0.5rem",
+              opacity: status === "loading" ? 0.7 : 1,
+              transition: "opacity 0.2s"
+            },
+            children: [
+              status === "loading" && /* @__PURE__ */ jsx("span", { style: {
+                display: "inline-block",
+                width: 16,
+                height: 16,
+                border: `2px solid ${theme.bg}40`,
+                borderTopColor: theme.bg,
+                borderRadius: "50%",
+                animation: "lc-spin 0.8s linear infinite"
+              } }),
+              buttonText
+            ]
+          }
+        )
+      ] })
+    ] }) })
+  ] });
 }
 function SocialLinksSection({ section, theme }) {
   const { links } = section.content;
@@ -1639,15 +3053,16 @@ function QRLandingPage({
   const logoUrl = data.qr_code.logo_url || data.store?.logo_url;
   const storeName = data.store?.name;
   const sorted = [...sections].sort((a, b) => a.order - b.order);
+  const tracking = { gatewayUrl, code };
   return /* @__PURE__ */ jsxs("div", { style: { minHeight: "100dvh", background: theme.bg, color: theme.fg, fontFamily }, children: [
     lp?.custom_css && /* @__PURE__ */ jsx("style", { children: lp.custom_css }),
     logoUrl && /* @__PURE__ */ jsx("div", { style: { padding: "1.5rem", display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ jsx("img", { src: logoUrl, alt: storeName || "Store", style: { height: 40, objectFit: "contain" } }) }),
     sorted.map((section) => {
-      const defaultRenderer = () => /* @__PURE__ */ jsx(SectionRenderer, { section, data, theme }, section.id);
+      const defaultRenderer = () => /* @__PURE__ */ jsx(SectionRenderer, { section, data, theme, tracking }, section.id);
       if (renderSection) {
         return /* @__PURE__ */ jsx("div", { children: renderSection(section, defaultRenderer) }, section.id);
       }
-      return /* @__PURE__ */ jsx(SectionRenderer, { section, data, theme }, section.id);
+      return /* @__PURE__ */ jsx(SectionRenderer, { section, data, theme, tracking }, section.id);
     }),
     storeName && /* @__PURE__ */ jsx("div", { style: { padding: "2rem 1.5rem", borderTop: `1px solid ${theme.surface}`, textAlign: "center" }, children: /* @__PURE__ */ jsxs("p", { style: { fontSize: "0.75rem", color: theme.muted, margin: 0 }, children: [
       storeName,
@@ -1675,10 +3090,10 @@ function buildDefaultSections(data) {
   let order = 0;
   const productName = qr.landing_page.title || product?.name || qr.name;
   const productImage = qr.landing_page.image_url || product?.featured_image || null;
-  const description = qr.landing_page.description || product?.description || "";
-  const ctaUrl = qr.landing_page.cta_url || qr.destination_url;
+  const description = product?.description || "";
   const categoryName = product?.category_name ?? null;
   const strainType = toStr(cf?.strain_type);
+  const tagline = toStr(cf?.tagline);
   if (productImage) {
     sections.push({
       id: "auto-hero",
@@ -1687,9 +3102,7 @@ function buildDefaultSections(data) {
       content: {
         title: productName,
         subtitle: [categoryName, strainType].filter(Boolean).join(" \xB7 "),
-        background_image: productImage,
-        cta_text: qr.landing_page.cta_text || null,
-        cta_url: ctaUrl
+        background_image: productImage
       }
     });
   } else {
@@ -1704,6 +3117,15 @@ function buildDefaultSections(data) {
       config: { align: "center" }
     });
   }
+  if (tagline) {
+    sections.push({
+      id: "auto-tagline",
+      type: "text",
+      order: order++,
+      content: { body: tagline },
+      config: { align: "center" }
+    });
+  }
   const thca = toNum(cf?.thca_percentage);
   const thc = toNum(cf?.d9_percentage);
   const cbd = toNum(cf?.cbd_total);
@@ -1719,23 +3141,23 @@ function buildDefaultSections(data) {
       content: { stats }
     });
   }
-  const details = [];
+  const profileDetails = [];
   const genetics = toStr(cf?.genetics);
   const terpenes = toStr(cf?.terpenes);
   const effects = toStr(cf?.effects);
-  const batchNumber = toStr(cf?.batch_number);
-  const dateTested = toStr(cf?.date_tested);
-  if (genetics) details.push({ label: "Genetics", value: genetics });
-  if (terpenes) details.push({ label: "Terpenes", value: terpenes });
-  if (effects) details.push({ label: "Effects", value: effects });
-  if (batchNumber) details.push({ label: "Batch", value: batchNumber });
-  if (dateTested) details.push({ label: "Tested", value: formatDate(dateTested) });
-  if (details.length > 0) {
+  const flavorProfile = toStr(cf?.flavor_profile);
+  const bestFor = toStr(cf?.best_for);
+  if (genetics) profileDetails.push({ label: "Genetics", value: genetics });
+  if (terpenes) profileDetails.push({ label: "Terpenes", value: terpenes });
+  if (effects) profileDetails.push({ label: "Effects", value: effects });
+  if (flavorProfile) profileDetails.push({ label: "Flavor", value: flavorProfile });
+  if (bestFor) profileDetails.push({ label: "Best For", value: bestFor });
+  if (profileDetails.length > 0) {
     sections.push({
-      id: "auto-details",
+      id: "auto-profile",
       type: "stats",
       order: order++,
-      content: { stats: details },
+      content: { stats: profileDetails },
       config: { layout: "list" }
     });
   }
@@ -1755,16 +3177,34 @@ function buildDefaultSections(data) {
       content: { button_text: "View Lab Results" }
     });
   }
-  if (ctaUrl) {
+  const labDetails = [];
+  const batchNumber = toStr(cf?.batch_number);
+  const dateTested = toStr(cf?.date_tested);
+  if (batchNumber) labDetails.push({ label: "Batch", value: batchNumber });
+  if (dateTested) labDetails.push({ label: "Tested", value: formatDate(dateTested) });
+  if (labDetails.length > 0) {
     sections.push({
-      id: "auto-cta",
-      type: "cta",
+      id: "auto-lab-info",
+      type: "stats",
       order: order++,
-      content: {
-        buttons: [{ text: qr.landing_page.cta_text || "Shop Online", url: ctaUrl, style: "primary" }]
-      }
+      content: { stats: labDetails },
+      config: { layout: "list" }
     });
   }
+  const productSlug = product?.slug;
+  if (productSlug) {
+    const storeDomain = data.store?.name === "Flora Distro" ? "floradistro.com" : null;
+    if (storeDomain) {
+      sections.push({
+        id: "auto-shop",
+        type: "cta",
+        order: order++,
+        content: {
+          buttons: [{ text: "Shop This Product", url: `https://${storeDomain}/shop/${productSlug}`, style: "outline" }]
+        }
+      });
+    }
+  }
   return sections;
 }
 function toNum(v) {
@@ -1872,10 +3312,11 @@ function LandingPage({
   if (state === "expired") return /* @__PURE__ */ jsx(DefaultExpired2, {});
   if (state === "error") return /* @__PURE__ */ jsx(DefaultError2, { message: errorMsg });
   if (!data) return null;
-  return /* @__PURE__ */ jsx(PageLayout, { data, renderSection });
+  return /* @__PURE__ */ jsx(PageLayout, { data, gatewayUrl, renderSection });
 }
 function PageLayout({
   data,
+  gatewayUrl,
   renderSection
 }) {
   const { landing_page: lp, store } = data;
@@ -1891,15 +3332,16 @@ function PageLayout({
   const fontFamily = lp.font_family || theme.fontDisplay || "system-ui, -apple-system, sans-serif";
   const logoUrl = store?.logo_url;
   const sorted = [...lp.sections].sort((a, b) => a.order - b.order);
+  const sectionData = { ...data, gatewayUrl, landing_page: { slug: lp.slug } };
   return /* @__PURE__ */ jsxs("div", { style: { minHeight: "100dvh", background: theme.bg, color: theme.fg, fontFamily }, children: [
     lp.custom_css && /* @__PURE__ */ jsx("style", { children: lp.custom_css }),
     logoUrl && /* @__PURE__ */ jsx("div", { style: { padding: "1.5rem", display: "flex", justifyContent: "center" }, children: /* @__PURE__ */ jsx("img", { src: logoUrl, alt: store?.name || "Store", style: { height: 40, objectFit: "contain" } }) }),
     sorted.map((section) => {
-      const defaultRenderer = () => /* @__PURE__ */ jsx(SectionRenderer, { section, data, theme }, section.id);
+      const defaultRenderer = () => /* @__PURE__ */ jsx(SectionRenderer, { section, data: sectionData, theme }, section.id);
       if (renderSection) {
         return /* @__PURE__ */ jsx("div", { children: renderSection(section, defaultRenderer) }, section.id);
       }
-      return /* @__PURE__ */ jsx(SectionRenderer, { section, data, theme }, section.id);
+      return /* @__PURE__ */ jsx(SectionRenderer, { section, data: sectionData, theme }, section.id);
     }),
     store?.name && /* @__PURE__ */ jsx("div", { style: { padding: "2rem 1.5rem", borderTop: `1px solid ${theme.surface}`, textAlign: "center" }, children: /* @__PURE__ */ jsxs("p", { style: { fontSize: "0.75rem", color: theme.muted, margin: 0 }, children: [
       "Powered by ",
@@ -1943,6 +3385,6 @@ function DefaultError2({ message }) {
   ] }) });
 }
 
-export { AnalyticsTracker, AuthInitializer, CartInitializer, LandingPage, PixelInitializer, QRLandingPage, SectionRenderer, WhaleContext, WhaleProvider, useAnalytics, useAuth, useCart, useCartItemCount, useCartTotal, useCategories, useCheckout, useCoupons, useCustomerAnalytics, useCustomerOrders, useLocations, useLoyalty, useProduct, useProducts, useRecommendations, useReviews, useSearch, useShipping, useWhaleClient, useWishlist };
+export { AnalyticsTracker, AuthInitializer, BehavioralTrackerComponent, CartInitializer, FingerprintCollector, LandingPage, PixelInitializer, QRLandingPage, SectionRenderer, SessionRecorderComponent, WhaleContext, WhaleProvider, useAnalytics, useAuth, useCart, useCartItemCount, useCartTotal, useCategories, useCheckout, useCoupons, useCustomerAnalytics, useCustomerOrders, useDeals, useLocations, useLoyalty, useProduct, useProducts, useRecommendations, useReferral, useReviews, useSearch, useShipping, useWhaleClient, useWishlist };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map