@aws-amplify/ui-react-liveness 3.0.14 → 3.0.16

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

@@ -1,18 +1,14 @@
 import * as React from 'react';
 import { VisuallyHidden, View } from '@aws-amplify/ui-react';
-import '../service/machine/index.mjs';
+import '../service/machine/machine.mjs';
 import { FaceMatchState, IlluminationState } from '../service/types/liveness.mjs';
 import '@tensorflow/tfjs-core';
 import '@tensorflow-models/face-detection';
 import '@tensorflow/tfjs-backend-wasm';
 import '@tensorflow/tfjs-backend-cpu';
 import '@aws-amplify/core/internals/utils';
-import 'aws-amplify/auth';
 import '@aws-sdk/client-rekognitionstreaming';
-import '@aws-sdk/util-format-url';
-import '@smithy/eventstream-serde-browser';
-import '@smithy/fetch-http-handler';
-import '@smithy/protocol-http';
+import '../service/utils/createStreamingClient/createStreamingClient.mjs';
 import '../service/utils/freshnessColorDisplay.mjs';
 import { useLivenessActor } from '../hooks/useLivenessActor.mjs';
 import { createLivenessSelector, useLivenessSelector } from '../hooks/useLivenessSelector.mjs';
@@ -56,7 +52,6 @@ const Hint = ({ hintDisplayText }) => {
         [FaceMatchState.CANT_IDENTIFY]: hintDisplayText.hintCanNotIdentifyText,
         [FaceMatchState.FACE_IDENTIFIED]: hintDisplayText.hintTooFarText,
         [FaceMatchState.TOO_MANY]: hintDisplayText.hintTooManyFacesText,
-        [FaceMatchState.TOO_CLOSE]: hintDisplayText.hintTooCloseText,
         [FaceMatchState.TOO_FAR]: hintDisplayText.hintTooFarText,
         [FaceMatchState.MATCHED]: hintDisplayText.hintHoldFaceForFreshnessText,
         [FaceMatchState.OFF_CENTER]: hintDisplayText.hintFaceOffCenterText,
@@ -102,13 +97,11 @@ const Hint = ({ hintDisplayText }) => {
         return React.createElement(DefaultToast, { text: hintDisplayText.hintHoldFaceForFreshnessText });
     }
     if (isRecording && !isFlashingFreshness) {
-        // During face matching, we want to only show the TOO_CLOSE or
-        // TOO_FAR texts. If FaceMatchState matches TOO_CLOSE, we'll show
-        // the TOO_CLOSE text, but for FACE_IDENTIFED, CANT_IDENTIFY, TOO_MANY
+        // During face matching, we want to only show the
+        // TOO_FAR texts. For FACE_IDENTIFIED, CANT_IDENTIFY, TOO_MANY
         // we are defaulting to the TOO_FAR text (for now).
         let resultHintString = FaceMatchStateStringMap[FaceMatchState.TOO_FAR];
-        if (faceMatchState === FaceMatchState.TOO_CLOSE ||
-            faceMatchState === FaceMatchState.MATCHED) {
+        if (faceMatchState === FaceMatchState.MATCHED) {
             resultHintString = FaceMatchStateStringMap[faceMatchState];
         }
         // If the face is outside the oval set the aria-label to a string about centering face in oval
@@ -122,7 +115,7 @@ const Hint = ({ hintDisplayText }) => {
             faceMatchPercentage > 50) {
             a11yHintString = hintDisplayText.hintMatchIndicatorText;
         }
-        return (React.createElement(Toast, { size: "large", variation: faceMatchState === FaceMatchState.TOO_CLOSE ? 'error' : 'primary' },
+        return (React.createElement(Toast, { size: "large", variation: 'primary' },
             React.createElement(VisuallyHidden, { "aria-live": "assertive" }, a11yHintString),
             React.createElement(View, { "aria-label": a11yHintString }, resultHintString)));
     }

package/dist/esm/version.mjs

@@ -1,3 +1,3 @@
-const VERSION = '3.0.14';
+const VERSION = '3.0.16';
 
 export { VERSION };

package/dist/index.js

@@ -17,6 +17,7 @@ var utilFormatUrl = require('@aws-sdk/util-format-url');
 var eventstreamSerdeBrowser = require('@smithy/eventstream-serde-browser');
 var fetchHttpHandler = require('@smithy/fetch-http-handler');
 var protocolHttp = require('@smithy/protocol-http');
+var signatureV4 = require('@smithy/signature-v4');
 var uiReact = require('@aws-amplify/ui-react');
 var ui = require('@aws-amplify/ui');
 var internal = require('@aws-amplify/ui-react/internal');
@@ -74,7 +75,6 @@ var FaceMatchState;
 (function (FaceMatchState) {
     FaceMatchState["MATCHED"] = "MATCHED";
     FaceMatchState["TOO_FAR"] = "TOO FAR";
-    FaceMatchState["TOO_CLOSE"] = "TOO CLOSE";
     FaceMatchState["CANT_IDENTIFY"] = "CANNOT IDENTIFY";
     FaceMatchState["FACE_IDENTIFIED"] = "ONE FACE IDENTIFIED";
     FaceMatchState["TOO_MANY"] = "TOO MANY FACES";
@@ -98,12 +98,20 @@ const LivenessErrorState = {
 
 // 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.
-// These FACE_DISTNACE_THRESHOLD values are determined by the science team and should only be changed with their approval.
+// These FACE_DISTANCE_THRESHOLD values are determined by the science team and should only be changed with their approval.
 // We want to ensure at the start of a  check that the user's pupilDistance/ovalWidth is below FACE_DISTANCE_THRESHOLD to ensure that they are starting
 //  a certain distance away from the camera.
 const FACE_DISTANCE_THRESHOLD = 0.32;
 const REDUCED_THRESHOLD = 0.4;
 const REDUCED_THRESHOLD_MOBILE = 0.37;
+// 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 WS_CLOSURE_CODE = {
     SUCCESS_CODE: 1000,
     DEFAULT_ERROR_CODE: 4000,
@@ -291,87 +299,33 @@ function getPupilDistanceAndFaceHeight(face) {
     const faceHeight = Math.sqrt((eyeCenter[0] - mouth[0]) ** 2 + (eyeCenter[1] - mouth[1]) ** 2);
     return { pupilDistance, faceHeight };
 }
-function generateBboxFromLandmarks(face, oval) {
-    const { leftEye, rightEye, nose, leftEar, rightEar, top: faceTop, height: faceHeight, } = face;
+function generateBboxFromLandmarks(face, oval, frameHeight) {
+    const { leftEye, rightEye, nose, leftEar, rightEar } = face;
     const { height: ovalHeight, centerY } = oval;
     const ovalTop = centerY - ovalHeight / 2;
     const eyeCenter = [];
     eyeCenter[0] = (leftEye[0] + rightEye[0]) / 2;
     eyeCenter[1] = (leftEye[1] + rightEye[1]) / 2;
     const { pupilDistance: pd, faceHeight: fh } = getPupilDistanceAndFaceHeight(face);
-    const alpha = 2.0, gamma = 1.8;
-    const ow = (alpha * pd + gamma * fh) / 2;
-    const oh = 1.618 * ow;
-    let cx;
+    const ocularWidth = (PUPIL_DISTANCE_WEIGHT * pd + FACE_HEIGHT_WEIGHT * fh) / 2;
+    let centerFaceX, centerFaceY;
     if (eyeCenter[1] <= (ovalTop + ovalHeight) / 2) {
-        cx = (eyeCenter[0] + nose[0]) / 2;
+        centerFaceX = (eyeCenter[0] + nose[0]) / 2;
+        centerFaceY = (eyeCenter[1] + nose[1]) / 2;
     }
     else {
-        cx = eyeCenter[0];
-    }
-    const bottom = faceTop + faceHeight;
-    const top = bottom - oh;
-    const left = Math.min(cx - ow / 2, rightEar[0]);
-    const right = Math.max(cx + ow / 2, leftEar[0]);
+        // when face tilts down
+        centerFaceX = eyeCenter[0];
+        centerFaceY = eyeCenter[1];
+    }
+    const faceWidth = ocularWidth;
+    const faceHeight = 1.68 * faceWidth;
+    const top = Math.max(centerFaceY - faceHeight / 2, 0);
+    const bottom = Math.min(centerFaceY + faceHeight / 2, frameHeight);
+    const left = Math.min(centerFaceX - ocularWidth / 2, rightEar[0]);
+    const right = Math.max(centerFaceX + ocularWidth / 2, leftEar[0]);
     return { bottom, left, right, top };
 }
-/**
- * Returns the state of the provided face with respect to the provided liveness oval.
- */
-// eslint-disable-next-line max-params
-function getFaceMatchStateInLivenessOval(face, ovalDetails, initialFaceIntersection, sessionInformation) {
-    let faceMatchState;
-    const challengeConfig = sessionInformation?.Challenge?.FaceMovementAndLightChallenge
-        ?.ChallengeConfig;
-    if (!challengeConfig ||
-        !challengeConfig.OvalIouThreshold ||
-        !challengeConfig.OvalIouHeightThreshold ||
-        !challengeConfig.OvalIouWidthThreshold ||
-        !challengeConfig.FaceIouHeightThreshold ||
-        !challengeConfig.FaceIouWidthThreshold) {
-        throw new Error('Challenge information not returned from session information.');
-    }
-    const { OvalIouThreshold, OvalIouHeightThreshold, OvalIouWidthThreshold, FaceIouHeightThreshold, FaceIouWidthThreshold, } = challengeConfig;
-    const faceBoundingBox = generateBboxFromLandmarks(face, ovalDetails);
-    const minFaceX = faceBoundingBox.left;
-    const maxFaceX = faceBoundingBox.right;
-    const minFaceY = faceBoundingBox.top;
-    const maxFaceY = faceBoundingBox.bottom;
-    const { ovalBoundingBox, minOvalX, minOvalY, maxOvalX, maxOvalY } = getOvalBoundingBox(ovalDetails);
-    const intersection = getIntersectionOverUnion(faceBoundingBox, ovalBoundingBox);
-    const intersectionThreshold = OvalIouThreshold;
-    const ovalMatchWidthThreshold = ovalDetails.width * OvalIouWidthThreshold;
-    const ovalMatchHeightThreshold = ovalDetails.height * OvalIouHeightThreshold;
-    const faceDetectionWidthThreshold = ovalDetails.width * FaceIouWidthThreshold;
-    const faceDetectionHeightThreshold = ovalDetails.height * FaceIouHeightThreshold;
-    /** From Science
-     * p=max(min(1,0.75∗(si−s0)/(st−s0)+0.25)),0)
-     */
-    const faceMatchPercentage = Math.max(Math.min(1, (0.75 * (intersection - initialFaceIntersection)) /
-        (intersectionThreshold - initialFaceIntersection) +
-        0.25), 0) * 100;
-    const faceIsOutsideOvalToTheLeft = minOvalX > minFaceX && maxOvalX > maxFaceX;
-    const faceIsOutsideOvalToTheRight = minFaceX > minOvalX && maxFaceX > maxOvalX;
-    if (intersection > intersectionThreshold &&
-        Math.abs(minOvalX - minFaceX) < ovalMatchWidthThreshold &&
-        Math.abs(maxOvalX - maxFaceX) < ovalMatchWidthThreshold &&
-        Math.abs(maxOvalY - maxFaceY) < ovalMatchHeightThreshold) {
-        faceMatchState = FaceMatchState.MATCHED;
-    }
-    else if (faceIsOutsideOvalToTheLeft || faceIsOutsideOvalToTheRight) {
-        faceMatchState = FaceMatchState.OFF_CENTER;
-    }
-    else if (minOvalY - minFaceY > faceDetectionHeightThreshold ||
-        maxFaceY - maxOvalY > faceDetectionHeightThreshold ||
-        (minOvalX - minFaceX > faceDetectionWidthThreshold &&
-            maxFaceX - maxOvalX > faceDetectionWidthThreshold)) {
-        faceMatchState = FaceMatchState.TOO_CLOSE;
-    }
-    else {
-        faceMatchState = FaceMatchState.TOO_FAR;
-    }
-    return { faceMatchState, faceMatchPercentage };
-}
 /**
  * Returns the illumination state in the provided video frame.
  */
@@ -547,8 +501,10 @@ async function isFaceDistanceBelowThreshold({ faceDetector, videoEl, ovalDetails
             detectedFace = detectedFaces[0];
             const { width } = ovalDetails;
             const { pupilDistance, faceHeight } = getPupilDistanceAndFaceHeight(detectedFace);
-            const alpha = 2.0, gamma = 1.8;
-            const calibratedPupilDistance = (alpha * pupilDistance + gamma * faceHeight) / 2 / alpha;
+            const calibratedPupilDistance = (PUPIL_DISTANCE_WEIGHT * pupilDistance +
+                FACE_HEIGHT_WEIGHT * faceHeight) /
+                2 /
+                PUPIL_DISTANCE_WEIGHT;
             if (width) {
                 isDistanceBelowThreshold =
                     calibratedPupilDistance / width <
@@ -781,7 +737,61 @@ class VideoRecorder {
     }
 }
 
-const VERSION = '3.0.14';
+/**
+ * Returns the state of the provided face with respect to the provided liveness oval.
+ */
+function getFaceMatchStateInLivenessOval({ face, ovalDetails, initialFaceIntersection, sessionInformation, frameHeight, }) {
+    let faceMatchState;
+    const challengeConfig = sessionInformation?.Challenge?.FaceMovementAndLightChallenge
+        ?.ChallengeConfig;
+    if (!challengeConfig ||
+        !challengeConfig.OvalIouThreshold ||
+        !challengeConfig.OvalIouHeightThreshold ||
+        !challengeConfig.OvalIouWidthThreshold ||
+        !challengeConfig.FaceIouHeightThreshold ||
+        !challengeConfig.FaceIouWidthThreshold) {
+        throw new Error('Challenge information not returned from session information.');
+    }
+    const { OvalIouThreshold, FaceIouHeightThreshold, FaceIouWidthThreshold } = challengeConfig;
+    const faceBoundingBox = generateBboxFromLandmarks(face, ovalDetails, frameHeight);
+    const minFaceX = faceBoundingBox.left;
+    const maxFaceX = faceBoundingBox.right;
+    const minFaceY = faceBoundingBox.top;
+    const maxFaceY = faceBoundingBox.bottom;
+    const { ovalBoundingBox, minOvalX, minOvalY, maxOvalX, maxOvalY } = getOvalBoundingBox(ovalDetails);
+    const intersection = getIntersectionOverUnion(faceBoundingBox, ovalBoundingBox);
+    const intersectionThreshold = OvalIouThreshold;
+    const faceDetectionWidthThreshold = ovalDetails.width * FaceIouWidthThreshold;
+    const faceDetectionHeightThreshold = ovalDetails.height * FaceIouHeightThreshold;
+    /** From Science
+     * p=max(min(1,0.75∗(si−s0)/(st−s0)+0.25)),0)
+     */
+    const faceMatchPercentage = Math.max(Math.min(FACE_MATCH_RANGE_MAX, (FACE_MATCH_WEIGHT_MAX * (intersection - initialFaceIntersection)) /
+        (intersectionThreshold - initialFaceIntersection) +
+        FACE_MATCH_WEIGHT_MIN), FACE_MATCH_RANGE_MIN) * 100;
+    const isFaceOutsideOvalToTheLeft = minOvalX > minFaceX && maxOvalX > maxFaceX;
+    const isFaceOutsideOvalToTheRight = minFaceX > minOvalX && maxFaceX > maxOvalX;
+    const isFaceMatched = intersection > intersectionThreshold;
+    const isFaceMatchedClosely = minOvalY - minFaceY > faceDetectionHeightThreshold ||
+        maxFaceY - maxOvalY > faceDetectionHeightThreshold ||
+        (minOvalX - minFaceX > faceDetectionWidthThreshold &&
+            maxFaceX - maxOvalX > faceDetectionWidthThreshold);
+    if (isFaceMatched) {
+        faceMatchState = FaceMatchState.MATCHED;
+    }
+    else if (isFaceOutsideOvalToTheLeft || isFaceOutsideOvalToTheRight) {
+        faceMatchState = FaceMatchState.OFF_CENTER;
+    }
+    else if (isFaceMatchedClosely) {
+        faceMatchState = FaceMatchState.MATCHED;
+    }
+    else {
+        faceMatchState = FaceMatchState.TOO_FAR;
+    }
+    return { faceMatchState, faceMatchPercentage };
+}
+
+const VERSION = '3.0.16';
 
 const BASE_USER_AGENT = `ui-react-liveness/${VERSION}`;
 const getLivenessUserAgent = () => {
@@ -980,6 +990,75 @@ class CustomWebSocketFetchHandler {
     }
 }
 
+const isCredentialsProvider = (credentialsProvider) => typeof credentialsProvider === 'function';
+// the return interface of `fetchAuthSession` includes `credentials` as
+// optional, but `credentials` is always returned. If `fetchAuthSession`
+// is called for an unauthenticated end user, values of `accessKeyId`
+// and `secretAccessKey` are `undefined`
+const isCredentials = (credentials) => !!(credentials?.accessKeyId && credentials?.secretAccessKey);
+/**
+ * Resolves the `credentials` param to be passed to `RekognitionStreamingClient` which accepts either:
+ * - a `credentials` object
+ * - a `credentialsProvider` callback
+ *
+ * @param credentialsProvider optional `credentialsProvider` callback
+ * @returns {Promise<AwsCredentials | AwsCredentialProvider>} `credentials` object or valid `credentialsProvider` callback
+ */
+async function resolveCredentials(credentialsProvider) {
+    const hasCredentialsProvider = isCredentialsProvider(credentialsProvider);
+    if (hasCredentialsProvider) {
+        return credentialsProvider;
+    }
+    if (credentialsProvider && !hasCredentialsProvider) {
+        throw new Error('Invalid credentialsProvider');
+    }
+    try {
+        const result = (await auth.fetchAuthSession()).credentials;
+        if (isCredentials(result)) {
+            return result;
+        }
+        throw new Error('Missing credentials');
+    }
+    catch (e) {
+        const { message } = e;
+        throw new Error(`Invalid credentials: ${message}`);
+    }
+}
+
+// override aws sdk default value of 60
+const REQUEST_EXPIRY = 299;
+class Signer extends signatureV4.SignatureV4 {
+    presign(request, options) {
+        return super.presign(request, {
+            ...options,
+            expiresIn: REQUEST_EXPIRY,
+            // `headers` that should not be signed. Liveness WebSocket
+            // request omits `headers` except for required `host` header. Signature
+            // could be a mismatch if other `headers` are signed
+            unsignableHeaders: new Set(Object.keys(request.headers).filter((header) => header !== 'host')),
+        });
+    }
+}
+
+const CONNECTION_TIMEOUT = 10000;
+const CUSTOM_USER_AGENT = `${utils.getAmplifyUserAgent()} ${getLivenessUserAgent()}`;
+async function createStreamingClient({ credentialsProvider, endpointOverride, region, }) {
+    const credentials = await resolveCredentials(credentialsProvider);
+    const clientconfig = {
+        credentials,
+        customUserAgent: CUSTOM_USER_AGENT,
+        region,
+        requestHandler: new CustomWebSocketFetchHandler({
+            connectionTimeout: CONNECTION_TIMEOUT,
+        }),
+        signerConstructor: Signer,
+    };
+    if (endpointOverride) {
+        clientconfig.endpointProvider = () => ({ url: new URL(endpointOverride) });
+    }
+    return new clientRekognitionstreaming.RekognitionStreamingClient(clientconfig);
+}
+
 const TIME_SLICE = 1000;
 function isBlob(obj) {
     return obj.arrayBuffer !== undefined;
@@ -1009,9 +1088,7 @@ class LivenessStreamProvider {
         this.videoRecorder.start(TIME_SLICE);
     }
     sendClientInfo(clientInfo) {
-        this.videoRecorder.dispatch(new MessageEvent('clientSesssionInfo', {
-            data: { clientInfo },
-        }));
+        this.videoRecorder.dispatch(new MessageEvent('clientSesssionInfo', { data: { clientInfo } }));
     }
     async stopVideo() {
         await this.videoRecorder.stop();
@@ -1023,32 +1100,15 @@ class LivenessStreamProvider {
         if (this.videoRecorder.getState() === 'recording') {
             await this.stopVideo();
         }
-        this.videoRecorder.dispatch(new MessageEvent('endStreamWithCode', {
-            data: { code: code },
-        }));
+        this.videoRecorder.dispatch(new MessageEvent('endStreamWithCode', { data: { code } }));
         return;
     }
     async init() {
-        const credentials = this.credentialProvider ?? (await auth.fetchAuthSession()).credentials;
-        if (!credentials) {
-            throw new Error('No credentials');
-        }
-        const clientconfig = {
-            credentials,
+        this._client = await createStreamingClient({
+            credentialsProvider: this.credentialProvider,
+            endpointOverride: this.endpointOverride,
             region: this.region,
-            customUserAgent: `${utils.getAmplifyUserAgent()} ${getLivenessUserAgent()}`,
-            requestHandler: new CustomWebSocketFetchHandler({
-                connectionTimeout: 10000,
-            }),
-        };
-        if (this.endpointOverride) {
-            const override = this.endpointOverride;
-            clientconfig.endpointProvider = () => {
-                const url = new URL(override);
-                return { url };
-            };
-        }
-        this._client = new clientRekognitionstreaming.RekognitionStreamingClient(clientconfig);
+        });
         this.responseStream = await this.startLivenessVideoConnection();
     }
     // Creates a generator from a stream of video chunks and livenessActionDocuments and yields VideoEvent and ClientEvents
@@ -1289,7 +1349,6 @@ const STATIC_VIDEO_CONSTRAINTS = {
 
 const CAMERA_ID_KEY = 'AmplifyLivenessCameraId';
 const DEFAULT_FACE_FIT_TIMEOUT = 7000;
-const MIN_FACE_MATCH_TIME = 1000;
 let responseStream;
 const responseStreamActor = async (callback) => {
     try {
@@ -1379,7 +1438,6 @@ const livenessMachine = xstate.createMachine({
             currentDetectedFace: undefined,
             startFace: undefined,
             endFace: undefined,
-            initialFaceMatchTime: undefined,
         },
         freshnessColorAssociatedParams: {
             freshnessColorEl: undefined,
@@ -1564,6 +1622,8 @@ const livenessMachine = xstate.createMachine({
                         100: { target: 'checkRecordingStarted' },
                     },
                 },
+                // Evaluates face match and moves to checkMatch
+                // which continually checks for match until either timeout or face match
                 ovalMatching: {
                     entry: 'cancelOvalDrawingTimeout',
                     invoke: {
@@ -1574,29 +1634,32 @@ const livenessMachine = xstate.createMachine({
                         },
                     },
                 },
+                // If `hasFaceMatchedInOval` is true, then move to `delayBeforeFlash`, which pauses 
+                // for one second to show "Hold still" text before moving to `flashFreshnessColors`.
+                // If not, move back to ovalMatching and re-evaluate match state
                 checkMatch: {
                     after: {
                         0: {
-                            target: 'flashFreshnessColors',
-                            cond: 'hasFaceMatchedInOvalWithMinTime',
+                            target: 'delayBeforeFlash',
+                            cond: 'hasFaceMatchedInOval',
                             actions: [
+                                'setFaceMatchTimeAndStartFace',
                                 'updateEndFaceMatch',
                                 'setupFlashFreshnessColors',
                                 'cancelOvalMatchTimeout',
                                 'cancelOvalDrawingTimeout',
                             ],
                         },
-                        0.1: {
-                            target: 'ovalMatching',
-                            cond: 'hasFaceMatchedInOval',
-                            actions: 'setFaceMatchTimeAndStartFace',
-                        },
                         1: {
                             target: 'ovalMatching',
-                            cond: 'hasNotFaceMatchedInOval',
                         },
                     },
                 },
+                delayBeforeFlash: {
+                    after: {
+                        1000: 'flashFreshnessColors',
+                    },
+                },
                 flashFreshnessColors: {
                     invoke: {
                         src: 'flashColors',
@@ -1861,10 +1924,6 @@ const livenessMachine = xstate.createMachine({
                     startFace: context.faceMatchAssociatedParams.startFace === undefined
                         ? context.faceMatchAssociatedParams.currentDetectedFace
                         : context.faceMatchAssociatedParams.startFace,
-                    initialFaceMatchTime: context.faceMatchAssociatedParams.initialFaceMatchTime ===
-                        undefined
-                        ? Date.now()
-                        : context.faceMatchAssociatedParams.initialFaceMatchTime,
                 };
             },
         }),
@@ -2036,21 +2095,10 @@ const livenessMachine = xstate.createMachine({
     },
     guards: {
         shouldTimeoutOnFailedAttempts: (context) => context.failedAttempts >= context.maxFailedAttempts,
-        hasFaceMatchedInOvalWithMinTime: (context) => {
-            const { faceMatchState, initialFaceMatchTime } = context.faceMatchAssociatedParams;
-            const timeSinceInitialFaceMatch = Date.now() - initialFaceMatchTime;
-            const hasMatched = faceMatchState === FaceMatchState.MATCHED &&
-                timeSinceInitialFaceMatch >= MIN_FACE_MATCH_TIME;
-            return hasMatched;
-        },
         hasFaceMatchedInOval: (context) => {
             return (context.faceMatchAssociatedParams.faceMatchState ===
                 FaceMatchState.MATCHED);
         },
-        hasNotFaceMatchedInOval: (context) => {
-            return (context.faceMatchAssociatedParams.faceMatchState !==
-                FaceMatchState.MATCHED);
-        },
         hasSingleFace: (context) => {
             return (context.faceMatchAssociatedParams.faceMatchState ===
                 FaceMatchState.FACE_IDENTIFIED);
@@ -2267,7 +2315,7 @@ const livenessMachine = xstate.createMachine({
                 videoWidth: videoEl.width,
             });
             // renormalize initial face
-            const renormalizedFace = generateBboxFromLandmarks(initialFace, ovalDetails);
+            const renormalizedFace = generateBboxFromLandmarks(initialFace, ovalDetails, videoEl.videoHeight);
             initialFace.top = renormalizedFace.top;
             initialFace.left = renormalizedFace.left;
             initialFace.height = renormalizedFace.bottom - renormalizedFace.top;
@@ -2296,7 +2344,7 @@ const livenessMachine = xstate.createMachine({
             let faceMatchPercentage = 0;
             let detectedFace;
             let illuminationState;
-            const initialFaceBoundingBox = generateBboxFromLandmarks(initialFace, ovalDetails);
+            const initialFaceBoundingBox = generateBboxFromLandmarks(initialFace, ovalDetails, videoEl.videoHeight);
             const { ovalBoundingBox } = getOvalBoundingBox(ovalDetails);
             const initialFaceIntersection = getIntersectionOverUnion(initialFaceBoundingBox, ovalBoundingBox);
             switch (detectedFaces.length) {
@@ -2309,7 +2357,13 @@ const livenessMachine = xstate.createMachine({
                 case 1: {
                     //exactly one face detected, match face with oval;
                     detectedFace = detectedFaces[0];
-                    const { faceMatchState: faceMatchStateInLivenessOval, faceMatchPercentage: faceMatchPercentageInLivenessOval, } = getFaceMatchStateInLivenessOval(detectedFace, ovalDetails, initialFaceIntersection, serverSessionInformation);
+                    const { faceMatchState: faceMatchStateInLivenessOval, faceMatchPercentage: faceMatchPercentageInLivenessOval, } = getFaceMatchStateInLivenessOval({
+                        face: detectedFace,
+                        ovalDetails: ovalDetails,
+                        initialFaceIntersection,
+                        sessionInformation: serverSessionInformation,
+                        frameHeight: videoEl.videoHeight,
+                    });
                     faceMatchState = faceMatchStateInLivenessOval;
                     faceMatchPercentage = faceMatchPercentageInLivenessOval;
                     break;
@@ -2564,7 +2618,6 @@ const Hint = ({ hintDisplayText }) => {
         [FaceMatchState.CANT_IDENTIFY]: hintDisplayText.hintCanNotIdentifyText,
         [FaceMatchState.FACE_IDENTIFIED]: hintDisplayText.hintTooFarText,
         [FaceMatchState.TOO_MANY]: hintDisplayText.hintTooManyFacesText,
-        [FaceMatchState.TOO_CLOSE]: hintDisplayText.hintTooCloseText,
         [FaceMatchState.TOO_FAR]: hintDisplayText.hintTooFarText,
         [FaceMatchState.MATCHED]: hintDisplayText.hintHoldFaceForFreshnessText,
         [FaceMatchState.OFF_CENTER]: hintDisplayText.hintFaceOffCenterText,
@@ -2610,13 +2663,11 @@ const Hint = ({ hintDisplayText }) => {
         return React__namespace.createElement(DefaultToast, { text: hintDisplayText.hintHoldFaceForFreshnessText });
     }
     if (isRecording && !isFlashingFreshness) {
-        // During face matching, we want to only show the TOO_CLOSE or
-        // TOO_FAR texts. If FaceMatchState matches TOO_CLOSE, we'll show
-        // the TOO_CLOSE text, but for FACE_IDENTIFED, CANT_IDENTIFY, TOO_MANY
+        // During face matching, we want to only show the
+        // TOO_FAR texts. For FACE_IDENTIFIED, CANT_IDENTIFY, TOO_MANY
         // we are defaulting to the TOO_FAR text (for now).
         let resultHintString = FaceMatchStateStringMap[FaceMatchState.TOO_FAR];
-        if (faceMatchState === FaceMatchState.TOO_CLOSE ||
-            faceMatchState === FaceMatchState.MATCHED) {
+        if (faceMatchState === FaceMatchState.MATCHED) {
             resultHintString = FaceMatchStateStringMap[faceMatchState];
         }
         // If the face is outside the oval set the aria-label to a string about centering face in oval
@@ -2630,7 +2681,7 @@ const Hint = ({ hintDisplayText }) => {
             faceMatchPercentage > 50) {
             a11yHintString = hintDisplayText.hintMatchIndicatorText;
         }
-        return (React__namespace.createElement(Toast, { size: "large", variation: faceMatchState === FaceMatchState.TOO_CLOSE ? 'error' : 'primary' },
+        return (React__namespace.createElement(Toast, { size: "large", variation: 'primary' },
             React__namespace.createElement(uiReact.VisuallyHidden, { "aria-live": "assertive" }, a11yHintString),
             React__namespace.createElement(uiReact.View, { "aria-label": a11yHintString }, resultHintString)));
     }

package/dist/types/components/FaceLivenessDetector/service/machine/index.d.ts

@@ -1,5 +1 @@
-import { LivenessContext, LivenessEvent } from '../types';
-export declare const livenessMachine: import("xstate").StateMachine<LivenessContext, any, LivenessEvent, {
-    value: any;
-    context: LivenessContext;
-}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, LivenessEvent, import("xstate").BaseActionObject, import("xstate").ServiceMap>>;
+export { livenessMachine } from './machine';

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

@@ -0,0 +1,5 @@
+import { LivenessContext, LivenessEvent } from '../types';
+export declare const livenessMachine: import("xstate").StateMachine<LivenessContext, any, LivenessEvent, {
+    value: any;
+    context: LivenessContext;
+}, import("xstate").BaseActionObject, import("xstate").ServiceMap, import("xstate").ResolveTypegenMeta<import("xstate").TypegenDisabled, LivenessEvent, import("xstate").BaseActionObject, import("xstate").ServiceMap>>;

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

@@ -1,16 +1,15 @@
+import { CredentialsAndIdentityId } from 'aws-amplify/auth';
+export type AwsCredentials = CredentialsAndIdentityId['credentials'];
+export interface IdentityProvider<IdentityT extends AwsCredentials> {
+    (identityProperties?: Record<string, any>): Promise<IdentityT>;
+}
 /**
- * These types are copied over / adapted from the aws-sdk/types package as they do not semantic versioning and we do not want these changing unexpectedly.
- * When Amplify Auth exports these types this file should be removed and the type definitions should come from the Amplify auth package
+ * @deprecated `AwsTemporaryCredentials` has been replaced with `AwsCredentials`.
+ *
+ * The `AwsTemporaryCredentials` type may be removed in a future major version of _@aws-amplify/ui-react-liveness_.
  */
-export interface AwsCredentials {
-    readonly accessKeyId: string;
-    readonly secretAccessKey: string;
-}
 export interface AwsTemporaryCredentials extends AwsCredentials {
     readonly sessionToken?: string;
     readonly expiration?: Date;
 }
-export interface IdentityProvider<IdentityT extends AwsTemporaryCredentials> {
-    (identityProperties?: Record<string, any>): Promise<IdentityT>;
-}
-export type AwsCredentialProvider = IdentityProvider<AwsTemporaryCredentials>;
+export type AwsCredentialProvider = IdentityProvider<AwsCredentials>;

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

@@ -98,7 +98,6 @@ export declare enum IlluminationState {
 export declare enum FaceMatchState {
     MATCHED = "MATCHED",
     TOO_FAR = "TOO FAR",
-    TOO_CLOSE = "TOO CLOSE",
     CANT_IDENTIFY = "CANNOT IDENTIFY",
     FACE_IDENTIFIED = "ONE FACE IDENTIFIED",
     TOO_MANY = "TOO MANY FACES",

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

@@ -11,7 +11,6 @@ export interface FaceMatchAssociatedParams {
     currentDetectedFace?: Face;
     startFace?: Face;
     endFace?: Face;
-    initialFaceMatchTime?: number;
 }
 export interface FreshnessColorAssociatedParams {
     freshnessColorEl?: HTMLCanvasElement;

package/dist/types/components/FaceLivenessDetector/service/utils/constants.d.ts

@@ -1,6 +1,12 @@
 export declare const FACE_DISTANCE_THRESHOLD = 0.32;
 export declare const REDUCED_THRESHOLD = 0.4;
 export declare const REDUCED_THRESHOLD_MOBILE = 0.37;
+export declare const PUPIL_DISTANCE_WEIGHT = 2;
+export declare const FACE_HEIGHT_WEIGHT = 1.8;
+export declare const FACE_MATCH_RANGE_MIN = 0;
+export declare const FACE_MATCH_RANGE_MAX = 1;
+export declare const FACE_MATCH_WEIGHT_MIN = 0.25;
+export declare const FACE_MATCH_WEIGHT_MAX = 0.75;
 export declare const WS_CLOSURE_CODE: {
     SUCCESS_CODE: number;
     DEFAULT_ERROR_CODE: number;

package/dist/types/components/FaceLivenessDetector/service/utils/createStreamingClient/Signer.d.ts

@@ -0,0 +1,6 @@
+import { SignatureV4 } from '@smithy/signature-v4';
+import { HttpRequest as HttpRequest, RequestPresigningArguments } from '@smithy/types';
+export declare const REQUEST_EXPIRY = 299;
+export declare class Signer extends SignatureV4 {
+    presign(request: HttpRequest, options?: Omit<RequestPresigningArguments, 'expiresIn'>): Promise<HttpRequest>;
+}

package/dist/types/components/FaceLivenessDetector/service/utils/createStreamingClient/createStreamingClient.d.ts

@@ -0,0 +1,9 @@
+import { RekognitionStreamingClient } from '@aws-sdk/client-rekognitionstreaming';
+import { AwsCredentialProvider } from '../../types';
+interface CreateClientConfig {
+    credentialsProvider?: AwsCredentialProvider;
+    endpointOverride?: string;
+    region: string;
+}
+export declare function createStreamingClient({ credentialsProvider, endpointOverride, region, }: CreateClientConfig): Promise<RekognitionStreamingClient>;
+export {};

package/dist/types/components/FaceLivenessDetector/service/utils/createStreamingClient/index.d.ts

@@ -0,0 +1 @@
+export { createStreamingClient } from './createStreamingClient';