@sessionvision/core 0.2.0 → 0.3.0

package/dist/sessionvision.esm.js

@@ -1,5 +1,5 @@
 /*!
- * Session Vision Core v0.2.0
+ * Session Vision Core v0.3.0
  * (c) 2026 Session Vision
  * Released under the MIT License
  */
@@ -29,8 +29,11 @@ const DEFAULT_CONFIG = {
     maskAllInputs: true,
     autocapture: {
         pageview: true,
-        clicks: true,
+        click: true,
         formSubmit: true,
+        rageClick: true,
+        deadClick: true,
+        formAbandonment: true,
     },
 };
 /**
@@ -350,8 +353,11 @@ function resolveConfig(projectToken, userConfig) {
             // Boolean: enable or disable all
             autocapture = {
                 pageview: userConfig.autocapture,
-                clicks: userConfig.autocapture,
+                click: userConfig.autocapture,
                 formSubmit: userConfig.autocapture,
+                rageClick: userConfig.autocapture,
+                deadClick: userConfig.autocapture,
+                formAbandonment: userConfig.autocapture,
             };
         }
         else if (typeof userConfig.autocapture === 'object') {
@@ -359,8 +365,11 @@ function resolveConfig(projectToken, userConfig) {
             const userAutocapture = userConfig.autocapture;
             autocapture = {
                 pageview: userAutocapture.pageview ?? DEFAULT_CONFIG.autocapture.pageview,
-                clicks: userAutocapture.clicks ?? DEFAULT_CONFIG.autocapture.clicks,
+                click: userAutocapture.click ?? DEFAULT_CONFIG.autocapture.click,
                 formSubmit: userAutocapture.formSubmit ?? DEFAULT_CONFIG.autocapture.formSubmit,
+                rageClick: userAutocapture.rageClick ?? DEFAULT_CONFIG.autocapture.rageClick,
+                deadClick: userAutocapture.deadClick ?? DEFAULT_CONFIG.autocapture.deadClick,
+                formAbandonment: userAutocapture.formAbandonment ?? DEFAULT_CONFIG.autocapture.formAbandonment,
             };
         }
     }
@@ -832,7 +841,7 @@ function getAutomaticProperties() {
         $timezone: getTimezone(),
         $locale: getLocale(),
         $connection_type: getConnectionType(),
-        $lib_version: "0.2.0"
+        $lib_version: "0.3.0"
             ,
     };
 }
@@ -935,6 +944,246 @@ function captureSystemEvent(eventName, properties = {}) {
     captureEvent(eventName, properties, { includeAutoProperties: true });
 }
 
+/**
+ * Payload compression module
+ * Uses CompressionStream API when available
+ */
+/**
+ * Check if compression is supported
+ */
+function isCompressionSupported() {
+    return (typeof CompressionStream !== 'undefined' &&
+        typeof ReadableStream !== 'undefined');
+}
+/**
+ * Compress a string using gzip
+ * Returns the compressed data as a Blob, or null if compression is not supported
+ */
+async function compressPayload(data) {
+    if (!isCompressionSupported()) {
+        return null;
+    }
+    try {
+        const encoder = new TextEncoder();
+        const inputBytes = encoder.encode(data);
+        const stream = new ReadableStream({
+            start(controller) {
+                controller.enqueue(inputBytes);
+                controller.close();
+            },
+        });
+        const compressedStream = stream.pipeThrough(new CompressionStream('gzip'));
+        const reader = compressedStream.getReader();
+        const chunks = [];
+        while (true) {
+            const { done, value } = await reader.read();
+            if (done)
+                break;
+            chunks.push(value);
+        }
+        // Combine chunks into a single Blob
+        return new Blob(chunks, { type: 'application/gzip' });
+    }
+    catch {
+        // Compression failed, return null to use uncompressed
+        return null;
+    }
+}
+/**
+ * Get the size of data in bytes
+ */
+function getByteSize(data) {
+    return new Blob([data]).size;
+}
+/**
+ * Check if payload should be compressed (based on size threshold)
+ * Only compress if payload is larger than 1KB
+ */
+function shouldCompress(data) {
+    return isCompressionSupported() && getByteSize(data) > 1024;
+}
+
+/**
+ * HTTP transport module
+ * Handles sending events to the ingest API
+ */
+let config$2 = null;
+let consecutiveFailures = 0;
+/**
+ * Set the configuration
+ */
+function setTransportConfig(cfg) {
+    config$2 = cfg;
+}
+/**
+ * Sleep for a given number of milliseconds
+ */
+function sleep(ms) {
+    return new Promise((resolve) => setTimeout(resolve, ms));
+}
+/**
+ * Send events to the ingest API
+ * Handles compression and retry logic
+ */
+async function sendEvents(payload) {
+    if (!config$2) {
+        console.warn('[SessionVision] SDK not initialized');
+        return false;
+    }
+    const url = `${config$2.ingestHost}/api/v1/ingest/events`;
+    const jsonPayload = JSON.stringify(payload);
+    // Try to compress if payload is large enough
+    const useCompression = shouldCompress(jsonPayload);
+    let body = jsonPayload;
+    const headers = {
+        'Content-Type': 'application/json',
+    };
+    if (useCompression) {
+        const compressed = await compressPayload(jsonPayload);
+        if (compressed) {
+            body = compressed;
+            headers['Content-Type'] = 'application/json';
+            headers['Content-Encoding'] = 'gzip';
+        }
+    }
+    // Attempt to send with retries
+    for (let attempt = 0; attempt <= BUFFER_CONFIG.MAX_RETRIES; attempt++) {
+        try {
+            const response = await fetch(url, {
+                method: 'POST',
+                headers,
+                body,
+                keepalive: true, // Keep connection alive for background sends
+            });
+            if (response.ok || response.status === 202) {
+                // Success
+                consecutiveFailures = 0;
+                if (config$2.debug) {
+                    console.log(`[SessionVision] Events sent successfully (${payload.events.length} events)`);
+                }
+                return true;
+            }
+            // Server error, might be worth retrying
+            if (response.status >= 500) {
+                throw new Error(`Server error: ${response.status}`);
+            }
+            // Client error (4xx), don't retry
+            if (config$2.debug) {
+                console.warn(`[SessionVision] Failed to send events: ${response.status}`);
+            }
+            return false;
+        }
+        catch (error) {
+            // Network error or server error, retry if attempts remaining
+            if (attempt < BUFFER_CONFIG.MAX_RETRIES) {
+                const delay = BUFFER_CONFIG.RETRY_DELAYS_MS[attempt] || 4000;
+                if (config$2.debug) {
+                    console.log(`[SessionVision] Retry ${attempt + 1}/${BUFFER_CONFIG.MAX_RETRIES} in ${delay}ms`);
+                }
+                await sleep(delay);
+            }
+            else {
+                // All retries exhausted
+                consecutiveFailures++;
+                if (config$2.debug) {
+                    console.warn('[SessionVision] Failed to send events after retries:', error);
+                }
+            }
+        }
+    }
+    return false;
+}
+/**
+ * Check if we should stop retrying (3+ consecutive failures)
+ */
+function shouldStopRetrying() {
+    return consecutiveFailures >= 3;
+}
+
+/**
+ * Event buffer module
+ * Buffers events and flushes them periodically or when buffer is full
+ */
+let eventBuffer = [];
+let flushTimer = null;
+let config$1 = null;
+let isFlushing = false;
+/**
+ * Set the configuration
+ */
+function setBufferConfig(cfg) {
+    config$1 = cfg;
+}
+/**
+ * Add an event to the buffer
+ */
+function addToBuffer(event) {
+    // If we've had too many failures, drop events
+    if (shouldStopRetrying()) {
+        if (config$1?.debug) {
+            console.warn('[SessionVision] Too many failures, dropping event');
+        }
+        return;
+    }
+    eventBuffer.push(event);
+    // Flush if buffer is full
+    if (eventBuffer.length >= BUFFER_CONFIG.MAX_EVENTS) {
+        flush();
+    }
+}
+/**
+ * Flush the event buffer
+ * Sends all buffered events to the server
+ */
+async function flush() {
+    if (isFlushing || eventBuffer.length === 0 || !config$1) {
+        return;
+    }
+    isFlushing = true;
+    // Take events from buffer (FIFO eviction on failure)
+    const eventsToSend = [...eventBuffer];
+    eventBuffer = [];
+    const payload = {
+        projectToken: config$1.projectToken,
+        events: eventsToSend,
+    };
+    const success = await sendEvents(payload);
+    if (!success) {
+        // Re-add events to buffer if we haven't exceeded max retries
+        if (!shouldStopRetrying()) {
+            // Only keep most recent events up to max buffer size
+            const combined = [...eventsToSend, ...eventBuffer];
+            eventBuffer = combined.slice(-10);
+            if (config$1.debug && combined.length > BUFFER_CONFIG.MAX_EVENTS) {
+                console.warn(`[SessionVision] Buffer overflow, dropped ${combined.length - BUFFER_CONFIG.MAX_EVENTS} oldest events`);
+            }
+        }
+    }
+    isFlushing = false;
+}
+/**
+ * Start the flush timer
+ */
+function startFlushTimer() {
+    if (flushTimer) {
+        return;
+    }
+    flushTimer = setInterval(() => {
+        flush();
+    }, BUFFER_CONFIG.FLUSH_INTERVAL_MS);
+}
+/**
+ * Initialize visibility change handler for flushing on tab hide
+ */
+function initVisibilityHandler() {
+    document.addEventListener('visibilitychange', () => {
+        if (document.visibilityState === 'hidden') {
+            // Best-effort flush when tab is hidden
+            flush();
+        }
+    });
+}
+
 /**
  * Pageview tracking module
  * Handles initial page load and SPA navigation
@@ -958,6 +1207,9 @@ function capturePageview(customProperties = {}) {
         ...customProperties,
     };
     captureEvent('$pageview', properties);
+    // Flush immediately to ensure pageview is sent quickly
+    // This captures users who bounce before the 5-second interval
+    flush();
 }
 /**
  * Handle history state changes for SPA navigation
@@ -1206,21 +1458,509 @@ function maskPII(text) {
         pii.pattern.lastIndex = 0;
         masked = masked.replace(pii.pattern, pii.mask);
     }
-    return masked;
+    return masked;
+}
+
+/**
+ * Rage Click Detection
+ *
+ * Detects rapid repeated clicks indicating user frustration.
+ * Emits a single $rage_click event after the click sequence ends.
+ */
+/** Elements that legitimately receive rapid clicks */
+const RAGE_CLICK_EXCLUDED_SELECTORS = [
+    'input[type="number"]',
+    'input[type="range"]',
+    '[role="spinbutton"]',
+    '[role="slider"]',
+    '[class*="quantity"]',
+    '[class*="stepper"]',
+    '[class*="increment"]',
+    '[class*="decrement"]',
+    '[class*="plus"]',
+    '[class*="minus"]',
+    'video',
+    'audio',
+    '[class*="player"]',
+    '[class*="volume"]',
+    '[class*="seek"]',
+    'canvas',
+];
+function shouldExcludeFromRageClick(element) {
+    if (element.closest('[data-sessionvision-no-rageclick]')) {
+        return true;
+    }
+    for (const selector of RAGE_CLICK_EXCLUDED_SELECTORS) {
+        if (element.matches(selector) || element.closest(selector)) {
+            return true;
+        }
+    }
+    return false;
+}
+class RageClickDetector {
+    constructor(_config) {
+        this.clicks = [];
+        this.emitTimeout = null;
+        this.threshold = RageClickDetector.DEFAULT_THRESHOLD;
+        this.windowMs = RageClickDetector.DEFAULT_WINDOW_MS;
+        this.radiusPx = RageClickDetector.DEFAULT_RADIUS_PX;
+    }
+    recordClick(event, element, properties) {
+        const now = Date.now();
+        this.clicks.push({
+            timestamp: now,
+            x: event.clientX,
+            y: event.clientY,
+            elementSelector: properties.$element_selector || '',
+            element,
+            properties,
+        });
+        // Remove expired clicks outside the window
+        this.clicks = this.clicks.filter((c) => now - c.timestamp <= this.windowMs);
+        // Reset the emit timeout - we'll check after the sequence ends
+        this.scheduleEmit();
+    }
+    scheduleEmit() {
+        if (this.emitTimeout) {
+            clearTimeout(this.emitTimeout);
+        }
+        this.emitTimeout = setTimeout(() => {
+            this.maybeEmitRageClick();
+        }, this.windowMs);
+    }
+    maybeEmitRageClick() {
+        if (this.clicks.length < this.threshold) {
+            this.clicks = [];
+            return;
+        }
+        const sameElement = this.clicks.every((c) => c.elementSelector === this.clicks[0].elementSelector);
+        const sameArea = this.isClickCluster(this.clicks);
+        if (sameElement || sameArea) {
+            this.emitRageClick();
+        }
+        this.clicks = [];
+    }
+    isClickCluster(clicks) {
+        for (let i = 0; i < clicks.length; i++) {
+            for (let j = i + 1; j < clicks.length; j++) {
+                const dx = clicks[i].x - clicks[j].x;
+                const dy = clicks[i].y - clicks[j].y;
+                const distance = Math.sqrt(dx * dx + dy * dy);
+                if (distance > this.radiusPx) {
+                    return false;
+                }
+            }
+        }
+        return true;
+    }
+    emitRageClick() {
+        const lastClick = this.clicks[this.clicks.length - 1];
+        const firstClick = this.clicks[0];
+        const duration = lastClick.timestamp - firstClick.timestamp;
+        let elementX = 0;
+        let elementY = 0;
+        try {
+            const rect = lastClick.element.getBoundingClientRect();
+            elementX = lastClick.x - rect.left;
+            elementY = lastClick.y - rect.top;
+        }
+        catch {
+            // Element may have been removed from DOM
+        }
+        const rageClickProperties = {
+            ...lastClick.properties,
+            $click_count: this.clicks.length,
+            $rage_click_duration_ms: duration,
+            $click_x: lastClick.x,
+            $click_y: lastClick.y,
+            $element_x: elementX,
+            $element_y: elementY,
+            $click_positions: this.clicks.map((c) => ({
+                x: c.x,
+                y: c.y,
+                timestamp: c.timestamp,
+            })),
+        };
+        captureEvent('$rage_click', rageClickProperties);
+    }
+    destroy() {
+        if (this.emitTimeout) {
+            clearTimeout(this.emitTimeout);
+            this.emitTimeout = null;
+        }
+        this.clicks = [];
+    }
+}
+RageClickDetector.DEFAULT_THRESHOLD = 3;
+RageClickDetector.DEFAULT_WINDOW_MS = 1000;
+RageClickDetector.DEFAULT_RADIUS_PX = 30;
+
+/**
+ * Dead Click Detection
+ *
+ * Detects clicks that produce no visible DOM changes.
+ * Emits $dead_click events when no response is detected.
+ */
+/** Elements that may not cause visible DOM changes when clicked */
+const DEAD_CLICK_EXCLUDED_SELECTORS = [
+    'input[type="text"]',
+    'input[type="password"]',
+    'input[type="email"]',
+    'input[type="search"]',
+    'input[type="tel"]',
+    'input[type="url"]',
+    'textarea',
+    'select',
+    'video',
+    'audio',
+];
+function shouldExcludeFromDeadClick(element) {
+    if (element.closest('[data-sessionvision-no-deadclick]')) {
+        return true;
+    }
+    for (const selector of DEAD_CLICK_EXCLUDED_SELECTORS) {
+        if (element.matches(selector) || element.closest(selector)) {
+            return true;
+        }
+    }
+    return false;
+}
+class DeadClickDetector {
+    constructor(_config) {
+        this.pendingClick = null;
+        this.timeoutMs = DeadClickDetector.DEFAULT_TIMEOUT_MS;
+    }
+    monitorClick(event, element, properties) {
+        // Cancel any pending detection
+        this.cancelPending();
+        const timestamp = Date.now();
+        let mutationDetected = false;
+        const observer = new MutationObserver((mutations) => {
+            const meaningful = mutations.some((m) => this.isMeaningfulMutation(m, element));
+            if (meaningful) {
+                mutationDetected = true;
+                this.cancelPending();
+            }
+        });
+        observer.observe(document.body, {
+            childList: true,
+            attributes: true,
+            characterData: true,
+            subtree: true,
+        });
+        const timeout = setTimeout(() => {
+            if (!mutationDetected && this.pendingClick) {
+                this.emitDeadClick(this.pendingClick);
+            }
+            this.cancelPending();
+        }, this.timeoutMs);
+        this.pendingClick = {
+            x: event.clientX,
+            y: event.clientY,
+            element,
+            properties,
+            timestamp,
+            observer,
+            timeout,
+        };
+    }
+    cancelPending() {
+        if (this.pendingClick) {
+            this.pendingClick.observer.disconnect();
+            clearTimeout(this.pendingClick.timeout);
+            this.pendingClick = null;
+        }
+    }
+    isMeaningfulMutation(mutation, clickedElement) {
+        // Ignore class changes on clicked element (often just :active styles)
+        if (mutation.type === 'attributes' &&
+            mutation.attributeName === 'class' &&
+            mutation.target === clickedElement) {
+            return false;
+        }
+        // Ignore data-* attribute changes (often analytics)
+        if (mutation.type === 'attributes' && mutation.attributeName?.startsWith('data-')) {
+            return false;
+        }
+        // Ignore script/style/link/meta injections
+        if (mutation.type === 'childList') {
+            const ignoredNodes = ['SCRIPT', 'STYLE', 'LINK', 'META'];
+            const addedNonIgnored = Array.from(mutation.addedNodes).some((node) => !ignoredNodes.includes(node.nodeName));
+            if (!addedNonIgnored && mutation.removedNodes.length === 0) {
+                return false;
+            }
+        }
+        return true;
+    }
+    emitDeadClick(pending) {
+        let elementX = 0;
+        let elementY = 0;
+        try {
+            const rect = pending.element.getBoundingClientRect();
+            elementX = pending.x - rect.left;
+            elementY = pending.y - rect.top;
+        }
+        catch {
+            // Element may have been removed from DOM
+        }
+        const deadClickProperties = {
+            ...pending.properties,
+            $click_x: pending.x,
+            $click_y: pending.y,
+            $element_x: elementX,
+            $element_y: elementY,
+            $wait_duration_ms: Date.now() - pending.timestamp,
+            $element_is_interactive: isInteractiveElement(pending.element),
+        };
+        captureEvent('$dead_click', deadClickProperties);
+    }
+    destroy() {
+        this.cancelPending();
+    }
+}
+DeadClickDetector.DEFAULT_TIMEOUT_MS = 1000;
+
+/**
+ * Form Field Tracking
+ *
+ * Tracks form field interactions for abandonment analysis.
+ * Emits $form_start when user begins filling a form,
+ * $form_field_change when fields are modified.
+ */
+/**
+ * Form field tracker instance
+ */
+let isActive = false;
+const startedForms = new Map();
+/**
+ * Get form fields (inputs, textareas, selects)
+ */
+function getFormFields(form) {
+    const fields = form.querySelectorAll('input, textarea, select');
+    return Array.from(fields);
+}
+/**
+ * Get the index of a field within its form
+ */
+function getFieldIndex(field, form) {
+    const fields = getFormFields(form);
+    return fields.indexOf(field);
+}
+/**
+ * Get the type of a form field
+ */
+function getFieldType(field) {
+    if (field instanceof HTMLInputElement) {
+        return field.type || 'text';
+    }
+    if (field instanceof HTMLTextAreaElement) {
+        return 'textarea';
+    }
+    if (field instanceof HTMLSelectElement) {
+        return 'select';
+    }
+    return 'unknown';
+}
+/**
+ * Check if a field has a value
+ */
+function fieldHasValue(field) {
+    if (field instanceof HTMLInputElement) {
+        if (field.type === 'checkbox' || field.type === 'radio') {
+            return field.checked;
+        }
+        return field.value.length > 0;
+    }
+    if (field instanceof HTMLTextAreaElement) {
+        return field.value.length > 0;
+    }
+    if (field instanceof HTMLSelectElement) {
+        return field.selectedIndex > 0 || (field.selectedIndex === 0 && field.value !== '');
+    }
+    return false;
+}
+/**
+ * Check if a field is a form field
+ */
+function isFormField(element) {
+    return (element instanceof HTMLInputElement ||
+        element instanceof HTMLTextAreaElement ||
+        element instanceof HTMLSelectElement);
+}
+/**
+ * Get the parent form of an element
+ */
+function getParentForm(element) {
+    return element.closest('form');
+}
+/**
+ * Handle focus events on form fields
+ */
+function handleFocusIn(event) {
+    const target = event.target;
+    if (!target || !isFormField(target)) {
+        return;
+    }
+    if (shouldIgnoreElement(target)) {
+        return;
+    }
+    const form = getParentForm(target);
+    if (!form || shouldIgnoreElement(form)) {
+        return;
+    }
+    const formSelector = generateSelector(form);
+    // Check if this form has already been started
+    if (startedForms.has(formSelector)) {
+        return;
+    }
+    // Emit $form_start
+    const fields = getFormFields(form);
+    const properties = {
+        $form_id: form.id || null,
+        $form_name: form.name || null,
+        $form_selector: formSelector,
+        $form_field_count: fields.length,
+    };
+    captureEvent('$form_start', properties);
+    // Track form state
+    startedForms.set(formSelector, {
+        startTime: Date.now(),
+        fieldCount: fields.length,
+        interactedFields: new Set(),
+        filledFields: new Set(),
+    });
+}
+/**
+ * Handle change events on form fields
+ */
+function handleChange(event) {
+    const target = event.target;
+    if (!target || !isFormField(target)) {
+        return;
+    }
+    if (shouldIgnoreElement(target)) {
+        return;
+    }
+    const form = getParentForm(target);
+    if (!form || shouldIgnoreElement(form)) {
+        return;
+    }
+    const formSelector = generateSelector(form);
+    const fieldSelector = generateSelector(target);
+    const formState = startedForms.get(formSelector);
+    // Track interaction even if form wasn't started (edge case)
+    if (!formState) {
+        // Start the form now
+        const fields = getFormFields(form);
+        const startProps = {
+            $form_id: form.id || null,
+            $form_name: form.name || null,
+            $form_selector: formSelector,
+            $form_field_count: fields.length,
+        };
+        captureEvent('$form_start', startProps);
+        startedForms.set(formSelector, {
+            startTime: Date.now(),
+            fieldCount: fields.length,
+            interactedFields: new Set([fieldSelector]),
+            filledFields: new Set(fieldHasValue(target) ? [fieldSelector] : []),
+        });
+    }
+    else {
+        // Update tracking
+        formState.interactedFields.add(fieldSelector);
+        if (fieldHasValue(target)) {
+            formState.filledFields.add(fieldSelector);
+        }
+        else {
+            formState.filledFields.delete(fieldSelector);
+        }
+    }
+    // Emit $form_field_change
+    const properties = {
+        $form_selector: formSelector,
+        $field_selector: fieldSelector,
+        $field_name: target.name || null,
+        $field_type: getFieldType(target),
+        $field_index: getFieldIndex(target, form),
+        $has_value: fieldHasValue(target),
+    };
+    captureEvent('$form_field_change', properties);
+}
+/**
+ * Reset tracking for a specific form (called after submit)
+ */
+function resetForm(formSelector) {
+    startedForms.delete(formSelector);
+}
+/**
+ * Get form tracking data for enhanced submit event
+ */
+function getFormTrackingData(form) {
+    const formSelector = generateSelector(form);
+    const fields = getFormFields(form);
+    const formState = startedForms.get(formSelector);
+    if (!formState) {
+        // Form submitted without tracking (e.g., direct submit without field focus)
+        const filledFields = [];
+        for (const field of fields) {
+            if (fieldHasValue(field) && !shouldIgnoreElement(field)) {
+                filledFields.push(generateSelector(field));
+            }
+        }
+        return {
+            formSelector,
+            formFieldCount: fields.length,
+            formFieldsFilled: filledFields,
+            formFieldsInteracted: [],
+            formCompletionRate: fields.length > 0 ? filledFields.length / fields.length : 0,
+            formTimeToSubmitMs: null,
+        };
+    }
+    // Update filled fields snapshot at submit time
+    const currentFilledFields = [];
+    for (const field of fields) {
+        if (fieldHasValue(field) && !shouldIgnoreElement(field)) {
+            currentFilledFields.push(generateSelector(field));
+        }
+    }
+    const completionRate = fields.length > 0 ? currentFilledFields.length / fields.length : 0;
+    return {
+        formSelector,
+        formFieldCount: formState.fieldCount,
+        formFieldsFilled: currentFilledFields,
+        formFieldsInteracted: Array.from(formState.interactedFields),
+        formCompletionRate: Math.round(completionRate * 100) / 100,
+        formTimeToSubmitMs: Date.now() - formState.startTime,
+    };
+}
+/**
+ * Initialize form field tracking
+ */
+function initFormFieldTracking(_cfg) {
+    if (isActive) {
+        return;
+    }
+    isActive = true;
+    document.addEventListener('focusin', handleFocusIn, { capture: true });
+    document.addEventListener('change', handleChange, { capture: true });
 }
 
 /**
  * Autocapture module
- * Handles automatic capture of clicks and form submissions
+ * Handles automatic capture of clicks, form submissions,
+ * rage clicks, and dead clicks
  */
 let isClickTrackingActive = false;
 let isFormTrackingActive = false;
-let config$2 = null;
+let config = null;
+let rageClickDetector = null;
+let deadClickDetector = null;
 /**
  * Set the configuration
  */
 function setAutocaptureConfig(cfg) {
-    config$2 = cfg;
+    config = cfg;
 }
 /**
  * Handle click events
@@ -1244,6 +1984,13 @@ function handleClick(event) {
         $element_href: getElementHref(element),
     };
     captureEvent('$click', properties);
+    // Feed click to frustration detectors
+    if (rageClickDetector && !shouldExcludeFromRageClick(element)) {
+        rageClickDetector.recordClick(event, element, properties);
+    }
+    if (deadClickDetector && !shouldExcludeFromDeadClick(element)) {
+        deadClickDetector.monitorClick(event, element, properties);
+    }
 }
 /**
  * Handle form submission events
@@ -1256,13 +2003,23 @@ function handleFormSubmit(event) {
     if (shouldIgnoreElement(form)) {
         return;
     }
+    // Get form field tracking data
+    const trackingData = getFormTrackingData(form);
     const properties = {
         $form_id: form.id || null,
         $form_action: form.action || '',
         $form_method: (form.method || 'GET').toUpperCase(),
         $form_name: form.name || null,
+        $form_selector: trackingData.formSelector,
+        $form_field_count: trackingData.formFieldCount,
+        $form_fields_filled: trackingData.formFieldsFilled,
+        $form_fields_interacted: trackingData.formFieldsInteracted,
+        $form_completion_rate: trackingData.formCompletionRate,
+        $form_time_to_submit_ms: trackingData.formTimeToSubmitMs,
     };
     captureEvent('$form_submit', properties);
+    // Reset form tracking state after submit
+    resetForm(trackingData.formSelector);
 }
 /**
  * Initialize click tracking
@@ -1288,253 +2045,24 @@ function initFormTracking() {
  * Initialize all autocapture based on configuration
  */
 function initAutocapture(cfg) {
-    config$2 = cfg;
-    if (config$2.autocapture.clicks) {
+    config = cfg;
+    if (config.autocapture.click) {
         initClickTracking();
     }
-    if (config$2.autocapture.formSubmit) {
+    if (config.autocapture.formSubmit) {
         initFormTracking();
     }
-}
-
-/**
- * Payload compression module
- * Uses CompressionStream API when available
- */
-/**
- * Check if compression is supported
- */
-function isCompressionSupported() {
-    return (typeof CompressionStream !== 'undefined' &&
-        typeof ReadableStream !== 'undefined');
-}
-/**
- * Compress a string using gzip
- * Returns the compressed data as a Blob, or null if compression is not supported
- */
-async function compressPayload(data) {
-    if (!isCompressionSupported()) {
-        return null;
-    }
-    try {
-        const encoder = new TextEncoder();
-        const inputBytes = encoder.encode(data);
-        const stream = new ReadableStream({
-            start(controller) {
-                controller.enqueue(inputBytes);
-                controller.close();
-            },
-        });
-        const compressedStream = stream.pipeThrough(new CompressionStream('gzip'));
-        const reader = compressedStream.getReader();
-        const chunks = [];
-        while (true) {
-            const { done, value } = await reader.read();
-            if (done)
-                break;
-            chunks.push(value);
-        }
-        // Combine chunks into a single Blob
-        return new Blob(chunks, { type: 'application/gzip' });
-    }
-    catch {
-        // Compression failed, return null to use uncompressed
-        return null;
-    }
-}
-/**
- * Get the size of data in bytes
- */
-function getByteSize(data) {
-    return new Blob([data]).size;
-}
-/**
- * Check if payload should be compressed (based on size threshold)
- * Only compress if payload is larger than 1KB
- */
-function shouldCompress(data) {
-    return isCompressionSupported() && getByteSize(data) > 1024;
-}
-
-/**
- * HTTP transport module
- * Handles sending events to the ingest API
- */
-let config$1 = null;
-let consecutiveFailures = 0;
-/**
- * Set the configuration
- */
-function setTransportConfig(cfg) {
-    config$1 = cfg;
-}
-/**
- * Sleep for a given number of milliseconds
- */
-function sleep(ms) {
-    return new Promise((resolve) => setTimeout(resolve, ms));
-}
-/**
- * Send events to the ingest API
- * Handles compression and retry logic
- */
-async function sendEvents(payload) {
-    if (!config$1) {
-        console.warn('[SessionVision] SDK not initialized');
-        return false;
-    }
-    const url = `${config$1.ingestHost}/api/v1/ingest/events`;
-    const jsonPayload = JSON.stringify(payload);
-    // Try to compress if payload is large enough
-    const useCompression = shouldCompress(jsonPayload);
-    let body = jsonPayload;
-    const headers = {
-        'Content-Type': 'application/json',
-    };
-    if (useCompression) {
-        const compressed = await compressPayload(jsonPayload);
-        if (compressed) {
-            body = compressed;
-            headers['Content-Type'] = 'application/json';
-            headers['Content-Encoding'] = 'gzip';
-        }
-    }
-    // Attempt to send with retries
-    for (let attempt = 0; attempt <= BUFFER_CONFIG.MAX_RETRIES; attempt++) {
-        try {
-            const response = await fetch(url, {
-                method: 'POST',
-                headers,
-                body,
-                keepalive: true, // Keep connection alive for background sends
-            });
-            if (response.ok || response.status === 202) {
-                // Success
-                consecutiveFailures = 0;
-                if (config$1.debug) {
-                    console.log(`[SessionVision] Events sent successfully (${payload.events.length} events)`);
-                }
-                return true;
-            }
-            // Server error, might be worth retrying
-            if (response.status >= 500) {
-                throw new Error(`Server error: ${response.status}`);
-            }
-            // Client error (4xx), don't retry
-            if (config$1.debug) {
-                console.warn(`[SessionVision] Failed to send events: ${response.status}`);
-            }
-            return false;
-        }
-        catch (error) {
-            // Network error or server error, retry if attempts remaining
-            if (attempt < BUFFER_CONFIG.MAX_RETRIES) {
-                const delay = BUFFER_CONFIG.RETRY_DELAYS_MS[attempt] || 4000;
-                if (config$1.debug) {
-                    console.log(`[SessionVision] Retry ${attempt + 1}/${BUFFER_CONFIG.MAX_RETRIES} in ${delay}ms`);
-                }
-                await sleep(delay);
-            }
-            else {
-                // All retries exhausted
-                consecutiveFailures++;
-                if (config$1.debug) {
-                    console.warn('[SessionVision] Failed to send events after retries:', error);
-                }
-            }
-        }
-    }
-    return false;
-}
-/**
- * Check if we should stop retrying (3+ consecutive failures)
- */
-function shouldStopRetrying() {
-    return consecutiveFailures >= 3;
-}
-
-/**
- * Event buffer module
- * Buffers events and flushes them periodically or when buffer is full
- */
-let eventBuffer = [];
-let flushTimer = null;
-let config = null;
-let isFlushing = false;
-/**
- * Set the configuration
- */
-function setBufferConfig(cfg) {
-    config = cfg;
-}
-/**
- * Add an event to the buffer
- */
-function addToBuffer(event) {
-    // If we've had too many failures, drop events
-    if (shouldStopRetrying()) {
-        if (config?.debug) {
-            console.warn('[SessionVision] Too many failures, dropping event');
-        }
-        return;
-    }
-    eventBuffer.push(event);
-    // Flush if buffer is full
-    if (eventBuffer.length >= BUFFER_CONFIG.MAX_EVENTS) {
-        flush();
-    }
-}
-/**
- * Flush the event buffer
- * Sends all buffered events to the server
- */
-async function flush() {
-    if (isFlushing || eventBuffer.length === 0 || !config) {
-        return;
+    // Initialize form field tracking for abandonment analysis
+    if (config.autocapture.formAbandonment) {
+        initFormFieldTracking();
     }
-    isFlushing = true;
-    // Take events from buffer (FIFO eviction on failure)
-    const eventsToSend = [...eventBuffer];
-    eventBuffer = [];
-    const payload = {
-        projectToken: config.projectToken,
-        events: eventsToSend,
-    };
-    const success = await sendEvents(payload);
-    if (!success) {
-        // Re-add events to buffer if we haven't exceeded max retries
-        if (!shouldStopRetrying()) {
-            // Only keep most recent events up to max buffer size
-            const combined = [...eventsToSend, ...eventBuffer];
-            eventBuffer = combined.slice(-10);
-            if (config.debug && combined.length > BUFFER_CONFIG.MAX_EVENTS) {
-                console.warn(`[SessionVision] Buffer overflow, dropped ${combined.length - BUFFER_CONFIG.MAX_EVENTS} oldest events`);
-            }
-        }
+    // Initialize frustration detectors
+    if (config.autocapture.rageClick) {
+        rageClickDetector = new RageClickDetector(config);
     }
-    isFlushing = false;
-}
-/**
- * Start the flush timer
- */
-function startFlushTimer() {
-    if (flushTimer) {
-        return;
+    if (config.autocapture.deadClick) {
+        deadClickDetector = new DeadClickDetector(config);
     }
-    flushTimer = setInterval(() => {
-        flush();
-    }, BUFFER_CONFIG.FLUSH_INTERVAL_MS);
-}
-/**
- * Initialize visibility change handler for flushing on tab hide
- */
-function initVisibilityHandler() {
-    document.addEventListener('visibilitychange', () => {
-        if (document.visibilityState === 'hidden') {
-            // Best-effort flush when tab is hidden
-            flush();
-        }
-    });
 }
 
 /**
@@ -1668,6 +2196,12 @@ function registerOnce(properties) {
     }
     registerOnceProperties(properties);
 }
+/**
+ * Manually flush the event buffer
+ */
+function flushEvents() {
+    return flush();
+}
 
 /**
  * Queue replay module
@@ -1739,7 +2273,7 @@ function getInitCalls(initArray) {
  * Session Vision JavaScript Snippet
  * Main SDK entry point
  *
- * @version "0.2.0"
+ * @version "0.3.0"
  */
 /**
  * Session Vision SDK instance
@@ -1748,7 +2282,7 @@ const sessionvision = {
     /**
      * SDK version
      */
-    version: "0.2.0" ,
+    version: "0.3.0" ,
     /**
      * Initialize the SDK with a project token and optional configuration
      *
@@ -1863,6 +2397,22 @@ const sessionvision = {
     registerOnce(properties) {
         registerOnce(properties);
     },
+    /**
+     * Manually flush the event buffer
+     * Useful before navigation or when you need to ensure events are sent immediately
+     *
+     * @returns Promise that resolves when the flush is complete
+     *
+     * @example
+     * ```js
+     * // Before navigating away
+     * await sessionvision.flushEvents();
+     * window.location.href = '/new-page';
+     * ```
+     */
+    flushEvents() {
+        return flushEvents();
+    },
 };
 /**
  * Bootstrap the SDK