idmission-web-sdk 1.0.122 → 1.0.124

package/dist/components/customer_flows/CustomerIdAndBiometricsEnrollment.d.ts

@@ -1,4 +1,4 @@
-import { FC, PropsWithChildren } from 'react';
+import { FC, PropsWithChildren, ReactNode } from 'react';
 import { CardData, PersonalData, SubmissionRequest, SubmissionResponse } from '../../contexts/SubmissionContext';
 import { FaceLivenessAssets, FaceLivenessClassNames, FaceLivenessColors, FaceLivenessVerbiage } from '../face_liveness/FaceLivenessWizard';
 import { IdCaptureWizardAssets, IdCaptureWizardClassNames, IdCaptureWizardColors, IdCaptureWizardVerbiage } from '../id_capture/IdCaptureWizard';
@@ -95,6 +95,7 @@ export interface CustomerEnrollmentProps extends PropsWithChildren {
     faceLivenessTimeoutDurationMs?: number;
     /** Boolean or async function to indicate whether to proceed automatically after capture guidance is satisfied. If an async function is supplied returning a boolean, it will be evaluated at the time of capture guidance satisfaction. Defaults to `false`. */
     skipSuccessScreen?: boolean | (() => Promise<boolean>);
+    idCaptureInstructions?: ReactNode;
     /** Callback function that fires immediately prior to submission, giving the client application an opportunity to specify custom asynchronous logic that mutates the request before it executes. The submission request is passed in as a parameter and a promise resolving to the updated request should be returned. */
     onBeforeSubmit?: (req: SubmissionRequest) => Promise<SubmissionRequest>;
     /** Callback function that fires when the user has completed the flow instead of making a call to IDmission's servers, allowing customers to specify their own submission logic. Arguments: the request payload that would have been dispatched to IDmission's API, which contains the images/documents/video submitted by the user. Note that when this parameter is supplied, `onComplete` will never fire, and the customer will need to implement their own error handling/retry logic. Use at your own risk! */

package/dist/components/customer_flows/IdAndFaceValidation.d.ts

@@ -1,4 +1,4 @@
-import { FC, PropsWithChildren } from 'react';
+import { FC, PropsWithChildren, ReactNode } from 'react';
 import { CardData, LivenessCheckRequest, PersonalData, SubmissionRequest, SubmissionResponse } from '../../contexts/SubmissionContext';
 import { FaceLivenessAssets, FaceLivenessClassNames, FaceLivenessColors, FaceLivenessVerbiage } from '../face_liveness/FaceLivenessWizard';
 import { IdCaptureWizardAssets, IdCaptureWizardClassNames, IdCaptureWizardColors, IdCaptureWizardVerbiage } from '../id_capture/IdCaptureWizard';
@@ -92,6 +92,8 @@ export interface IdAndFaceValidationProps extends PropsWithChildren {
     faceLivenessTimeoutDurationMs?: number;
     /** Boolean or async function to indicate whether to proceed automatically after capture guidance is satisfied. If an async function is supplied returning a boolean, it will be evaluated at the time of capture guidance satisfaction. Defaults to `false`. */
     skipSuccessScreen?: boolean | (() => Promise<boolean>);
+    /** React element or string to render on the instructions screen. */
+    idCaptureInstructions?: ReactNode;
     /** Callback function that fires immediately prior to liveness check, giving the client application an opportunity to specify custom asynchronous logic that mutates the request before it executes. The liveness check request is passed in as a parameter and a promise resolving to the updated request should be returned. */
     onBeforeLivenessCheck?: (req: LivenessCheckRequest) => Promise<LivenessCheckRequest>;
     /** Callback function that fires immediately prior to submission, giving the client application an opportunity to specify custom asynchronous logic that mutates the request before it executes. The submission request is passed in as a parameter and a promise resolving to the updated request should be returned. */

package/dist/components/customer_flows/IdValidation.d.ts

@@ -1,4 +1,4 @@
-import { FC, PropsWithChildren } from 'react';
+import { FC, PropsWithChildren, ReactNode } from 'react';
 import { CardData, PersonalData, SubmissionRequest, SubmissionResponse } from '../../contexts/SubmissionContext';
 import { IdCaptureWizardAssets, IdCaptureWizardClassNames, IdCaptureWizardColors, IdCaptureWizardVerbiage } from '../id_capture/IdCaptureWizard';
 import { AdditionalDocumentCaptureWizardClassNames, AdditionalDocumentCaptureWizardVerbiage } from '../additional_document_capture/AdditionalDocumentCaptureWizard';
@@ -74,6 +74,8 @@ export interface IdValidationProps extends PropsWithChildren {
     passportFocusScoreThreshold?: number;
     /** Boolean or async function to indicate whether to proceed automatically after capture guidance is satisfied. If an async function is supplied returning a boolean, it will be evaluated at the time of capture guidance satisfaction. Defaults to `false`. */
     skipSuccessScreen?: boolean | (() => Promise<boolean>);
+    /** React element or string to render on the instructions screen. */
+    instructions?: ReactNode;
     /** Object to allow documents that have been previously captured to be submitted. Valid keys: `idCardFront`, `idCardBack , `passport`.*/
     precapturedDocuments?: CapturedDocuments;
     /** Callback function that fires immediately prior to submission, giving the client application an opportunity to specify custom asynchronous logic that mutates the request before it executes. The submission request is passed in as a parameter and a promise resolving to the updated request should be returned. */

package/dist/components/id_capture/IdCaptureLoadingOverlay.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
+import { ReactElement, ReactNode } from 'react';
 import { CameraAccessDeniedOverlayAssets, CameraAccessDeniedOverlayClassNames, CameraAccessDeniedOverlayColors, CameraAccessDeniedOverlayVerbiage } from '../camera/CameraAccessDeniedOverlay';
 import { LoaderButtonColors } from '../common/LoaderButton';
 import { CustomerSuppliedVerbiage } from '../../lib/locales';
@@ -34,9 +34,10 @@ export type IdCaptureLoadingOverlayVerbiage = {
 export type IdCaptureLoadingOverlayProps = {
     onDismissed?: () => void;
     onUserCancel?: () => void;
+    instructions?: ReactNode;
     assets?: IdCaptureLoadingOverlayAssets;
     classNames?: IdCaptureLoadingOverlayClassNames;
     colors?: IdCaptureLoadingOverlayColors;
     verbiage?: IdCaptureLoadingOverlayVerbiage;
 };
-export declare const IdCaptureLoadingOverlay: ({ onDismissed, onUserCancel, assets, classNames, colors, verbiage: rawVerbiage, }: IdCaptureLoadingOverlayProps) => ReactElement;
+export declare const IdCaptureLoadingOverlay: ({ onDismissed, onUserCancel, instructions, assets, classNames, colors, verbiage: rawVerbiage, }: IdCaptureLoadingOverlayProps) => ReactElement;

package/dist/components/id_capture/IdCaptureWizard.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
+import { ReactElement, ReactNode } from 'react';
 import { IdCaptureAssets, IdCaptureClassNames, IdCaptureColors, IdCaptureVerbiage } from './IdCapture';
 import { IdCaptureLoadingOverlayAssets, IdCaptureLoadingOverlayClassNames, IdCaptureLoadingOverlayColors, IdCaptureLoadingOverlayVerbiage } from './IdCaptureLoadingOverlay';
 import { FlipIdPromptAssets, FlipIdPromptClassNames, FlipIdPromptVerbiage } from './FlipIdPrompt';
@@ -59,6 +59,7 @@ export type IdCaptureWizardProps = {
     idCardFocusScoreThreshold?: number;
     passportFocusScoreThreshold?: number;
     skipSuccessScreen?: boolean | (() => Promise<boolean>);
+    instructions?: ReactNode;
     releaseCameraAccessOnExit?: boolean;
     assets?: IdCaptureWizardAssets;
     classNames?: IdCaptureWizardClassNames;
@@ -66,4 +67,4 @@ export type IdCaptureWizardProps = {
     verbiage?: IdCaptureWizardVerbiage;
     debugMode?: boolean;
 };
-export declare const IdCaptureWizard: ({ onSuccess, onExitCapture, onUserCancel, precapturedDocuments, captureRequirement, autoCaptureEnabled, autoCaptureGoodFramesRequired, autoCaptureBarcodeRequired, barcodeScanningEnabled, idCardAutoCaptureScoreThreshold, passportAutoCaptureScoreThreshold, mrzDetectionScoreThreshold, idCardFocusScoreThreshold, passportFocusScoreThreshold, skipSuccessScreen, releaseCameraAccessOnExit, assets, classNames, colors, verbiage, debugMode, }: IdCaptureWizardProps) => ReactElement;
+export declare const IdCaptureWizard: ({ onSuccess, onExitCapture, onUserCancel, precapturedDocuments, captureRequirement, autoCaptureEnabled, autoCaptureGoodFramesRequired, autoCaptureBarcodeRequired, barcodeScanningEnabled, idCardAutoCaptureScoreThreshold, passportAutoCaptureScoreThreshold, mrzDetectionScoreThreshold, idCardFocusScoreThreshold, passportFocusScoreThreshold, skipSuccessScreen, instructions, releaseCameraAccessOnExit, assets, classNames, colors, verbiage, debugMode, }: IdCaptureWizardProps) => ReactElement;

package/dist/sdk2.cjs.development.js

@@ -47,7 +47,7 @@ var LanguageDetector__default = /*#__PURE__*/_interopDefaultLegacy(LanguageDetec
 var i18n__default = /*#__PURE__*/_interopDefaultLegacy(i18n);
 var SignatureCanvas__default = /*#__PURE__*/_interopDefaultLegacy(SignatureCanvas);
 
-var webSdkVersion = '1.0.122';
+var webSdkVersion = '1.0.124';
 
 function getPlatform() {
   if (typeof window === 'undefined') return;
@@ -10241,6 +10241,7 @@ var ContinuityCameraCheckbox = styled__default['default'].input(templateObject_2
 var IdCaptureLoadingOverlay = function IdCaptureLoadingOverlay(_a) {
   var onDismissed = _a.onDismissed,
     onUserCancel = _a.onUserCancel,
+    instructions = _a.instructions,
     _b = _a.assets,
     assets = _b === void 0 ? {} : _b,
     _c = _a.classNames,
@@ -10304,7 +10305,7 @@ var IdCaptureLoadingOverlay = function IdCaptureLoadingOverlay(_a) {
     alt: verbiage.headingText,
     src: assets.instructionImageUrl,
     className: classNames.image
-  })), /*#__PURE__*/React__default['default'].createElement(ContinuityCameraCheckboxContainer, {
+  })), instructions, /*#__PURE__*/React__default['default'].createElement(ContinuityCameraCheckboxContainer, {
     className: classNames.continuityCameraCheckboxContainer
   }, iphoneContinuityCameraAvailable && ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(ContinuityCameraCheckbox, {
     className: classNames.continuityCameraCheckbox,
@@ -10571,11 +10572,20 @@ var CapturedImage = function CapturedImage(_a) {
     url = _b[0],
     setUrl = _b[1];
   React.useEffect(function () {
-    if (!image.boundingBox) return;
+    if (!image.boundingBox) {
+      console.error('no bounding box received!');
+      return;
+    }
     var im = new Image();
     im.onload = function () {
+      console.log('image has been loaded');
       cropToBoundingBox(im, image.boundingBox, canvasRef.current);
-      setUrl(canvasRef.current.toDataURL());
+      var croppedDataUrl = canvasRef.current.toDataURL();
+      console.log('croppedDataUrl', croppedDataUrl);
+      setUrl(croppedDataUrl);
+    };
+    im.onerror = function (e) {
+      console.error('failed to load image', e);
     };
     im.src = image.imageData;
   }, [image.boundingBox, image.height, image.imageData, image.width]);
@@ -10915,6 +10925,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
     passportFocusScoreThreshold = _x === void 0 ? 0.3 : _x,
     _y = _a.skipSuccessScreen,
     skipSuccessScreen = _y === void 0 ? false : _y,
+    instructions = _a.instructions,
     _z = _a.releaseCameraAccessOnExit,
     releaseCameraAccessOnExit = _z === void 0 ? true : _z,
     _0 = _a.assets,
@@ -11152,6 +11163,7 @@ var IdCaptureWizard = function IdCaptureWizard(_a) {
     }
   }(), !overlayDismissed && ( /*#__PURE__*/React__default['default'].createElement(IdCaptureLoadingOverlay, {
     key: attempt,
+    instructions: instructions,
     assets: assets.loadingOverlay,
     classNames: classNames.loadingOverlay,
     colors: colors.loadingOverlay,
@@ -14440,6 +14452,7 @@ var IdValidation = function IdValidation(_a) {
     passportFocusScoreThreshold = _h === void 0 ? 0.3 : _h,
     _j = _a.skipSuccessScreen,
     skipSuccessScreen = _j === void 0 ? false : _j,
+    instructions = _a.instructions,
     onBeforeSubmit = _a.onBeforeSubmit,
     onSubmit = _a.onSubmit,
     onComplete = _a.onComplete,
@@ -14484,13 +14497,14 @@ var IdValidation = function IdValidation(_a) {
       passportFocusScoreThreshold: passportFocusScoreThreshold,
       barcodeScanningEnabled: false,
       skipSuccessScreen: skipSuccessScreen,
+      instructions: instructions,
       assets: assets,
       classNames: classNames,
       colors: colors,
       verbiage: verbiage,
       debugMode: debugMode
     };
-  }, [onExitCapture, onUserCancel, precapturedDocuments, idCaptureRequirement, idAutoCaptureEnabled, idCardAutoCaptureScoreThreshold, passportAutoCaptureScoreThreshold, idCardFocusScoreThreshold, passportFocusScoreThreshold, skipSuccessScreen, assets, classNames, colors, verbiage, debugMode]);
+  }, [onExitCapture, onUserCancel, precapturedDocuments, idCaptureRequirement, idAutoCaptureEnabled, idCardAutoCaptureScoreThreshold, passportAutoCaptureScoreThreshold, idCardFocusScoreThreshold, passportFocusScoreThreshold, skipSuccessScreen, instructions, assets, classNames, colors, verbiage, debugMode]);
   var additionalDocumentCaptureProps = React.useMemo(function () {
     return {
       documents: captureAdditionalDocuments,
@@ -14684,6 +14698,7 @@ var IdAndFaceValidation = function IdAndFaceValidation(_a) {
     faceLivenessTimeoutDurationMs = _k === void 0 ? 15000 : _k,
     _l = _a.skipSuccessScreen,
     skipSuccessScreen = _l === void 0 ? false : _l,
+    idCaptureInstructions = _a.idCaptureInstructions,
     onBeforeLivenessCheck = _a.onBeforeLivenessCheck,
     onBeforeSubmit = _a.onBeforeSubmit,
     onSubmit = _a.onSubmit,
@@ -14732,10 +14747,11 @@ var IdAndFaceValidation = function IdAndFaceValidation(_a) {
       mrzDetectionScoreThreshold: mrzDetectionScoreThreshold,
       idCardFocusScoreThreshold: idCardFocusScoreThreshold,
       passportFocusScoreThreshold: passportFocusScoreThreshold,
+      instructions: idCaptureInstructions,
       skipSuccessScreen: skipSuccessScreen,
       debugMode: debugMode
     };
-  }, [assets.idCapture, classNames.idCapture, colors.idCapture, debugMode, idAutoCaptureEnabled, idCaptureRequirement, idCardAutoCaptureScoreThreshold, idCardFocusScoreThreshold, mrzDetectionScoreThreshold, onExitCapture, onUserCancel, passportAutoCaptureScoreThreshold, passportFocusScoreThreshold, precapturedDocuments, skipSuccessScreen, verbiage.idCapture]);
+  }, [assets.idCapture, classNames.idCapture, colors.idCapture, debugMode, idAutoCaptureEnabled, idCaptureInstructions, idCaptureRequirement, idCardAutoCaptureScoreThreshold, idCardFocusScoreThreshold, mrzDetectionScoreThreshold, onExitCapture, onUserCancel, passportAutoCaptureScoreThreshold, passportFocusScoreThreshold, precapturedDocuments, skipSuccessScreen, verbiage.idCapture]);
   var faceLivenessProps = React.useMemo(function () {
     return {
       timeoutDurationMs: faceLivenessTimeoutDurationMs,
@@ -14872,6 +14888,7 @@ var CustomerIdAndBiometricsEnrollment = function CustomerIdAndBiometricsEnrollme
     faceLivenessTimeoutDurationMs = _k === void 0 ? 15000 : _k,
     _l = _a.skipSuccessScreen,
     skipSuccessScreen = _l === void 0 ? false : _l,
+    idCaptureInstructions = _a.idCaptureInstructions,
     onBeforeSubmit = _a.onBeforeSubmit,
     onSubmit = _a.onSubmit,
     onComplete = _a.onComplete,
@@ -14916,12 +14933,13 @@ var CustomerIdAndBiometricsEnrollment = function CustomerIdAndBiometricsEnrollme
       mrzDetectionScoreThreshold: mrzDetectionScoreThreshold,
       idCardFocusScoreThreshold: idCardFocusScoreThreshold,
       passportFocusScoreThreshold: passportFocusScoreThreshold,
+      instructions: idCaptureInstructions,
       onExitCapture: onExitCapture,
       onUserCancel: onUserCancel,
       skipSuccessScreen: skipSuccessScreen,
       debugMode: debugMode
     };
-  }, [assets.idCapture, classNames.idCapture, colors.idCapture, debugMode, idAutoCaptureEnabled, idCaptureRequirement, idCardAutoCaptureScoreThreshold, idCardFocusScoreThreshold, mrzDetectionScoreThreshold, onExitCapture, onUserCancel, passportAutoCaptureScoreThreshold, passportFocusScoreThreshold, skipSuccessScreen, verbiage.idCapture]);
+  }, [assets.idCapture, classNames.idCapture, colors.idCapture, debugMode, idAutoCaptureEnabled, idCaptureInstructions, idCaptureRequirement, idCardAutoCaptureScoreThreshold, idCardFocusScoreThreshold, mrzDetectionScoreThreshold, onExitCapture, onUserCancel, passportAutoCaptureScoreThreshold, passportFocusScoreThreshold, skipSuccessScreen, verbiage.idCapture]);
   var faceLivenessProps = React.useMemo(function () {
     return {
       onExitCapture: onExitCapture,