@bugspotter/sdk 0.1.0-alpha.1

package/dist/core/uploader.js

@@ -0,0 +1,185 @@
+"use strict";
+/**
+ * DirectUploader
+ * Handles direct client-to-storage uploads using presigned URLs
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DirectUploader = void 0;
+/**
+ * DirectUploader handles uploading files directly to storage using presigned URLs
+ * This bypasses the API server for file data, reducing memory usage and improving performance
+ */
+class DirectUploader {
+    constructor(config) {
+        this.config = config;
+    }
+    /**
+     * Upload a screenshot file directly to storage
+     * @param file - Screenshot file or Blob
+     * @param onProgress - Optional progress callback
+     * @returns Upload result with storage key
+     */
+    async uploadScreenshot(file, onProgress) {
+        return this.uploadFile(file, 'screenshot', 'screenshot.png', onProgress);
+    }
+    /**
+     * Upload a compressed session replay directly to storage
+     * @param compressedData - Gzip-compressed replay data
+     * @param onProgress - Optional progress callback
+     * @returns Upload result with storage key
+     */
+    async uploadReplay(compressedData, onProgress) {
+        return this.uploadFile(compressedData, 'replay', 'replay.gz', onProgress);
+    }
+    /**
+     * Upload an attachment file directly to storage
+     * @param file - Attachment file
+     * @param onProgress - Optional progress callback
+     * @returns Upload result with storage key
+     */
+    async uploadAttachment(file, onProgress) {
+        return this.uploadFile(file, 'attachment', file.name, onProgress);
+    }
+    /**
+     * Generic file upload method
+     * 1. Request presigned URL from API
+     * 2. Upload file directly to storage using presigned URL
+     * 3. Confirm upload with API
+     */
+    async uploadFile(file, fileType, filename, onProgress) {
+        try {
+            // Step 1: Get presigned upload URL
+            const presignedUrlResponse = await this.requestPresignedUrl(fileType, filename);
+            if (!presignedUrlResponse.success) {
+                return {
+                    success: false,
+                    error: presignedUrlResponse.error || 'Failed to get presigned URL',
+                };
+            }
+            const { uploadUrl, storageKey } = presignedUrlResponse.data;
+            // Step 2: Upload file to storage using presigned URL
+            const uploadSuccess = await this.uploadToStorage(uploadUrl, file, onProgress);
+            if (!uploadSuccess) {
+                return {
+                    success: false,
+                    error: 'Failed to upload file to storage',
+                };
+            }
+            // Step 3: Confirm upload with API
+            const confirmSuccess = await this.confirmUpload(fileType);
+            if (!confirmSuccess) {
+                return {
+                    success: false,
+                    error: 'Failed to confirm upload',
+                };
+            }
+            return {
+                success: true,
+                storageKey,
+            };
+        }
+        catch (error) {
+            return {
+                success: false,
+                error: error instanceof Error ? error.message : 'Unknown error',
+            };
+        }
+    }
+    /**
+     * Request a presigned URL from the API
+     */
+    async requestPresignedUrl(fileType, filename) {
+        try {
+            const response = await fetch(`${this.config.apiEndpoint}/api/v1/uploads/presigned-url`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'x-api-key': this.config.apiKey,
+                },
+                body: JSON.stringify({
+                    projectId: this.config.projectId,
+                    bugId: this.config.bugId,
+                    fileType,
+                    filename,
+                }),
+            });
+            if (!response.ok) {
+                const errorText = await response.text();
+                return {
+                    success: false,
+                    error: `HTTP ${response.status}: ${errorText}`,
+                };
+            }
+            const result = await response.json();
+            return {
+                success: result.success,
+                data: result.data,
+                error: result.error,
+            };
+        }
+        catch (error) {
+            return {
+                success: false,
+                error: error instanceof Error ? error.message : 'Network error',
+            };
+        }
+    }
+    /**
+     * Upload file to storage using presigned URL
+     * Uses XMLHttpRequest for progress tracking
+     */
+    uploadToStorage(uploadUrl, file, onProgress) {
+        return new Promise((resolve) => {
+            const xhr = new XMLHttpRequest();
+            // Track upload progress
+            if (onProgress) {
+                xhr.upload.addEventListener('progress', (event) => {
+                    if (event.lengthComputable) {
+                        onProgress({
+                            loaded: event.loaded,
+                            total: event.total,
+                            percentage: Math.round((event.loaded / event.total) * 100),
+                        });
+                    }
+                });
+            }
+            // Handle completion
+            xhr.addEventListener('load', () => {
+                resolve(xhr.status >= 200 && xhr.status < 300);
+            });
+            // Handle errors
+            xhr.addEventListener('error', () => {
+                resolve(false);
+            });
+            xhr.addEventListener('abort', () => {
+                resolve(false);
+            });
+            // Send file
+            xhr.open('PUT', uploadUrl);
+            xhr.setRequestHeader('Content-Type', file.type || 'application/octet-stream');
+            xhr.send(file);
+        });
+    }
+    /**
+     * Confirm successful upload with the API
+     */
+    async confirmUpload(fileType) {
+        try {
+            const response = await fetch(`${this.config.apiEndpoint}/api/v1/reports/${this.config.bugId}/confirm-upload`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                    'x-api-key': this.config.apiKey,
+                },
+                body: JSON.stringify({
+                    fileType,
+                }),
+            });
+            return response.ok;
+        }
+        catch (_a) {
+            return false;
+        }
+    }
+}
+exports.DirectUploader = DirectUploader;

package/dist/index.d.ts

@@ -0,0 +1,140 @@
+import type { BrowserMetadata } from './capture/metadata';
+import { type FloatingButtonOptions } from './widget/button';
+import type { eventWithTime } from '@rrweb/types';
+import { type AuthConfig, type RetryConfig } from './core/transport';
+import type { OfflineConfig } from './core/offline-queue';
+export declare class BugSpotter {
+    private static instance;
+    private config;
+    private screenshot;
+    private console;
+    private network;
+    private metadata;
+    private domCollector?;
+    private widget?;
+    private sanitizer?;
+    constructor(config: BugSpotterConfig);
+    static init(config: BugSpotterConfig): BugSpotter;
+    static getInstance(): BugSpotter | null;
+    /**
+     * Capture bug report data
+     * Note: Screenshot is captured for modal preview only (_screenshotPreview)
+     * Actual file uploads use presigned URLs (screenshotKey/replayKey set after upload)
+     */
+    capture(): Promise<BugReport>;
+    private handleBugReport;
+    private submitBugReport;
+    getConfig(): Readonly<BugSpotterConfig>;
+    destroy(): void;
+}
+export interface BugSpotterConfig {
+    endpoint?: string;
+    showWidget?: boolean;
+    widgetOptions?: FloatingButtonOptions;
+    /** Authentication configuration */
+    auth?: AuthConfig;
+    /** Retry configuration for failed requests */
+    retry?: RetryConfig;
+    /** Offline queue configuration */
+    offline?: OfflineConfig;
+    replay?: {
+        /** Enable session replay recording (default: true) */
+        enabled?: boolean;
+        /** Duration in seconds to keep replay events (default: 15, max recommended: 30) */
+        duration?: number;
+        /** Sampling configuration for performance optimization */
+        sampling?: {
+            /** Throttle mousemove events in milliseconds (default: 50) */
+            mousemove?: number;
+            /** Throttle scroll events in milliseconds (default: 100) */
+            scroll?: number;
+        };
+    };
+    sanitize?: {
+        /** Enable PII sanitization (default: true) */
+        enabled?: boolean;
+        /**
+         * PII patterns to detect and mask
+         * - Can be a preset name: 'all', 'minimal', 'financial', 'contact', 'gdpr', 'pci', etc.
+         * - Or an array of pattern names: ['email', 'phone', 'ip']
+         */
+        patterns?: 'all' | 'minimal' | 'financial' | 'contact' | 'identification' | 'kazakhstan' | 'gdpr' | 'pci' | Array<'email' | 'phone' | 'creditcard' | 'ssn' | 'iin' | 'ip' | 'custom'>;
+        /** Custom regex patterns for PII detection */
+        customPatterns?: Array<{
+            name: string;
+            regex: RegExp;
+            description?: string;
+            examples?: string[];
+            priority?: number;
+        }>;
+        /** CSS selectors to exclude from sanitization */
+        excludeSelectors?: string[];
+    };
+}
+export interface BugReportPayload {
+    title: string;
+    description: string;
+    report: BugReport;
+}
+export interface BugReport {
+    screenshotKey?: string;
+    console: Array<{
+        level: string;
+        message: string;
+        timestamp: number;
+        stack?: string;
+    }>;
+    network: Array<{
+        url: string;
+        method: string;
+        status: number;
+        duration: number;
+        timestamp: number;
+        error?: string;
+    }>;
+    metadata: BrowserMetadata;
+    replay?: eventWithTime[];
+    replayKey?: string;
+    _screenshotPreview?: string;
+}
+export type { BrowserMetadata } from './capture/metadata';
+export { ScreenshotCapture } from './capture/screenshot';
+export { ConsoleCapture } from './capture/console';
+export { NetworkCapture } from './capture/network';
+export { MetadataCapture } from './capture/metadata';
+export { DOMCollector } from './collectors';
+export type { DOMCollectorConfig } from './collectors';
+export { CircularBuffer } from './core/buffer';
+export type { CircularBufferConfig } from './core/buffer';
+export { compressData, decompressData, compressImage, estimateSize, getCompressionRatio, } from './core/compress';
+export { submitWithAuth, getAuthHeaders, clearOfflineQueue } from './core/transport';
+export type { AuthConfig, TransportOptions, RetryConfig } from './core/transport';
+export type { OfflineConfig } from './core/offline-queue';
+export type { Logger, LogLevel, LoggerConfig } from './utils/logger';
+export { getLogger, configureLogger, createLogger } from './utils/logger';
+export { DirectUploader } from './core/uploader';
+export type { UploadResult } from './core/uploader';
+export { compressReplayEvents, canvasToBlob, estimateCompressedReplaySize, isWithinSizeLimit, } from './core/upload-helpers';
+export { createSanitizer, Sanitizer } from './utils/sanitize';
+export type { PIIPattern, CustomPattern, SanitizeConfig } from './utils/sanitize';
+export { DEFAULT_PATTERNS, PATTERN_PRESETS, PATTERN_CATEGORIES, PatternBuilder, createPatternConfig, getPattern, getPatternsByCategory, validatePattern, } from './utils/sanitize';
+export type { PIIPatternName, PatternDefinition } from './utils/sanitize';
+export { FloatingButton } from './widget/button';
+export type { FloatingButtonOptions } from './widget/button';
+export { BugReportModal } from './widget/modal';
+export type { BugReportData, BugReportModalOptions, PIIDetection } from './widget/modal';
+export type { eventWithTime } from '@rrweb/types';
+/**
+ * Convenience function to sanitize text with default PII patterns
+ * Useful for quick sanitization without creating a Sanitizer instance
+ *
+ * @param text - Text to sanitize
+ * @returns Sanitized text with PII redacted
+ *
+ * @example
+ * ```typescript
+ * const sanitized = sanitize('Email: user@example.com');
+ * // Returns: 'Email: [REDACTED]'
+ * ```
+ */
+export declare function sanitize(text: string): string;

package/dist/index.esm.js

@@ -0,0 +1,205 @@
+import { ScreenshotCapture } from './capture/screenshot';
+import { ConsoleCapture } from './capture/console';
+import { NetworkCapture } from './capture/network';
+import { MetadataCapture } from './capture/metadata';
+import { compressData, estimateSize, getCompressionRatio } from './core/compress';
+import { FloatingButton } from './widget/button';
+import { BugReportModal } from './widget/modal';
+import { DOMCollector } from './collectors';
+import { createSanitizer } from './utils/sanitize';
+import { getLogger } from './utils/logger';
+import { submitWithAuth } from './core/transport';
+const logger = getLogger();
+export class BugSpotter {
+    constructor(config) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+        this.config = config;
+        // Initialize sanitizer if enabled
+        if (((_a = config.sanitize) === null || _a === void 0 ? void 0 : _a.enabled) !== false) {
+            this.sanitizer = createSanitizer({
+                enabled: (_c = (_b = config.sanitize) === null || _b === void 0 ? void 0 : _b.enabled) !== null && _c !== void 0 ? _c : true,
+                patterns: (_d = config.sanitize) === null || _d === void 0 ? void 0 : _d.patterns,
+                customPatterns: (_e = config.sanitize) === null || _e === void 0 ? void 0 : _e.customPatterns,
+                excludeSelectors: (_f = config.sanitize) === null || _f === void 0 ? void 0 : _f.excludeSelectors,
+            });
+        }
+        this.screenshot = new ScreenshotCapture();
+        this.console = new ConsoleCapture({ sanitizer: this.sanitizer });
+        this.network = new NetworkCapture({ sanitizer: this.sanitizer });
+        this.metadata = new MetadataCapture({ sanitizer: this.sanitizer });
+        // Note: DirectUploader is created per-report since it needs bugId
+        // See submitBugReport() for initialization
+        // Initialize DOM collector if replay is enabled
+        if (((_g = config.replay) === null || _g === void 0 ? void 0 : _g.enabled) !== false) {
+            this.domCollector = new DOMCollector({
+                duration: (_j = (_h = config.replay) === null || _h === void 0 ? void 0 : _h.duration) !== null && _j !== void 0 ? _j : 15,
+                sampling: (_k = config.replay) === null || _k === void 0 ? void 0 : _k.sampling,
+                sanitizer: this.sanitizer,
+            });
+            this.domCollector.startRecording();
+        }
+        // Initialize widget if enabled
+        if (config.showWidget !== false) {
+            this.widget = new FloatingButton(config.widgetOptions);
+            this.widget.onClick(async () => {
+                await this.handleBugReport();
+            });
+        }
+    }
+    static init(config) {
+        if (!BugSpotter.instance) {
+            BugSpotter.instance = new BugSpotter(config);
+        }
+        return BugSpotter.instance;
+    }
+    static getInstance() {
+        return BugSpotter.instance || null;
+    }
+    /**
+     * Capture bug report data
+     * Note: Screenshot is captured for modal preview only (_screenshotPreview)
+     * Actual file uploads use presigned URLs (screenshotKey/replayKey set after upload)
+     */
+    async capture() {
+        var _a, _b;
+        const screenshotPreview = await this.screenshot.capture();
+        const replayEvents = (_b = (_a = this.domCollector) === null || _a === void 0 ? void 0 : _a.getEvents()) !== null && _b !== void 0 ? _b : [];
+        return {
+            console: this.console.getLogs(),
+            network: this.network.getRequests(),
+            metadata: this.metadata.capture(),
+            replay: replayEvents,
+            // Internal: screenshot preview for modal (not sent to API)
+            _screenshotPreview: screenshotPreview,
+        };
+    }
+    async handleBugReport() {
+        const report = await this.capture();
+        const modal = new BugReportModal({
+            onSubmit: async (data) => {
+                logger.log('Submitting bug:', Object.assign(Object.assign({}, data), { report }));
+                // Send to endpoint if configured
+                if (this.config.endpoint) {
+                    try {
+                        await this.submitBugReport(Object.assign(Object.assign({}, data), { report }));
+                        logger.log('Bug report submitted successfully');
+                    }
+                    catch (error) {
+                        logger.error('Failed to submit bug report:', error);
+                        // Re-throw to allow UI to handle errors if needed
+                        throw error;
+                    }
+                }
+            },
+        });
+        modal.show(report._screenshotPreview || '');
+    }
+    async submitBugReport(payload) {
+        if (!this.config.endpoint) {
+            throw new Error('No endpoint configured for bug report submission');
+        }
+        const contentHeaders = {
+            'Content-Type': 'application/json',
+        };
+        logger.warn(`Submitting bug report to ${this.config.endpoint}`);
+        let body;
+        try {
+            // Try to compress the payload
+            const originalSize = estimateSize(payload);
+            const compressed = await compressData(payload);
+            const compressedSize = compressed.byteLength;
+            const ratio = getCompressionRatio(originalSize, compressedSize);
+            logger.log(`Payload compression: ${(originalSize / 1024).toFixed(1)}KB → ${(compressedSize / 1024).toFixed(1)}KB (${ratio}% reduction)`);
+            // Use compression if it actually reduces size
+            if (compressedSize < originalSize) {
+                // Create a Blob from the compressed Uint8Array for proper binary upload
+                // Use Uint8Array constructor to ensure clean ArrayBuffer (no extra padding bytes)
+                body = new Blob([new Uint8Array(compressed)], { type: 'application/gzip' });
+                contentHeaders['Content-Encoding'] = 'gzip';
+                contentHeaders['Content-Type'] = 'application/gzip';
+            }
+            else {
+                body = JSON.stringify(payload);
+            }
+        }
+        catch (error) {
+            // Fallback to uncompressed if compression fails
+            logger.warn('Compression failed, sending uncompressed payload:', error);
+            body = JSON.stringify(payload);
+        }
+        // Determine auth configuration
+        const auth = this.config.auth;
+        // Submit with authentication, retry logic, and offline queue
+        const response = await submitWithAuth(this.config.endpoint, body, contentHeaders, {
+            auth,
+            retry: this.config.retry,
+            offline: this.config.offline,
+        });
+        logger.warn(`${JSON.stringify(response)}`);
+        if (!response.ok) {
+            const errorText = await response.text().catch(() => {
+                return 'Unknown error';
+            });
+            throw new Error(`Failed to submit bug report: ${response.status} ${response.statusText}. ${errorText}`);
+        }
+        return response.json().catch(() => {
+            return undefined;
+        });
+    }
+    getConfig() {
+        return Object.assign({}, this.config);
+    }
+    destroy() {
+        var _a, _b;
+        this.console.destroy();
+        this.network.destroy();
+        (_a = this.domCollector) === null || _a === void 0 ? void 0 : _a.destroy();
+        (_b = this.widget) === null || _b === void 0 ? void 0 : _b.destroy();
+        BugSpotter.instance = undefined;
+    }
+}
+export { ScreenshotCapture } from './capture/screenshot';
+export { ConsoleCapture } from './capture/console';
+export { NetworkCapture } from './capture/network';
+export { MetadataCapture } from './capture/metadata';
+// Export collector modules
+export { DOMCollector } from './collectors';
+// Export core utilities
+export { CircularBuffer } from './core/buffer';
+// Export compression utilities
+export { compressData, decompressData, compressImage, estimateSize, getCompressionRatio, } from './core/compress';
+// Export transport and authentication
+export { submitWithAuth, getAuthHeaders, clearOfflineQueue } from './core/transport';
+export { getLogger, configureLogger, createLogger } from './utils/logger';
+// Export upload utilities
+export { DirectUploader } from './core/uploader';
+export { compressReplayEvents, canvasToBlob, estimateCompressedReplaySize, isWithinSizeLimit, } from './core/upload-helpers';
+// Export sanitization utilities
+export { createSanitizer, Sanitizer } from './utils/sanitize';
+// Export pattern configuration utilities
+export { DEFAULT_PATTERNS, PATTERN_PRESETS, PATTERN_CATEGORIES, PatternBuilder, createPatternConfig, getPattern, getPatternsByCategory, validatePattern, } from './utils/sanitize';
+// Export widget components
+export { FloatingButton } from './widget/button';
+export { BugReportModal } from './widget/modal';
+/**
+ * Convenience function to sanitize text with default PII patterns
+ * Useful for quick sanitization without creating a Sanitizer instance
+ *
+ * @param text - Text to sanitize
+ * @returns Sanitized text with PII redacted
+ *
+ * @example
+ * ```typescript
+ * const sanitized = sanitize('Email: user@example.com');
+ * // Returns: 'Email: [REDACTED]'
+ * ```
+ */
+export function sanitize(text) {
+    const sanitizer = createSanitizer({
+        enabled: true,
+        patterns: 'all',
+        customPatterns: [],
+        excludeSelectors: [],
+    });
+    return sanitizer.sanitize(text);
+}