@founderhq/journeys 0.4.1 → 0.4.2

package/README.md

@@ -208,6 +208,12 @@ Capture is enabled by default after access validation succeeds. Pass `capture={f
 
 `apiKey`, `journeyId`, and the FounderHQ API URL are inherited from the root props and are not repeated inside `capture`.
 
+Capture events are batched and persisted locally with a TTL. The runtime flushes
+immediately for completion events, and browser embeds also try an exit-safe
+`sendBeacon`/`keepalive` flush on `visibilitychange` and `pagehide`. Beacon
+delivery is treated as best-effort; FounderHQ uses event IDs server-side so a
+later retry can safely duplicate a queued event.
+
 ## Config Shape
 
 A journey config is centered around:

package/dist/index.cjs

@@ -9693,20 +9693,15 @@ function JourneyShell({ className, theme } = {}) {
   ] });
 }
 var JOURNEY_LIBRARY_NAME = "@founderhq/journeys";
-var JOURNEY_LIBRARY_VERSION = "0.4.1";
+var JOURNEY_LIBRARY_VERSION = "0.4.2";
+var DEFAULT_QUEUE_TTL_MS = 24 * 60 * 60 * 1e3;
+var MAX_QUEUED_CAPTURE_EVENTS = 100;
+var MAX_BEACON_BYTES = 60 * 1024;
 function randomId(prefix) {
   const cryptoRef = globalThis.crypto;
   if (cryptoRef == null ? void 0 : cryptoRef.randomUUID) return `${prefix}_${cryptoRef.randomUUID()}`;
   return `${prefix}_${Date.now().toString(36)}_${Math.random().toString(36).slice(2)}`;
 }
-function readJson(storage, key, fallback) {
-  try {
-    const raw = storage.getItem(key);
-    return raw ? JSON.parse(raw) : fallback;
-  } catch (e) {
-    return fallback;
-  }
-}
 function getStoredId(storage, key, prefix) {
   try {
     const existing = storage.getItem(key);
@@ -9718,6 +9713,64 @@ function getStoredId(storage, key, prefix) {
     return randomId(prefix);
   }
 }
+function safeBrowserStorage(name) {
+  var _a;
+  if (typeof window === "undefined") return null;
+  try {
+    return (_a = window[name]) != null ? _a : null;
+  } catch (e) {
+    return null;
+  }
+}
+function isQueuedCaptureEvent(value) {
+  if (!isRecord(value)) return false;
+  const event = value.event;
+  return isRecord(event) && typeof event.id === "string" && typeof event.type === "string" && typeof event.occurredAt === "string" && typeof value.attempts === "number" && typeof value.createdAt === "number";
+}
+function pruneQueuedEvents(queue, now = Date.now(), ttlMs = DEFAULT_QUEUE_TTL_MS) {
+  const cutoff = now - ttlMs;
+  return queue.filter((item) => item.createdAt >= cutoff);
+}
+function readPersistedCaptureQueue(storage, key) {
+  if (!storage) return null;
+  try {
+    const raw = storage.getItem(key);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw);
+    if (typeof parsed.visitorId !== "string" || typeof parsed.clientSessionId !== "string") {
+      return null;
+    }
+    const queue = Array.isArray(parsed.queue) ? pruneQueuedEvents(parsed.queue.filter(isQueuedCaptureEvent)) : [];
+    return {
+      visitorId: parsed.visitorId,
+      clientSessionId: parsed.clientSessionId,
+      updatedAt: typeof parsed.updatedAt === "number" ? parsed.updatedAt : Date.now(),
+      queue
+    };
+  } catch (e) {
+    return null;
+  }
+}
+function persistCaptureQueue(storage, runtime, queue) {
+  if (!storage) return;
+  try {
+    const pruned = pruneQueuedEvents(queue).slice(-MAX_QUEUED_CAPTURE_EVENTS);
+    if (pruned.length === 0) {
+      storage.removeItem(runtime.queueKey);
+      return;
+    }
+    storage.setItem(
+      runtime.queueKey,
+      JSON.stringify({
+        visitorId: runtime.visitorId,
+        clientSessionId: runtime.clientSessionId,
+        updatedAt: Date.now(),
+        queue: pruned
+      })
+    );
+  } catch (e) {
+  }
+}
 function isRecord(value) {
   return Boolean(value) && typeof value === "object" && !Array.isArray(value);
 }
@@ -9818,6 +9871,54 @@ function captureContext(capture, runtime) {
     screen: screenRef ? { width: screenRef.width, height: screenRef.height } : void 0
   }, customContext));
 }
+function captureUrl(capture) {
+  var _a;
+  const baseUrl = (_a = capture.baseUrl) != null ? _a : "https://getfounderhq.com";
+  return `${baseUrl}/api/v1/journeys/${encodeURIComponent(
+    capture.journeyId
+  )}/capture`;
+}
+function byteLength(value) {
+  try {
+    return new TextEncoder().encode(value).byteLength;
+  } catch (e) {
+    return value.length;
+  }
+}
+function safeSendBeacon() {
+  if (typeof navigator === "undefined") return null;
+  const beacon = navigator.sendBeacon;
+  return typeof beacon === "function" ? beacon.bind(navigator) : null;
+}
+async function sendCaptureBatch(capture, runtime, batch, options = {}) {
+  const body = JSON.stringify(__spreadProps(__spreadValues({}, options.preferBeacon ? { apiKey: capture.apiKey } : {}), {
+    clientSessionId: runtime.clientSessionId,
+    visitorId: runtime.visitorId,
+    context: captureContext(capture, runtime),
+    events: batch.map((item) => item.event)
+  }));
+  const url = captureUrl(capture);
+  if (options.preferBeacon && byteLength(body) <= MAX_BEACON_BYTES) {
+    const beacon = safeSendBeacon();
+    if (beacon == null ? void 0 : beacon(url, body)) {
+      return "queued";
+    }
+  }
+  try {
+    const response = await fetch(url, {
+      method: "POST",
+      headers: {
+        Authorization: `Bearer ${capture.apiKey}`,
+        "Content-Type": "application/json"
+      },
+      body,
+      keepalive: batch.length <= 5 || options.preferBeacon === true
+    });
+    return response.ok ? "acknowledged" : "failed";
+  } catch (e) {
+    return "failed";
+  }
+}
 function toJsonRecord(value) {
   return isRecord(value) ? value : {};
 }
@@ -9963,30 +10064,34 @@ function useJourneyCapture(params) {
   captureRef.current = params.capture;
   const persistQueue = React.useCallback(() => {
     const runtime = runtimeRef.current;
-    if (!runtime || typeof window === "undefined") return;
-    try {
-      sessionStorage.setItem(
-        runtime.queueKey,
-        JSON.stringify(queueRef.current)
-      );
-    } catch (e) {
-    }
+    if (!runtime) return;
+    persistCaptureQueue(
+      safeBrowserStorage("localStorage"),
+      runtime,
+      queueRef.current
+    );
   }, []);
   const ensureRuntime = React.useCallback((capture) => {
+    var _a, _b;
     if (typeof window === "undefined") return null;
+    const queueKey = `fhq_journey_queue:v2:${capture.apiKey.slice(
+      0,
+      16
+    )}:${capture.journeyId}`;
     const existing = runtimeRef.current;
-    if ((existing == null ? void 0 : existing.journeyId) === capture.journeyId) return existing;
-    const visitorId = getStoredId(
-      localStorage,
-      "fhq_journey_visitor_id",
-      "fhqv"
-    );
-    const clientSessionId = getStoredId(
-      sessionStorage,
-      `fhq_journey_session:${capture.journeyId}`,
-      "fhqs"
-    );
-    const queueKey = `fhq_journey_queue:${capture.journeyId}:${clientSessionId}`;
+    if ((existing == null ? void 0 : existing.journeyId) === capture.journeyId && existing.queueKey === queueKey) {
+      return existing;
+    }
+    const local = safeBrowserStorage("localStorage");
+    const session = safeBrowserStorage("sessionStorage");
+    const persisted = readPersistedCaptureQueue(local, queueKey);
+    const visitorId = (_a = persisted == null ? void 0 : persisted.visitorId) != null ? _a : local ? getStoredId(local, "fhq_journey_visitor_id", "fhqv") : randomId("fhqv");
+    const sessionKey = `fhq_journey_session:${capture.journeyId}`;
+    const clientSessionId = persisted && persisted.queue.length > 0 ? persisted.clientSessionId : session ? getStoredId(session, sessionKey, "fhqs") : randomId("fhqs");
+    try {
+      session == null ? void 0 : session.setItem(sessionKey, clientSessionId);
+    } catch (e) {
+    }
     const runtime = {
       journeyId: capture.journeyId,
       visitorId,
@@ -9994,51 +10099,46 @@ function useJourneyCapture(params) {
       queueKey
     };
     runtimeRef.current = runtime;
-    queueRef.current = readJson(
-      sessionStorage,
-      queueKey,
-      []
-    );
+    queueRef.current = (_b = persisted == null ? void 0 : persisted.queue) != null ? _b : [];
     return runtime;
   }, []);
-  const flush = React.useCallback(async () => {
-    var _a, _b, _c;
+  const flush = React.useCallback(async (options = {}) => {
+    var _a, _b;
     const capture = captureRef.current;
-    if (!capture || !configRef.current || flushingRef.current) return;
+    if (!capture || !configRef.current) return;
+    if (!options.preferBeacon && flushingRef.current) return;
     const runtime = ensureRuntime(capture);
     if (!runtime || queueRef.current.length === 0) return;
-    flushingRef.current = true;
+    queueRef.current = pruneQueuedEvents(queueRef.current);
     const batchSize = Math.max(1, (_a = capture.batchSize) != null ? _a : 10);
     const maxRetries = Math.max(1, (_b = capture.maxRetries) != null ? _b : 3);
-    const batch = queueRef.current.slice(0, batchSize);
-    const baseUrl = (_c = capture.baseUrl) != null ? _c : "https://getfounderhq.com";
+    const batch = queueRef.current.slice(
+      0,
+      options.preferBeacon ? Math.min(batchSize, 5) : batchSize
+    );
+    if (batch.length === 0) {
+      persistQueue();
+      return;
+    }
+    if (options.preferBeacon) {
+      await sendCaptureBatch(capture, runtime, batch, options);
+      persistQueue();
+      return;
+    }
+    flushingRef.current = true;
     try {
-      const response = await fetch(
-        `${baseUrl}/api/v1/journeys/${encodeURIComponent(
-          capture.journeyId
-        )}/capture`,
-        {
-          method: "POST",
-          headers: {
-            Authorization: `Bearer ${capture.apiKey}`,
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify({
-            clientSessionId: runtime.clientSessionId,
-            visitorId: runtime.visitorId,
-            context: captureContext(capture, runtime),
-            events: batch.map((item) => item.event)
-          }),
-          keepalive: batch.length <= 5
-        }
-      );
-      if (!response.ok) throw new Error(`Capture failed: ${response.status}`);
-      queueRef.current = queueRef.current.slice(batch.length);
-    } catch (e) {
-      const failedIds = new Set(batch.map((item) => item.event.id));
-      queueRef.current = queueRef.current.map(
-        (item) => failedIds.has(item.event.id) ? __spreadProps(__spreadValues({}, item), { attempts: item.attempts + 1 }) : item
-      ).filter((item) => item.attempts < maxRetries);
+      const result = await sendCaptureBatch(capture, runtime, batch);
+      if (result === "acknowledged") {
+        const sentIds = new Set(batch.map((item) => item.event.id));
+        queueRef.current = queueRef.current.filter(
+          (item) => !sentIds.has(item.event.id)
+        );
+      } else {
+        const failedIds = new Set(batch.map((item) => item.event.id));
+        queueRef.current = queueRef.current.map(
+          (item) => failedIds.has(item.event.id) ? __spreadProps(__spreadValues({}, item), { attempts: item.attempts + 1 }) : item
+        ).filter((item) => item.attempts < maxRetries);
+      }
     } finally {
       persistQueue();
       flushingRef.current = false;
@@ -10054,15 +10154,18 @@ function useJourneyCapture(params) {
       Math.max(1e3, (_a = capture.flushIntervalMs) != null ? _a : 3e3)
     );
     const handleVisibility = () => {
-      if (document.visibilityState === "hidden") void flush();
+      if (document.visibilityState === "hidden") {
+        void flush({ preferBeacon: true });
+      }
     };
-    window.addEventListener("beforeunload", persistQueue);
+    const handlePageHide = () => void flush({ preferBeacon: true });
     document.addEventListener("visibilitychange", handleVisibility);
+    window.addEventListener("pagehide", handlePageHide);
     void flush();
     return () => {
       window.clearInterval(interval);
-      window.removeEventListener("beforeunload", persistQueue);
       document.removeEventListener("visibilitychange", handleVisibility);
+      window.removeEventListener("pagehide", handlePageHide);
       persistQueue();
     };
   }, [ensureRuntime, flush, persistQueue, params.capture]);
@@ -10078,8 +10181,12 @@ function useJourneyCapture(params) {
       sequenceRef.current += 1;
       queueRef.current.push({
         event: toCaptureEvent(config, event, sequenceRef.current, runtime),
-        attempts: 0
+        attempts: 0,
+        createdAt: Date.now()
       });
+      queueRef.current = pruneQueuedEvents(queueRef.current).slice(
+        -MAX_QUEUED_CAPTURE_EVENTS
+      );
       persistQueue();
       const batchSize = Math.max(1, (_b = capture.batchSize) != null ? _b : 10);
       if (event.type === "complete" || queueRef.current.length >= batchSize) {

package/dist/index.js

@@ -9668,20 +9668,15 @@ function JourneyShell({ className, theme } = {}) {
   ] });
 }
 var JOURNEY_LIBRARY_NAME = "@founderhq/journeys";
-var JOURNEY_LIBRARY_VERSION = "0.4.1";
+var JOURNEY_LIBRARY_VERSION = "0.4.2";
+var DEFAULT_QUEUE_TTL_MS = 24 * 60 * 60 * 1e3;
+var MAX_QUEUED_CAPTURE_EVENTS = 100;
+var MAX_BEACON_BYTES = 60 * 1024;
 function randomId(prefix) {
   const cryptoRef = globalThis.crypto;
   if (cryptoRef == null ? void 0 : cryptoRef.randomUUID) return `${prefix}_${cryptoRef.randomUUID()}`;
   return `${prefix}_${Date.now().toString(36)}_${Math.random().toString(36).slice(2)}`;
 }
-function readJson(storage, key, fallback) {
-  try {
-    const raw = storage.getItem(key);
-    return raw ? JSON.parse(raw) : fallback;
-  } catch (e) {
-    return fallback;
-  }
-}
 function getStoredId(storage, key, prefix) {
   try {
     const existing = storage.getItem(key);
@@ -9693,6 +9688,64 @@ function getStoredId(storage, key, prefix) {
     return randomId(prefix);
   }
 }
+function safeBrowserStorage(name) {
+  var _a;
+  if (typeof window === "undefined") return null;
+  try {
+    return (_a = window[name]) != null ? _a : null;
+  } catch (e) {
+    return null;
+  }
+}
+function isQueuedCaptureEvent(value) {
+  if (!isRecord(value)) return false;
+  const event = value.event;
+  return isRecord(event) && typeof event.id === "string" && typeof event.type === "string" && typeof event.occurredAt === "string" && typeof value.attempts === "number" && typeof value.createdAt === "number";
+}
+function pruneQueuedEvents(queue, now = Date.now(), ttlMs = DEFAULT_QUEUE_TTL_MS) {
+  const cutoff = now - ttlMs;
+  return queue.filter((item) => item.createdAt >= cutoff);
+}
+function readPersistedCaptureQueue(storage, key) {
+  if (!storage) return null;
+  try {
+    const raw = storage.getItem(key);
+    if (!raw) return null;
+    const parsed = JSON.parse(raw);
+    if (typeof parsed.visitorId !== "string" || typeof parsed.clientSessionId !== "string") {
+      return null;
+    }
+    const queue = Array.isArray(parsed.queue) ? pruneQueuedEvents(parsed.queue.filter(isQueuedCaptureEvent)) : [];
+    return {
+      visitorId: parsed.visitorId,
+      clientSessionId: parsed.clientSessionId,
+      updatedAt: typeof parsed.updatedAt === "number" ? parsed.updatedAt : Date.now(),
+      queue
+    };
+  } catch (e) {
+    return null;
+  }
+}
+function persistCaptureQueue(storage, runtime, queue) {
+  if (!storage) return;
+  try {
+    const pruned = pruneQueuedEvents(queue).slice(-MAX_QUEUED_CAPTURE_EVENTS);
+    if (pruned.length === 0) {
+      storage.removeItem(runtime.queueKey);
+      return;
+    }
+    storage.setItem(
+      runtime.queueKey,
+      JSON.stringify({
+        visitorId: runtime.visitorId,
+        clientSessionId: runtime.clientSessionId,
+        updatedAt: Date.now(),
+        queue: pruned
+      })
+    );
+  } catch (e) {
+  }
+}
 function isRecord(value) {
   return Boolean(value) && typeof value === "object" && !Array.isArray(value);
 }
@@ -9793,6 +9846,54 @@ function captureContext(capture, runtime) {
     screen: screenRef ? { width: screenRef.width, height: screenRef.height } : void 0
   }, customContext));
 }
+function captureUrl(capture) {
+  var _a;
+  const baseUrl = (_a = capture.baseUrl) != null ? _a : "https://getfounderhq.com";
+  return `${baseUrl}/api/v1/journeys/${encodeURIComponent(
+    capture.journeyId
+  )}/capture`;
+}
+function byteLength(value) {
+  try {
+    return new TextEncoder().encode(value).byteLength;
+  } catch (e) {
+    return value.length;
+  }
+}
+function safeSendBeacon() {
+  if (typeof navigator === "undefined") return null;
+  const beacon = navigator.sendBeacon;
+  return typeof beacon === "function" ? beacon.bind(navigator) : null;
+}
+async function sendCaptureBatch(capture, runtime, batch, options = {}) {
+  const body = JSON.stringify(__spreadProps(__spreadValues({}, options.preferBeacon ? { apiKey: capture.apiKey } : {}), {
+    clientSessionId: runtime.clientSessionId,
+    visitorId: runtime.visitorId,
+    context: captureContext(capture, runtime),
+    events: batch.map((item) => item.event)
+  }));
+  const url = captureUrl(capture);
+  if (options.preferBeacon && byteLength(body) <= MAX_BEACON_BYTES) {
+    const beacon = safeSendBeacon();
+    if (beacon == null ? void 0 : beacon(url, body)) {
+      return "queued";
+    }
+  }
+  try {
+    const response = await fetch(url, {
+      method: "POST",
+      headers: {
+        Authorization: `Bearer ${capture.apiKey}`,
+        "Content-Type": "application/json"
+      },
+      body,
+      keepalive: batch.length <= 5 || options.preferBeacon === true
+    });
+    return response.ok ? "acknowledged" : "failed";
+  } catch (e) {
+    return "failed";
+  }
+}
 function toJsonRecord(value) {
   return isRecord(value) ? value : {};
 }
@@ -9938,30 +10039,34 @@ function useJourneyCapture(params) {
   captureRef.current = params.capture;
   const persistQueue = useCallback(() => {
     const runtime = runtimeRef.current;
-    if (!runtime || typeof window === "undefined") return;
-    try {
-      sessionStorage.setItem(
-        runtime.queueKey,
-        JSON.stringify(queueRef.current)
-      );
-    } catch (e) {
-    }
+    if (!runtime) return;
+    persistCaptureQueue(
+      safeBrowserStorage("localStorage"),
+      runtime,
+      queueRef.current
+    );
   }, []);
   const ensureRuntime = useCallback((capture) => {
+    var _a, _b;
     if (typeof window === "undefined") return null;
+    const queueKey = `fhq_journey_queue:v2:${capture.apiKey.slice(
+      0,
+      16
+    )}:${capture.journeyId}`;
     const existing = runtimeRef.current;
-    if ((existing == null ? void 0 : existing.journeyId) === capture.journeyId) return existing;
-    const visitorId = getStoredId(
-      localStorage,
-      "fhq_journey_visitor_id",
-      "fhqv"
-    );
-    const clientSessionId = getStoredId(
-      sessionStorage,
-      `fhq_journey_session:${capture.journeyId}`,
-      "fhqs"
-    );
-    const queueKey = `fhq_journey_queue:${capture.journeyId}:${clientSessionId}`;
+    if ((existing == null ? void 0 : existing.journeyId) === capture.journeyId && existing.queueKey === queueKey) {
+      return existing;
+    }
+    const local = safeBrowserStorage("localStorage");
+    const session = safeBrowserStorage("sessionStorage");
+    const persisted = readPersistedCaptureQueue(local, queueKey);
+    const visitorId = (_a = persisted == null ? void 0 : persisted.visitorId) != null ? _a : local ? getStoredId(local, "fhq_journey_visitor_id", "fhqv") : randomId("fhqv");
+    const sessionKey = `fhq_journey_session:${capture.journeyId}`;
+    const clientSessionId = persisted && persisted.queue.length > 0 ? persisted.clientSessionId : session ? getStoredId(session, sessionKey, "fhqs") : randomId("fhqs");
+    try {
+      session == null ? void 0 : session.setItem(sessionKey, clientSessionId);
+    } catch (e) {
+    }
     const runtime = {
       journeyId: capture.journeyId,
       visitorId,
@@ -9969,51 +10074,46 @@ function useJourneyCapture(params) {
       queueKey
     };
     runtimeRef.current = runtime;
-    queueRef.current = readJson(
-      sessionStorage,
-      queueKey,
-      []
-    );
+    queueRef.current = (_b = persisted == null ? void 0 : persisted.queue) != null ? _b : [];
     return runtime;
   }, []);
-  const flush = useCallback(async () => {
-    var _a, _b, _c;
+  const flush = useCallback(async (options = {}) => {
+    var _a, _b;
     const capture = captureRef.current;
-    if (!capture || !configRef.current || flushingRef.current) return;
+    if (!capture || !configRef.current) return;
+    if (!options.preferBeacon && flushingRef.current) return;
     const runtime = ensureRuntime(capture);
     if (!runtime || queueRef.current.length === 0) return;
-    flushingRef.current = true;
+    queueRef.current = pruneQueuedEvents(queueRef.current);
     const batchSize = Math.max(1, (_a = capture.batchSize) != null ? _a : 10);
     const maxRetries = Math.max(1, (_b = capture.maxRetries) != null ? _b : 3);
-    const batch = queueRef.current.slice(0, batchSize);
-    const baseUrl = (_c = capture.baseUrl) != null ? _c : "https://getfounderhq.com";
+    const batch = queueRef.current.slice(
+      0,
+      options.preferBeacon ? Math.min(batchSize, 5) : batchSize
+    );
+    if (batch.length === 0) {
+      persistQueue();
+      return;
+    }
+    if (options.preferBeacon) {
+      await sendCaptureBatch(capture, runtime, batch, options);
+      persistQueue();
+      return;
+    }
+    flushingRef.current = true;
     try {
-      const response = await fetch(
-        `${baseUrl}/api/v1/journeys/${encodeURIComponent(
-          capture.journeyId
-        )}/capture`,
-        {
-          method: "POST",
-          headers: {
-            Authorization: `Bearer ${capture.apiKey}`,
-            "Content-Type": "application/json"
-          },
-          body: JSON.stringify({
-            clientSessionId: runtime.clientSessionId,
-            visitorId: runtime.visitorId,
-            context: captureContext(capture, runtime),
-            events: batch.map((item) => item.event)
-          }),
-          keepalive: batch.length <= 5
-        }
-      );
-      if (!response.ok) throw new Error(`Capture failed: ${response.status}`);
-      queueRef.current = queueRef.current.slice(batch.length);
-    } catch (e) {
-      const failedIds = new Set(batch.map((item) => item.event.id));
-      queueRef.current = queueRef.current.map(
-        (item) => failedIds.has(item.event.id) ? __spreadProps(__spreadValues({}, item), { attempts: item.attempts + 1 }) : item
-      ).filter((item) => item.attempts < maxRetries);
+      const result = await sendCaptureBatch(capture, runtime, batch);
+      if (result === "acknowledged") {
+        const sentIds = new Set(batch.map((item) => item.event.id));
+        queueRef.current = queueRef.current.filter(
+          (item) => !sentIds.has(item.event.id)
+        );
+      } else {
+        const failedIds = new Set(batch.map((item) => item.event.id));
+        queueRef.current = queueRef.current.map(
+          (item) => failedIds.has(item.event.id) ? __spreadProps(__spreadValues({}, item), { attempts: item.attempts + 1 }) : item
+        ).filter((item) => item.attempts < maxRetries);
+      }
     } finally {
       persistQueue();
       flushingRef.current = false;
@@ -10029,15 +10129,18 @@ function useJourneyCapture(params) {
       Math.max(1e3, (_a = capture.flushIntervalMs) != null ? _a : 3e3)
     );
     const handleVisibility = () => {
-      if (document.visibilityState === "hidden") void flush();
+      if (document.visibilityState === "hidden") {
+        void flush({ preferBeacon: true });
+      }
     };
-    window.addEventListener("beforeunload", persistQueue);
+    const handlePageHide = () => void flush({ preferBeacon: true });
     document.addEventListener("visibilitychange", handleVisibility);
+    window.addEventListener("pagehide", handlePageHide);
     void flush();
     return () => {
       window.clearInterval(interval);
-      window.removeEventListener("beforeunload", persistQueue);
       document.removeEventListener("visibilitychange", handleVisibility);
+      window.removeEventListener("pagehide", handlePageHide);
       persistQueue();
     };
   }, [ensureRuntime, flush, persistQueue, params.capture]);
@@ -10053,8 +10156,12 @@ function useJourneyCapture(params) {
       sequenceRef.current += 1;
       queueRef.current.push({
         event: toCaptureEvent(config, event, sequenceRef.current, runtime),
-        attempts: 0
+        attempts: 0,
+        createdAt: Date.now()
       });
+      queueRef.current = pruneQueuedEvents(queueRef.current).slice(
+        -MAX_QUEUED_CAPTURE_EVENTS
+      );
       persistQueue();
       const batchSize = Math.max(1, (_b = capture.batchSize) != null ? _b : 10);
       if (event.type === "complete" || queueRef.current.length >= batchSize) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@founderhq/journeys",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "Config-driven interactive journey/questionnaire engine for React",
   "type": "module",
   "main": "./dist/index.cjs",