@jaak.ai/stamps 2.0.0-dev.24 → 2.0.0-dev.26

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (36) hide show
  1. package/README.md +50 -12
  2. package/dist/cjs/{index-DGM9-FNg.js → index-BfhtOB0D.js} +5 -2
  3. package/dist/cjs/index-BfhtOB0D.js.map +1 -0
  4. package/dist/cjs/jaak-stamps-webcomponent.cjs.js +2 -2
  5. package/dist/cjs/jaak-stamps.cjs.entry.js +385 -25
  6. package/dist/cjs/jaak-stamps.cjs.entry.js.map +1 -1
  7. package/dist/cjs/jaak-stamps.entry.cjs.js.map +1 -1
  8. package/dist/cjs/loader.cjs.js +2 -2
  9. package/dist/collection/components/my-component/my-component.css +227 -0
  10. package/dist/collection/components/my-component/my-component.js +467 -24
  11. package/dist/collection/components/my-component/my-component.js.map +1 -1
  12. package/dist/components/index.js +3 -0
  13. package/dist/components/index.js.map +1 -1
  14. package/dist/components/jaak-stamps.js +393 -25
  15. package/dist/components/jaak-stamps.js.map +1 -1
  16. package/dist/esm/{index-DqoVMnc7.js → index-BP1Q4KOg.js} +5 -2
  17. package/dist/esm/index-BP1Q4KOg.js.map +1 -0
  18. package/dist/esm/jaak-stamps-webcomponent.js +3 -3
  19. package/dist/esm/jaak-stamps.entry.js +385 -25
  20. package/dist/esm/jaak-stamps.entry.js.map +1 -1
  21. package/dist/esm/loader.js +3 -3
  22. package/dist/jaak-stamps-webcomponent/jaak-stamps-webcomponent.esm.js +1 -1
  23. package/dist/jaak-stamps-webcomponent/jaak-stamps.entry.esm.js.map +1 -1
  24. package/dist/jaak-stamps-webcomponent/p-14eb13d8.entry.js +2 -0
  25. package/dist/jaak-stamps-webcomponent/p-14eb13d8.entry.js.map +1 -0
  26. package/dist/jaak-stamps-webcomponent/p-BP1Q4KOg.js +3 -0
  27. package/dist/jaak-stamps-webcomponent/p-BP1Q4KOg.js.map +1 -0
  28. package/dist/types/components/my-component/my-component.d.ts +37 -0
  29. package/dist/types/components.d.ts +18 -0
  30. package/package.json +1 -1
  31. package/dist/cjs/index-DGM9-FNg.js.map +0 -1
  32. package/dist/esm/index-DqoVMnc7.js.map +0 -1
  33. package/dist/jaak-stamps-webcomponent/p-0521d8f5.entry.js +0 -2
  34. package/dist/jaak-stamps-webcomponent/p-0521d8f5.entry.js.map +0 -1
  35. package/dist/jaak-stamps-webcomponent/p-DqoVMnc7.js +0 -3
  36. package/dist/jaak-stamps-webcomponent/p-DqoVMnc7.js.map +0 -1
package/README.md CHANGED
@@ -12,7 +12,7 @@ Un componente web para la detección y captura automática de documentos de iden
12
12
  - ✂️ **Recorte configurable** con margen personalizable alrededor del documento
13
13
  - 🔧 **API programática** para control total del proceso
14
14
  - 📱 **Responsive** y compatible con dispositivos móviles
15
- - ⚡ **Optimización automática** usando ONNX Runtime Web
15
+ - ⚡ **Optimización automática** para mejor rendimiento
16
16
 
17
17
  ## Instalación
18
18
 
@@ -43,7 +43,7 @@ yarn add @jaak.ai/stamps
43
43
  <script type="module" src="https://unpkg.com/@jaak.ai/stamps/dist/jaak-stamps-webcomponent/jaak-stamps-webcomponent.esm.js"></script>
44
44
  </head>
45
45
  <body>
46
- <jaak-stamps id="detector" debug="false" mask-size="90" crop-margin="10"></jaak-stamps>
46
+ <jaak-stamps id="detector" debug="false" mask-size="90" crop-margin="10" use-document-classification="false"></jaak-stamps>
47
47
 
48
48
  <button onclick="startCapture()">Iniciar Captura</button>
49
49
  <button onclick="stopCapture()">Detener</button>
@@ -142,6 +142,7 @@ import { Component, ElementRef, ViewChild, OnInit } from '@angular/core';
142
142
  [debug]="false"
143
143
  [maskSize]="90"
144
144
  [cropMargin]="10"
145
+ [useDocumentClassification]="false"
145
146
  (captureCompleted)="onCaptureCompleted($event)"
146
147
  (isReady)="onComponentReady($event)">
147
148
  </jaak-stamps>
@@ -243,7 +244,7 @@ import React, { useRef, useEffect, useImperativeHandle, forwardRef } from 'react
243
244
  // Importar el web component
244
245
  import '@jaak.ai/stamps/dist/jaak-stamps-webcomponent/jaak-stamps-webcomponent.esm.js';
245
246
 
246
- const JaakStampsWrapper = forwardRef(({ debug = false, maskSize = 90, cropMargin = 0, onCaptureCompleted, onIsReady }, ref) => {
247
+ const JaakStampsWrapper = forwardRef(({ debug = false, maskSize = 90, cropMargin = 0, useDocumentClassification = false, onCaptureCompleted, onIsReady }, ref) => {
247
248
  const elementRef = useRef(null);
248
249
 
249
250
  useImperativeHandle(ref, () => ({
@@ -289,6 +290,7 @@ const JaakStampsWrapper = forwardRef(({ debug = false, maskSize = 90, cropMargin
289
290
  debug={debug}
290
291
  mask-size={maskSize}
291
292
  crop-margin={cropMargin}
293
+ use-document-classification={useDocumentClassification}
292
294
  />
293
295
  );
294
296
  });
@@ -370,6 +372,7 @@ function App() {
370
372
  debug={false}
371
373
  maskSize={90}
372
374
  cropMargin={10}
375
+ useDocumentClassification={false}
373
376
  onCaptureCompleted={handleCaptureCompleted}
374
377
  onIsReady={handleIsReady}
375
378
  />
@@ -443,6 +446,8 @@ export default App;
443
446
  | `alignmentTolerance` | `number` | `10` | Tolerancia en píxeles para considerar un lado alineado |
444
447
  | `maskSize` | `number` | `90` | Porcentaje del video que ocupará la máscara de detección (50-100) |
445
448
  | `cropMargin` | `number` | `0` | Margen en píxeles agregado al recorte del documento (0-100) |
449
+ | `useDocumentClassification` | `boolean` | `false` | Habilita la clasificación automática de documentos para determinar si solicitar reverso. Solo carga el modelo de clasificación cuando está habilitada. |
450
+ | `preferredCamera` | `'auto' \| 'front' \| 'back'` | `'auto'` | Define qué cámara usar: `'auto'` (automático según dispositivo), `'front'` (cámara frontal), `'back'` (cámara trasera) |
446
451
 
447
452
  ### Métodos Públicos
448
453
 
@@ -456,13 +461,15 @@ export default App;
456
461
  | `isProcessCompleted()` | `Promise<boolean>` | Verifica si el proceso ha sido completado |
457
462
  | `getStatus()` | `Promise<Status>` | Obtiene el estado actual del detector |
458
463
  | `skipBackCapture()` | `Promise<void>` | Omite la captura del reverso (solo disponible en paso 'back') |
464
+ | `getCameraInfo()` | `Promise<CameraInfo>` | Obtiene información detallada sobre las cámaras disponibles |
465
+ | `setPreferredCamera(camera)` | `Promise<{success: boolean, selectedCamera: string, availableCameras: number}>` | Configura la cámara preferida ('auto', 'front', 'back') |
459
466
 
460
467
  ### Eventos
461
468
 
462
469
  | Evento | Payload | Descripción |
463
470
  |--------|---------|-------------|
464
471
  | `captureCompleted` | `CapturedImages` | Se emite cuando se completa el proceso de captura |
465
- | `isReady` | `boolean` | Se emite cuando el componente está listo para comenzar la detección (modelo ONNX cargado) |
472
+ | `isReady` | `boolean` | Se emite cuando el componente está listo para comenzar la detección (modelos cargados) |
466
473
 
467
474
  ### Tipos de Datos
468
475
 
@@ -496,14 +503,22 @@ interface Status {
496
503
 
497
504
  ## Flujo de Trabajo
498
505
 
499
- ### Flujo Estándar
506
+ ### Flujo Estándar (useDocumentClassification = false)
507
+ 1. **Inicialización**: El componente se prepara para la detección
508
+ 2. **Inicio de captura**: Se carga automáticamente el modelo de detección
509
+ 3. **Captura del frente**: El usuario posiciona el documento y se captura automáticamente
510
+ 4. **Solicitud de reverso**: Siempre se solicita voltear el documento para capturar el reverso
511
+ 5. **Botón "Saltar reverso"**: Disponible para omitir manualmente la captura del reverso
512
+ 6. **Completado**: Se emite el evento `captureCompleted` con las imágenes correspondientes
513
+
514
+ ### Flujo con Clasificación Inteligente (useDocumentClassification = true)
500
515
  1. **Inicialización**: El componente se prepara para la detección
501
516
  2. **Inicio de captura**: Se cargan automáticamente los modelos de detección y clasificación
502
517
  3. **Captura del frente**: El usuario posiciona el documento y se captura automáticamente
503
518
  4. **Clasificación automática**: El sistema determina si el documento requiere captura de reverso
504
519
  5. **Flujo adaptativo**:
505
- - **Si no requiere reverso**: Se completa automáticamente el proceso
506
- - **Si requiere reverso**: Se solicita voltear el documento para capturar el reverso
520
+ - **Si es pasaporte**: Se completa automáticamente el proceso (sin reverso)
521
+ - **Si es otro documento**: Se solicita voltear el documento para capturar el reverso
507
522
  6. **Completado**: Se emite el evento `captureCompleted` con las imágenes correspondientes
508
523
 
509
524
  ### Flujo con Precarga (Recomendado)
@@ -516,25 +531,48 @@ interface Status {
516
531
  5. **Completado**: Se emite el evento `captureCompleted` con todas las imágenes
517
532
 
518
533
  ### Clasificación de Documentos
519
- El sistema utiliza un modelo MobileNet especializado para determinar automáticamente si el documento requiere captura de reverso:
520
- - **Documentos sin reverso**: Se omite automáticamente la captura del reverso
521
- - **Documentos con reverso**: Requieren captura de ambos lados (frente y reverso)
534
+
535
+ #### Modo con Clasificación Habilitada (`useDocumentClassification = true`)
536
+ Cuando la propiedad está habilitada, el sistema utiliza un modelo de inteligencia artificial especializado para determinar automáticamente si el documento requiere captura de reverso:
537
+ - **Pasaportes**: Se omite automáticamente la captura del reverso
538
+ - **Otros documentos**: Requieren captura de ambos lados (frente y reverso)
522
539
  - **Botón "Saltar reverso"**: Siempre disponible para permitir flexibilidad manual
540
+ - **Carga optimizada**: El modelo de clasificación se descarga solo cuando es necesario
541
+
542
+ #### Modo Estándar (`useDocumentClassification = false`, por defecto)
543
+ Cuando está deshabilitada, el comportamiento es más liviano y directo:
544
+ - **Todos los documentos**: Siempre se solicita captura del reverso
545
+ - **Botón "Saltar reverso"**: Disponible para omitir manualmente la captura
546
+ - **Sin clasificación**: NO se carga el modelo de clasificación, solo el de detección
547
+ - **Menor uso de ancho de banda**: Solo descarga el modelo de detección (~5MB menos)
548
+
549
+ #### Consideraciones de Rendimiento
550
+ - **Con clasificación deshabilitada**: Carga más rápida y menor uso de datos
551
+ - **Con clasificación habilitada**: Experiencia más inteligente pero requiere descargar modelo adicional
552
+ - **Carga bajo demanda**: El modelo de clasificación se carga solo cuando se captura el primer documento
523
553
 
524
554
  ## Requisitos del Sistema
525
555
 
526
556
  - **Navegadores**: Chrome/Edge 88+, Firefox 85+, Safari 14+
527
557
  - **Cámara**: Acceso a cámara trasera (móvil) o webcam (escritorio)
528
- - **Conexión**: Conexión a internet para cargar el modelo ONNX Runtime
558
+ - **Conexión**: Conexión a internet para cargar los modelos de IA
529
559
 
530
- ## Consideraciones de Privacidad
560
+ ## Consideraciones de Privacidad y Rendimiento
531
561
 
562
+ ### Privacidad
532
563
  - Las imágenes se procesan localmente en el navegador
533
564
  - No se envían datos a servidores externos
534
565
  - Los modelos de IA (detección y clasificación) se ejecutan completamente en el cliente
535
566
  - La clasificación de documentos se realiza de forma privada y local
536
567
  - Las imágenes capturadas solo están disponibles en el contexto de tu aplicación
537
568
 
569
+ ### Optimización de Recursos
570
+ - **Carga condicional**: Solo descarga modelos necesarios según configuración
571
+ - **Modelo de detección**: ~15MB (siempre requerido)
572
+ - **Modelo de clasificación**: ~5MB (solo si `useDocumentClassification = true`)
573
+ - **Lazy loading**: Los modelos se cargan cuando realmente se necesitan
574
+ - **Cache del navegador**: Los modelos se almacenan localmente después de la primera descarga
575
+
538
576
  ## Desarrollo
539
577
 
540
578
  ### Clonar el repositorio
@@ -336,6 +336,9 @@ var parsePropertyValue = (propValue, propType) => {
336
336
  if (propType & 2 /* Number */) {
337
337
  return typeof propValue === "string" ? parseFloat(propValue) : typeof propValue === "number" ? propValue : NaN;
338
338
  }
339
+ if (propType & 1 /* String */) {
340
+ return String(propValue);
341
+ }
339
342
  return propValue;
340
343
  }
341
344
  return propValue;
@@ -1397,6 +1400,6 @@ exports.h = h;
1397
1400
  exports.promiseResolve = promiseResolve;
1398
1401
  exports.registerInstance = registerInstance;
1399
1402
  exports.setNonce = setNonce;
1400
- //# sourceMappingURL=index-DGM9-FNg.js.map
1403
+ //# sourceMappingURL=index-BfhtOB0D.js.map
1401
1404
 
1402
- //# sourceMappingURL=index-DGM9-FNg.js.map
1405
+ //# sourceMappingURL=index-BfhtOB0D.js.map