@ekyc_qoobiss/qbs-ect-cmp 3.6.13 → 3.6.15

package/dist/cjs/loader.cjs.js

@@ -14,7 +14,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["agreement-check_18.cjs",[[1,"identification-component",{"token":[1537],"order_id":[1537],"api_url":[1537],"env":[1537],"redirect_id":[1537],"phone_number":[1537],"idSide":[32],"errorMessage":[32],"errorTitle":[32]},[[0,"agreementAcceptance","agreementAcceptanceEmitted"],[0,"apiError","apiErrorEmitter"]]],[0,"process-id",{"captureStep":[32],"showTimeout":[32],"showInvalid":[32],"flow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoIdCapture","captureIdImage"],[0,"photoIdBackCapture","captureIdBackImage"],[0,"recordingIdCapture","capturedIdRecording"]]],[0,"user-liveness",{"showError":[32],"showHowTo":[32],"selfieFlow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoSelfieCapture","captureSelfieImage"],[0,"recordingSelfieCapture","capturedSelfieRecording"],[0,"verificationFinished","verificationFinished"]]],[0,"agreement-info",{"agreementsChecked":[32],"termsChecked":[32],"openAgreements":[32],"openTerms":[32]},[[0,"agreementAcceptance","agreementAcceptanceEmitted"]]],[0,"camera-error",{"title":[32],"description":[32],"buttonDisabled":[32],"demoVideo":[32]}],[0,"end-redirect"],[0,"error-end",{"message":[1],"errorTitle":[1,"error-title"]}],[0,"landing-validation",{"warningText":[32],"buttonDisabled":[32]}],[0,"mobile-redirect",{"infoTextTop":[32],"infoTextBottom":[32],"contact":[32],"invalidValue":[32],"waitingMobile":[32],"orderStatus":[32],"redirectLink":[32],"qrCode":[32],"prefilledPhone":[32]}],[0,"sms-code-validation",{"title":[32],"details":[32],"buttonText":[32],"phoneNumber":[32],"code":[32],"prefilledPhone":[32],"canSend":[32]}],[0,"id-tilt",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"selfie-capture",{"videoStarted":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"demoEnded":[32],"demoVideo":[32],"uploadingLink":[32],"captureHeight":[32],"captureWidth":[32]},[[0,"changeTitle","eventChangeTitle"],[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"agreement-check",{"agreementType":[1,"agreement-type"],"htmlContent":[32],"buttonEnabled":[32]}],[0,"id-back-capture",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"verificationFinished","verificationFinished"],[0,"takePhoto","takePhoto"]]],[0,"id-capture",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"capture-error",{"type":[1],"buttonEnabled":[32],"buttonText":[32]}],[0,"how-to-info",{"idSide":[1,"id-side"],"topTitle":[32],"subTitle":[32],"imagePath":[32],"buttonText":[32],"buttonEnabled":[32]}],[0,"camera-comp",{"modelPath":[1,"model-path"],"probabilityThreshold":[2,"probability-threshold"],"captureMode":[1,"capture-mode"]}]]],["id-double-side.cjs",[[0,"id-double-side",{"showTimeout":[32],"showInvalid":[32],"showHowTo":[32],"front":[32],"flow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoIdCapture","captureIdImage"],[0,"photoIdBackCapture","captureIdBackImage"],[0,"recordingIdCapture","capturedIdRecording"],[0,"verificationFinished","verificationFinished"]]]]],["id-single-side.cjs",[[0,"id-single-side",{"showTimeout":[32],"showHowTo":[32],"idFlow":[32]},[[0,"captureErrorDone","captureErrorDone"],[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"photoIdCapture","captureIdImage"],[0,"verificationFinished","verificationFinished"],[0,"recordingIdCapture","capturedIdRecording"]]]]],["loader-dots.cjs",[[1,"loader-dots"]]]], options);
+  return index.bootstrapLazy([["loader-dots.cjs",[[1,"loader-dots"]]],["agreement-check_19.cjs",[[1,"identification-component",{"token":[1537],"order_id":[1537],"api_url":[1537],"env":[1537],"redirect_id":[1537],"phone_number":[1537],"idSide":[32],"errorMessage":[32],"errorTitle":[32]},[[0,"agreementAcceptance","agreementAcceptanceEmitted"],[0,"apiError","apiErrorEmitter"]]],[0,"process-id",{"captureStep":[32],"showTimeout":[32],"showInvalid":[32],"flow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoIdCapture","captureIdImage"],[0,"photoIdBackCapture","captureIdBackImage"],[0,"recordingIdCapture","capturedIdRecording"]]],[0,"user-liveness",{"showError":[32],"captureStep":[32],"flow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoSelfieCapture","captureSelfieImage"],[0,"recordingSelfieCapture","capturedSelfieRecording"],[0,"verificationFinished","verificationFinished"]]],[0,"agreement-info",{"agreementsChecked":[32],"termsChecked":[32],"openAgreements":[32],"openTerms":[32]},[[0,"agreementAcceptance","agreementAcceptanceEmitted"]]],[0,"camera-error",{"title":[32],"description":[32],"buttonDisabled":[32],"demoVideo":[32]}],[0,"end-redirect"],[0,"error-end",{"message":[1],"errorTitle":[1,"error-title"]}],[0,"landing-validation",{"warningText":[32],"buttonDisabled":[32]}],[0,"mobile-redirect",{"infoTextTop":[32],"infoTextBottom":[32],"contact":[32],"invalidValue":[32],"waitingMobile":[32],"orderStatus":[32],"redirectLink":[32],"qrCode":[32],"prefilledPhone":[32]}],[0,"sms-code-validation",{"title":[32],"details":[32],"buttonText":[32],"phoneNumber":[32],"code":[32],"prefilledPhone":[32],"canSend":[32]}],[0,"id-back-capture",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"verificationFinished","verificationFinished"],[0,"takePhoto","takePhoto"]]],[0,"id-capture",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"id-tilt",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"selfie-capture",{"videoStarted":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"demoEnded":[32],"demoVideo":[32],"uploadingLink":[32],"captureHeight":[32],"captureWidth":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"selfie-tilt",{"videoStarted":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"demoEnded":[32],"demoVideo":[32],"uploadingLink":[32],"captureHeight":[32],"captureWidth":[32]},[[0,"changeTitle","eventChangeTitle"],[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"agreement-check",{"agreementType":[1,"agreement-type"],"htmlContent":[32],"buttonEnabled":[32]}],[0,"capture-error",{"type":[1],"buttonEnabled":[32],"buttonText":[32]}],[0,"how-to-info",{"idSide":[1,"id-side"],"topTitle":[32],"subTitle":[32],"imagePath":[32],"buttonText":[32],"buttonEnabled":[32]}],[0,"camera-comp",{"modelPath":[1,"model-path"],"probabilityThreshold":[2,"probability-threshold"],"captureMode":[1,"capture-mode"]}]]]], options);
   });
 };
 

package/dist/cjs/qbs-ect-cmp.cjs.js

@@ -17,7 +17,7 @@ const patchBrowser = () => {
 };
 
 patchBrowser().then(options => {
-  return index.bootstrapLazy([["agreement-check_18.cjs",[[1,"identification-component",{"token":[1537],"order_id":[1537],"api_url":[1537],"env":[1537],"redirect_id":[1537],"phone_number":[1537],"idSide":[32],"errorMessage":[32],"errorTitle":[32]},[[0,"agreementAcceptance","agreementAcceptanceEmitted"],[0,"apiError","apiErrorEmitter"]]],[0,"process-id",{"captureStep":[32],"showTimeout":[32],"showInvalid":[32],"flow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoIdCapture","captureIdImage"],[0,"photoIdBackCapture","captureIdBackImage"],[0,"recordingIdCapture","capturedIdRecording"]]],[0,"user-liveness",{"showError":[32],"showHowTo":[32],"selfieFlow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoSelfieCapture","captureSelfieImage"],[0,"recordingSelfieCapture","capturedSelfieRecording"],[0,"verificationFinished","verificationFinished"]]],[0,"agreement-info",{"agreementsChecked":[32],"termsChecked":[32],"openAgreements":[32],"openTerms":[32]},[[0,"agreementAcceptance","agreementAcceptanceEmitted"]]],[0,"camera-error",{"title":[32],"description":[32],"buttonDisabled":[32],"demoVideo":[32]}],[0,"end-redirect"],[0,"error-end",{"message":[1],"errorTitle":[1,"error-title"]}],[0,"landing-validation",{"warningText":[32],"buttonDisabled":[32]}],[0,"mobile-redirect",{"infoTextTop":[32],"infoTextBottom":[32],"contact":[32],"invalidValue":[32],"waitingMobile":[32],"orderStatus":[32],"redirectLink":[32],"qrCode":[32],"prefilledPhone":[32]}],[0,"sms-code-validation",{"title":[32],"details":[32],"buttonText":[32],"phoneNumber":[32],"code":[32],"prefilledPhone":[32],"canSend":[32]}],[0,"id-tilt",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"selfie-capture",{"videoStarted":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"demoEnded":[32],"demoVideo":[32],"uploadingLink":[32],"captureHeight":[32],"captureWidth":[32]},[[0,"changeTitle","eventChangeTitle"],[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"agreement-check",{"agreementType":[1,"agreement-type"],"htmlContent":[32],"buttonEnabled":[32]}],[0,"id-back-capture",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"verificationFinished","verificationFinished"],[0,"takePhoto","takePhoto"]]],[0,"id-capture",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"capture-error",{"type":[1],"buttonEnabled":[32],"buttonText":[32]}],[0,"how-to-info",{"idSide":[1,"id-side"],"topTitle":[32],"subTitle":[32],"imagePath":[32],"buttonText":[32],"buttonEnabled":[32]}],[0,"camera-comp",{"modelPath":[1,"model-path"],"probabilityThreshold":[2,"probability-threshold"],"captureMode":[1,"capture-mode"]}]]],["id-double-side.cjs",[[0,"id-double-side",{"showTimeout":[32],"showInvalid":[32],"showHowTo":[32],"front":[32],"flow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoIdCapture","captureIdImage"],[0,"photoIdBackCapture","captureIdBackImage"],[0,"recordingIdCapture","capturedIdRecording"],[0,"verificationFinished","verificationFinished"]]]]],["id-single-side.cjs",[[0,"id-single-side",{"showTimeout":[32],"showHowTo":[32],"idFlow":[32]},[[0,"captureErrorDone","captureErrorDone"],[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"photoIdCapture","captureIdImage"],[0,"verificationFinished","verificationFinished"],[0,"recordingIdCapture","capturedIdRecording"]]]]],["loader-dots.cjs",[[1,"loader-dots"]]]], options);
+  return index.bootstrapLazy([["loader-dots.cjs",[[1,"loader-dots"]]],["agreement-check_19.cjs",[[1,"identification-component",{"token":[1537],"order_id":[1537],"api_url":[1537],"env":[1537],"redirect_id":[1537],"phone_number":[1537],"idSide":[32],"errorMessage":[32],"errorTitle":[32]},[[0,"agreementAcceptance","agreementAcceptanceEmitted"],[0,"apiError","apiErrorEmitter"]]],[0,"process-id",{"captureStep":[32],"showTimeout":[32],"showInvalid":[32],"flow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoIdCapture","captureIdImage"],[0,"photoIdBackCapture","captureIdBackImage"],[0,"recordingIdCapture","capturedIdRecording"]]],[0,"user-liveness",{"showError":[32],"captureStep":[32],"flow":[32]},[[0,"howToInfoDone","howToDone"],[0,"timeElapsed","timeElapsed"],[0,"captureErrorDone","captureErrorDone"],[0,"photoSelfieCapture","captureSelfieImage"],[0,"recordingSelfieCapture","capturedSelfieRecording"],[0,"verificationFinished","verificationFinished"]]],[0,"agreement-info",{"agreementsChecked":[32],"termsChecked":[32],"openAgreements":[32],"openTerms":[32]},[[0,"agreementAcceptance","agreementAcceptanceEmitted"]]],[0,"camera-error",{"title":[32],"description":[32],"buttonDisabled":[32],"demoVideo":[32]}],[0,"end-redirect"],[0,"error-end",{"message":[1],"errorTitle":[1,"error-title"]}],[0,"landing-validation",{"warningText":[32],"buttonDisabled":[32]}],[0,"mobile-redirect",{"infoTextTop":[32],"infoTextBottom":[32],"contact":[32],"invalidValue":[32],"waitingMobile":[32],"orderStatus":[32],"redirectLink":[32],"qrCode":[32],"prefilledPhone":[32]}],[0,"sms-code-validation",{"title":[32],"details":[32],"buttonText":[32],"phoneNumber":[32],"code":[32],"prefilledPhone":[32],"canSend":[32]}],[0,"id-back-capture",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"verificationFinished","verificationFinished"],[0,"takePhoto","takePhoto"]]],[0,"id-capture",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"id-tilt",{"videoStarted":[32],"cameraSize":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"showDemo":[32],"demoVideo":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"selfie-capture",{"videoStarted":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"demoEnded":[32],"demoVideo":[32],"uploadingLink":[32],"captureHeight":[32],"captureWidth":[32]},[[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"selfie-tilt",{"videoStarted":[32],"captureTaken":[32],"verified":[32],"titleMesage":[32],"demoEnded":[32],"demoVideo":[32],"uploadingLink":[32],"captureHeight":[32],"captureWidth":[32]},[[0,"changeTitle","eventChangeTitle"],[0,"videoStarted","eventVideoStarted"],[0,"takePhoto","takePhoto"],[0,"verificationFinished","verificationFinished"]]],[0,"agreement-check",{"agreementType":[1,"agreement-type"],"htmlContent":[32],"buttonEnabled":[32]}],[0,"capture-error",{"type":[1],"buttonEnabled":[32],"buttonText":[32]}],[0,"how-to-info",{"idSide":[1,"id-side"],"topTitle":[32],"subTitle":[32],"imagePath":[32],"buttonText":[32],"buttonEnabled":[32]}],[0,"camera-comp",{"modelPath":[1,"model-path"],"probabilityThreshold":[2,"probability-threshold"],"captureMode":[1,"capture-mode"]}]]]], options);
 });
 
 exports.setNonce = index.setNonce;

package/dist/collection/collection-manifest.json

@@ -8,13 +8,12 @@
     "./components/common/id-capture/id-capture.js",
     "./components/common/id-tilt/id-tilt.js",
     "./components/common/selfie-capture/selfie-capture.js",
+    "./components/common/selfie-tilt/selfie-tilt.js",
     "./components/controls/camera/camera.js",
     "./components/controls/loader-dots/loader-dots.js",
     "./components/flow/agreement-info/agreement-info.js",
     "./components/flow/end-redirect/end-redirect.js",
     "./components/flow/error-end/error-end.js",
-    "./components/flow/id-double-side/id-double-side.js",
-    "./components/flow/id-single-side/id-single-side.js",
     "./components/flow/landing-validation/landing-validation.js",
     "./components/flow/mobile-redirect/mobile-redirect.js",
     "./components/flow/process-id/process-id.js",

package/dist/collection/components/common/capture-error/capture-error.js

@@ -1,11 +1,14 @@
 import { h } from '@stencil/core';
 import { IdCaptureValues, SelfieCaptureValues } from '../../../helpers/textValues';
 import { delay } from '../../../utils/utils';
+import { BaseComponent } from '../../base-component';
+import { FlowMoments, FlowSteps } from '../../../models/FlowSteps';
 export class CaptureError {
   constructor() {
     this.type = undefined;
     this.buttonEnabled = undefined;
     this.buttonText = undefined;
+    this.baseComponent = new BaseComponent(FlowSteps.CiError);
   }
   async componentWillLoad() {
     this.buttonEnabled = false;
@@ -23,6 +26,7 @@ export class CaptureError {
     }
   }
   async componentDidLoad() {
+    await this.baseComponent.logStep(FlowSteps.CiError, FlowMoments.Initialized);
     for (let i = 5; i >= 1; i--) {
       this.buttonText = i.toString();
       await delay(1000);
@@ -30,8 +34,9 @@ export class CaptureError {
     this.buttonText = IdCaptureValues.Button;
     this.buttonEnabled = true;
   }
-  buttonClick() {
+  async buttonClick() {
     this.buttonEnabled = false;
+    await this.baseComponent.logStep(FlowSteps.CiError, FlowMoments.Finalized);
     this.eventCaptureErrorDone.emit();
   }
   render() {

package/dist/collection/components/common/id-back-capture/id-back-capture.js

@@ -29,7 +29,7 @@ export class IdBackCapture {
     this.verified = false;
     this.cameras = new Cameras();
     this.showDemo = true;
-    this.baseComponent = new BaseComponent(FlowSteps.CiBackHoldAnimation);
+    this.baseComponent = new BaseComponent(FlowSteps.CiBackCapture);
   }
   eventVideoStarted(event) {
     this.videoStarted = true;
@@ -42,7 +42,7 @@ export class IdBackCapture {
     }
   }
   async componentDidLoad() {
-    await this.baseComponent.logStep(FlowSteps.CiBackHoldAnimation, FlowMoments.Initialized);
+    await this.baseComponent.logStep(FlowSteps.CiBackCapture, FlowMoments.Initialized);
     this.titleMesage = IdCaptureValues.TtileRotate;
     this.demoVideo.src = IdCaptureValues.IDPoseDemoMapping[IDPose.Rotate];
     this.demoVideo.play();
@@ -52,11 +52,9 @@ export class IdBackCapture {
     this.demoVideo.play();
     await delay(IdCaptureValues.VideoLenght);
     this.showDemo = false;
-    await this.baseComponent.logStep(FlowSteps.CiBackHoldAnimation, FlowMoments.Finalized);
     this.openCamera();
   }
   async openCamera() {
-    await this.baseComponent.logStep(FlowSteps.CiBackCapture, FlowMoments.Initialized);
     const constraints = this.cameras.GetConstraints(store.cameraId, store.device);
     setTimeout(() => {
       navigator.mediaDevices

package/dist/collection/components/common/id-capture/id-capture.js

@@ -29,7 +29,7 @@ export class IdCapture {
     this.verified = false;
     this.cameras = new Cameras();
     this.showDemo = true;
-    this.baseComponent = new BaseComponent(FlowSteps.CiFrontHoldAnimation);
+    this.baseComponent = new BaseComponent(FlowSteps.CiFrontCapture);
   }
   eventVideoStarted(event) {
     this.videoStarted = true;
@@ -43,16 +43,14 @@ export class IdCapture {
     }
   }
   async componentDidLoad() {
-    await this.baseComponent.logStep(FlowSteps.CiFrontHoldAnimation, FlowMoments.Initialized);
+    await this.baseComponent.logStep(FlowSteps.CiFrontCapture, FlowMoments.Initialized);
     this.demoVideo.src = IdCaptureValues.IDPoseDemoMapping[IDPose.Straight];
     this.demoVideo.play();
     await delay(IdCaptureValues.VideoLenght);
     this.showDemo = false;
-    await this.baseComponent.logStep(FlowSteps.CiFrontHoldAnimation, FlowMoments.Finalized);
     this.openCamera();
   }
   async openCamera() {
-    await this.baseComponent.logStep(FlowSteps.CiFrontCapture, FlowMoments.Initialized);
     const constraints = this.cameras.GetConstraints(store.cameraId, store.device);
     setTimeout(() => {
       navigator.mediaDevices

package/dist/collection/components/common/id-tilt/id-tilt.js

@@ -29,7 +29,7 @@ export class IdTilt {
     this.verified = false;
     this.cameras = new Cameras();
     this.showDemo = true;
-    this.baseComponent = new BaseComponent(FlowSteps.CiFrontHoldAnimation);
+    this.baseComponent = new BaseComponent(FlowSteps.CiTilt);
   }
   eventVideoStarted(event) {
     this.videoStarted = true;
@@ -43,16 +43,14 @@ export class IdTilt {
     }
   }
   async componentDidLoad() {
-    await this.baseComponent.logStep(FlowSteps.CiFrontTiltAnimation, FlowMoments.Initialized);
+    await this.baseComponent.logStep(FlowSteps.CiTilt, FlowMoments.Initialized);
     this.demoVideo.src = IdCaptureValues.IDPoseDemoMapping[IDPose.Tilted];
     this.demoVideo.play();
     await delay(IdCaptureValues.VideoLenght);
     this.showDemo = false;
-    await this.baseComponent.logStep(FlowSteps.CiFrontTiltAnimation, FlowMoments.Finalized);
     this.openCamera();
   }
   async openCamera() {
-    await this.baseComponent.logStep(FlowSteps.CiTilt, FlowMoments.Initialized);
     const constraints = this.cameras.GetConstraints(store.cameraId, store.device);
     setTimeout(() => {
       navigator.mediaDevices
@@ -139,7 +137,7 @@ export class IdTilt {
   static get events() {
     return [{
         "method": "eventPhotoCapture",
-        "name": "photoIdCapture",
+        "name": "photoTiltCapture",
         "bubbles": true,
         "cancelable": true,
         "composed": true,

package/dist/collection/components/common/selfie-capture/selfie-capture.js

@@ -30,23 +30,7 @@ export class SelfieCapture {
     this.cameras = new Cameras();
     this.demoEnded = false;
     this.uploadingLink = 'https://ekyc.blob.core.windows.net/$web/animations/uploading_selfie.mp4';
-    this.baseComponent = new BaseComponent(FlowSteps.SelfieHoldAnimation);
-  }
-  async eventChangeTitle(event) {
-    // this.stopAnimation = false;
-    if (event.detail == null) {
-      this.titleMesage = SelfieCaptureValues.FinalTitle;
-    }
-    else {
-      await this.baseComponent.logStep(FlowSteps.SelfieTiltAnimation, FlowMoments.Initialized);
-      this.titleMesage = SelfieCaptureValues.FacePoseMapping[event.detail];
-      this.demoEnded = false;
-      this.demoVideo.src = SelfieCaptureValues.FacePoseDemoMapping[event.detail];
-      this.demoVideo.play();
-      await delay(SelfieCaptureValues.VideoLenght);
-      this.demoEnded = true;
-      await this.baseComponent.logStep(FlowSteps.SelfieTiltAnimation, FlowMoments.Finalized);
-    }
+    this.baseComponent = new BaseComponent(FlowSteps.SelfieCapture);
   }
   eventVideoStarted(event) {
     this.videoStarted = true;
@@ -63,16 +47,14 @@ export class SelfieCapture {
     }
   }
   async componentDidLoad() {
-    await this.baseComponent.logStep(FlowSteps.SelfieHoldAnimation, FlowMoments.Initialized);
+    await this.baseComponent.logStep(FlowSteps.SelfieCapture, FlowMoments.Initialized);
     this.demoVideo.src = SelfieCaptureValues.FacePoseDemoMapping[FacePose.Main];
     this.demoVideo.play();
     await delay(SelfieCaptureValues.VideoLenght);
     this.demoEnded = true;
-    await this.baseComponent.logStep(FlowSteps.SelfieHoldAnimation, FlowMoments.Finalized);
     this.openCamera();
   }
   async openCamera() {
-    await this.baseComponent.logStep(FlowSteps.SelfieCapture, FlowMoments.Initialized);
     const constraints = this.cameras.GetConstraints('', store.device, true);
     setTimeout(() => {
       navigator.mediaDevices
@@ -103,7 +85,7 @@ export class SelfieCapture {
     this.captureTaken = true;
     let res = await Stream.getInstance(VerificationMode.Full).takePhoto();
     this.photoIsReady(res);
-    await this.baseComponent.logStep(FlowSteps.SelfieHoldAnimation, FlowMoments.Finalized);
+    await this.baseComponent.logStep(FlowSteps.SelfieCapture, FlowMoments.Finalized);
   }
   verificationFinished() {
     if (this.verified)
@@ -193,12 +175,6 @@ export class SelfieCapture {
   static get elementRef() { return "component"; }
   static get listeners() {
     return [{
-        "name": "changeTitle",
-        "method": "eventChangeTitle",
-        "target": undefined,
-        "capture": false,
-        "passive": false
-      }, {
         "name": "videoStarted",
         "method": "eventVideoStarted",
         "target": undefined,

package/dist/collection/components/common/selfie-tilt/selfie-tilt.css

@@ -0,0 +1,7 @@
+/* .cameraContainer {
+  width: 100%;
+  height: 100%;
+  z-index: 10;
+  position: relative;
+  overflow: hidden;
+} */

package/dist/collection/components/common/selfie-tilt/selfie-tilt.js

@@ -0,0 +1,212 @@
+import { h } from '@stencil/core';
+import { Cameras } from '../../../helpers/Cameras';
+import { Stream } from '../../../helpers/Stream';
+import { SelfieCaptureValues } from '../../../helpers/textValues';
+import { FaceML5Detector } from '../../../libs/FaceML5Detector/FaceML5Detector';
+import { delay } from '../../../utils/utils';
+import store from '../../../helpers/store';
+import { BaseComponent } from '../../base-component';
+import { FlowMoments, FlowSteps } from '../../../models/FlowSteps';
+import { VerificationMode } from '../../../models/IVerificationMode';
+export class SelfieTilt {
+  // @State() private animationPath: string;
+  constructor() {
+    this.photoIsReady = photos => {
+      //this.closeCamera();
+      this.eventPhotoCapture.emit(photos);
+    };
+    this.videoStarted = undefined;
+    this.captureTaken = undefined;
+    this.verified = undefined;
+    this.titleMesage = undefined;
+    this.demoEnded = undefined;
+    this.demoVideo = undefined;
+    this.uploadingLink = undefined;
+    this.captureHeight = undefined;
+    this.captureWidth = undefined;
+    this.captureTaken = false;
+    this.verified = false;
+    this.cameras = new Cameras();
+    this.demoEnded = false;
+    this.uploadingLink = 'https://ekyc.blob.core.windows.net/$web/animations/uploading_selfie.mp4';
+    this.baseComponent = new BaseComponent(FlowSteps.SelfieTilt);
+  }
+  async eventChangeTitle(event) {
+    // this.stopAnimation = false;
+    if (event.detail == null) {
+      this.titleMesage = SelfieCaptureValues.FinalTitle;
+    }
+    else {
+      this.titleMesage = SelfieCaptureValues.FacePoseMapping[event.detail];
+      this.demoEnded = false;
+      this.demoVideo.src = SelfieCaptureValues.FacePoseDemoMapping[event.detail];
+      this.demoVideo.play();
+      await delay(SelfieCaptureValues.VideoLenght);
+      this.demoEnded = true;
+    }
+  }
+  eventVideoStarted(event) {
+    this.videoStarted = true;
+    var cameraSize = event.detail;
+    var height = Math.round((cameraSize.width * 16) / 9);
+    this.captureHeight = height - Math.round((window.screen.height - height) / 2);
+    this.captureWidth = Math.round((this.captureHeight * 9) / 16);
+  }
+  componentWillLoad() {
+    this.titleMesage = SelfieCaptureValues.Title;
+    //this.videoDemoStyle = this.device.isMobile ? { 'width': window.screen.width + 'px', 'height': window.screen.height + 'px', 'object-fit': 'fill' } : {};
+    if (!navigator.mediaDevices) {
+      this.apiErrorEvent.emit({ message: 'This browser does not support webRTC' });
+    }
+  }
+  async componentDidLoad() {
+    this.mainStream = Stream.getInstance(VerificationMode.Tilt);
+    await this.baseComponent.logStep(FlowSteps.SelfieTilt, FlowMoments.Initialized);
+    this.openCamera();
+  }
+  async openCamera() {
+    const constraints = this.cameras.GetConstraints('', store.device, true);
+    setTimeout(() => {
+      navigator.mediaDevices
+        .getUserMedia(constraints)
+        .then(stream => {
+        this.mainStream.initStream(stream);
+      })
+        .catch(e => {
+        this.closeCamera();
+        this.apiErrorEvent.emit(e);
+      });
+    }, 100);
+  }
+  closeCamera() {
+    if (this.mainStream) {
+      this.mainStream.dropStream();
+    }
+  }
+  disconnectedCallback() {
+    this.closeCamera();
+    Stream.instance = null;
+    FaceML5Detector.instance = null;
+  }
+  async takePhoto() {
+    if (this.captureTaken)
+      return;
+    this.captureTaken = true;
+    let res = this.mainStream.takePhoto();
+    this.photoIsReady(res);
+    await this.baseComponent.logStep(FlowSteps.SelfieCapture, FlowMoments.Finalized);
+  }
+  verificationFinished() {
+    if (this.verified)
+      return;
+    this.verified = true;
+    this.titleMesage = SelfieCaptureValues.Loading;
+    this.closeCamera();
+    this.demoEnded = false;
+    this.demoVideo.src = this.uploadingLink;
+    this.demoVideo.loop = true;
+    this.demoVideo.play();
+  }
+  render() {
+    let cameraStyle;
+    if (store.device.isMobile && this.videoStarted) {
+      cameraStyle = {
+        'width': this.captureWidth + 'px',
+        'height': this.captureHeight + 'px',
+        'overflow': 'hidden',
+        'borderRadius': '10px',
+        'text-align': 'center',
+        'margin': 'auto',
+      };
+    }
+    let titleClass = this.verified ? 'color-black-2 text-center' : 'color-white text-center';
+    //let videoClass = this.device.isMobile ? '' : 'video-demo';
+    let bgDemo = this.verified ? 'container' : 'container bg-black';
+    return (h("div", { class: bgDemo }, h("div", { class: "container-video" }, h("div", { hidden: this.demoEnded }, h("video", { id: "howtoSelfie", class: "video-demo", playsinline: true, ref: el => (this.demoVideo = el) }, h("source", { type: "video/mp4" }))), h("div", { hidden: this.demoEnded == false }, h("div", { hidden: this.verified }, h("div", { class: "video-capture" }, h("div", { style: cameraStyle }, h("camera-comp", { "capture-mode": "selfie" }))))), h("div", { class: "capture-title" }, h("h1", { class: titleClass }, this.titleMesage), h("p", { class: "main-text font-size-18 text-right mb-0" }, SelfieCaptureValues.FooterText)))));
+  }
+  static get is() { return "selfie-tilt"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["selfie-tilt.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["selfie-tilt.css"]
+    };
+  }
+  static get states() {
+    return {
+      "videoStarted": {},
+      "captureTaken": {},
+      "verified": {},
+      "titleMesage": {},
+      "demoEnded": {},
+      "demoVideo": {},
+      "uploadingLink": {},
+      "captureHeight": {},
+      "captureWidth": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "eventPhotoCapture",
+        "name": "photoSelfieTiltCapture",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }, {
+        "method": "apiErrorEvent",
+        "name": "apiError",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
+  static get elementRef() { return "component"; }
+  static get listeners() {
+    return [{
+        "name": "changeTitle",
+        "method": "eventChangeTitle",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "videoStarted",
+        "method": "eventVideoStarted",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "takePhoto",
+        "method": "takePhoto",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
+        "name": "verificationFinished",
+        "method": "verificationFinished",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }];
+  }
+}