@smileid/web-components 10.0.5 → 11.0.0

package/lib/components/document/src/DocumentCaptureScreens.js

@@ -104,6 +104,7 @@ class DocumentCaptureScreens extends HTMLElement {
 
   disconnectedCallback() {
     SmartCamera.stopMedia();
+    smartCameraWeb?.dispatchEvent(new CustomEvent('metadata.cleanup'));
     if (this.activeScreen) {
       this.activeScreen.removeAttribute('hidden');
     }

package/lib/components/selfie/src/SelfieCaptureScreens.js

@@ -120,6 +120,7 @@ class SelfieCaptureScreens extends HTMLElement {
 
   disconnectedCallback() {
     SmartCamera.stopMedia();
+    smartCameraWeb?.dispatchEvent(new CustomEvent('metadata.cleanup'));
 
     if (this._selfieWrapperListeners) {
       this._selfieWrapperListeners.forEach(({ event, handler }) => {
@@ -140,24 +141,6 @@ class SelfieCaptureScreens extends HTMLElement {
       'selfie-capture-instructions.capture',
       async () => {
         this.setActiveScreen(this.selfieCapture);
-
-        const selfieCapture =
-          this.selfieCapture.querySelector('selfie-capture');
-        if (selfieCapture) {
-          smartCameraWeb?.dispatchEvent(
-            new CustomEvent('metadata.selfie-capture-start'),
-          );
-          smartCameraWeb?.dispatchEvent(
-            new CustomEvent('metadata.selfie-origin', {
-              detail: {
-                imageOrigin: {
-                  environment: 'back_camera',
-                  user: 'front_camera',
-                }[this.getAgentMode()],
-              },
-            }),
-          );
-        }
       },
     );
     this.selfieInstruction.addEventListener(
@@ -405,6 +388,9 @@ class SelfieCaptureScreens extends HTMLElement {
       'show-navigation',
       'hide-back-to-host',
       'initial-screen',
+      'allow-agent-mode',
+      'show-agent-mode-for-tests',
+      'disable-image-tests',
     ];
   }
 
@@ -413,6 +399,9 @@ class SelfieCaptureScreens extends HTMLElement {
       case 'title':
       case 'hidden':
       case 'initial-screen':
+      case 'allow-agent-mode':
+      case 'show-agent-mode-for-tests':
+      case 'disable-image-tests':
         this.connectedCallback();
         break;
       default:

package/lib/components/selfie/src/selfie-capture/SelfieCapture.js

@@ -643,6 +643,21 @@ class SelfieCaptureScreen extends HTMLElement {
       this.switchCamera.disabled = true;
     }
 
+    const smartCameraWeb = document.querySelector('smart-camera-web');
+    smartCameraWeb?.dispatchEvent(
+      new CustomEvent('metadata.selfie-capture-start'),
+    );
+    smartCameraWeb?.dispatchEvent(
+      new CustomEvent('metadata.selfie-origin', {
+        detail: {
+          imageOrigin: {
+            environment: 'back_camera',
+            user: 'front_camera',
+          }[this.inAgentMode ? 'environment' : 'user'],
+        },
+      }),
+    );
+
     /**
      * this was culled from https://jakearchibald.com/2013/animated-line-drawing-svg/
      */

package/lib/components/selfie/src/selfie-capture-wrapper/SelfieCaptureWrapper.tsx

@@ -29,16 +29,33 @@ const SelfieCaptureWrapper: FunctionComponent<Props> = ({
   hidden: hiddenProp = false,
   ...props
 }) => {
+  const isParentCypress = (() => {
+    try {
+      return (
+        !!(window.parent as any).Cypress ||
+        (window.parent.navigator.userAgent.includes('Electron') &&
+          (window.parent as any).__Cypress)
+      );
+    } catch {
+      return false;
+    }
+  })();
+  const isCypress =
+    isParentCypress ||
+    !!(window as any).Cypress ||
+    (window.navigator.userAgent.includes('Electron') &&
+      (window as any).__Cypress);
+
   const hidden = getBoolProp(hiddenProp);
   const startCountdown = getBoolProp(startCountdownProp);
   const [mediapipeReady, setMediapipeReady] = useState(false);
-  const [loadingProgress, setLoadingProgress] = useState(0);
+  const [loadingProgress, setLoadingProgress] = useState(isCypress ? 100 : 0);
   const [initialSessionCompleted, setInitialSessionCompleted] = useState(false);
   const [mediapipeLoading, setMediapipeLoading] = useState(false);
   const [usingSelfieCapture, setUsingSelfieCapture] = useState(false);
 
   useEffect(() => {
-    if (mediapipeReady || mediapipeLoading) return;
+    if (mediapipeReady || mediapipeLoading || isCypress) return;
 
     const loadMediapipe = async () => {
       setMediapipeLoading(true);

package/lib/components/selfie/src/smartselfie-capture/SmartSelfieCapture.tsx

@@ -2,7 +2,7 @@ import { useRef, useEffect } from 'preact/hooks';
 import { useSignal } from '@preact/signals';
 import register from 'preact-custom-element';
 import type { FunctionComponent } from 'preact';
-import { throttle } from 'lodash';
+import throttle from 'lodash/throttle';
 
 import { getBoolProp } from '../../../../utils/props';
 import { useFaceCapture, useCamera } from './hooks';
@@ -149,24 +149,6 @@ const SmartSelfieCapture: FunctionComponent<Props> = ({
     }
   }, [faceCapture.hasFinishedCapture.value]);
 
-  const handleStartCapture = () => {
-    faceCapture.startCapture();
-    const smartCameraWeb = document.querySelector('smart-camera-web');
-    smartCameraWeb?.dispatchEvent(
-      new CustomEvent('metadata.selfie-capture-start'),
-    );
-    smartCameraWeb?.dispatchEvent(
-      new CustomEvent('metadata.selfie-origin', {
-        detail: {
-          imageOrigin: {
-            environment: 'back_camera',
-            user: 'front_camera',
-          }[camera.facingMode],
-        },
-      }),
-    );
-  };
-
   return (
     <div className="smartselfie-capture">
       {showNavigation && (
@@ -201,7 +183,7 @@ const SmartSelfieCapture: FunctionComponent<Props> = ({
             showAgentModeForTests={showAgentModeForTests}
             facingMode={camera.facingMode}
             themeColor={themeColor}
-            onStartCapture={handleStartCapture}
+            onStartCapture={faceCapture.startCapture}
             onSwitchCamera={camera.switchCamera}
           />
         )}

package/lib/components/selfie/src/smartselfie-capture/components/CaptureControls.tsx

@@ -28,6 +28,7 @@ export const CaptureControls: FunctionComponent<CaptureControlsProps> = ({
   <>
     <div className="controls">
       <button
+        id="start-image-capture"
         class="btn-primary"
         onClick={onStartCapture}
         disabled={isCapturing || hasFinishedCapture || !isReadyToCapture}
@@ -37,6 +38,7 @@ export const CaptureControls: FunctionComponent<CaptureControlsProps> = ({
 
       {allowAgentMode && (agentSupported || showAgentModeForTests) && (
         <button
+          id="switch-camera"
           onClick={onSwitchCamera}
           className="agent-mode-btn"
           disabled={isCapturing || hasFinishedCapture}

package/lib/components/selfie/src/smartselfie-capture/hooks/useFaceCapture.ts

@@ -1,7 +1,8 @@
 import { useRef } from 'preact/hooks';
 import { useSignal, useComputed } from '@preact/signals';
+import type { RefObject } from 'preact';
 import { FaceLandmarker } from '@mediapipe/tasks-vision';
-import { throttle } from 'lodash';
+import throttle from 'lodash/throttle';
 import {
   calculateFaceSize,
   isFaceInBounds,
@@ -21,8 +22,8 @@ import packageJson from '../../../../../../package.json';
 const COMPONENTS_VERSION = packageJson.version;
 
 interface UseFaceCaptureProps {
-  videoRef: React.RefObject<HTMLVideoElement>;
-  canvasRef: React.RefObject<HTMLCanvasElement>;
+  videoRef: RefObject<HTMLVideoElement>;
+  canvasRef: RefObject<HTMLCanvasElement>;
   interval: number;
   duration: number;
   smileThreshold: number;
@@ -96,7 +97,7 @@ export const useFaceCapture = ({
   const updateAlert = useRef(
     throttle((messageKey: MessageKey | null) => {
       updateAlertImmediate(messageKey);
-    }, 300),
+    }, 600),
   ).current;
 
   const initializeFaceLandmarker = async () => {

package/lib/components/signature-pad/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@smileid/signature-pad",
-  "version": "10.0.5",
+  "version": "11.0.0",
   "private": "true",
   "exports": {
     ".": "./index.js"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@smileid/web-components",
-  "version": "10.0.5",
+  "version": "11.0.0",
   "private": false,
   "main": "dist/esm/main.js",
   "module": "dist/esm/main.js",
@@ -105,7 +105,7 @@
     "prettier": "^3.6.2",
     "rollup-plugin-visualizer": "^6.0.3",
     "typescript": "^5.8.3",
-    "vite": "^7.0.1",
+    "vite": "^7.1.5",
     "vite-plugin-dts": "^4.5.4",
     "vite-plugin-tsconfig-paths": "^1.4.1"
   }