idmission-web-sdk 1.0.343 → 1.0.345

package/dist/components/face_liveness/FaceLivenessCapture.d.ts

@@ -2,7 +2,7 @@ import { ReactElement } from 'react';
 import { SelfieCaptureClassNames, SelfieCaptureColors, SelfieCaptureVerbiage } from '../selfie_capture/SelfieCapture';
 import { SelfieProgressPreviewClassNames } from '../common/SelfieProgressPreview';
 import { CustomerSuppliedVerbiage } from '../../lib/locales';
-import { SelfieCaptureLoadingOverlayProps } from "../selfie_capture/SelfieCaptureLoadingOverlay";
+import { SelfieCaptureLoadingOverlayProps } from '../selfie_capture/SelfieCaptureLoadingOverlay';
 export type FaceLivenessCaptureClassNames = SelfieCaptureClassNames & {
     imagePreview?: SelfieProgressPreviewClassNames;
 };

package/dist/components/fallback_flows/SelfieCapture.d.ts

@@ -1,7 +1,7 @@
 import { ReactElement } from 'react';
 import { CustomerSuppliedVerbiage } from '../../lib/locales';
 import { LoaderButtonColors } from '../common/LoaderButton';
-import { SelfieCaptureLoadingOverlayProps } from "../selfie_capture/SelfieCaptureLoadingOverlay";
+import { SelfieCaptureLoadingOverlayProps } from '../selfie_capture/SelfieCaptureLoadingOverlay';
 export type SelfieCaptureFallbackClassNames = {
     container?: string;
     inner?: string;
@@ -33,4 +33,4 @@ export type SelfieCaptureFallbackProps = {
     silentFallback?: boolean;
     selfieCaptureLoadingOverlayProps?: SelfieCaptureLoadingOverlayProps;
 };
-export declare const SelfieCaptureFallback: ({ onFinished, onCapture, classNames, colors, verbiage: rawVerbiage, silentFallback, selfieCaptureLoadingOverlayProps: overlayProps }: SelfieCaptureFallbackProps) => ReactElement;
+export declare const SelfieCaptureFallback: ({ onFinished, onCapture, classNames, colors, verbiage: rawVerbiage, silentFallback, selfieCaptureLoadingOverlayProps: overlayProps, }: SelfieCaptureFallbackProps) => ReactElement;

package/dist/sdk2.cjs.development.js

@@ -50,7 +50,7 @@ var LanguageDetector__default = /*#__PURE__*/_interopDefaultLegacy(LanguageDetec
 var i18n__default = /*#__PURE__*/_interopDefaultLegacy(i18n);
 var SignatureCanvas__default = /*#__PURE__*/_interopDefaultLegacy(SignatureCanvas);
 
-var webSdkVersion = '1.0.343';
+var webSdkVersion = '1.0.345';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -14159,12 +14159,9 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
   var _j = React.useState(false),
     usingDocumentCapture = _j[0],
     setUsingDocumentCapture = _j[1];
-  var _k = React.useState(silentFallback),
-    useFallback = _k[0],
-    setUseFallback = _k[1];
-  var _l = React.useState(1),
-    selfieKey = _l[0],
-    setSelfieKey = _l[1];
+  var _k = React.useState(1),
+    selfieKey = _k[0],
+    setSelfieKey = _k[1];
   var verbiage = useTranslations(rawVerbiage, {
     headingText: "We're having some trouble.",
     descriptionText: silentFallback ? 'Use your device camera to capture your face' : 'On-device capture guidance failed, please capture a selfie manually.',
@@ -14174,7 +14171,7 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
   });
   React.useEffect(function () {
     var fallbackTimeout;
-    if (useFallback) {
+    if (silentFallback) {
       fallbackTimeout = setTimeout(function () {
         var _a;
         // using the input element, we want to click on it "immediately" which is 250ms to allow for even old browsers to finish connecting the input
@@ -14188,7 +14185,7 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
     return function () {
       clearTimeout(fallbackTimeout);
     };
-  }, [useFallback]);
+  }, [silentFallback]);
   var onFileSelected = function onFileSelected(e) {
     var _a;
     var file = (_a = e.target.files) === null || _a === void 0 ? void 0 : _a[0];
@@ -14212,12 +14209,12 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
       onDocumentCaptured: function onDocumentCaptured(document) {
         var imageData = document.contentUrl;
         setImage(imageData);
-        setUseFallback(false);
         setUsingDocumentCapture(false);
         onCapture === null || onCapture === void 0 ? void 0 : onCapture(imageData);
       }
     });
   }
+  // todo: we might be able to use the media stream instead if we clone it - as it stands today, we hae to use the camera to support iOS 16 devices
   return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("input", {
     ref: fileInput,
     type: "file",
@@ -14225,7 +14222,7 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
     capture: "user",
     onChange: onFileSelected,
     hidden: true
-  }), useFallback && !image ? ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(SelfieCaptureLoadingOverlay, {
+  }), silentFallback && !image ? ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(SelfieCaptureLoadingOverlay, {
     key: selfieKey,
     assets: overlayProps.assets,
     classNames: overlayProps.classNames,
@@ -14241,29 +14238,38 @@ var SelfieCaptureFallback = function SelfieCaptureFallback(_a) {
     className: classNames.container
   }, /*#__PURE__*/React__default['default'].createElement(StyledOverlayInner, {
     className: classNames.inner
-  }, !useFallback && ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(Heading$6, {
+  }, !silentFallback && ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(Heading$6, {
     className: classNames.heading
   }, verbiage.headingText), /*#__PURE__*/React__default['default'].createElement(Description$1, {
     className: classNames.description
-  }, verbiage.descriptionText))), image && ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(ImageContainer$5, {
+  }, verbiage.descriptionText))), image && ( /*#__PURE__*/React__default['default'].createElement(ImageContainer$5, {
     className: classNames.imageContainer
   }, /*#__PURE__*/React__default['default'].createElement("img", {
     src: image,
     alt: "",
     className: classNames.image
-  })), /*#__PURE__*/React__default['default'].createElement(StyledButtonsRow$5, {
+  }))), /*#__PURE__*/React__default['default'].createElement(StyledButtonsRow$5, {
     className: classNames.buttonsRow
   }, /*#__PURE__*/React__default['default'].createElement(LoaderButton, {
     variant: "positive",
     key: loading ? 'loading-btn' : 'ready-btn',
-    className: classNames.doneBtn,
-    colors: colors.doneBtn,
-    finished: !loading,
+    className: !image ? classNames.captureBtn : classNames === null || classNames === void 0 ? void 0 : classNames.doneBtn,
+    colors: !image ? colors.captureBtn : colors === null || colors === void 0 ? void 0 : colors.doneBtn,
+    finished: !image ? true : !loading,
     onClick: function onClick() {
-      setLoading(true);
-      onFinished === null || onFinished === void 0 ? void 0 : onFinished(image);
+      var _a;
+      if (isMobile()) {
+        (_a = fileInput.current) === null || _a === void 0 ? void 0 : _a.click();
+      } else {
+        if (!image) {
+          setUsingDocumentCapture(true);
+        } else {
+          setLoading(true);
+          onFinished === null || onFinished === void 0 ? void 0 : onFinished(image);
+        }
+      }
     }
-  }, loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText))))))));
+  }, !image ? verbiage.captureBtnText : loading ? verbiage.doneBtnLoadingText : verbiage.doneBtnText))))));
 };
 var StyledOverlayInner = styled__default['default'](OverlayInner$2)(templateObject_1$g || (templateObject_1$g = tslib.__makeTemplateObject(["\n  justify-content: center;\n"], ["\n  justify-content: center;\n"])));
 var Heading$6 = styled__default['default'].h3(templateObject_2$a || (templateObject_2$a = tslib.__makeTemplateObject(["\n  margin-bottom: 8px;\n"], ["\n  margin-bottom: 8px;\n"])));
@@ -14525,6 +14531,9 @@ var initialState$2 = {
   phoneDetected: false,
   timesLivenessCheckFailed: 0
 };
+/** todo: this feels like it should be hoisted up to the wizard because these states of failed and error dovetail into those in the wizard.
+ *    There may also be some crossing of wires in how error/failed are used.
+ */
 var reducer$2 = function reducer(state, action) {
   var _a, _b;
   switch (action.type) {
@@ -14688,21 +14697,28 @@ var FaceLivenessCapture = function FaceLivenessCapture(_a) {
   var onFallbackImageCaptured = React.useCallback(function (imageUrl) {
     return tslib.__awaiter(void 0, void 0, void 0, function () {
       var imageData, response, e_2;
-      return tslib.__generator(this, function (_a) {
-        switch (_a.label) {
+      var _a;
+      return tslib.__generator(this, function (_b) {
+        switch (_b.label) {
           case 0:
             dispatch({
               type: 'livenessChecking'
             });
-            _a.label = 1;
+            _b.label = 1;
           case 1:
-            _a.trys.push([1, 4,, 5]);
+            _b.trys.push([1, 4,, 5]);
             return [4 /*yield*/, dataUrlToBase64(imageUrl)];
           case 2:
-            imageData = _a.sent();
-            return [4 /*yield*/, checkLiveness(imageData)];
+            imageData = _b.sent();
+            return [4 /*yield*/, checkLiveness(imageData)
+            // todo: this feels dirty and is the reason for the todo around line 83 - but is necessary to handle fallback liveness validation
+            ];
           case 3:
-            response = _a.sent();
+            response = _b.sent();
+            // todo: this feels dirty and is the reason for the todo around line 83 - but is necessary to handle fallback liveness validation
+            if (((_a = response === null || response === void 0 ? void 0 : response.resultData) === null || _a === void 0 ? void 0 : _a.verificationResult) !== 'Live Face Detected') {
+              onTimeout === null || onTimeout === void 0 ? void 0 : onTimeout();
+            }
             dispatch({
               type: 'livenessChecked',
               payload: {
@@ -14712,7 +14728,7 @@ var FaceLivenessCapture = function FaceLivenessCapture(_a) {
             });
             return [3 /*break*/, 5];
           case 4:
-            e_2 = _a.sent();
+            e_2 = _b.sent();
             dispatch({
               type: 'livenessCheckFailed',
               payload: {
@@ -14961,7 +14977,8 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
       });
     });
   }, [onSuccess, setSelfieImage, livenessCheckRequest, submissionResponse]);
-  var onTimeoutCallback = React.useCallback(function () {
+  // todo: how this is being used, it would make sense to rename the prop as well, but that would be a breaking change - discuss
+  var onFailureOrTimeout = React.useCallback(function () {
     setCaptureState('FAILED');
     onTimeout === null || onTimeout === void 0 ? void 0 : onTimeout(submissionResponse, livenessCheckRequest);
   }, [onTimeout, livenessCheckRequest, submissionResponse]);
@@ -15006,7 +15023,7 @@ var FaceLivenessWizard = function FaceLivenessWizard(_a) {
           key: "capture".concat(attempt),
           onCapture: onCapture,
           onSuccess: onSuccessCallback,
-          onTimeout: onTimeoutCallback,
+          onTimeout: onFailureOrTimeout,
           onExit: onExitCallback,
           timeoutDurationMs: timeoutDurationMs,
           silentFallback: silentFallback,