@v-tilt/browser 1.1.5 → 1.3.0

package/lib/entrypoints/external-scripts-loader.js

@@ -0,0 +1,107 @@
+"use strict";
+/**
+ * External Scripts Loader
+ *
+ * Dynamically loads external scripts (like rrweb) from CDN.
+ * Based on PostHog's implementation.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getExtensionUrl = exports.loadScript = void 0;
+const globals_1 = require("../utils/globals");
+const LOGGER_PREFIX = "[ExternalScriptsLoader]";
+/**
+ * Load a script dynamically
+ */
+const loadScript = (vtilt, url, callback) => {
+    const config = vtilt.getConfig();
+    // Check if external script loading is disabled
+    if (config.disable_external_dependency_loading) {
+        console.warn(`${LOGGER_PREFIX} ${url} was requested but loading of external scripts is disabled.`);
+        return callback("Loading of external scripts is disabled");
+    }
+    // Check if script is already loaded
+    const existingScripts = globals_1.document === null || globals_1.document === void 0 ? void 0 : globals_1.document.querySelectorAll("script");
+    if (existingScripts) {
+        for (let i = 0; i < existingScripts.length; i++) {
+            if (existingScripts[i].src === url) {
+                const alreadyExistingScriptTag = existingScripts[i];
+                if (alreadyExistingScriptTag.__vtilt_loading_callback_fired) {
+                    // Script already exists and fired its load event
+                    return callback();
+                }
+                // Script exists but hasn't loaded yet - attach callback
+                alreadyExistingScriptTag.addEventListener("load", (event) => {
+                    alreadyExistingScriptTag.__vtilt_loading_callback_fired = true;
+                    callback(undefined, event);
+                });
+                alreadyExistingScriptTag.onerror = (error) => callback(error);
+                return;
+            }
+        }
+    }
+    const addScript = () => {
+        var _a;
+        if (!globals_1.document) {
+            return callback("document not found");
+        }
+        const scriptTag = globals_1.document.createElement("script");
+        scriptTag.type = "text/javascript";
+        scriptTag.crossOrigin = "anonymous";
+        scriptTag.src = url;
+        scriptTag.onload = (event) => {
+            scriptTag.__vtilt_loading_callback_fired = true;
+            callback(undefined, event);
+        };
+        scriptTag.onerror = (error) => callback(error);
+        const scripts = globals_1.document.querySelectorAll("body > script");
+        if (scripts.length > 0) {
+            (_a = scripts[0].parentNode) === null || _a === void 0 ? void 0 : _a.insertBefore(scriptTag, scripts[0]);
+        }
+        else {
+            globals_1.document.body.appendChild(scriptTag);
+        }
+    };
+    if (globals_1.document === null || globals_1.document === void 0 ? void 0 : globals_1.document.body) {
+        addScript();
+    }
+    else {
+        globals_1.document === null || globals_1.document === void 0 ? void 0 : globals_1.document.addEventListener("DOMContentLoaded", addScript);
+    }
+};
+exports.loadScript = loadScript;
+/**
+ * SDK version - used for loading correct script version from CDN
+ */
+const SDK_VERSION = "1.3.0";
+/**
+ * Get the URL for an extension script
+ *
+ * Priority:
+ * 1. script_host config (if set) - loads from {script_host}/dist/{kind}.js
+ * 2. Default to unpkg CDN for npm package
+ *
+ * Note: script_host should be the base URL (e.g., "https://cdn.example.com")
+ * The /dist/ path is automatically appended to match the npm package structure
+ */
+const getExtensionUrl = (vtilt, kind) => {
+    const config = vtilt.getConfig();
+    // Use script_host if configured (matches snippet behavior: script_host+"/dist/array.js")
+    if (config.script_host) {
+        const cleanHost = config.script_host.replace(/\/+$/gm, "");
+        return `${cleanHost}/dist/${kind}.js`;
+    }
+    // Default: load from unpkg (npm CDN)
+    // This serves the file directly from the published @v-tilt/browser package
+    return `https://unpkg.com/@v-tilt/browser@${SDK_VERSION}/dist/${kind}.js`;
+};
+exports.getExtensionUrl = getExtensionUrl;
+// Initialize extensions object
+globals_1.assignableWindow.__VTiltExtensions__ =
+    globals_1.assignableWindow.__VTiltExtensions__ || {};
+/**
+ * Load an external dependency
+ */
+globals_1.assignableWindow.__VTiltExtensions__.loadExternalDependency = (vtilt, kind, callback) => {
+    const url = getExtensionUrl(vtilt, kind);
+    loadScript(vtilt, url, callback);
+};

package/lib/entrypoints/module.es.d.ts

@@ -1,3 +1,4 @@
+import "./external-scripts-loader";
 import vt from "./module.no-external.es";
 export * from "./module.no-external.es";
 export default vt;

package/lib/entrypoints/module.es.js

@@ -17,6 +17,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+require("./external-scripts-loader");
 const module_no_external_es_1 = __importDefault(require("./module.no-external.es"));
 __exportStar(require("./module.no-external.es"), exports);
 exports.default = module_no_external_es_1.default;

package/lib/entrypoints/recorder.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Recorder Entrypoint
+ *
+ * This file is built as a separate bundle (recorder.js) that can be
+ * lazy-loaded when session recording is enabled.
+ *
+ * It exports:
+ * - rrweb.record: The rrweb record function
+ * - rrwebPlugins: Plugins for console recording
+ * - initSessionRecording: Factory function to create LazyLoadedSessionRecording
+ */
+import { record as rrwebRecord } from "@rrweb/record";
+import { LazyLoadedSessionRecordingInterface } from "../utils/globals";
+import type { SessionRecordingConfig } from "../extensions/replay/types";
+import type { VTilt } from "../vtilt";
+/**
+ * Factory function to create a LazyLoadedSessionRecording instance
+ *
+ * Called by SessionRecordingWrapper after the recorder script is loaded
+ */
+declare function initSessionRecording(instance: VTilt, config?: SessionRecordingConfig): LazyLoadedSessionRecordingInterface;
+export { initSessionRecording };
+export default rrwebRecord;

package/lib/entrypoints/recorder.js

@@ -0,0 +1,42 @@
+"use strict";
+/**
+ * Recorder Entrypoint
+ *
+ * This file is built as a separate bundle (recorder.js) that can be
+ * lazy-loaded when session recording is enabled.
+ *
+ * It exports:
+ * - rrweb.record: The rrweb record function
+ * - rrwebPlugins: Plugins for console recording
+ * - initSessionRecording: Factory function to create LazyLoadedSessionRecording
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initSessionRecording = initSessionRecording;
+const record_1 = require("@rrweb/record");
+const rrweb_plugin_console_record_1 = require("@rrweb/rrweb-plugin-console-record");
+const globals_1 = require("../utils/globals");
+const session_recording_1 = require("../extensions/replay/session-recording");
+// Initialize extensions object
+globals_1.assignableWindow.__VTiltExtensions__ =
+    globals_1.assignableWindow.__VTiltExtensions__ || {};
+// Register rrweb record function
+globals_1.assignableWindow.__VTiltExtensions__.rrweb = {
+    record: record_1.record,
+    version: "v2",
+};
+// Register rrweb plugins
+globals_1.assignableWindow.__VTiltExtensions__.rrwebPlugins = {
+    getRecordConsolePlugin: rrweb_plugin_console_record_1.getRecordConsolePlugin,
+};
+/**
+ * Factory function to create a LazyLoadedSessionRecording instance
+ *
+ * Called by SessionRecordingWrapper after the recorder script is loaded
+ */
+function initSessionRecording(instance, config) {
+    return new session_recording_1.LazyLoadedSessionRecording(instance, config);
+}
+// Register the factory function
+globals_1.assignableWindow.__VTiltExtensions__.initSessionRecording =
+    initSessionRecording;
+exports.default = record_1.record;

package/lib/entrypoints/web-vitals.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Web Vitals Extension Entrypoint
+ *
+ * This file imports the web-vitals library and registers its callbacks
+ * on the global __VTiltExtensions__ object. The main SDK checks for these
+ * callbacks and uses them if available.
+ *
+ * Usage:
+ * - Include this entrypoint in the full bundle (array.full.ts)
+ * - Or load it dynamically via loadExternalDependency('web-vitals', callback)
+ */
+import { WebVitalsCallbacks } from "../utils/globals";
+declare const vtiltWebVitalsCallbacks: WebVitalsCallbacks;
+export default vtiltWebVitalsCallbacks;

package/lib/entrypoints/web-vitals.js

@@ -0,0 +1,29 @@
+"use strict";
+/**
+ * Web Vitals Extension Entrypoint
+ *
+ * This file imports the web-vitals library and registers its callbacks
+ * on the global __VTiltExtensions__ object. The main SDK checks for these
+ * callbacks and uses them if available.
+ *
+ * Usage:
+ * - Include this entrypoint in the full bundle (array.full.ts)
+ * - Or load it dynamically via loadExternalDependency('web-vitals', callback)
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+const web_vitals_1 = require("web-vitals");
+const globals_1 = require("../utils/globals");
+const vtiltWebVitalsCallbacks = {
+    onLCP: web_vitals_1.onLCP,
+    onCLS: web_vitals_1.onCLS,
+    onFCP: web_vitals_1.onFCP,
+    onINP: web_vitals_1.onINP,
+    onTTFB: web_vitals_1.onTTFB,
+};
+// Initialize extensions object if not exists
+globals_1.assignableWindow.__VTiltExtensions__ =
+    globals_1.assignableWindow.__VTiltExtensions__ || {};
+// Register web vitals callbacks
+globals_1.assignableWindow.__VTiltExtensions__.webVitalsCallbacks =
+    vtiltWebVitalsCallbacks;
+exports.default = vtiltWebVitalsCallbacks;

package/lib/extensions/replay/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Session Recording Extension
+ *
+ * Exports for rrweb session recording functionality.
+ *
+ * Architecture:
+ * - SessionRecordingWrapper: Lightweight wrapper in main bundle, handles lazy loading
+ * - LazyLoadedSessionRecording: Actual recording logic, loaded on demand via recorder.js
+ */
+export { SessionRecordingWrapper, LAZY_LOADING, type SessionRecordingStatus, type LazyLoadedSessionRecordingInterface, } from "./session-recording-wrapper";
+export { LazyLoadedSessionRecording } from "./session-recording";
+export type { SessionRecordingConfig, SessionStartReason, RecordOptions, RRWebRecord, SnapshotBuffer, CanvasRecordingConfig, NetworkPayloadCaptureConfig, MaskingConfig, TriggerType, } from "./types";
+export { compressEvent, estimateSize, truncateLargeConsoleLogs, splitBuffer, isSessionIdleEvent, isRecordingPausedEvent, isInteractiveEvent, RECORDING_MAX_EVENT_SIZE, RECORDING_BUFFER_TIMEOUT, RECORDING_IDLE_THRESHOLD_MS, } from "./session-recording-utils";

package/lib/extensions/replay/index.js

@@ -0,0 +1,31 @@
+"use strict";
+/**
+ * Session Recording Extension
+ *
+ * Exports for rrweb session recording functionality.
+ *
+ * Architecture:
+ * - SessionRecordingWrapper: Lightweight wrapper in main bundle, handles lazy loading
+ * - LazyLoadedSessionRecording: Actual recording logic, loaded on demand via recorder.js
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RECORDING_IDLE_THRESHOLD_MS = exports.RECORDING_BUFFER_TIMEOUT = exports.RECORDING_MAX_EVENT_SIZE = exports.isInteractiveEvent = exports.isRecordingPausedEvent = exports.isSessionIdleEvent = exports.splitBuffer = exports.truncateLargeConsoleLogs = exports.estimateSize = exports.compressEvent = exports.LazyLoadedSessionRecording = exports.LAZY_LOADING = exports.SessionRecordingWrapper = void 0;
+// Main export - the wrapper that lives in the main bundle
+var session_recording_wrapper_1 = require("./session-recording-wrapper");
+Object.defineProperty(exports, "SessionRecordingWrapper", { enumerable: true, get: function () { return session_recording_wrapper_1.SessionRecordingWrapper; } });
+Object.defineProperty(exports, "LAZY_LOADING", { enumerable: true, get: function () { return session_recording_wrapper_1.LAZY_LOADING; } });
+// Lazy-loaded implementation (only used in recorder.js bundle)
+var session_recording_1 = require("./session-recording");
+Object.defineProperty(exports, "LazyLoadedSessionRecording", { enumerable: true, get: function () { return session_recording_1.LazyLoadedSessionRecording; } });
+// Utilities
+var session_recording_utils_1 = require("./session-recording-utils");
+Object.defineProperty(exports, "compressEvent", { enumerable: true, get: function () { return session_recording_utils_1.compressEvent; } });
+Object.defineProperty(exports, "estimateSize", { enumerable: true, get: function () { return session_recording_utils_1.estimateSize; } });
+Object.defineProperty(exports, "truncateLargeConsoleLogs", { enumerable: true, get: function () { return session_recording_utils_1.truncateLargeConsoleLogs; } });
+Object.defineProperty(exports, "splitBuffer", { enumerable: true, get: function () { return session_recording_utils_1.splitBuffer; } });
+Object.defineProperty(exports, "isSessionIdleEvent", { enumerable: true, get: function () { return session_recording_utils_1.isSessionIdleEvent; } });
+Object.defineProperty(exports, "isRecordingPausedEvent", { enumerable: true, get: function () { return session_recording_utils_1.isRecordingPausedEvent; } });
+Object.defineProperty(exports, "isInteractiveEvent", { enumerable: true, get: function () { return session_recording_utils_1.isInteractiveEvent; } });
+Object.defineProperty(exports, "RECORDING_MAX_EVENT_SIZE", { enumerable: true, get: function () { return session_recording_utils_1.RECORDING_MAX_EVENT_SIZE; } });
+Object.defineProperty(exports, "RECORDING_BUFFER_TIMEOUT", { enumerable: true, get: function () { return session_recording_utils_1.RECORDING_BUFFER_TIMEOUT; } });
+Object.defineProperty(exports, "RECORDING_IDLE_THRESHOLD_MS", { enumerable: true, get: function () { return session_recording_utils_1.RECORDING_IDLE_THRESHOLD_MS; } });

package/lib/extensions/replay/session-recording-utils.d.ts

@@ -0,0 +1,92 @@
+/**
+ * Session Recording Utilities
+ *
+ * Utility functions for session recording.
+ * Based on PostHog's sessionrecording-utils.ts
+ */
+import { EventType, IncrementalSource, eventWithTime } from "@rrweb/types";
+import type { SnapshotBuffer } from "./types";
+export declare const INCREMENTAL_SNAPSHOT_EVENT_TYPE = 3;
+export declare const ONE_KB = 1024;
+export declare const ONE_MB: number;
+export declare const SEVEN_MB: number;
+export declare const PARTIAL_COMPRESSION_THRESHOLD = 1024;
+export declare const RECORDING_MAX_EVENT_SIZE: number;
+export declare const RECORDING_BUFFER_TIMEOUT = 2000;
+export declare const RECORDING_IDLE_THRESHOLD_MS: number;
+/** Active interaction sources */
+export declare const ACTIVE_SOURCES: IncrementalSource[];
+/**
+ * Gzip compress data to a base64 string
+ */
+export declare function gzipToString(data: unknown): string;
+/**
+ * Estimate the size of an object in bytes
+ */
+export declare function estimateSize(obj: unknown): number;
+export interface CompressedFullSnapshotEvent {
+    type: typeof EventType.FullSnapshot;
+    data: string;
+}
+export interface CompressedIncrementalSnapshotEvent {
+    type: typeof EventType.IncrementalSnapshot;
+    data: {
+        source: IncrementalSource;
+        texts: string;
+        attributes: string;
+        removes: string;
+        adds: string;
+    };
+}
+export interface CompressedIncrementalStyleSnapshotEvent {
+    type: typeof EventType.IncrementalSnapshot;
+    data: {
+        source: typeof IncrementalSource.StyleSheetRule;
+        id?: number;
+        styleId?: number;
+        replace?: string;
+        replaceSync?: string;
+        adds?: string;
+        removes?: string;
+    };
+}
+export type CompressedEvent = CompressedFullSnapshotEvent | CompressedIncrementalSnapshotEvent | CompressedIncrementalStyleSnapshotEvent;
+export type CompressedEventWithTime = CompressedEvent & {
+    timestamp: number;
+    delay?: number;
+    cv: "2024-10";
+};
+/**
+ * Compress an rrweb event for transmission
+ * Only compresses full snapshots and mutation events above threshold
+ */
+export declare function compressEvent(event: eventWithTime): eventWithTime | CompressedEventWithTime;
+/**
+ * Truncate large console log payloads to prevent excessive data
+ */
+export declare function truncateLargeConsoleLogs(event: eventWithTime): eventWithTime;
+/**
+ * Split a large buffer into smaller chunks for transmission
+ */
+export declare function splitBuffer(buffer: SnapshotBuffer, sizeLimit?: number): SnapshotBuffer[];
+/**
+ * Check if an event is a session idle custom event
+ */
+export declare function isSessionIdleEvent(event: eventWithTime): event is eventWithTime & {
+    data: {
+        tag: string;
+        payload: unknown;
+    };
+};
+/**
+ * Check if an event is a recording paused custom event
+ */
+export declare function isRecordingPausedEvent(event: eventWithTime): boolean;
+/**
+ * Check if an event represents user interaction
+ */
+export declare function isInteractiveEvent(event: eventWithTime): boolean;
+/**
+ * Clamp a value to a range with logging
+ */
+export declare function clampToRange(value: number, min: number, max: number, label: string, defaultValue: number): number;

package/lib/extensions/replay/session-recording-utils.js

@@ -0,0 +1,212 @@
+"use strict";
+/**
+ * Session Recording Utilities
+ *
+ * Utility functions for session recording.
+ * Based on PostHog's sessionrecording-utils.ts
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ACTIVE_SOURCES = exports.RECORDING_IDLE_THRESHOLD_MS = exports.RECORDING_BUFFER_TIMEOUT = exports.RECORDING_MAX_EVENT_SIZE = exports.PARTIAL_COMPRESSION_THRESHOLD = exports.SEVEN_MB = exports.ONE_MB = exports.ONE_KB = exports.INCREMENTAL_SNAPSHOT_EVENT_TYPE = void 0;
+exports.gzipToString = gzipToString;
+exports.estimateSize = estimateSize;
+exports.compressEvent = compressEvent;
+exports.truncateLargeConsoleLogs = truncateLargeConsoleLogs;
+exports.splitBuffer = splitBuffer;
+exports.isSessionIdleEvent = isSessionIdleEvent;
+exports.isRecordingPausedEvent = isRecordingPausedEvent;
+exports.isInteractiveEvent = isInteractiveEvent;
+exports.clampToRange = clampToRange;
+const types_1 = require("@rrweb/types");
+const fflate_1 = require("fflate");
+// ============================================================================
+// Constants
+// ============================================================================
+exports.INCREMENTAL_SNAPSHOT_EVENT_TYPE = 3;
+exports.ONE_KB = 1024;
+exports.ONE_MB = exports.ONE_KB * exports.ONE_KB;
+exports.SEVEN_MB = exports.ONE_MB * 7 * 0.9; // ~7mb with wiggle room
+exports.PARTIAL_COMPRESSION_THRESHOLD = exports.ONE_KB;
+exports.RECORDING_MAX_EVENT_SIZE = exports.ONE_MB * 0.9; // ~1mb with wiggle room
+exports.RECORDING_BUFFER_TIMEOUT = 2000; // 2 seconds
+exports.RECORDING_IDLE_THRESHOLD_MS = 5 * 60 * 1000; // 5 minutes
+/** Active interaction sources */
+exports.ACTIVE_SOURCES = [
+    types_1.IncrementalSource.MouseMove,
+    types_1.IncrementalSource.MouseInteraction,
+    types_1.IncrementalSource.Scroll,
+    types_1.IncrementalSource.ViewportResize,
+    types_1.IncrementalSource.Input,
+    types_1.IncrementalSource.TouchMove,
+    types_1.IncrementalSource.MediaInteraction,
+    types_1.IncrementalSource.Drag,
+];
+// ============================================================================
+// Compression
+// ============================================================================
+/**
+ * Gzip compress data to a base64 string
+ */
+function gzipToString(data) {
+    return (0, fflate_1.strFromU8)((0, fflate_1.gzipSync)((0, fflate_1.strToU8)(JSON.stringify(data))), true);
+}
+/**
+ * Estimate the size of an object in bytes
+ */
+function estimateSize(obj) {
+    try {
+        return new Blob([JSON.stringify(obj)]).size;
+    }
+    catch (_a) {
+        // Fallback for environments without Blob
+        return JSON.stringify(obj).length * 2;
+    }
+}
+/**
+ * Compress an rrweb event for transmission
+ * Only compresses full snapshots and mutation events above threshold
+ */
+function compressEvent(event) {
+    const originalSize = estimateSize(event);
+    if (originalSize < exports.PARTIAL_COMPRESSION_THRESHOLD) {
+        return event;
+    }
+    try {
+        if (event.type === types_1.EventType.FullSnapshot) {
+            return {
+                ...event,
+                data: gzipToString(event.data),
+                cv: "2024-10",
+            };
+        }
+        if (event.type === types_1.EventType.IncrementalSnapshot &&
+            event.data.source === types_1.IncrementalSource.Mutation) {
+            const mutationData = event.data;
+            return {
+                ...event,
+                cv: "2024-10",
+                data: {
+                    ...mutationData,
+                    texts: gzipToString(mutationData.texts),
+                    attributes: gzipToString(mutationData.attributes),
+                    removes: gzipToString(mutationData.removes),
+                    adds: gzipToString(mutationData.adds),
+                },
+            };
+        }
+        if (event.type === types_1.EventType.IncrementalSnapshot &&
+            event.data.source === types_1.IncrementalSource.StyleSheetRule) {
+            const styleData = event.data;
+            return {
+                ...event,
+                cv: "2024-10",
+                data: {
+                    ...styleData,
+                    adds: styleData.adds ? gzipToString(styleData.adds) : undefined,
+                    removes: styleData.removes
+                        ? gzipToString(styleData.removes)
+                        : undefined,
+                },
+            };
+        }
+    }
+    catch (e) {
+        console.error("[SessionRecording] Could not compress event - will use uncompressed event", e);
+    }
+    return event;
+}
+// ============================================================================
+// Console Log Handling
+// ============================================================================
+const MAX_CONSOLE_LOG_SIZE = 1000;
+/**
+ * Truncate large console log payloads to prevent excessive data
+ */
+function truncateLargeConsoleLogs(event) {
+    if (event.type !== types_1.EventType.Plugin ||
+        event.data.plugin !== "rrweb/console@1") {
+        return event;
+    }
+    const payload = event.data.payload;
+    if (!(payload === null || payload === void 0 ? void 0 : payload.payload)) {
+        return event;
+    }
+    const truncatedPayload = payload.payload.map((item) => {
+        if (typeof item === "string" && item.length > MAX_CONSOLE_LOG_SIZE) {
+            return item.substring(0, MAX_CONSOLE_LOG_SIZE) + "... [truncated]";
+        }
+        return item;
+    });
+    return {
+        ...event,
+        data: {
+            ...event.data,
+            payload: {
+                ...payload,
+                payload: truncatedPayload,
+            },
+        },
+    };
+}
+// ============================================================================
+// Buffer Management
+// ============================================================================
+/**
+ * Split a large buffer into smaller chunks for transmission
+ */
+function splitBuffer(buffer, sizeLimit = exports.SEVEN_MB) {
+    if (buffer.size >= sizeLimit && buffer.data.length > 1) {
+        const half = Math.floor(buffer.data.length / 2);
+        const firstHalf = buffer.data.slice(0, half);
+        const secondHalf = buffer.data.slice(half);
+        return [
+            ...splitBuffer({
+                size: estimateSize(firstHalf),
+                data: firstHalf,
+                sessionId: buffer.sessionId,
+                windowId: buffer.windowId,
+            }),
+            ...splitBuffer({
+                size: estimateSize(secondHalf),
+                data: secondHalf,
+                sessionId: buffer.sessionId,
+                windowId: buffer.windowId,
+            }),
+        ];
+    }
+    return [buffer];
+}
+// ============================================================================
+// Event Helpers
+// ============================================================================
+/**
+ * Check if an event is a session idle custom event
+ */
+function isSessionIdleEvent(event) {
+    return (event.type === types_1.EventType.Custom &&
+        event.data.tag === "sessionIdle");
+}
+/**
+ * Check if an event is a recording paused custom event
+ */
+function isRecordingPausedEvent(event) {
+    return (event.type === types_1.EventType.Custom &&
+        event.data.tag === "recording paused");
+}
+/**
+ * Check if an event represents user interaction
+ */
+function isInteractiveEvent(event) {
+    return (event.type === exports.INCREMENTAL_SNAPSHOT_EVENT_TYPE &&
+        exports.ACTIVE_SOURCES.includes(event.data
+            .source));
+}
+/**
+ * Clamp a value to a range with logging
+ */
+function clampToRange(value, min, max, label, defaultValue) {
+    if (value < min || value > max) {
+        console.warn(`[SessionRecording] ${label} must be between ${min} and ${max}. Using default: ${defaultValue}`);
+        return defaultValue;
+    }
+    return value;
+}

package/lib/extensions/replay/session-recording-wrapper.d.ts

@@ -0,0 +1,61 @@
+/**
+ * Session Recording Wrapper
+ *
+ * Lightweight wrapper that handles the decision of WHEN to load recording.
+ * The actual recording logic is in LazyLoadedSessionRecording which is
+ * loaded on demand.
+ *
+ * Based on PostHog's sessionrecording-wrapper.ts
+ */
+import type { VTilt } from "../../vtilt";
+import type { SessionRecordingConfig, SessionStartReason } from "./types";
+import { LazyLoadedSessionRecordingInterface } from "../../utils/globals";
+/** Status when lazy loading is in progress */
+export declare const LAZY_LOADING: "lazy_loading";
+/** Session recording status */
+export type SessionRecordingStatus = "disabled" | "buffering" | "active" | "paused" | "sampled" | "trigger_pending" | typeof LAZY_LOADING;
+export type { LazyLoadedSessionRecordingInterface };
+/**
+ * Session Recording Wrapper
+ *
+ * This is the lightweight class that lives in the main bundle.
+ * It handles:
+ * - Deciding if recording should be enabled
+ * - Lazy loading the actual recording code
+ * - Delegating to LazyLoadedSessionRecording
+ */
+export declare class SessionRecordingWrapper {
+    private readonly _instance;
+    private _lazyLoadedRecording;
+    private _config;
+    constructor(_instance: VTilt, config?: SessionRecordingConfig);
+    get started(): boolean;
+    get status(): SessionRecordingStatus;
+    get sessionId(): string;
+    /**
+     * Start recording if enabled, otherwise stop
+     */
+    startIfEnabledOrStop(startReason?: SessionStartReason): void;
+    /**
+     * Stop recording
+     */
+    stopRecording(): void;
+    /**
+     * Log a message to the recording
+     */
+    log(message: string, level?: "log" | "warn" | "error"): void;
+    /**
+     * Update configuration
+     */
+    updateConfig(config: Partial<SessionRecordingConfig>): void;
+    private get _isRecordingEnabled();
+    private get _scriptName();
+    /**
+     * Lazy load the recording script and start
+     */
+    private _lazyLoadAndStart;
+    /**
+     * Called after the recording script is loaded
+     */
+    private _onScriptLoaded;
+}