@aws-amplify/ui-react-liveness 3.6.6 → 3.6.8

package/dist/esm/components/FaceLivenessDetector/FaceLivenessDetectorCore.mjs

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import { useInterpret } from '@xstate/react';
 import { livenessMachine } from './service/machine/machine.mjs';
+import './service/utils/constants.mjs';
 import './service/types/liveness.mjs';
 import '@tensorflow/tfjs-core';
 import '../../packages/react-liveness/node_modules/@tensorflow-models/face-detection/dist/face-detection.esm.mjs';
 import '@tensorflow/tfjs-backend-wasm';
 import '@tensorflow/tfjs-backend-cpu';
 import '@aws-amplify/core/internals/utils';
-import './service/utils/constants.mjs';
 import './service/utils/ColorSequenceDisplay/ColorSequenceDisplay.mjs';
 import '@aws-amplify/ui';
 import './service/utils/createStreamingClient/createStreamingClient.mjs';

package/dist/esm/components/FaceLivenessDetector/LivenessCheck/LivenessCameraModule.mjs

@@ -3,6 +3,7 @@ import { classNames } from '@aws-amplify/ui';
 import { View, Flex, Loader, Text, Button } from '@aws-amplify/ui-react';
 import { useColorMode } from '@aws-amplify/ui-react/internal';
 import '../service/machine/machine.mjs';
+import { FACE_MOVEMENT_CHALLENGE } from '../service/utils/constants.mjs';
 import { FaceMatchState } from '../service/types/liveness.mjs';
 import '@tensorflow/tfjs-core';
 import '../../../packages/react-liveness/node_modules/@tensorflow-models/face-detection/dist/face-detection.esm.mjs';
@@ -10,7 +11,6 @@ import '@tensorflow/tfjs-backend-wasm';
 import '@tensorflow/tfjs-backend-cpu';
 import '@aws-amplify/core/internals/utils';
 import { drawStaticOval, clearOvalCanvas } from '../service/utils/liveness.mjs';
-import { FACE_MOVEMENT_CHALLENGE } from '../service/utils/constants.mjs';
 import '../service/utils/ColorSequenceDisplay/ColorSequenceDisplay.mjs';
 import '../service/utils/createStreamingClient/createStreamingClient.mjs';
 import '../service/utils/StreamRecorder/StreamRecorder.mjs';

package/dist/esm/components/FaceLivenessDetector/LivenessCheck/LivenessCheck.mjs

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { Flex, Text, Button, View } from '@aws-amplify/ui-react';
 import '../service/machine/machine.mjs';
+import '../service/utils/constants.mjs';
 import '../service/types/liveness.mjs';
 import { LivenessErrorState } from '../service/types/error.mjs';
 import '@tensorflow/tfjs-core';
@@ -8,7 +9,6 @@ import '../../../packages/react-liveness/node_modules/@tensorflow-models/face-de
 import '@tensorflow/tfjs-backend-wasm';
 import '@tensorflow/tfjs-backend-cpu';
 import '@aws-amplify/core/internals/utils';
-import '../service/utils/constants.mjs';
 import '../service/utils/ColorSequenceDisplay/ColorSequenceDisplay.mjs';
 import '@aws-amplify/ui';
 import '../service/utils/createStreamingClient/createStreamingClient.mjs';

package/dist/esm/components/FaceLivenessDetector/service/machine/machine.mjs

@@ -1,12 +1,12 @@
 import { v4 } from 'uuid';
 import { createMachine, assign, actions, spawn } from 'xstate';
 import { fillOverlayCanvasFractional, generateBboxFromLandmarks, getOvalBoundingBox, getIntersectionOverUnion, estimateIllumination, getOvalDetailsFromSessionInformation, drawLivenessOvalInCanvas, getStaticLivenessOvalDetails, isFaceDistanceBelowThreshold, getFaceMatchState, isCameraDeviceVirtual, getColorsSequencesFromSessionInformation } from '../utils/liveness.mjs';
+import { FACE_MOVEMENT_AND_LIGHT_CHALLENGE, FACE_MOVEMENT_CHALLENGE, WS_CLOSURE_CODE } from '../utils/constants.mjs';
 import { FaceMatchState } from '../types/liveness.mjs';
 import { LivenessErrorState } from '../types/error.mjs';
 import { BlazeFaceFaceDetection } from '../utils/blazefaceFaceDetection.mjs';
 import { getFaceMatchStateInLivenessOval } from '../utils/getFaceMatchStateInLivenessOval.mjs';
 import { ColorSequenceDisplay } from '../utils/ColorSequenceDisplay/ColorSequenceDisplay.mjs';
-import { FACE_MOVEMENT_AND_LIGHT_CHALLENGE, FACE_MOVEMENT_CHALLENGE, WS_CLOSURE_CODE } from '../utils/constants.mjs';
 import { createRequestStreamGenerator } from '../utils/createRequestStreamGenerator/createRequestStreamGenerator.mjs';
 import { createSessionEndEvent, getTrackDimensions, createColorDisplayEvent, createSessionStartEvent } from '../utils/createRequestStreamGenerator/utils.mjs';
 import { createStreamingClient } from '../utils/createStreamingClient/createStreamingClient.mjs';
@@ -203,6 +203,10 @@ const livenessMachine = createMachine({
                                 'spawnResponseStreamActor',
                             ],
                         },
+                        onError: {
+                            target: '#livenessMachine.error',
+                            actions: 'updateErrorStateForRuntime',
+                        },
                     },
                 },
                 waitForSessionInfo: {
@@ -231,6 +235,10 @@ const livenessMachine = createMachine({
                     target: 'checkFaceDetectedBeforeStart',
                     actions: 'updateFaceMatchBeforeStartDetails',
                 },
+                onError: {
+                    target: 'error',
+                    actions: 'updateErrorStateForRuntime',
+                },
             },
         },
         checkFaceDetectedBeforeStart: {
@@ -249,6 +257,10 @@ const livenessMachine = createMachine({
                     target: 'checkFaceDistanceBeforeRecording',
                     actions: 'updateFaceDistanceBeforeRecording',
                 },
+                onError: {
+                    target: 'error',
+                    actions: 'updateErrorStateForRuntime',
+                },
             },
         },
         checkFaceDistanceBeforeRecording: {
@@ -926,13 +938,7 @@ const livenessMachine = createMachine({
             const { videoEl } = context.videoAssociatedParams;
             const { faceDetector } = context.ovalAssociatedParams;
             // initialize models
-            try {
-                await faceDetector.modelLoadingPromise;
-            }
-            catch (err) {
-                // eslint-disable-next-line no-console
-                console.log({ err });
-            }
+            await faceDetector.modelLoadingPromise;
             // detect face
             const faceMatchState = await getFaceMatchState(faceDetector, videoEl);
             return { faceMatchState };
@@ -964,13 +970,7 @@ const livenessMachine = createMachine({
             const { videoEl, canvasEl, isMobile } = context.videoAssociatedParams;
             const { faceDetector } = context.ovalAssociatedParams;
             // initialize models
-            try {
-                await faceDetector.modelLoadingPromise;
-            }
-            catch (err) {
-                // eslint-disable-next-line no-console
-                console.log({ err });
-            }
+            await faceDetector.modelLoadingPromise;
             // detect face
             const detectedFaces = await faceDetector.detectFaces(videoEl);
             let initialFace;

package/dist/esm/components/FaceLivenessDetector/service/types/faceDetection.mjs

@@ -1,14 +1,40 @@
+import { CONNECTION_TIMEOUT } from '../utils/constants.mjs';
+
 /**
  * The abstract class representing FaceDetection
  * to be implemented for different libraries.
  */
 class FaceDetection {
+    constructor() {
+        this._modelLoadTriggered = false;
+    }
     /**
      * Triggers the `loadModels` method and stores
      * the corresponding promise to be awaited later.
+     * Applies a timeout to prevent indefinite hangs if the
+     * network request for model assets stalls.
      */
     triggerModelLoading() {
-        this.modelLoadingPromise = this.loadModels();
+        if (this._modelLoadTriggered) {
+            return;
+        }
+        this._modelLoadTriggered = true;
+        let timeoutId;
+        this.modelLoadingPromise = Promise.race([
+            // `finally` ensures the timeout is cleared whether loadModels
+            // resolves or rejects, preventing a leaked timer on fast failures.
+            this.loadModels().finally(() => {
+                clearTimeout(timeoutId);
+            }),
+            new Promise((_, reject) => {
+                timeoutId = setTimeout(() => reject(new Error('Face detection model loading timed out. Check your network connection and try again.')), 
+                // Uses the same 10s timeout as the WebSocket connection phase.
+                // The WASM binary (~425KB) + model (~100KB) should load well
+                // within 10s on any reasonable connection. If it hasn't loaded
+                // by then, the request is likely stalled (not just slow).
+                CONNECTION_TIMEOUT);
+            }),
+        ]);
     }
 }
 

package/dist/esm/components/FaceLivenessDetector/service/utils/createStreamingClient/CustomWebSocketFetchHandler.mjs

@@ -142,48 +142,97 @@ class CustomWebSocketFetchHandler {
         let streamError = undefined;
         // To notify onclose event that error has occurred.
         let socketErrorOccurred = false;
-        // initialize as no-op.
-        let reject = () => { };
-        let resolve = () => { };
+        // Buffer for messages that arrive before the consumer calls .next().
+        // This prevents dropped messages when the server responds faster than
+        // the client sets up its async iterator (race condition).
+        const messageQueue = [];
+        let waitingResolve = null;
+        let waitingReject = null;
+        let done = false;
+        let endError = undefined;
         socket.onmessage = (event) => {
-            resolve({
-                done: false,
-                value: new Uint8Array(event.data),
-            });
+            const chunk = new Uint8Array(event.data);
+            if (waitingResolve) {
+                // Consumer is waiting for data — deliver immediately
+                const resolve = waitingResolve;
+                waitingResolve = null;
+                waitingReject = null;
+                resolve({ done: false, value: chunk });
+            }
+            else {
+                // Consumer hasn't called .next() yet — buffer the message
+                messageQueue.push(chunk);
+            }
         };
         socket.onerror = (error) => {
             socketErrorOccurred = true;
             socket.close();
-            reject(error);
+            done = true;
+            endError = error;
+            if (waitingReject) {
+                const reject = waitingReject;
+                waitingResolve = null;
+                waitingReject = null;
+                reject(error);
+            }
         };
         socket.onclose = (event) => {
             this.removeNotUsableSockets(socket.url);
             if (socketErrorOccurred)
                 return;
+            done = true;
             if (streamError) {
-                reject(streamError);
+                endError = streamError;
             }
             else if (event.code !== WS_CLOSURE_CODE.SUCCESS_CODE &&
                 event.code !== 1001) {
                 // Server closed the connection with an abnormal code (e.g. 4001
                 // StreamIdleTimeout, 4003 SessionExpired, 1006 abnormal closure).
-                reject(new Error(`Server ended the connection unexpectedly (code ${event.code}` +
+                endError = new Error(`Server ended the connection unexpectedly (code ${event.code}` +
                     (event.reason ? `: ${event.reason}` : '') +
-                    ')'));
+                    ')');
             }
-            else {
-                resolve({
-                    done: true,
-                    value: undefined,
-                });
+            if (waitingResolve) {
+                if (endError) {
+                    const reject = waitingReject;
+                    waitingResolve = null;
+                    waitingReject = null;
+                    reject(endError);
+                }
+                else {
+                    const resolve = waitingResolve;
+                    waitingResolve = null;
+                    waitingReject = null;
+                    resolve({ done: true, value: undefined });
+                }
             }
         };
         const outputStream = {
             [Symbol.asyncIterator]: () => ({
                 next: () => {
+                    // If there are buffered messages, deliver the next one immediately
+                    if (messageQueue.length > 0) {
+                        return Promise.resolve({
+                            done: false,
+                            value: messageQueue.shift(),
+                        });
+                    }
+                    // If the stream has ended, resolve/reject accordingly
+                    if (done) {
+                        if (endError) {
+                            return Promise.reject(endError instanceof Error
+                                ? endError
+                                : new Error('Stream ended with an error'));
+                        }
+                        return Promise.resolve({
+                            done: true,
+                            value: undefined,
+                        });
+                    }
+                    // Otherwise wait for the next message or close event
                     return new Promise((_resolve, _reject) => {
-                        resolve = _resolve;
-                        reject = _reject;
+                        waitingResolve = _resolve;
+                        waitingReject = _reject;
                     });
                 },
             }),
@@ -206,8 +255,7 @@ class CustomWebSocketFetchHandler {
             catch (err) {
                 // We don't throw the error here because the send()'s returned
                 // would already be settled by the time sending chunk throws error.
-                // Instead, the notify the output stream to throw if there's
-                // exceptions
+                // Instead, notify the output stream to throw if there's exceptions
                 if (err instanceof Error) {
                     streamError = err;
                 }

package/dist/esm/components/FaceLivenessDetector/service/utils/getFaceMatchStateInLivenessOval.mjs

@@ -1,6 +1,6 @@
+import { FACE_MATCH_RANGE_MAX, FACE_MATCH_WEIGHT_MAX, FACE_MATCH_WEIGHT_MIN, FACE_MATCH_RANGE_MIN } from './constants.mjs';
 import { FaceMatchState } from '../types/liveness.mjs';
 import { generateBboxFromLandmarks, getOvalBoundingBox, getIntersectionOverUnion } from './liveness.mjs';
-import { FACE_MATCH_RANGE_MAX, FACE_MATCH_WEIGHT_MAX, FACE_MATCH_WEIGHT_MIN, FACE_MATCH_RANGE_MIN } from './constants.mjs';
 
 /**
  * Returns the state of the provided face with respect to the provided liveness oval.

package/dist/esm/components/FaceLivenessDetector/service/utils/liveness.mjs

@@ -1,6 +1,6 @@
+import { OVAL_HEIGHT_WIDTH_RATIO, PUPIL_DISTANCE_WEIGHT, FACE_HEIGHT_WEIGHT } from './constants.mjs';
 import { IlluminationState, FaceMatchState } from '../types/liveness.mjs';
 import { LivenessErrorState } from '../types/error.mjs';
-import { OVAL_HEIGHT_WIDTH_RATIO, PUPIL_DISTANCE_WEIGHT, FACE_HEIGHT_WEIGHT } from './constants.mjs';
 
 /**
  * Returns the random number between min and max

package/dist/esm/components/FaceLivenessDetector/shared/DefaultStartScreenComponents.mjs

@@ -3,13 +3,13 @@ import { ComponentClassName } from '@aws-amplify/ui';
 import { Flex, View } from '@aws-amplify/ui-react';
 import { CancelButton } from './CancelButton.mjs';
 import '../service/machine/machine.mjs';
+import '../service/utils/constants.mjs';
 import '../service/types/liveness.mjs';
 import '@tensorflow/tfjs-core';
 import '../../../packages/react-liveness/node_modules/@tensorflow-models/face-detection/dist/face-detection.esm.mjs';
 import '@tensorflow/tfjs-backend-wasm';
 import '@tensorflow/tfjs-backend-cpu';
 import '@aws-amplify/core/internals/utils';
-import '../service/utils/constants.mjs';
 import '../service/utils/ColorSequenceDisplay/ColorSequenceDisplay.mjs';
 import '../service/utils/createStreamingClient/createStreamingClient.mjs';
 import '../service/utils/StreamRecorder/StreamRecorder.mjs';

package/dist/esm/components/FaceLivenessDetector/shared/FaceLivenessErrorModal.mjs

@@ -2,6 +2,7 @@ import React__default from 'react';
 import { Flex, Button, Text } from '@aws-amplify/ui-react';
 import { AlertIcon } from '@aws-amplify/ui-react/internal';
 import '../service/machine/machine.mjs';
+import '../service/utils/constants.mjs';
 import '../service/types/liveness.mjs';
 import { LivenessErrorState } from '../service/types/error.mjs';
 import '@tensorflow/tfjs-core';
@@ -9,7 +10,6 @@ import '../../../packages/react-liveness/node_modules/@tensorflow-models/face-de
 import '@tensorflow/tfjs-backend-wasm';
 import '@tensorflow/tfjs-backend-cpu';
 import '@aws-amplify/core/internals/utils';
-import '../service/utils/constants.mjs';
 import '../service/utils/ColorSequenceDisplay/ColorSequenceDisplay.mjs';
 import '@aws-amplify/ui';
 import '../service/utils/createStreamingClient/createStreamingClient.mjs';

package/dist/esm/components/FaceLivenessDetector/shared/Hint.mjs

@@ -1,13 +1,13 @@
 import * as React from 'react';
 import { VisuallyHidden, View } from '@aws-amplify/ui-react';
 import '../service/machine/machine.mjs';
+import '../service/utils/constants.mjs';
 import { FaceMatchState, IlluminationState } from '../service/types/liveness.mjs';
 import '@tensorflow/tfjs-core';
 import '../../../packages/react-liveness/node_modules/@tensorflow-models/face-detection/dist/face-detection.esm.mjs';
 import '@tensorflow/tfjs-backend-wasm';
 import '@tensorflow/tfjs-backend-cpu';
 import '@aws-amplify/core/internals/utils';
-import '../service/utils/constants.mjs';
 import '../service/utils/ColorSequenceDisplay/ColorSequenceDisplay.mjs';
 import '@aws-amplify/ui';
 import '../service/utils/createStreamingClient/createStreamingClient.mjs';

package/dist/esm/index.mjs

@@ -1,13 +1,13 @@
 export { default as FaceLivenessDetector } from './components/FaceLivenessDetector/FaceLivenessDetector.mjs';
 export { default as FaceLivenessDetectorCore } from './components/FaceLivenessDetector/FaceLivenessDetectorCore.mjs';
 import './components/FaceLivenessDetector/service/machine/machine.mjs';
+import './components/FaceLivenessDetector/service/utils/constants.mjs';
 import './components/FaceLivenessDetector/service/types/liveness.mjs';
 import '@tensorflow/tfjs-core';
 import './packages/react-liveness/node_modules/@tensorflow-models/face-detection/dist/face-detection.esm.mjs';
 import '@tensorflow/tfjs-backend-wasm';
 import '@tensorflow/tfjs-backend-cpu';
 import '@aws-amplify/core/internals/utils';
-import './components/FaceLivenessDetector/service/utils/constants.mjs';
 import './components/FaceLivenessDetector/service/utils/ColorSequenceDisplay/ColorSequenceDisplay.mjs';
 import '@aws-amplify/ui';
 import './components/FaceLivenessDetector/service/utils/createStreamingClient/createStreamingClient.mjs';

package/dist/esm/version.mjs

@@ -1,3 +1,3 @@
-const VERSION = '3.6.6';
+const VERSION = '3.6.8';
 
 export { VERSION };

package/dist/index.js

@@ -43,17 +43,89 @@ function _interopNamespace(e) {
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
+// Face distance is calculated as pupilDistance / ovalWidth.
+// The further away you are from the camera the distance between your pupils will decrease, thus lowering the threshold values.
+// Constants from science team to determine ocular distance (space between eyes)
+const PUPIL_DISTANCE_WEIGHT = 2.0;
+const FACE_HEIGHT_WEIGHT = 1.8;
+// Constants from science team to find face match percentage
+const FACE_MATCH_RANGE_MIN = 0;
+const FACE_MATCH_RANGE_MAX = 1;
+const FACE_MATCH_WEIGHT_MIN = 0.25;
+const FACE_MATCH_WEIGHT_MAX = 0.75;
+const OVAL_HEIGHT_WIDTH_RATIO = 1.618;
+const WS_CLOSURE_CODE = {
+    SUCCESS_CODE: 1000,
+    DEFAULT_ERROR_CODE: 4000,
+    FACE_FIT_TIMEOUT: 4001,
+    USER_CANCEL: 4003,
+    RUNTIME_ERROR: 4005,
+    USER_ERROR_DURING_CONNECTION: 4007,
+};
+// number in milliseconds to record into each video chunk.
+// see https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/start#timeslice
+const TIME_SLICE = 1000;
+// in MS, the rate at which colors are rendered/checked
+const TICK_RATE = 10;
+/**
+ * The number of seconds before the presigned URL expires.
+ * Used to override aws sdk default value of 60
+ */
+const REQUEST_EXPIRY = 299;
+/**
+ * The maximum time in milliseconds that the connection phase of a request
+ * may take before the connection attempt is abandoned.
+ */
+const CONNECTION_TIMEOUT = 10000;
+const FACE_MOVEMENT_AND_LIGHT_CHALLENGE = {
+    type: 'FaceMovementAndLightChallenge',
+    version: '2.0.0',
+};
+const FACE_MOVEMENT_CHALLENGE = {
+    type: 'FaceMovementChallenge',
+    version: '1.0.0',
+};
+const SUPPORTED_CHALLENGES = [
+    FACE_MOVEMENT_AND_LIGHT_CHALLENGE,
+    FACE_MOVEMENT_CHALLENGE,
+];
+const queryParameterString = SUPPORTED_CHALLENGES.map((challenge) => `${challenge.type}_${challenge.version}`).join(',');
+
 /**
  * The abstract class representing FaceDetection
  * to be implemented for different libraries.
  */
 let FaceDetection$1 = class FaceDetection {
+    constructor() {
+        this._modelLoadTriggered = false;
+    }
     /**
      * Triggers the `loadModels` method and stores
      * the corresponding promise to be awaited later.
+     * Applies a timeout to prevent indefinite hangs if the
+     * network request for model assets stalls.
      */
     triggerModelLoading() {
-        this.modelLoadingPromise = this.loadModels();
+        if (this._modelLoadTriggered) {
+            return;
+        }
+        this._modelLoadTriggered = true;
+        let timeoutId;
+        this.modelLoadingPromise = Promise.race([
+            // `finally` ensures the timeout is cleared whether loadModels
+            // resolves or rejects, preventing a leaked timer on fast failures.
+            this.loadModels().finally(() => {
+                clearTimeout(timeoutId);
+            }),
+            new Promise((_, reject) => {
+                timeoutId = setTimeout(() => reject(new Error('Face detection model loading timed out. Check your network connection and try again.')), 
+                // Uses the same 10s timeout as the WebSocket connection phase.
+                // The WASM binary (~425KB) + model (~100KB) should load well
+                // within 10s on any reasonable connection. If it hasn't loaded
+                // by then, the request is likely stalled (not just slow).
+                CONNECTION_TIMEOUT);
+            }),
+        ]);
     }
 };
 
@@ -95,54 +167,6 @@ const LivenessErrorState = {
     DEFAULT_CAMERA_NOT_FOUND_ERROR: 'DEFAULT_CAMERA_NOT_FOUND_ERROR',
 };
 
-// Face distance is calculated as pupilDistance / ovalWidth.
-// The further away you are from the camera the distance between your pupils will decrease, thus lowering the threshold values.
-// Constants from science team to determine ocular distance (space between eyes)
-const PUPIL_DISTANCE_WEIGHT = 2.0;
-const FACE_HEIGHT_WEIGHT = 1.8;
-// Constants from science team to find face match percentage
-const FACE_MATCH_RANGE_MIN = 0;
-const FACE_MATCH_RANGE_MAX = 1;
-const FACE_MATCH_WEIGHT_MIN = 0.25;
-const FACE_MATCH_WEIGHT_MAX = 0.75;
-const OVAL_HEIGHT_WIDTH_RATIO = 1.618;
-const WS_CLOSURE_CODE = {
-    SUCCESS_CODE: 1000,
-    DEFAULT_ERROR_CODE: 4000,
-    FACE_FIT_TIMEOUT: 4001,
-    USER_CANCEL: 4003,
-    RUNTIME_ERROR: 4005,
-    USER_ERROR_DURING_CONNECTION: 4007,
-};
-// number in milliseconds to record into each video chunk.
-// see https://developer.mozilla.org/en-US/docs/Web/API/MediaRecorder/start#timeslice
-const TIME_SLICE = 1000;
-// in MS, the rate at which colors are rendered/checked
-const TICK_RATE = 10;
-/**
- * The number of seconds before the presigned URL expires.
- * Used to override aws sdk default value of 60
- */
-const REQUEST_EXPIRY = 299;
-/**
- * The maximum time in milliseconds that the connection phase of a request
- * may take before the connection attempt is abandoned.
- */
-const CONNECTION_TIMEOUT = 10000;
-const FACE_MOVEMENT_AND_LIGHT_CHALLENGE = {
-    type: 'FaceMovementAndLightChallenge',
-    version: '2.0.0',
-};
-const FACE_MOVEMENT_CHALLENGE = {
-    type: 'FaceMovementChallenge',
-    version: '1.0.0',
-};
-const SUPPORTED_CHALLENGES = [
-    FACE_MOVEMENT_AND_LIGHT_CHALLENGE,
-    FACE_MOVEMENT_CHALLENGE,
-];
-const queryParameterString = SUPPORTED_CHALLENGES.map((challenge) => `${challenge.type}_${challenge.version}`).join(',');
-
 /**
  * Returns the random number between min and max
  * seeded with the provided random seed.
@@ -1227,7 +1251,7 @@ function createRequestStreamGenerator(stream) {
     };
 }
 
-const VERSION = '3.6.6';
+const VERSION = '3.6.8';
 
 const BASE_USER_AGENT = `ui-react-liveness/${VERSION}`;
 const getLivenessUserAgent = () => {
@@ -1372,48 +1396,97 @@ class CustomWebSocketFetchHandler {
         let streamError = undefined;
         // To notify onclose event that error has occurred.
         let socketErrorOccurred = false;
-        // initialize as no-op.
-        let reject = () => { };
-        let resolve = () => { };
+        // Buffer for messages that arrive before the consumer calls .next().
+        // This prevents dropped messages when the server responds faster than
+        // the client sets up its async iterator (race condition).
+        const messageQueue = [];
+        let waitingResolve = null;
+        let waitingReject = null;
+        let done = false;
+        let endError = undefined;
         socket.onmessage = (event) => {
-            resolve({
-                done: false,
-                value: new Uint8Array(event.data),
-            });
+            const chunk = new Uint8Array(event.data);
+            if (waitingResolve) {
+                // Consumer is waiting for data — deliver immediately
+                const resolve = waitingResolve;
+                waitingResolve = null;
+                waitingReject = null;
+                resolve({ done: false, value: chunk });
+            }
+            else {
+                // Consumer hasn't called .next() yet — buffer the message
+                messageQueue.push(chunk);
+            }
         };
         socket.onerror = (error) => {
             socketErrorOccurred = true;
             socket.close();
-            reject(error);
+            done = true;
+            endError = error;
+            if (waitingReject) {
+                const reject = waitingReject;
+                waitingResolve = null;
+                waitingReject = null;
+                reject(error);
+            }
         };
         socket.onclose = (event) => {
             this.removeNotUsableSockets(socket.url);
             if (socketErrorOccurred)
                 return;
+            done = true;
             if (streamError) {
-                reject(streamError);
+                endError = streamError;
             }
             else if (event.code !== WS_CLOSURE_CODE.SUCCESS_CODE &&
                 event.code !== 1001) {
                 // Server closed the connection with an abnormal code (e.g. 4001
                 // StreamIdleTimeout, 4003 SessionExpired, 1006 abnormal closure).
-                reject(new Error(`Server ended the connection unexpectedly (code ${event.code}` +
+                endError = new Error(`Server ended the connection unexpectedly (code ${event.code}` +
                     (event.reason ? `: ${event.reason}` : '') +
-                    ')'));
+                    ')');
             }
-            else {
-                resolve({
-                    done: true,
-                    value: undefined,
-                });
+            if (waitingResolve) {
+                if (endError) {
+                    const reject = waitingReject;
+                    waitingResolve = null;
+                    waitingReject = null;
+                    reject(endError);
+                }
+                else {
+                    const resolve = waitingResolve;
+                    waitingResolve = null;
+                    waitingReject = null;
+                    resolve({ done: true, value: undefined });
+                }
             }
         };
         const outputStream = {
             [Symbol.asyncIterator]: () => ({
                 next: () => {
+                    // If there are buffered messages, deliver the next one immediately
+                    if (messageQueue.length > 0) {
+                        return Promise.resolve({
+                            done: false,
+                            value: messageQueue.shift(),
+                        });
+                    }
+                    // If the stream has ended, resolve/reject accordingly
+                    if (done) {
+                        if (endError) {
+                            return Promise.reject(endError instanceof Error
+                                ? endError
+                                : new Error('Stream ended with an error'));
+                        }
+                        return Promise.resolve({
+                            done: true,
+                            value: undefined,
+                        });
+                    }
+                    // Otherwise wait for the next message or close event
                     return new Promise((_resolve, _reject) => {
-                        resolve = _resolve;
-                        reject = _reject;
+                        waitingResolve = _resolve;
+                        waitingReject = _reject;
                     });
                 },
             }),
@@ -1436,8 +1509,7 @@ class CustomWebSocketFetchHandler {
             catch (err) {
                 // We don't throw the error here because the send()'s returned
                 // would already be settled by the time sending chunk throws error.
-                // Instead, the notify the output stream to throw if there's
-                // exceptions
+                // Instead, notify the output stream to throw if there's exceptions
                 if (err instanceof Error) {
                     streamError = err;
                 }
@@ -1973,6 +2045,10 @@ const livenessMachine = xstate.createMachine({
                                 'spawnResponseStreamActor',
                             ],
                         },
+                        onError: {
+                            target: '#livenessMachine.error',
+                            actions: 'updateErrorStateForRuntime',
+                        },
                     },
                 },
                 waitForSessionInfo: {
@@ -2001,6 +2077,10 @@ const livenessMachine = xstate.createMachine({
                     target: 'checkFaceDetectedBeforeStart',
                     actions: 'updateFaceMatchBeforeStartDetails',
                 },
+                onError: {
+                    target: 'error',
+                    actions: 'updateErrorStateForRuntime',
+                },
             },
         },
         checkFaceDetectedBeforeStart: {
@@ -2019,6 +2099,10 @@ const livenessMachine = xstate.createMachine({
                     target: 'checkFaceDistanceBeforeRecording',
                     actions: 'updateFaceDistanceBeforeRecording',
                 },
+                onError: {
+                    target: 'error',
+                    actions: 'updateErrorStateForRuntime',
+                },
             },
         },
         checkFaceDistanceBeforeRecording: {
@@ -2696,13 +2780,7 @@ const livenessMachine = xstate.createMachine({
             const { videoEl } = context.videoAssociatedParams;
             const { faceDetector } = context.ovalAssociatedParams;
             // initialize models
-            try {
-                await faceDetector.modelLoadingPromise;
-            }
-            catch (err) {
-                // eslint-disable-next-line no-console
-                console.log({ err });
-            }
+            await faceDetector.modelLoadingPromise;
             // detect face
             const faceMatchState = await getFaceMatchState(faceDetector, videoEl);
             return { faceMatchState };
@@ -2734,13 +2812,7 @@ const livenessMachine = xstate.createMachine({
             const { videoEl, canvasEl, isMobile } = context.videoAssociatedParams;
             const { faceDetector } = context.ovalAssociatedParams;
             // initialize models
-            try {
-                await faceDetector.modelLoadingPromise;
-            }
-            catch (err) {
-                // eslint-disable-next-line no-console
-                console.log({ err });
-            }
+            await faceDetector.modelLoadingPromise;
             // detect face
             const detectedFaces = await faceDetector.detectFaces(videoEl);
             let initialFace;

package/dist/styles.css

@@ -1512,11 +1512,11 @@
   --amplify-colors-black: hsl(0, 0%, 0%);
   --amplify-colors-white: hsl(0, 0%, 100%);
   --amplify-colors-transparent: transparent;
-  --amplify-fonts-default-variable: "InterVariable", "Inter var", "Inter", -apple-system, BlinkMacSystemFont,
-          "Helvetica Neue", "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans",
+  --amplify-fonts-default-variable: 'InterVariable', 'Inter var', 'Inter', -apple-system, BlinkMacSystemFont,
+          'Helvetica Neue', 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans',
           sans-serif;
-  --amplify-fonts-default-static: "Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue",
-          "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans", sans-serif;
+  --amplify-fonts-default-static: 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue',
+          'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', sans-serif;
   --amplify-font-sizes-xxxs: 0.375rem;
   --amplify-font-sizes-xxs: 0.5rem;
   --amplify-font-sizes-xs: 0.75rem;
@@ -2067,9 +2067,6 @@ strong.amplify-text {
   border-width: var(--amplify-components-button-menu-border-width);
   background-color: var(--amplify-components-button-menu-background-color);
   justify-content: var(--amplify-components-button-menu-justify-content);
-  --amplify-internal-button-disabled-color: var(
-    --amplify-components-button-menu-disabled-color
-  );
 }
 .amplify-button--menu:hover {
   color: var(--amplify-components-button-menu-hover-color);
@@ -2084,6 +2081,11 @@ strong.amplify-text {
   color: var(--amplify-components-button-menu-active-color);
   background-color: var(--amplify-components-button-menu-active-background-color);
 }
+.amplify-button--menu {
+  --amplify-internal-button-disabled-color: var(
+    --amplify-components-button-menu-disabled-color
+  );
+}
 .amplify-button--primary {
   --amplify-internal-button-border-width: var(
     --amplify-components-button-primary-border-width
@@ -2097,24 +2099,6 @@ strong.amplify-text {
   --amplify-internal-button-color: var(
     --amplify-components-button-primary-color
   );
-  --amplify-internal-button-disabled-border-color: var(
-    --amplify-components-button-primary-disabled-border-color
-  );
-  --amplify-internal-button-disabled-background-color: var(
-    --amplify-components-button-primary-disabled-background-color
-  );
-  --amplify-internal-button-disabled-color: var(
-    --amplify-components-button-primary-disabled-color
-  );
-  --amplify-internal-button-loading-background-color: var(
-    --amplify-components-button-primary-loading-background-color
-  );
-  --amplify-internal-button-loading-border-color: var(
-    --amplify-components-button-primary-loading-border-color
-  );
-  --amplify-internal-button-loading-color: var(
-    --amplify-components-button-primary-loading-color
-  );
 }
 .amplify-button--primary:hover {
   --amplify-internal-button-background-color: var(
@@ -2387,6 +2371,26 @@ strong.amplify-text {
     --amplify-components-button-primary-overlay-active-color
   );
 }
+.amplify-button--primary {
+  --amplify-internal-button-disabled-border-color: var(
+    --amplify-components-button-primary-disabled-border-color
+  );
+  --amplify-internal-button-disabled-background-color: var(
+    --amplify-components-button-primary-disabled-background-color
+  );
+  --amplify-internal-button-disabled-color: var(
+    --amplify-components-button-primary-disabled-color
+  );
+  --amplify-internal-button-loading-background-color: var(
+    --amplify-components-button-primary-loading-background-color
+  );
+  --amplify-internal-button-loading-border-color: var(
+    --amplify-components-button-primary-loading-border-color
+  );
+  --amplify-internal-button-loading-color: var(
+    --amplify-components-button-primary-loading-color
+  );
+}
 .amplify-button--link {
   --amplify-internal-button-border-width: var(
     --amplify-components-button-link-border-width
@@ -2400,24 +2404,6 @@ strong.amplify-text {
   --amplify-internal-button-color: var(
     --amplify-components-button-link-color
   );
-  --amplify-internal-button-disabled-border-color: var(
-    --amplify-components-button-link-disabled-border-color
-  );
-  --amplify-internal-button-disabled-background-color: var(
-    --amplify-components-button-link-disabled-background-color
-  );
-  --amplify-internal-button-disabled-color: var(
-    --amplify-components-button-link-disabled-color
-  );
-  --amplify-internal-button-loading-background-color: var(
-    --amplify-components-button-link-loading-background-color
-  );
-  --amplify-internal-button-loading-border-color: var(
-    --amplify-components-button-link-loading-border-color
-  );
-  --amplify-internal-button-loading-color: var(
-    --amplify-components-button-link-loading-color
-  );
 }
 .amplify-button--link:hover {
   --amplify-internal-button-background-color: var(
@@ -2690,30 +2676,32 @@ strong.amplify-text {
     --amplify-components-button-link-overlay-active-color
   );
 }
-.amplify-button--destructive {
-  border-width: var(--amplify-components-button-destructive-border-width);
-  background-color: var(--amplify-components-button-destructive-background-color);
-  border-color: var(--amplify-components-button-destructive-border-color);
-  color: var(--amplify-components-button-destructive-color);
+.amplify-button--link {
   --amplify-internal-button-disabled-border-color: var(
-    --amplify-components-button-destructive-disabled-border-color
+    --amplify-components-button-link-disabled-border-color
   );
   --amplify-internal-button-disabled-background-color: var(
-    --amplify-components-button-destructive-disabled-background-color
+    --amplify-components-button-link-disabled-background-color
   );
   --amplify-internal-button-disabled-color: var(
-    --amplify-components-button-destructive-disabled-color
+    --amplify-components-button-link-disabled-color
   );
   --amplify-internal-button-loading-background-color: var(
-    --amplify-components-button-destructive-loading-background-color
+    --amplify-components-button-link-loading-background-color
   );
   --amplify-internal-button-loading-border-color: var(
-    --amplify-components-button-destructive-loading-border-color
+    --amplify-components-button-link-loading-border-color
   );
   --amplify-internal-button-loading-color: var(
-    --amplify-components-button-destructive-loading-color
+    --amplify-components-button-link-loading-color
   );
 }
+.amplify-button--destructive {
+  border-width: var(--amplify-components-button-destructive-border-width);
+  background-color: var(--amplify-components-button-destructive-background-color);
+  border-color: var(--amplify-components-button-destructive-border-color);
+  color: var(--amplify-components-button-destructive-color);
+}
 .amplify-button--destructive:hover {
   background-color: var(--amplify-components-button-destructive-hover-background-color);
   border-color: var(--amplify-components-button-destructive-hover-border-color);
@@ -2730,6 +2718,26 @@ strong.amplify-text {
   border-color: var(--amplify-components-button-destructive-active-border-color);
   color: var(--amplify-components-button-destructive-active-color);
 }
+.amplify-button--destructive {
+  --amplify-internal-button-disabled-border-color: var(
+    --amplify-components-button-destructive-disabled-border-color
+  );
+  --amplify-internal-button-disabled-background-color: var(
+    --amplify-components-button-destructive-disabled-background-color
+  );
+  --amplify-internal-button-disabled-color: var(
+    --amplify-components-button-destructive-disabled-color
+  );
+  --amplify-internal-button-loading-background-color: var(
+    --amplify-components-button-destructive-loading-background-color
+  );
+  --amplify-internal-button-loading-border-color: var(
+    --amplify-components-button-destructive-loading-border-color
+  );
+  --amplify-internal-button-loading-color: var(
+    --amplify-components-button-destructive-loading-color
+  );
+}
 .amplify-button--warning {
   background-color: var(--amplify-components-button-warning-background-color);
   border-color: var(--amplify-components-button-warning-border-color);
@@ -2989,22 +2997,6 @@ strong.amplify-text {
   outline-style: var(--amplify-components-fieldcontrol-outline-style);
   outline-width: var(--amplify-components-fieldcontrol-outline-width);
   outline-offset: var(--amplify-components-fieldcontrol-outline-offset);
-  -webkit-user-select: text;
-     -moz-user-select: text;
-          user-select: text;
-  display: inline-block;
-  --amplify-components-fieldcontrol-color: var(
-    --amplify-components-input-color
-  );
-  --amplify-components-fieldcontrol-border-color: var(
-    --amplify-components-input-border-color
-  );
-  --amplify-components-fieldcontrol-font-size: var(
-    --amplify-components-input-font-size
-  );
-  --amplify-components-fieldcontrol-focus-border-color: var(
-    --amplify-components-input-focus-border-color
-  );
 }
 .amplify-input:focus {
   border-color: var(--amplify-components-fieldcontrol-focus-border-color);
@@ -3054,6 +3046,24 @@ strong.amplify-text {
   border-color: var(--amplify-components-fieldcontrol-disabled-border-color);
   background-color: var(--amplify-components-fieldcontrol-disabled-background-color);
 }
+.amplify-input {
+  -webkit-user-select: text;
+     -moz-user-select: text;
+          user-select: text;
+  display: inline-block;
+  --amplify-components-fieldcontrol-color: var(
+    --amplify-components-input-color
+  );
+  --amplify-components-fieldcontrol-border-color: var(
+    --amplify-components-input-border-color
+  );
+  --amplify-components-fieldcontrol-font-size: var(
+    --amplify-components-input-font-size
+  );
+  --amplify-components-fieldcontrol-focus-border-color: var(
+    --amplify-components-input-focus-border-color
+  );
+}
 
 .amplify-textarea {
   box-sizing: border-box;
@@ -3074,11 +3084,6 @@ strong.amplify-text {
   outline-style: var(--amplify-components-fieldcontrol-outline-style);
   outline-width: var(--amplify-components-fieldcontrol-outline-width);
   outline-offset: var(--amplify-components-fieldcontrol-outline-offset);
-  -webkit-user-select: text;
-     -moz-user-select: text;
-          user-select: text;
-  white-space: pre-wrap;
-  max-height: 100%;
 }
 .amplify-textarea:focus {
   border-color: var(--amplify-components-fieldcontrol-focus-border-color);
@@ -3128,6 +3133,13 @@ strong.amplify-text {
   border-color: var(--amplify-components-fieldcontrol-disabled-border-color);
   background-color: var(--amplify-components-fieldcontrol-disabled-background-color);
 }
+.amplify-textarea {
+  -webkit-user-select: text;
+     -moz-user-select: text;
+          user-select: text;
+  white-space: pre-wrap;
+  max-height: 100%;
+}
 
 .amplify-image {
   height: var(--amplify-components-image-height);
@@ -3185,8 +3197,6 @@ strong.amplify-text {
   animation-timing-function: linear;
   animation-iteration-count: infinite;
   animation-duration: var(--amplify-components-loader-animation-duration);
-  stroke: var(--amplify-components-loader-stroke-filled);
-  stroke-linecap: var(--amplify-components-loader-stroke-linecap);
 }
 @media (prefers-reduced-motion) {
   .amplify-loader circle:last-of-type {
@@ -3195,6 +3205,10 @@ strong.amplify-text {
     stroke-dashoffset: 50%;
   }
 }
+.amplify-loader circle:last-of-type {
+  stroke: var(--amplify-components-loader-stroke-filled);
+  stroke-linecap: var(--amplify-components-loader-stroke-linecap);
+}
 .amplify-loader line:last-of-type {
   stroke: var(--amplify-components-loader-linear-stroke-filled);
   stroke-dasharray: 50% 200%;
@@ -3897,6 +3911,9 @@ strong.amplify-text {
   border-color: var(--amplify-internal-checkbox_button-focused-before-border-color);
   box-shadow: var(--amplify-internal-checkbox_button-focused-before-box-shadow);
 }
+.amplify-checkbox__button--error::before {
+  border-color: var(--amplify-components-checkbox-button-error-border-color);
+}
 .amplify-checkbox__button--error {
   --amplify-internal-checkbox_button-focused-before-border-color: var(
     --amplify-components-checkbox-button-error-focus-border-color
@@ -3905,9 +3922,6 @@ strong.amplify-text {
     --amplify-components-checkbox-button-error-focus-box-shadow
   );
 }
-.amplify-checkbox__button--error::before {
-  border-color: var(--amplify-components-checkbox-button-error-border-color);
-}
 .amplify-checkbox__button--disabled::before {
   border-color: var(--amplify-components-checkbox-button-disabled-border-color);
 }
@@ -4166,7 +4180,6 @@ html[dir=rtl] .amplify-field-group__inner-start {
   flex-direction: var(--amplify-components-fieldset-flex-direction);
   gap: var(--amplify-components-fieldset-gap);
   /* Sizes */
-  /* Variations */
 }
 .amplify-fieldset--small {
   gap: var(--amplify-components-fieldset-small-gap);
@@ -4174,6 +4187,9 @@ html[dir=rtl] .amplify-field-group__inner-start {
 .amplify-fieldset--large {
   gap: var(--amplify-components-fieldset-large-gap);
 }
+.amplify-fieldset {
+  /* Variations */
+}
 .amplify-fieldset--outlined {
   border: var(--amplify-components-fieldset-outlined-border-width) var(--amplify-components-fieldset-outlined-border-style) var(--amplify-components-fieldset-outlined-border-color);
   padding: var(--amplify-components-fieldset-outlined-padding);
@@ -5280,11 +5296,6 @@ html[dir=rtl] .amplify-field-group__inner-start {
   outline-style: var(--amplify-components-fieldcontrol-outline-style);
   outline-width: var(--amplify-components-fieldcontrol-outline-width);
   outline-offset: var(--amplify-components-fieldcontrol-outline-offset);
-  background-color: var(--amplify-components-select-background-color);
-  color: var(--amplify-components-select-color);
-  min-width: var(--amplify-components-select-min-width);
-  padding-inline-end: var(--amplify-components-select-padding-inline-end);
-  white-space: var(--amplify-components-select-white-space);
 }
 .amplify-select:focus {
   border-color: var(--amplify-components-fieldcontrol-focus-border-color);
@@ -5334,6 +5345,13 @@ html[dir=rtl] .amplify-field-group__inner-start {
   border-color: var(--amplify-components-fieldcontrol-disabled-border-color);
   background-color: var(--amplify-components-fieldcontrol-disabled-background-color);
 }
+.amplify-select {
+  background-color: var(--amplify-components-select-background-color);
+  color: var(--amplify-components-select-color);
+  min-width: var(--amplify-components-select-min-width);
+  padding-inline-end: var(--amplify-components-select-padding-inline-end);
+  white-space: var(--amplify-components-select-white-space);
+}
 .amplify-select option {
   background-color: var(--amplify-components-select-option-background-color);
   color: var(--amplify-components-select-option-color);
@@ -5595,14 +5613,14 @@ html[dir=rtl] .amplify-field-group__inner-start {
   border-inline-start: none;
 }
 
-.amplify-stepperfield__input {
-  -moz-appearance: textfield;
-  text-align: var(--amplify-components-stepperfield-input-text-align);
-}
 .amplify-stepperfield__input::-webkit-outer-spin-button, .amplify-stepperfield__input::-webkit-inner-spin-button {
   -webkit-appearance: none;
   margin: 0;
 }
+.amplify-stepperfield__input {
+  -moz-appearance: textfield;
+  text-align: var(--amplify-components-stepperfield-input-text-align);
+}
 .amplify-stepperfield__input:not(:focus, [aria-invalid=true]) {
   border-inline-start: none;
   border-inline-end: none;
@@ -5715,9 +5733,6 @@ html[dir=rtl] .amplify-field-group__inner-start {
       --amplify-components-table-header-border-width
     )
     0px var(--amplify-components-table-header-border-width) 0px;
-  /**
-   * Data attribute stylings
-   */
 }
 .amplify-table--small {
   --amplify-internal-table-caption-font-size: var(
@@ -5831,6 +5846,11 @@ html[dir=rtl] .amplify-field-group__inner-start {
 .amplify-table__td:last-child {
   border-right-width: var(--amplify-components-table-data-border-width);
 }
+.amplify-table {
+  /**
+   * Data attribute stylings
+   */
+}
 .amplify-table[data-highlightonhover=true] .amplify-table__row:not(.amplify-table__head *):hover {
   background-color: var(--amplify-components-table-row-hover-background-color);
 }
@@ -5972,6 +5992,13 @@ html[dir=rtl] .amplify-field-group__inner-start {
   --amplify-internal-togglebutton-focus-color: var(
     --amplify-components-togglebutton-focus-color
   );
+}
+.amplify-togglebutton:focus {
+  background-color: var(--amplify-internal-togglebutton-focus-background-color);
+  border-color: var(--amplify-internal-togglebutton-focus-border-color);
+  color: var(--amplify-internal-togglebutton-focus-color);
+}
+.amplify-togglebutton {
   --amplify-internal-togglebutton-hover-background-color: var(
     --amplify-components-togglebutton-hover-background-color
   );
@@ -5981,9 +6008,21 @@ html[dir=rtl] .amplify-field-group__inner-start {
   --amplify-internal-togglebutton-hover-color: var(
     --amplify-internal-togglebutton-color
   );
+}
+.amplify-togglebutton:hover {
+  background-color: var(--amplify-internal-togglebutton-hover-background-color);
+  border-color: var(--amplify-internal-togglebutton-hover-border-color);
+  color: var(--amplify-internal-togglebutton-hover-color);
+}
+.amplify-togglebutton {
   --amplify-internal-togglebutton-active-background-color: var(
     --amplify-components-togglebutton-active-background-color
   );
+}
+.amplify-togglebutton:active {
+  background-color: var(--amplify-internal-togglebutton-active-background-color);
+}
+.amplify-togglebutton {
   --amplify-internal-togglebutton-disabled-background-color: var(
     --amplify-components-togglebutton-disabled-background-color
   );
@@ -5994,19 +6033,6 @@ html[dir=rtl] .amplify-field-group__inner-start {
     --amplify-components-togglebutton-disabled-color
   );
 }
-.amplify-togglebutton:focus {
-  background-color: var(--amplify-internal-togglebutton-focus-background-color);
-  border-color: var(--amplify-internal-togglebutton-focus-border-color);
-  color: var(--amplify-internal-togglebutton-focus-color);
-}
-.amplify-togglebutton:hover {
-  background-color: var(--amplify-internal-togglebutton-hover-background-color);
-  border-color: var(--amplify-internal-togglebutton-hover-border-color);
-  color: var(--amplify-internal-togglebutton-hover-color);
-}
-.amplify-togglebutton:active {
-  background-color: var(--amplify-internal-togglebutton-active-background-color);
-}
 .amplify-togglebutton:disabled {
   background-color: var(--amplify-internal-togglebutton-disabled-background-color);
   border-color: var(--amplify-internal-togglebutton-disabled-border-color);
@@ -6076,6 +6102,11 @@ html[dir=rtl] .amplify-field-group__inner-start {
   --amplify-internal-togglebutton-focus-color: var(
     --amplify-internal-togglebutton-primary-focus-color
   );
+}
+.amplify-togglebutton--primary:focus {
+  box-shadow: var(--amplify-internal-togglebutton-primary-focus-box-shadow);
+}
+.amplify-togglebutton--primary {
   --amplify-internal-togglebutton-primary-hover-background-color: var(
     --amplify-components-togglebutton-primary-hover-background-color
   );
@@ -6113,9 +6144,6 @@ html[dir=rtl] .amplify-field-group__inner-start {
     --amplify-internal-togglebutton-primary-disabled-color
   );
 }
-.amplify-togglebutton--primary:focus {
-  box-shadow: var(--amplify-internal-togglebutton-primary-focus-box-shadow);
-}
 .amplify-togglebutton--pressed {
   --amplify-internal-togglebutton-primary-background-color: var(
     --amplify-components-togglebutton-primary-pressed-background-color
@@ -6144,6 +6172,13 @@ html[dir=rtl] .amplify-field-group__inner-start {
   --amplify-internal-togglebutton-primary-hover-color: var(
     --amplify-components-togglebutton-primary-pressed-hover-color
   );
+}
+.amplify-togglebutton--pressed:hover {
+  --amplify-internal-togglebutton-primary-focus-box-shadow: var(
+    --amplify-components-togglebutton-primary-pressed-hover-box-shadow
+  );
+}
+.amplify-togglebutton--pressed {
   --amplify-internal-togglebutton-primary-disabled-background-color: var(
     --amplify-components-togglebutton-primary-pressed-background-color
   );
@@ -6154,11 +6189,6 @@ html[dir=rtl] .amplify-field-group__inner-start {
     --amplify-components-togglebutton-primary-pressed-color
   );
 }
-.amplify-togglebutton--pressed:hover {
-  --amplify-internal-togglebutton-primary-focus-box-shadow: var(
-    --amplify-components-togglebutton-primary-pressed-hover-box-shadow
-  );
-}
 .amplify-togglebutton--link {
   --amplify-internal-togglebutton-link-background-color: var(
     --amplify-components-togglebutton-link-background-color

package/dist/types/components/FaceLivenessDetector/service/types/faceDetection.d.ts

@@ -22,9 +22,12 @@ export type Coordinate = [number, number];
  */
 export declare abstract class FaceDetection {
     modelLoadingPromise: Promise<void>;
+    private _modelLoadTriggered;
     /**
      * Triggers the `loadModels` method and stores
      * the corresponding promise to be awaited later.
+     * Applies a timeout to prevent indefinite hangs if the
+     * network request for model assets stalls.
      */
     triggerModelLoading(): void;
     /**

package/dist/types/version.d.ts

@@ -1 +1 @@
-export declare const VERSION = "3.6.6";
+export declare const VERSION = "3.6.8";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aws-amplify/ui-react-liveness",
-  "version": "3.6.6",
+  "version": "3.6.8",
   "main": "dist/index.js",
   "module": "dist/esm/index.mjs",
   "exports": {
@@ -9,10 +9,12 @@
       "import": "./dist/esm/index.mjs",
       "require": "./dist/index.js"
     },
-    "./styles.css": "./dist/styles.css"
+    "./styles.css": "./dist/styles.css",
+    "./dist/styles.css": "./dist/styles.css"
   },
   "browser": {
-    "./styles.css": "./dist/styles.css"
+    "./styles.css": "./dist/styles.css",
+    "./dist/styles.css": "./dist/styles.css"
   },
   "types": "dist/types/index.d.ts",
   "sideEffects": [
@@ -49,10 +51,10 @@
     "react-dom": "^16.14 || ^17 || ^18 || ^19"
   },
   "dependencies": {
-    "@aws-amplify/ui": "6.15.4",
-    "@aws-amplify/ui-react": "6.15.4",
-    "@aws-sdk/client-rekognitionstreaming": "3.967.0",
-    "@aws-sdk/util-format-url": "3.965.0",
+    "@aws-amplify/ui": "6.15.5",
+    "@aws-amplify/ui-react": "6.15.5",
+    "@aws-sdk/client-rekognitionstreaming": "^3.974.0",
+    "@aws-sdk/util-format-url": "^3.972.37",
     "@smithy/eventstream-serde-browser": "^4.0.4",
     "@smithy/fetch-http-handler": "^5.0.4",
     "@smithy/protocol-http": "^3.0.3",
@@ -84,7 +86,7 @@
       "name": "FaceLivenessDetector",
       "path": "dist/esm/index.mjs",
       "import": "{ FaceLivenessDetector }",
-      "limit": "229 kB"
+      "limit": "230 kB"
     }
   ]
-}
+}