@jaak.ai/stamps 2.1.0-dev.8 → 2.1.0

package/dist/cjs/loader.cjs.js

@@ -1,11 +1,12 @@
 'use strict';
 
-var index = require('./index-BfhtOB0D.js');
+var index = require('./index-Ga0t6BMe.js');
+var appGlobals = require('./app-globals-V2Kpy_OQ.js');
 
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
-  await index.globalScripts();
-  return index.bootstrapLazy([["jaak-stamps.cjs",[[1,"jaak-stamps",{"debug":[4],"alignmentTolerance":[2,"alignment-tolerance"],"maskSize":[2,"mask-size"],"cropMargin":[2,"crop-margin"],"useDocumentClassification":[4,"use-document-classification"],"useDocumentDetector":[4,"use-document-detector"],"preferredCamera":[1,"preferred-camera"],"captureDelay":[2,"capture-delay"],"enableBackDocumentTimer":[4,"enable-back-document-timer"],"backDocumentTimerDuration":[2,"back-document-timer-duration"],"detectionBoxes":[32],"sideAlignment":[32],"isMaskReady":[32],"shouldMirrorVideo":[32],"showCameraSelector":[32],"isSwitchingCamera":[32],"hasDocumentDetected":[32],"cameraInfoWithAutofocus":[32],"currentStatus":[32],"performanceData":[32],"backDocumentTimerRemaining":[32],"showManualCaptureButton":[32],"performanceDegradedMode":[32],"showPerformanceMessage":[32],"captureStateVersion":[32],"processingButton":[32],"getCapturedImages":[64],"isProcessCompleted":[64],"startCapture":[64],"stopCapture":[64],"resetCapture":[64],"skipBackCapture":[64],"getStatus":[64],"preloadModel":[64],"getCameraInfo":[64],"setPreferredCamera":[64],"setCaptureDelay":[64],"getCaptureDelay":[64],"getResourceReport":[64],"forceResourceCleanup":[64]}]]]], options);
+  await appGlobals.globalScripts();
+  return index.bootstrapLazy([["jaak-stamps.cjs",[[257,"jaak-stamps",{"debug":[4],"alignmentTolerance":[2,"alignment-tolerance"],"maskSize":[2,"mask-size"],"cropMargin":[2,"crop-margin"],"useDocumentClassification":[4,"use-document-classification"],"useDocumentDetector":[4,"use-document-detector"],"preferredCamera":[1,"preferred-camera"],"captureDelay":[2,"capture-delay"],"enableBackDocumentTimer":[4,"enable-back-document-timer"],"backDocumentTimerDuration":[2,"back-document-timer-duration"],"detectionBoxes":[32],"sideAlignment":[32],"isMaskReady":[32],"shouldMirrorVideo":[32],"showCameraSelector":[32],"isSwitchingCamera":[32],"hasDocumentDetected":[32],"cameraInfoWithAutofocus":[32],"currentStatus":[32],"performanceData":[32],"backDocumentTimerRemaining":[32],"showManualCaptureButton":[32],"performanceDegradedMode":[32],"showPerformanceMessage":[32],"captureStateVersion":[32],"processingButton":[32],"getCapturedImages":[64],"isProcessCompleted":[64],"startCapture":[64],"stopCapture":[64],"resetCapture":[64],"skipBackCapture":[64],"getStatus":[64],"preloadModel":[64],"getCameraInfo":[64],"setPreferredCamera":[64],"setCaptureDelay":[64],"getCaptureDelay":[64]}]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/cjs/loader.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"loader.cjs.js","sources":["@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = async (win, options) => {\n  if (typeof window === 'undefined') return undefined;\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n};\n"],"names":["globalScripts","bootstrapLazy"],"mappings":";;;;AAGY,MAAC,oBAAoB,GAAG,OAAO,GAAG,EAAE,OAAO,KAAK;AAC5D,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,SAAS;AACrD,EAAE,MAAMA,mBAAa,EAAE;AACvB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D;;;;;"}
+{"version":3,"file":"loader.cjs.js","sources":["@lazy-external-entrypoint?app-data=conditional"],"sourcesContent":["export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\nexport const defineCustomElements = async (win, options) => {\n  if (typeof window === 'undefined') return undefined;\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n};\n"],"names":["globalScripts","bootstrapLazy"],"mappings":";;;;;AAGY,MAAC,oBAAoB,GAAG,OAAO,GAAG,EAAE,OAAO,KAAK;AAC5D,EAAE,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,OAAO,SAAS;AACrD,EAAE,MAAMA,wBAAa,EAAE;AACvB,EAAE,OAAOC,mBAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D;;;;;"}

package/dist/collection/collection-manifest.json

@@ -4,7 +4,7 @@
   ],
   "compiler": {
     "name": "@stencil/core",
-    "version": "4.33.1",
+    "version": "4.36.3",
     "typescriptVersion": "5.5.4"
   },
   "collections": [],

package/dist/collection/components/my-component/my-component.css

@@ -439,7 +439,7 @@ video {
   border-top: none;
   border-left: none;
   transform: rotate(45deg);
-  animation: drawCheck 0.4s ease-out 0.2s both;
+  /* animation: drawCheck 0.4s ease-out 0.2s both; */ /* Deshabilitado - check aparece completo */
 }
 
 .success-text {

package/dist/collection/components/my-component/my-component.js

@@ -71,6 +71,7 @@ export class JaakStamps {
     alignmentStartTime;
     alignmentTimer;
     backDocumentTimer;
+    orientationTimer;
     // Performance monitoring
     performanceMetrics = {
         fps: 0,
@@ -174,7 +175,7 @@ export class JaakStamps {
         if (!window.ort) {
             this.updateStatus('Preparando herramientas...', 'Configurando funciones de captura', 'initializing');
             const script = document.createElement('script');
-            script.src = 'https://cdn.jsdelivr.net/npm/onnxruntime-web/dist/ort.min.js';
+            script.src = 'https://cdn.jsdelivr.net/npm/onnxruntime-web@1.23.0/dist/ort.min.js';
             document.head.appendChild(script);
             await new Promise((resolve) => {
                 script.onload = () => {
@@ -255,6 +256,18 @@ export class JaakStamps {
             });
             resizeObserver.observe(this.detectionContainer.parentElement);
         }
+        // Handle mobile device orientation changes
+        window.addEventListener('orientationchange', () => {
+            // Clear any existing orientation timer
+            if (this.orientationTimer) {
+                clearTimeout(this.orientationTimer);
+            }
+            // Add delay to ensure video dimensions are updated after rotation
+            this.orientationTimer = window.setTimeout(() => {
+                this.handleResize();
+                this.orientationTimer = undefined;
+            }, 300);
+        });
     }
     handleResize() {
         if (this.detectionContainer) {
@@ -411,13 +424,7 @@ export class JaakStamps {
         }
         try {
             this.exitSession();
-            // Aggressive cleanup when stopping capture
-            const cleanupResult = await this.aggressiveResourceCleanup();
-            return {
-                success: true,
-                resourcesFreed: cleanupResult.freed,
-                cleanupErrors: cleanupResult.errors
-            };
+            return { success: true };
         }
         catch (error) {
             return { success: false, error: error.message };
@@ -642,60 +649,11 @@ export class JaakStamps {
         // Always allow getting capture delay, even during initialization
         return this.captureDelay;
     }
-    async getResourceReport() {
-        // Public method to get resource usage report
-        return this.getResourceReportInternal();
-    }
-    async forceResourceCleanup() {
-        // Public method to force aggressive resource cleanup
-        const readyCheck = this.isComponentReady();
-        if (!readyCheck.ready) {
-            return { success: false, error: readyCheck.message };
-        }
-        try {
-            const cleanupResult = await this.aggressiveResourceCleanup();
-            return {
-                success: true,
-                resourcesFreed: cleanupResult.freed,
-                errors: cleanupResult.errors,
-                timestamp: new Date().toISOString()
-            };
-        }
-        catch (error) {
-            return { success: false, error: error.message };
-        }
-    }
     // Memory and device capability detection
     checkDeviceCapabilities() {
         const deviceMemory = navigator.deviceMemory;
-        const hardwareConcurrency = navigator.hardwareConcurrency || 1;
-        const isLowEndDevice = hardwareConcurrency <= 2;
-        const isMobile = /Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
-        const isSafari = /Safari/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent);
-        // Si tenemos info de memoria del dispositivo
-        if (deviceMemory && deviceMemory < 4) {
-            return {
-                canUseML: false,
-                reason: `Memoria del dispositivo (${deviceMemory}GB) insuficiente para detección automática. Modo manual activado para mejor rendimiento.`,
-                memoryMB: deviceMemory * 1024
-            };
-        }
-        // Dispositivos móviles de gama baja
-        if (isMobile && isLowEndDevice) {
-            return {
-                canUseML: false,
-                reason: 'Dispositivo móvil optimizado detectado. Modo manual activado para mejor rendimiento y duración de batería.',
-                memoryMB: null
-            };
-        }
-        // Safari tiene limitaciones conocidas con WASM
-        if (isSafari) {
-            return {
-                canUseML: false,
-                reason: 'Safari detectado. Modo manual activado por compatibilidad optimizada con este navegador.',
-                memoryMB: null
-            };
-        }
+        // Siempre intentar usar ML, independientemente del dispositivo
+        // Las restricciones anteriores no eran confiables
         return {
             canUseML: true,
             reason: 'Dispositivo compatible con detección automática.',
@@ -821,6 +779,12 @@ export class JaakStamps {
                 this.videoRef.onloadedmetadata = async () => {
                     await this.videoRef.play();
                     this.stateManager.updateCaptureState({ isVideoActive: true });
+                    // Recalculate mask dimensions when new camera stream loads
+                    if (this.detectionContainer) {
+                        const container = this.detectionContainer.parentElement;
+                        const rect = container.getBoundingClientRect();
+                        this.updateMaskDimensions(rect);
+                    }
                     resolve();
                 };
             });
@@ -992,6 +956,10 @@ export class JaakStamps {
             clearTimeout(this.alignmentTimer);
             this.alignmentTimer = undefined;
         }
+        if (this.orientationTimer) {
+            clearTimeout(this.orientationTimer);
+            this.orientationTimer = undefined;
+        }
         // Liberar recursos de ONNX al limpiar el componente
         this.releaseOnnxResources();
         if (this.performanceUpdateInterval) {
@@ -1000,182 +968,11 @@ export class JaakStamps {
         }
         // Clear canvas pool
         this.canvasPool = [];
-        // Clean DOM references and memory leaks
-        this.cleanupDOMReferences();
         this.detectionBoxes = [];
         this.alignmentStartTime = undefined;
         this.hasDocumentDetected = false;
         this.serviceContainer?.cleanup();
     }
-    // AGGRESSIVE RESOURCE CLEANUP METHODS
-    // Clean DOM references and memory leaks
-    cleanupDOMReferences() {
-        // Remove event listeners that could maintain references
-        if (this.videoRef) {
-            // Remove common event listeners (if any were added)
-            this.videoRef.srcObject = null;
-            this.videoRef = undefined;
-        }
-        // Clean detection container
-        if (this.detectionContainer) {
-            this.detectionContainer = undefined;
-        }
-        // Clean references to images in the DOM and revoke blob URLs
-        const images = this.el.shadowRoot?.querySelectorAll('img');
-        images?.forEach(img => {
-            if (img.src.startsWith('blob:')) {
-                URL.revokeObjectURL(img.src);
-            }
-            img.src = '';
-        });
-    }
-    // Clear browser cache and storage
-    async clearBrowserCache() {
-        try {
-            // 1. Clear Service Worker cache if exists
-            if ('serviceWorker' in navigator) {
-                const registrations = await navigator.serviceWorker.getRegistrations();
-                await Promise.all(registrations.map(registration => registration.unregister()));
-            }
-            // 2. Clear Cache API specific to the component
-            const cacheNames = await caches.keys();
-            const componentCaches = cacheNames.filter(name => name.includes('jaak') || name.includes('stamps'));
-            await Promise.all(componentCaches.map(cacheName => caches.delete(cacheName)));
-            // 3. Force garbage collection if available (only in dev)
-            if (this.debug && window.gc) {
-                window.gc();
-            }
-        }
-        catch (error) {
-            console.warn('Error clearing browser cache:', error);
-        }
-    }
-    // Clear local storage specific to the component
-    async clearLocalStorage() {
-        try {
-            // Clear localStorage specific to the component
-            const keysToRemove = [];
-            for (let i = 0; i < localStorage.length; i++) {
-                const key = localStorage.key(i);
-                if (key && (key.includes('jaak') || key.includes('onnx') || key.includes('stamps'))) {
-                    keysToRemove.push(key);
-                }
-            }
-            keysToRemove.forEach(key => localStorage.removeItem(key));
-            // Clear sessionStorage
-            const sessionKeysToRemove = [];
-            for (let i = 0; i < sessionStorage.length; i++) {
-                const key = sessionStorage.key(i);
-                if (key && (key.includes('jaak') || key.includes('onnx'))) {
-                    sessionKeysToRemove.push(key);
-                }
-            }
-            sessionKeysToRemove.forEach(key => sessionStorage.removeItem(key));
-        }
-        catch (error) {
-            console.warn('Error clearing local storage:', error);
-        }
-    }
-    // Aggressive resource cleanup combining all strategies
-    async aggressiveResourceCleanup() {
-        const freed = [];
-        const errors = [];
-        try {
-            // 1. Release ONNX resources
-            this.releaseOnnxResources();
-            freed.push('ONNX models');
-            // 2. Clear model cache in detection service
-            if (this.detectionService) {
-                await this.detectionService.clearModelCache();
-                freed.push('Model cache');
-            }
-            // 3. Clear browser cache
-            await this.clearBrowserCache();
-            freed.push('Browser cache');
-            // 4. Clear local storage
-            await this.clearLocalStorage();
-            freed.push('Local storage');
-            // 5. Clean DOM references
-            this.cleanupDOMReferences();
-            freed.push('DOM references');
-            // 6. Optimize canvas pools
-            if (this.detectionService) {
-                this.detectionService.optimizeCanvasPool(0);
-                freed.push('Canvas pools');
-            }
-            // 7. Clear component canvas pool
-            this.canvasPool = [];
-            freed.push('Component canvas pool');
-            // 8. Force garbage collection (if available)
-            if (this.debug && window.gc) {
-                window.gc();
-                freed.push('Garbage collection');
-            }
-        }
-        catch (error) {
-            errors.push(error.message);
-        }
-        return { freed, errors };
-    }
-    // Progressive resource release after front capture
-    async onFrontCaptureComplete() {
-        try {
-            // Release classification model if not needed for back
-            if (this.detectionService && !this.useDocumentClassification) {
-                await this.detectionService.releaseMobileNetResources();
-            }
-            // Optimize canvas pool to minimum needed for back capture
-            if (this.detectionService) {
-                this.detectionService.optimizeCanvasPool(1);
-            }
-            // Reduce component canvas pool
-            while (this.canvasPool.length > 1) {
-                const canvas = this.canvasPool.pop();
-                if (canvas) {
-                    const ctx = canvas.getContext('2d');
-                    if (ctx) {
-                        ctx.clearRect(0, 0, canvas.width, canvas.height);
-                    }
-                }
-            }
-            if (this.debug) {
-                console.log('🧹 Progressive cleanup after front capture completed');
-            }
-        }
-        catch (error) {
-            console.warn('Error in progressive cleanup:', error);
-        }
-    }
-    // Resource reporting for debugging
-    getResourceReportInternal() {
-        const report = {
-            timestamp: new Date().toISOString(),
-            component: {
-                hasVideoStream: !!this.videoStream,
-                hasAnimationFrame: !!this.animationId,
-                canvasPoolSize: this.canvasPool.length,
-                detectionBoxesCount: this.detectionBoxes.length,
-                performanceMonitorActive: !!this.performanceUpdateInterval
-            }
-        };
-        // Add detection service stats if available
-        if (this.detectionService) {
-            report.detectionService = {
-                isModelLoaded: this.detectionService.isModelLoaded(),
-                canvasPoolStats: this.detectionService.getPoolStats()
-            };
-        }
-        // Add memory info if available
-        if ('memory' in performance) {
-            const memInfo = performance.memory;
-            report.memory = {
-                usedJSHeapSize: Math.round(memInfo.usedJSHeapSize / 1048576), // MB
-                totalJSHeapSize: Math.round(memInfo.totalJSHeapSize / 1048576), // MB
-                jsHeapSizeLimit: Math.round(memInfo.jsHeapSizeLimit / 1048576) // MB
-            };
-        }
-        return report;
-    }
     render() {
         const captureState = this.stateManager?.getCaptureState() || {
             isVideoActive: false,
@@ -1186,7 +983,7 @@ export class JaakStamps {
             isCapturing: false
         };
         const cameraInfo = this.cameraInfoWithAutofocus;
-        return (h("div", { key: 'ca44b9eacbde9f688f2c41aa21ad35a2b882002b', class: "detector-container" }, h("div", { key: '86c7b5d31ed69276b62fa43e01c92b0c0b9f298d', class: "video-container" }, h("video", { key: 'bb310544c17ae734d8b42ed2617748c2f69743ff', ref: el => this.videoRef = el, autoplay: true, muted: true, playsinline: true, class: this.shouldMirrorVideo ? 'mirror' : '', style: { display: captureState.isVideoActive ? 'block' : 'none' } }), h("div", { key: '078a79a0c6386ca6c040e629acbf4f52f12d8e29', ref: el => this.detectionContainer = el, class: `detection-overlay ${this.shouldMirrorVideo ? 'mirror' : ''}` }, this.debug && this.detectionBoxes.map((box, index) => (h("div", { key: index, class: "detection-box", style: {
+        return (h("div", { key: 'f9cbca2fd6b8548a29ace7fcb972b53f402f61af', class: "detector-container" }, h("div", { key: '4f3cac734eb6bfd44a8de644eadca17e7893e11a', class: "video-container" }, h("video", { key: '5e15a38c989a72d5274281272d41ba064447ca6f', ref: el => this.videoRef = el, autoplay: true, muted: true, playsinline: true, class: this.shouldMirrorVideo ? 'mirror' : '', style: { display: captureState.isVideoActive ? 'block' : 'none' } }), h("div", { key: '38c8ad8b691db60e9b5a2a8b641fe6febbeacfca', ref: el => this.detectionContainer = el, class: `detection-overlay ${this.shouldMirrorVideo ? 'mirror' : ''}` }, this.debug && this.detectionBoxes.map((box, index) => (h("div", { key: index, class: "detection-box", style: {
                 position: 'absolute',
                 left: `${box.x}px`,
                 top: `${box.y}px`,
@@ -1195,9 +992,9 @@ export class JaakStamps {
                 border: '2px solid #32406C',
                 pointerEvents: 'none',
                 boxSizing: 'border-box'
-            } })))), this.isMaskReady && (h("div", { key: '990015ff5b2ded89405dd2b891c027aad8788f3e', class: "overlay-mask" }, h("div", { key: 'dd9145140987addb1b6e4cc2119b8e9f89003726', class: "card-outline" }, h("div", { key: 'e8f4ec692a8b80c7a98075e4f708b79a272db67b', class: "side side-top" }), h("div", { key: '2577253b40425ecdcb3dd51b2f4a43c15c83ca79', class: "side side-right" }), h("div", { key: '30f4454020c00cf4fb92308af5ecf1843ec24005', class: "side side-bottom" }), h("div", { key: '3459f634987b8396106fff23fa1c99b295ee7d0a', class: "side side-left" })), !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '84f4d70947e211a9c6b296531d53420223d2ca34', class: `guide-text ${this.showPerformanceMessage ? 'performance-warning-text' : ''}` }, this.getGuideText(captureState.step))), captureState.step === 'back' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '7c28e86e8de6c33bf7d7baab3083c5f6a0ab060f', class: "back-capture-section" }, h("div", { key: '27bdcf9cfe9790c4bbad484423f6f4c353ccf0b3', class: "back-capture-buttons" }, (!this.useDocumentDetector || this.performanceDegradedMode) && (h("button", { key: 'ed0320b1df412bf53cbe4e4119f6d769926eb2c5', class: "capture-button primary-button", onClick: () => this.takeManualScreenshot(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'capture-back' && (h("span", { key: '0bba706c8ebda59c33faca8e97b7536146462d21', class: "button-spinner" })), "Capturar Reverso")), h("button", { key: 'b072c46b25d16a04c5e0a8f3975d8aa8d24576d5', class: "skip-button", onClick: () => this.skipBackCapture(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'skip-back' && (h("span", { key: 'efd0827d0f19c9072d49d1b3c0046ef6c95a842c', class: "button-spinner" })), this.enableBackDocumentTimer && this.backDocumentTimerRemaining > 0
+            } })))), this.isMaskReady && (h("div", { key: 'c56fde56b7a86a4e8a4cf558745291ea5cde12fd', class: "overlay-mask" }, h("div", { key: '04ed3f01f271dc84eed594cb4b60c2453645bd41', class: "card-outline" }, h("div", { key: '648bd423a5e886d4768115237de5896c7223b30b', class: "side side-top" }), h("div", { key: 'b8878059493ca61961b9b3c82ecc18b50b79ac85', class: "side side-right" }), h("div", { key: '09e5ad64ff33dbd5c112bf52b71e14409ab6aa65', class: "side side-bottom" }), h("div", { key: 'b8ba3d83c9bc1b4a0da859d7ed4b9a15eaddcc2a', class: "side side-left" })), !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '3279701a240f77ac96e68a34ad95c099340c9a6a', class: `guide-text ${this.showPerformanceMessage ? 'performance-warning-text' : ''}` }, this.getGuideText(captureState.step))), captureState.step === 'back' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '2adf96d0a57e482372fd9586229dac2301b64fd4', class: "back-capture-section" }, h("div", { key: '305a147c9cfee854c60ac946a48a1d21b2792725', class: "back-capture-buttons" }, (!this.useDocumentDetector || this.performanceDegradedMode || this.showManualCaptureButton) && (h("button", { key: '43270a0647f39307229c540dd5130fb58b1ff4fb', class: "capture-button primary-button", onClick: () => this.takeManualScreenshot(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'capture-back' && (h("span", { key: 'eb4666603774564eef95a120ac13faeb9e10c8b4', class: "button-spinner" })), "Capturar Reverso")), h("button", { key: 'cac667d9548ae2314ad5a677c5ed90f25184f728', class: "skip-button", onClick: () => this.skipBackCapture(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'skip-back' && (h("span", { key: '0af7aa4106ce189ae2d79bec78ede01abe25b1e7', class: "button-spinner" })), this.enableBackDocumentTimer && this.backDocumentTimerRemaining > 0
             ? `Saltar reverso (${this.backDocumentTimerRemaining}s)`
-            : 'Saltar reverso')))), captureState.isVideoActive && (h("div", { key: 'bd0303e8ce85211e4c68fc3cd79545db7c74288b', class: "camera-controls" }, h("button", { key: 'e4327d260b988b67e0de3654c72f24455cd3bbbd', class: `camera-selector-button ${this.isSwitchingCamera ? 'loading' : ''}`, onClick: () => this.toggleCameraSelector(), type: "button", title: "Seleccionar c\u00E1mara", disabled: this.isSwitchingCamera }, this.isSwitchingCamera ? (h("div", { class: "button-spinner" })) : ('Cámaras')))), this.showCameraSelector && cameraInfo.availableCameras.length > 0 && (h("div", { key: '35da16baf4c62466c2a66650209a1daf842c0db2', class: "camera-selector-dropdown" }, h("div", { key: '7035dd0e22f614cf239a015c6d59531b68fa74a9', class: "camera-selector-header" }, h("span", { key: 'ae026f31931f52ea0daf72391a9de4ff9e4b88f1' }, "Seleccionar C\u00E1mara"), h("button", { key: '40f2ba0770bafea71fedbf849938010e743be776', class: "close-selector", onClick: () => this.toggleCameraSelector(), type: "button" }, "\u00D7")), h("div", { key: '6f26927094a724a35ebb07ef701caf14f296a837', class: "camera-list" }, cameraInfo.availableCameras.map((camera) => (h("button", { key: camera.id, class: `camera-option ${cameraInfo.selectedCameraId === camera.id ? 'selected' : ''}`, onClick: () => this.handleCameraSwitch(camera.id), type: "button" }, h("span", { class: "camera-label" }, camera.label || `Cámara ${cameraInfo.availableCameras.indexOf(camera) + 1}`, camera.hasAutofocus && (h("span", { class: "autofocus-icon", title: "Autofoco disponible" }, "\u29BF"))), cameraInfo.selectedCameraId === camera.id && (h("span", { class: "selected-indicator" }, "\u2713")))))), h("div", { key: '082236981c369f8fd487f036439b16e6560514be', class: "device-info" }, h("small", { key: 'ccbbfa0bca96395f574bda71103338ae9226f709' }, "Dispositivo: ", cameraInfo.deviceType)))), this.showManualCaptureButton && captureState.step === 'front' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '6baa487409503777e90453b39fd30649941cbbe4', class: "manual-capture-section" }, h("button", { key: '893f4715ca3315613f779603f178459955f686f0', class: "manual-capture-button", onClick: () => this.takeManualScreenshot(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'capture-front' && (h("span", { key: '7c30b680fe84f4c8227beba45d8416f1edb8348f', class: "button-spinner" })), "Capturar Frente"))))), captureState.isCapturing && (h("div", { key: 'd8ef052cf67d7bda4b3534febf96efa2cdcc6bf7', class: "capture-animation" })), captureState.showFlipAnimation && (h("div", { key: '3dae7634e770dda2655b1042ec8fb997b3cb2220', class: "flip-animation" }, h("div", { key: 'a977fc5e889369121bacc06cf5213dfee39d858d', class: "id-card-icon" }), h("div", { key: '4f052cdc8c7b493cddce90e108e976325c9bab8e', class: "flip-text" }, "\u00A1Voltea tu identificaci\u00F3n!"))), captureState.showSuccessAnimation && (h("div", { key: '5117cd6e63e1e0763c1503f6f60f3c7ef60dd665', class: "success-animation" }, h("div", { key: 'd11128c45c7118915cc0dd9c25845bb55b4b3eb2', class: "check-icon" }), h("div", { key: '693e197bf8a4c91ac7ddedb457d15aa3aa46a5d5', class: "success-text" }, "\u00A1Proceso completado!"))), h("div", { key: '89caaa9d78eb522e0fadfd1c0e844e05d29b8286', class: `component-status status-${this.currentStatus.type}` }, (this.currentStatus.type === 'loading' || this.currentStatus.type === 'initializing') && (h("div", { key: '3f41d40b05b71e13e7e1d0c0e980b48308cba9d6', class: "status-spinner" })), h("div", { key: '8674480928f4f4a77099c0600ed84f0e27903379', class: "status-content" }, h("div", { key: 'e88f4044ab8115a6a5cbb78cc4030975eef9149a', class: "status-message" }, this.currentStatus.message), this.currentStatus.description && (h("div", { key: 'ad581e42c30c304b837711549148c11b801dee5e', class: "status-description" }, this.currentStatus.description)))), this.debug && (h("div", { key: '1b371c1b47f3ba699885db00fef52eb448f9e245', class: "performance-monitor" }, h("div", { key: '8b9ac60449a15e9fb966c329b2e6c9285c0228c0', class: "performance-expanded" }, h("div", { key: '760c11a3ed28e248a144d53a92fd8adee6822ff2', class: "metrics-row" }, h("div", { key: '858ab8b106f1d12210e4e15c423ab3bab11bdb60', class: "metric-compact" }, h("span", { key: '65fe2479c3822d99452e7e5faa93c25a80765024', class: "metric-label" }, "FPS"), h("span", { key: '9faf7763d1284a6f3c1e15fb0f3c99f1d45bb4dc', class: `metric-value ${this.performanceData.fps < 15 ? 'warning' : this.performanceData.fps < 10 ? 'danger' : 'good'}` }, this.performanceData.fps)), h("div", { key: 'c95ed8fa8101f42bfba5cc8ca7debbad028caf42', class: "metric-compact" }, h("span", { key: '3555b3778cb71e959d132d6aa563f58f757915d8', class: "metric-label" }, "MEM"), h("span", { key: 'd72b0491147a6f80dcf33f5d72dd8dae5898f44a', class: `metric-value ${this.performanceData.memoryUsage > 100 ? 'warning' : this.performanceData.memoryUsage > 200 ? 'danger' : 'good'}` }, this.performanceData.memoryUsage, "MB"))), h("div", { key: 'cd4dc81f28f9e59a36a0295dde7bfee89f50d3e2', class: "metrics-row" }, h("div", { key: 'c43d8624c5da256ce3e97f67b022bdd98fb04e07', class: "metric-compact" }, h("span", { key: 'adb402d83809a90580b81544f31b5331bdff59dd', class: "metric-label" }, "INF"), h("span", { key: 'e48c9814c08acbe321460a29e42cb49b0eab38ff', class: `metric-value ${this.performanceData.inferenceTime > 100 ? 'warning' : this.performanceData.inferenceTime > 200 ? 'danger' : 'good'}` }, this.performanceData.inferenceTime, "ms")), h("div", { key: '71517f9279e9a6aa0d5b02e2169db868ca3fb676', class: "metric-compact" }, h("span", { key: '3ddbcc56b137aea702a40f900178e8e16efd146e', class: "metric-label" }, "FRAME"), h("span", { key: 'd3a70afb511d3f72b485b3a1cb922876faa62b11', class: `metric-value ${this.performanceData.frameProcessingTime > 50 ? 'warning' : this.performanceData.frameProcessingTime > 100 ? 'danger' : 'good'}` }, this.performanceData.frameProcessingTime, "ms"))), h("div", { key: 'a3b62cdbe830b1024ab96f7fb726825df24fecdc', class: "metrics-row" }, h("div", { key: '95471e5cdde748d1ce6bdee3540740dd3aa66865', class: "metric-compact" }, h("span", { key: 'c93e01c0bdc67621c3a666357d2477b7a5275d52', class: "metric-label" }, "DET"), h("span", { key: 'ef33c86a83101b0989b14c7f1ab0ce0b331b397f', class: "metric-value good" }, this.performanceData.successfulDetections, "/", this.performanceData.totalDetections)), h("div", { key: 'e14d56128bf96337e4c3859f8e4003e001e8e953', class: "metric-compact" }, h("span", { key: '8aa828632f0a977a27ed377f103bb8d5e7e0ed1a', class: "metric-label" }, "RATE"), h("span", { key: '59035c473b5a747a27f774e2554322a084b6d19f', class: `metric-value ${this.performanceData.detectionRate < 30 ? 'danger' : this.performanceData.detectionRate < 60 ? 'warning' : 'good'}` }, this.performanceData.detectionRate, "%")))))), h("div", { key: '4d0c2de00954416faac30ab622fb21f36c932aca', class: "watermark" }, h("img", { key: 'd8f775428ebb3ba86a943ca73b074db2180d0c29', src: "https://storage.googleapis.com/jaak-static/commons/powered-by-jaak.png", alt: "Powered by Jaak" })))));
+            : 'Saltar reverso')))), captureState.isVideoActive && (h("div", { key: 'de6e5c4fad4d4d996b894457c9af52bc71e533fb', class: "camera-controls" }, h("button", { key: 'cfddcf2420d5f5923a6b02ca446bbe1b8e9fc5e4', class: `camera-selector-button ${this.isSwitchingCamera ? 'loading' : ''}`, onClick: () => this.toggleCameraSelector(), type: "button", title: "Seleccionar c\u00E1mara", disabled: this.isSwitchingCamera }, this.isSwitchingCamera ? (h("div", { class: "button-spinner" })) : ('Cámaras')))), this.showCameraSelector && cameraInfo.availableCameras.length > 0 && (h("div", { key: '5fb73f958b9a5a6f9242032c4530b0bdab84f6c5', class: "camera-selector-dropdown" }, h("div", { key: '8ee2d26b1001e571e7b6c326e927926fa08287fd', class: "camera-selector-header" }, h("span", { key: '78350b0fb1bd933f7c8c59d8dab0b7122ffbe363' }, "Seleccionar C\u00E1mara"), h("button", { key: 'bb750e0ddd5a1ee5ff96bd57805a7f90b8821e9f', class: "close-selector", onClick: () => this.toggleCameraSelector(), type: "button" }, "\u00D7")), h("div", { key: 'd0f6343cf1b7367f3da33ec8cf64891109d923b8', class: "camera-list" }, cameraInfo.availableCameras.map((camera) => (h("button", { key: camera.id, class: `camera-option ${cameraInfo.selectedCameraId === camera.id ? 'selected' : ''}`, onClick: () => this.handleCameraSwitch(camera.id), type: "button" }, h("span", { class: "camera-label" }, camera.label || `Cámara ${cameraInfo.availableCameras.indexOf(camera) + 1}`, camera.hasAutofocus && (h("span", { class: "autofocus-icon", title: "Autofoco disponible" }, "\u29BF"))), cameraInfo.selectedCameraId === camera.id && (h("span", { class: "selected-indicator" }, "\u2713")))))), h("div", { key: 'c9642fbfb0acea766d3f0542f4cc9f17f4af4d7b', class: "device-info" }, h("small", { key: 'b6e9507ff7addf011f339f6c22a88a96b40db68a' }, "Dispositivo: ", cameraInfo.deviceType)))), this.showManualCaptureButton && captureState.step === 'front' && !captureState.showFlipAnimation && !captureState.showSuccessAnimation && (h("div", { key: '04ae9262409284782850b90945eb7038673e2097', class: "manual-capture-section" }, h("button", { key: '27c315e503ccba468b89ebd58d6b70f40ddd06ba', class: "manual-capture-button", onClick: () => this.takeManualScreenshot(), type: "button", disabled: this.processingButton !== null }, this.processingButton === 'capture-front' && (h("span", { key: '8f2dcd2df9a218b37eb0b8204a8724362cfeaa53', class: "button-spinner" })), "Capturar Frente"))))), captureState.isCapturing && (h("div", { key: '6fd6fe1d0213b01c8119a67fb8108f73227feee1', class: "capture-animation" })), captureState.showFlipAnimation && (h("div", { key: 'fba3816b48b99ca64510ecbefc0d41431569c9ae', class: "flip-animation" }, h("div", { key: 'beea1c8245b5d81f1008efc6d1b079a61c821e7f', class: "id-card-icon" }), h("div", { key: 'f0fbc34f619a653e2c0ade764ca99e7aa582d157', class: "flip-text" }, "\u00A1Voltea tu identificaci\u00F3n!"))), captureState.showSuccessAnimation && (h("div", { key: 'e4a0e6d31112e3a50024d1d0430b4ad997049fe7', class: "success-animation" }, h("div", { key: '5dd3f781f55630bc904c81207548ae35bc79b452', class: "check-icon" }), h("div", { key: 'a10ebc557582325091efb0abd12d62b27a43b98c', class: "success-text" }, "\u00A1Proceso completado!"))), h("div", { key: '975865955dee1803b5215ecf049701c98b324855', class: `component-status status-${this.currentStatus.type}` }, (this.currentStatus.type === 'loading' || this.currentStatus.type === 'initializing') && (h("div", { key: '84f6f67202e26ce80f7fc5d5f321e23b5bc55c57', class: "status-spinner" })), h("div", { key: 'a1ae56ed156e8feb279a1bf160f749c5d0b5ce45', class: "status-content" }, h("div", { key: 'd62932554cea257ce19763df26e0ba702e50eeca', class: "status-message" }, this.currentStatus.message), this.currentStatus.description && (h("div", { key: 'c5506fa12dd0d37d26dc26c9f2381c843330451f', class: "status-description" }, this.currentStatus.description)))), this.debug && (h("div", { key: '2097eda63185f336f7319014fae2ef6db1e41761', class: "performance-monitor" }, h("div", { key: 'd611c494c6b1a5930ef64aebdcba41e5d94c9ee6', class: "performance-expanded" }, h("div", { key: '800d46831e7b9bec260d9c5e67ea1a3eb9c2933e', class: "metrics-row" }, h("div", { key: 'dd0db1faa9050d98e71da4b5cd26a4a484c37c64', class: "metric-compact" }, h("span", { key: 'f0e6ea61a35ddb2ae5c2a6aff8c255a02c5c1219', class: "metric-label" }, "FPS"), h("span", { key: 'cbf4df4d142f6f01e45f566a8ede8fbbf29ad673', class: `metric-value ${this.performanceData.fps < 15 ? 'warning' : this.performanceData.fps < 10 ? 'danger' : 'good'}` }, this.performanceData.fps)), h("div", { key: '83861ad31fa46c8199a5583e4b3f8eefd44bacd6', class: "metric-compact" }, h("span", { key: '41b8de4cda47959dfc9df393e95fdadde534dd21', class: "metric-label" }, "MEM"), h("span", { key: 'b268f13cc78066e240ed158f1443113a94827aff', class: `metric-value ${this.performanceData.memoryUsage > 100 ? 'warning' : this.performanceData.memoryUsage > 200 ? 'danger' : 'good'}` }, this.performanceData.memoryUsage, "MB"))), h("div", { key: '9f9a9d0690906b186492af23b900c5fa0f5cff89', class: "metrics-row" }, h("div", { key: '84fa6e453dc36e4a74e8b573447b17230766229e', class: "metric-compact" }, h("span", { key: 'f17d52899090c89f532d74c552dd8c5338fc2d83', class: "metric-label" }, "INF"), h("span", { key: '2beca0d7ce55ed574f6b01efc086c5846983e024', class: `metric-value ${this.performanceData.inferenceTime > 100 ? 'warning' : this.performanceData.inferenceTime > 200 ? 'danger' : 'good'}` }, this.performanceData.inferenceTime, "ms")), h("div", { key: '981e300cf076e81bfe946974f6cffd63619eacde', class: "metric-compact" }, h("span", { key: '3dfb0c996a69eb87b0f711322675cad69c471146', class: "metric-label" }, "FRAME"), h("span", { key: '3ae2ac6e90cda77f23e559f3197c3b761f9bdc40', class: `metric-value ${this.performanceData.frameProcessingTime > 50 ? 'warning' : this.performanceData.frameProcessingTime > 100 ? 'danger' : 'good'}` }, this.performanceData.frameProcessingTime, "ms"))), h("div", { key: '2c51216838d87728d9d7764e5ba8a50fa02eb493', class: "metrics-row" }, h("div", { key: 'eda810ffb80ec38ab84583f59b26706f90a50fc9', class: "metric-compact" }, h("span", { key: '978ba9c0c67d6da6b29b3535af33a314bab9276a', class: "metric-label" }, "DET"), h("span", { key: '3e5e169fd4a3906283d8f918b5bbc7c5df6ccd0f', class: "metric-value good" }, this.performanceData.successfulDetections, "/", this.performanceData.totalDetections)), h("div", { key: 'b4b915c745e35c09470a4dc5edfc112d32cfb8b6', class: "metric-compact" }, h("span", { key: '3e2a7b88a4446813c955efb0dfa9e2958e8e1448', class: "metric-label" }, "RATE"), h("span", { key: 'f4f073f7ee622167a241c6a1c535ef580c13d9ab', class: `metric-value ${this.performanceData.detectionRate < 30 ? 'danger' : this.performanceData.detectionRate < 60 ? 'warning' : 'good'}` }, this.performanceData.detectionRate, "%")))))), h("div", { key: '76c556e92f6d7980539f1a30efe8751f665164fb', class: "watermark" }, h("img", { key: 'af23e115d6b4e92a72e55d6d98fde0e4b1d09e9b', src: "https://storage.googleapis.com/jaak-static/commons/powered-by-jaak.png", alt: "Powered by Jaak" })))));
     }
     // Utility methods
     updateDetectionBoxes(boxes) {
@@ -1394,8 +1191,8 @@ export class JaakStamps {
         if (captureState.step === 'front') {
             this.stateManager.setCapturedImages({
                 front: {
-                    fullFrame: captureCanvas.toDataURL('image/png'),
-                    cropped: croppedCanvas.toDataURL('image/png')
+                    fullFrame: captureCanvas.toDataURL('image/jpeg'),
+                    cropped: croppedCanvas.toDataURL('image/jpeg')
                 }
             });
             // Check if document classification is enabled (independent of detector)
@@ -1421,8 +1218,6 @@ export class JaakStamps {
                 showFlipAnimation: true
             });
             this.triggerRerender();
-            // Progressive resource cleanup after front capture
-            await this.onFrontCaptureComplete();
             setTimeout(() => {
                 this.stateManager.updateCaptureState({
                     showFlipAnimation: false,
@@ -1437,8 +1232,8 @@ export class JaakStamps {
         else if (captureState.step === 'back') {
             this.stateManager.setCapturedImages({
                 back: {
-                    fullFrame: captureCanvas.toDataURL('image/png'),
-                    cropped: croppedCanvas.toDataURL('image/png')
+                    fullFrame: captureCanvas.toDataURL('image/jpeg'),
+                    cropped: croppedCanvas.toDataURL('image/jpeg')
                 }
             });
             this.completeProcess(false);
@@ -1476,8 +1271,8 @@ export class JaakStamps {
         if (captureState.step === 'front') {
             this.stateManager.setCapturedImages({
                 front: {
-                    fullFrame: captureCanvas.toDataURL('image/png'),
-                    cropped: croppedCanvas.toDataURL('image/png')
+                    fullFrame: captureCanvas.toDataURL('image/jpeg'),
+                    cropped: croppedCanvas.toDataURL('image/jpeg')
                 }
             });
             // Check if document classification is enabled
@@ -1498,8 +1293,6 @@ export class JaakStamps {
                 isDetectionPaused: true,
                 showFlipAnimation: true
             });
-            // Progressive resource cleanup after front capture
-            await this.onFrontCaptureComplete();
             setTimeout(() => {
                 this.stateManager.updateCaptureState({
                     showFlipAnimation: false,
@@ -1511,8 +1304,8 @@ export class JaakStamps {
         else if (captureState.step === 'back') {
             this.stateManager.setCapturedImages({
                 back: {
-                    fullFrame: captureCanvas.toDataURL('image/png'),
-                    cropped: croppedCanvas.toDataURL('image/png')
+                    fullFrame: captureCanvas.toDataURL('image/jpeg'),
+                    cropped: croppedCanvas.toDataURL('image/jpeg')
                 }
             });
             this.completeProcess(false);
@@ -1638,10 +1431,13 @@ export class JaakStamps {
         this.useDocumentDetector = false; // Desactivar detector automático
         // Actualizar el estado con mensaje de error
         this.updateStatus('Modo manual activado', errorMessage, 'error');
-        // Ocultar mensaje después de 5 segundos
-        setTimeout(() => {
-            this.updateStatus('Captura manual', 'Use el botón para capturar', 'ready');
-        }, 5000);
+        // Continuar con la configuración de cámara para mostrar el video
+        this.continueWithCameraSetup().catch(() => {
+            // Si falla la configuración de cámara, mantener el mensaje de error pero cambiar el estado
+            setTimeout(() => {
+                this.updateStatus('Captura manual', 'Use el botón para capturar', 'ready');
+            }, 5000);
+        });
     }
     stopPerformanceMonitoring() {
         // Nota: No necesitamos limpiar más variables porque ya no se usarán
@@ -1677,16 +1473,6 @@ export class JaakStamps {
         setTimeout(() => {
             this.stateManager.updateCaptureState({ showSuccessAnimation: false });
         }, 3000);
-        // Aggressive cleanup after process completion with delay
-        setTimeout(async () => {
-            const cleanupResult = await this.aggressiveResourceCleanup();
-            if (this.debug) {
-                console.log('🧹 Post-completion cleanup:', cleanupResult.freed);
-                if (cleanupResult.errors.length > 0) {
-                    console.warn('⚠️ Cleanup errors:', cleanupResult.errors);
-                }
-            }
-        }, 1000); // Wait 1 second after completion
     }
     stopDetection() {
         if (this.animationId) {
@@ -1738,6 +1524,12 @@ export class JaakStamps {
         try {
             // Close the selector immediately when user selects a camera
             this.showCameraSelector = false;
+            // Check if user selected the same camera that's already active
+            const currentCameraId = this.cameraService.getSelectedCameraId();
+            if (currentCameraId === cameraId) {
+                // Same camera selected, just close the selector without switching
+                return;
+            }
             this.isSwitchingCamera = true;
             // Stop current video stream
             if (this.videoStream) {
@@ -2268,7 +2060,7 @@ export class JaakStamps {
             },
             "stopCapture": {
                 "complexType": {
-                    "signature": "() => Promise<{ success: boolean; resourcesFreed: string[]; cleanupErrors: string[]; error?: undefined; } | { success: boolean; error: any; resourcesFreed?: undefined; cleanupErrors?: undefined; }>",
+                    "signature": "() => Promise<{ success: boolean; error?: undefined; } | { success: boolean; error: any; }>",
                     "parameters": [],
                     "references": {
                         "Promise": {
@@ -2276,7 +2068,7 @@ export class JaakStamps {
                             "id": "global::Promise"
                         }
                     },
-                    "return": "Promise<{ success: boolean; resourcesFreed: string[]; cleanupErrors: string[]; error?: undefined; } | { success: boolean; error: any; resourcesFreed?: undefined; cleanupErrors?: undefined; }>"
+                    "return": "Promise<{ success: boolean; error?: undefined; } | { success: boolean; error: any; }>"
                 },
                 "docs": {
                     "text": "",
@@ -2436,40 +2228,6 @@ export class JaakStamps {
                     "text": "",
                     "tags": []
                 }
-            },
-            "getResourceReport": {
-                "complexType": {
-                    "signature": "() => Promise<any>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<any>"
-                },
-                "docs": {
-                    "text": "",
-                    "tags": []
-                }
-            },
-            "forceResourceCleanup": {
-                "complexType": {
-                    "signature": "() => Promise<{ success: boolean; resourcesFreed: string[]; errors: string[]; timestamp: string; error?: undefined; } | { success: boolean; error: any; resourcesFreed?: undefined; errors?: undefined; timestamp?: undefined; }>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<{ success: boolean; resourcesFreed: string[]; errors: string[]; timestamp: string; error?: undefined; } | { success: boolean; error: any; resourcesFreed?: undefined; errors?: undefined; timestamp?: undefined; }>"
-                },
-                "docs": {
-                    "text": "",
-                    "tags": []
-                }
             }
         };
     }