ngx-scandoc 1.1.1 → 1.1.3

package/fesm2020/ngx-scandoc.mjs

@@ -55,9 +55,6 @@ import { FormlySelectModule } from '@ngx-formly/core/select';
 import { FormlyMatDatepickerModule } from '@ngx-formly/material/datepicker';
 import * as i4$1 from '@angular/material/form-field';
 import * as i1$3 from '@angular/platform-browser';
-import * as i4$2 from '@angular/flex-layout';
-import { FlexModule, FlexLayoutModule } from '@angular/flex-layout';
-import * as i5$3 from '@angular/flex-layout/extended';
 import { QRCodeModule } from 'angularx-qrcode';
 import { webSocket } from 'rxjs/webSocket';
 
@@ -1247,10 +1244,10 @@ WebcamComponent.DEFAULT_VIDEO_OPTIONS = {
 WebcamComponent.DEFAULT_IMAGE_TYPE = 'image/jpeg';
 WebcamComponent.DEFAULT_IMAGE_QUALITY = 1;
 WebcamComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WebcamComponent, deps: [{ token: i1.BreakpointObserver }, { token: i2.Platform }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: NgxScandocCameraProvider }], target: i0.ɵɵFactoryTarget.Component });
-WebcamComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: { imageHandler: "imageHandler", id: "id", type: "type", width: "width", height: "height", videoOptions: "videoOptions", allowCameraSwitch: "allowCameraSwitch", mirrorImage: "mirrorImage", captureImageData: "captureImageData", imageType: "imageType", imageQuality: "imageQuality", trigger: "trigger", switchCamera: "switchCamera" }, outputs: { imageCapture: "imageCapture", initError: "initError", imageClick: "imageClick", cameraSwitched: "cameraSwitched", videoReady: "videoReady", destroyed: "destroyed" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "video", first: true, predicate: ["video"], descendants: true, static: true }, { propertyName: "videoStreamer", first: true, predicate: ["videoStreamer"], descendants: true, static: true }, { propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true, static: true }, { propertyName: "canvasSnapshot", first: true, predicate: ["canvasSnapshot"], descendants: true, static: true }, { propertyName: "canvasResize", first: true, predicate: ["canvasResize"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"webcam-wrapper\">\n  <div>\n    <video\n      #video\n      autoplay\n      muted\n      style=\"display: block\"\n      playsinline\n\n    ></video>\n\n    <div class=\"rectangle\">\n\n      <canvas\n        #canvas\n        [ngStyle]=\"{ visibility: showVideo ? 'visible' : 'hidden' }\"\n        [width]=\"canvasSize.width\"\n        [height]=\"canvasSize.height\"\n      ></canvas>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex:1;transform:transale3d(0,0,0);background-color:#000}.webcam-wrapper{display:flex;flex-direction:row;align-items:center;flex:1;justify-content:center}.webcam-wrapper canvas{transform:transale3d(0,0,0);display:block;position:relative;z-index:20;left:0;top:0}.webcam-wrapper .rectangle{position:absolute;left:0;top:0;display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+WebcamComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: { imageHandler: "imageHandler", id: "id", type: "type", width: "width", height: "height", videoOptions: "videoOptions", allowCameraSwitch: "allowCameraSwitch", mirrorImage: "mirrorImage", captureImageData: "captureImageData", imageType: "imageType", imageQuality: "imageQuality", trigger: "trigger", switchCamera: "switchCamera" }, outputs: { imageCapture: "imageCapture", initError: "initError", imageClick: "imageClick", cameraSwitched: "cameraSwitched", videoReady: "videoReady", destroyed: "destroyed" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "video", first: true, predicate: ["video"], descendants: true, static: true }, { propertyName: "videoStreamer", first: true, predicate: ["videoStreamer"], descendants: true, static: true }, { propertyName: "canvas", first: true, predicate: ["canvas"], descendants: true, static: true }, { propertyName: "canvasSnapshot", first: true, predicate: ["canvasSnapshot"], descendants: true, static: true }, { propertyName: "canvasResize", first: true, predicate: ["canvasResize"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"webcam-wrapper\">\n  <div>\n    <video\n      #video\n      autoplay\n      muted\n      style=\"display: block\"\n      playsinline\n\n    ></video>\n\n    <div class=\"rectangle\">\n\n      <canvas\n        #canvas\n        [ngStyle]=\"{ visibility: showVideo ? 'visible' : 'hidden' }\"\n        [width]=\"canvasSize.width\"\n        [height]=\"canvasSize.height\"\n      ></canvas>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex:1;transform:transale3d(0,0,0);background-color:#000}.webcam-wrapper{display:flex;flex-direction:row;align-items:center;flex:1;justify-content:center;position:relative}.webcam-wrapper canvas{transform:transale3d(0,0,0);display:block;position:relative;z-index:20;left:0;top:0}.webcam-wrapper .rectangle{position:absolute;left:0;top:0;display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i5.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: WebcamComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngx-scandoc-webcam', template: "<div class=\"webcam-wrapper\">\n  <div>\n    <video\n      #video\n      autoplay\n      muted\n      style=\"display: block\"\n      playsinline\n\n    ></video>\n\n    <div class=\"rectangle\">\n\n      <canvas\n        #canvas\n        [ngStyle]=\"{ visibility: showVideo ? 'visible' : 'hidden' }\"\n        [width]=\"canvasSize.width\"\n        [height]=\"canvasSize.height\"\n      ></canvas>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex:1;transform:transale3d(0,0,0);background-color:#000}.webcam-wrapper{display:flex;flex-direction:row;align-items:center;flex:1;justify-content:center}.webcam-wrapper canvas{transform:transale3d(0,0,0);display:block;position:relative;z-index:20;left:0;top:0}.webcam-wrapper .rectangle{position:absolute;left:0;top:0;display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;height:100%}\n"] }]
+            args: [{ selector: 'ngx-scandoc-webcam', template: "<div class=\"webcam-wrapper\">\n  <div>\n    <video\n      #video\n      autoplay\n      muted\n      style=\"display: block\"\n      playsinline\n\n    ></video>\n\n    <div class=\"rectangle\">\n\n      <canvas\n        #canvas\n        [ngStyle]=\"{ visibility: showVideo ? 'visible' : 'hidden' }\"\n        [width]=\"canvasSize.width\"\n        [height]=\"canvasSize.height\"\n      ></canvas>\n    </div>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:row;flex:1;transform:transale3d(0,0,0);background-color:#000}.webcam-wrapper{display:flex;flex-direction:row;align-items:center;flex:1;justify-content:center;position:relative}.webcam-wrapper canvas{transform:transale3d(0,0,0);display:block;position:relative;z-index:20;left:0;top:0}.webcam-wrapper .rectangle{position:absolute;left:0;top:0;display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;height:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.BreakpointObserver }, { type: i2.Platform }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: NgxScandocCameraProvider }]; }, propDecorators: { imageHandler: [{
                 type: Input
             }], id: [{
@@ -2857,10 +2854,15 @@ class ScanComponent extends BaseComponent {
             this.__subs(this.scanProvider.sendLog(this.logData)).subscribe();
             console.log(this.logData);
         }
-        this.dialogRef?.close({
+        this.actions.emit({
+            type: 'scanDataUse',
             model: this.model,
             images: this.images,
         });
+        // this.dialogRef?.close({
+        //   model: this.model,
+        //   images: this.images,
+        // });
     }
     selfie() {
         this.dialogs
@@ -2888,10 +2890,10 @@ class ScanComponent extends BaseComponent {
     }
 }
 ScanComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i1$2.TranslateService }, { token: NgxScandocCameraProvider }, { token: i0.Injector }, { token: LayoutProvider }, { token: AuthProvider }], target: i0.ɵɵFactoryTarget.Component });
-ScanComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScanComponent, selector: "ngx-scan", inputs: { type: "type", dialogs: "dialogs", showDialog: "showDialog" }, outputs: { actions: "actions" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class.mobile": "this.class" } }, viewQueries: [{ propertyName: "wraper", first: true, predicate: ["wraper"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<section *ngIf=\"result\">\n  <ngx-scan-results\n    (action)=\"selfie()\"\n    [form]=\"form\"\n    [model]=\"model\"\n    [images]=\"images\"\n  ></ngx-scan-results>\n\n  <footer>\n    <div class=\"actions\">\n      <button fxFlex class=\"mr-4\" mat-raised-button (click)=\"retake()\">\n        {{ \"pms.dialogs.components.scanProfile.reTake\" | translate }}\n      </button>\n      <button\n        [disabled]=\"error || form.invalid\"\n        fxFlex\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"use()\"\n      >\n        {{ \"pms.dialogs.components.scanProfile.useData\" | translate }}\n      </button>\n    </div>\n  </footer>\n</section>\n\n<section *ngIf=\"!result && documentTypeSelected\">\n  <div #wraper class=\"wraper\">\n    <div class=\"loading\" *ngIf=\"!cameraReady && !preview\">\n      <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n    </div>\n\n    <ng-container *ngIf=\"!error\">\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main\"\n        [imageQuality]=\"1\"\n        #webcam\n        fxFlex\n        type=\"document\"\n        [trigger]=\"trigger\"\n        [imageHandler]=\"imageHandler\"\n        (imageCapture)=\"handleImage($event)\"\n        [allowCameraSwitch]=\"allowCameraSwitch\"\n        [videoOptions]=\"videoOptions\"\n        [switchCamera]=\"cameraProvider.nextWebcamObservable\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        [width]=\"width\"\n        [height]=\"height\"\n        (destroyed)=\"cameraOff($event)\"\n        (videoReady)=\"videoReady($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      fxLayout=\"row\"\n      fxFlex\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"z-index: 20; position: absolute; width: 100%; height: 100%\"\n    >\n      <div class=\"p-16 error\" *ngIf=\"error\">\n        <div>\n          <div class=\"title\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n            <mat-icon>error_outline</mat-icon\n            ><span class=\"ml-8\">{{\n              \"pms.dialogs.components.scanProfile.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ng-container *ngIf=\"errorCode === '1001'\">\n            <div>\n              Could not classify the given object as a supported document.\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"errorCode === '1002'\">\n            <div>\n              Something is wrong with extraction data. Please try again.\n            </div>\n          </ng-container>\n\n          <ul *ngIf=\"errorCode === '1000'\">\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.placeIdCloseToDevice\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.ensureSufficientLight\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.holdDocumentSteady\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureAllEdgesOfTheIdAreVisible\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureThereAreNoGlareAndShadowsOnTheId\"\n                  | translate\n              }}\n            </li>\n          </ul>\n        </div>\n      </div>\n\n      <div\n        class=\"scanPreview\"\n        fxFlex\n        fxLayout=\"column\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <!-- <div class=\"py-16\" style=\"font-size: 16px\">\n          {{\n            \"pms.dialogs.components.scanProfile.ensureAllTextsAreVisible\"\n              | translate\n          }}\n        </div> -->\n        <div\n          fxFlex\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer>\n    <div\n      class=\"displayInfo\"\n      ngClass.lt-sm=\"mobile\"\n      *ngIf=\"!preview && cameraReady\"\n    >\n      {{ displayInfo }}\n    </div>\n    <!-- <div style=\"height: 26px\">\n      <div\n        style=\"text-align: center; font-size: 18px\"\n        *ngIf=\"idScan && !preview && cameraReady\"\n      >\n        <ng-container *ngIf=\"idScan === 'BACK'\">\n          Turn document and:\n          {{ \"pms.dialogs.components.scanProfile.captureBack\" | translate }}\n        </ng-container>\n        <ng-container *ngIf=\"idScan === 'FRONT'\">\n          Turn document and:\n          {{ \"pms.dialogs.components.scanProfile.captureFront\" | translate }}\n        </ng-container>\n      </div>\n    </div> -->\n\n    <div class=\"actions\" *ngIf=\"preview\">\n      <button fxFlex class=\"mr-4\" mat-raised-button (click)=\"retry()\">\n        {{ \"pms.dialogs.components.scanProfile.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        fxFlex\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{\n          \"pms.dialogs.components.scanProfile.continueWithSelectedImage\"\n            | translate\n        }}\n      </button>\n    </div>\n  </footer>\n</section>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden}section{flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden}.wraper{position:relative;overflow:hidden;display:flex;flex-direction:column;flex:1}.wraper .loading{position:absolute;inset:0;z-index:20;background-color:#f5f5f5}.documentTurnOver{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.documentTurnOver mat-icon{width:200px;color:#fff;height:200px;font-size:100px}.displayInfo{text-align:center;flex:1;width:100%;background-color:#000;height:50px;line-height:50px;color:#fff;z-index:200}.displayInfo.mobile{font-size:12px}.preview{width:100%;border-radius:1%}footer button{box-shadow:none!important;height:45px;min-height:45px;text-transform:uppercase}footer .actions{display:flex;flex-direction:row;align-items:center;padding:8px}footer .actions button{flex:1}.error{display:flex;align-items:center;justify-content:center;flex:1}.error .title{font-size:20px;margin-bottom:8px}.error .title mat-icon{margin-right:8px}.error ul{font-size:18px;list-style-type:none}mat-card{box-shadow:none!important}.mr-4{margin-right:4px}.ml-4{margin-left:4px}.p-16{padding:16px}.p-8{padding:8px}.py-16{padding:16px 0}.w-100-p{width:100%}.scanPreview{padding:16px}.scanPreview .image{background-position:center;background-repeat:no-repeat;background-size:contain}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "id", "type", "width", "height", "videoOptions", "allowCameraSwitch", "mirrorImage", "captureImageData", "imageType", "imageQuality", "trigger", "switchCamera"], outputs: ["imageCapture", "initError", "imageClick", "cameraSwitched", "videoReady", "destroyed"] }, { kind: "component", type: i7$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: ScanResultsComponent, selector: "ngx-scan-results", inputs: ["model", "images", "form"], outputs: ["action"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ScanComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScanComponent, selector: "ngx-scan", inputs: { type: "type", dialogs: "dialogs", showDialog: "showDialog" }, outputs: { actions: "actions" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class.mobile": "this.class" } }, viewQueries: [{ propertyName: "wraper", first: true, predicate: ["wraper"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<section *ngIf=\"result\">\n  <ngx-scan-results\n    (action)=\"selfie()\"\n    [form]=\"form\"\n    [model]=\"model\"\n    [images]=\"images\"\n  ></ngx-scan-results>\n\n  <footer>\n    <div class=\"actions\">\n      <button class=\"mr-4\" mat-raised-button (click)=\"retake()\">\n      retake\n      </button>\n      <button\n        [disabled]=\"error || form.invalid\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"use()\"\n      >\n       use\n      </button>\n    </div>\n  </footer>\n</section>\n\n<section *ngIf=\"!result && documentTypeSelected\">\n  <div #wraper class=\"wraper\">\n    <div class=\"loading\" *ngIf=\"!cameraReady && !preview\">\n      <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n    </div>\n\n    <ng-container *ngIf=\"!error\">\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main\"\n        [imageQuality]=\"1\"\n        #webcam\n        type=\"document\"\n        [trigger]=\"trigger\"\n        [imageHandler]=\"imageHandler\"\n        (imageCapture)=\"handleImage($event)\"\n        [allowCameraSwitch]=\"allowCameraSwitch\"\n        [videoOptions]=\"videoOptions\"\n        [switchCamera]=\"cameraProvider.nextWebcamObservable\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        [width]=\"width\"\n        [height]=\"height\"\n        (destroyed)=\"cameraOff($event)\"\n        (videoReady)=\"videoReady($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"z-index: 20; position: absolute; width: 100%; height: 100%\"\n    >\n      <div class=\"p-16 error\" *ngIf=\"error\">\n        <div>\n          <div class=\"title\">\n            <mat-icon>error_outline</mat-icon\n            ><span class=\"ml-8\">{{\n              \"pms.dialogs.components.scanProfile.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ng-container *ngIf=\"errorCode === '1001'\">\n            <div>\n              Could not classify the given object as a supported document.\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"errorCode === '1002'\">\n            <div>\n              Something is wrong with extraction data. Please try again.\n            </div>\n          </ng-container>\n\n          <ul *ngIf=\"errorCode === '1000'\">\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.placeIdCloseToDevice\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.ensureSufficientLight\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.holdDocumentSteady\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureAllEdgesOfTheIdAreVisible\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureThereAreNoGlareAndShadowsOnTheId\"\n                  | translate\n              }}\n            </li>\n          </ul>\n        </div>\n      </div>\n\n      <div class=\"scanPreview\" *ngIf=\"!error && !scaning\">\n        <!-- <div class=\"py-16\" style=\"font-size: 16px\">\n          {{\n            \"pms.dialogs.components.scanProfile.ensureAllTextsAreVisible\"\n              | translate\n          }}\n        </div> -->\n        <div\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer>\n    <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      {{ displayInfo }}\n    </div>\n    <!-- <div style=\"height: 26px\">\n      <div\n        style=\"text-align: center; font-size: 18px\"\n        *ngIf=\"idScan && !preview && cameraReady\"\n      >\n        <ng-container *ngIf=\"idScan === 'BACK'\">\n          Turn document and:\n          {{ \"pms.dialogs.components.scanProfile.captureBack\" | translate }}\n        </ng-container>\n        <ng-container *ngIf=\"idScan === 'FRONT'\">\n          Turn document and:\n          {{ \"pms.dialogs.components.scanProfile.captureFront\" | translate }}\n        </ng-container>\n      </div>\n    </div> -->\n\n    <div class=\"actions\" *ngIf=\"preview\">\n      <button class=\"mr-4\" mat-raised-button (click)=\"retry()\">\n        {{ \"pms.dialogs.components.scanProfile.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{\n          \"pms.dialogs.components.scanProfile.continueWithSelectedImage\"\n            | translate\n        }}\n      </button>\n    </div>\n  </footer>\n</section>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden}section{flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden}.wraper{position:relative;overflow:hidden;display:flex;flex-direction:column;flex:1}.wraper .loading{position:absolute;inset:0;z-index:20;background-color:#f5f5f5}.documentTurnOver{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.documentTurnOver mat-icon{width:200px;color:#fff;height:200px;font-size:100px}.displayInfo{text-align:center;flex:1;width:100%;background-color:#000;height:50px;display:flex;flex-direction:row;align-items:center;justify-content:center;color:#fff;z-index:200}.displayInfo.mobile{font-size:12px}.preview{width:100%;border-radius:1%}footer button{box-shadow:none!important;height:45px;min-height:45px;text-transform:uppercase}footer .actions{display:flex;flex-direction:row;align-items:center;padding:8px}footer .actions button{flex:1}.error{display:flex;align-items:center;justify-content:center;flex:1}.error .title{font-size:20px;margin-bottom:8px}.error .title mat-icon{margin-right:8px}.error ul{font-size:18px;list-style-type:none}mat-card{box-shadow:none!important}.mr-4{margin-right:4px}.ml-4{margin-left:4px}.p-16{padding:16px}.p-8{padding:8px}.py-16{padding:16px 0}.w-100-p{width:100%}.scanPreview{padding:16px}.scanPreview .image{background-position:center;background-repeat:no-repeat;background-size:contain}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "id", "type", "width", "height", "videoOptions", "allowCameraSwitch", "mirrorImage", "captureImageData", "imageType", "imageQuality", "trigger", "switchCamera"], outputs: ["imageCapture", "initError", "imageClick", "cameraSwitched", "videoReady", "destroyed"] }, { kind: "component", type: i7$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: ScanResultsComponent, selector: "ngx-scan-results", inputs: ["model", "images", "form"], outputs: ["action"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngx-scan', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section *ngIf=\"result\">\n  <ngx-scan-results\n    (action)=\"selfie()\"\n    [form]=\"form\"\n    [model]=\"model\"\n    [images]=\"images\"\n  ></ngx-scan-results>\n\n  <footer>\n    <div class=\"actions\">\n      <button fxFlex class=\"mr-4\" mat-raised-button (click)=\"retake()\">\n        {{ \"pms.dialogs.components.scanProfile.reTake\" | translate }}\n      </button>\n      <button\n        [disabled]=\"error || form.invalid\"\n        fxFlex\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"use()\"\n      >\n        {{ \"pms.dialogs.components.scanProfile.useData\" | translate }}\n      </button>\n    </div>\n  </footer>\n</section>\n\n<section *ngIf=\"!result && documentTypeSelected\">\n  <div #wraper class=\"wraper\">\n    <div class=\"loading\" *ngIf=\"!cameraReady && !preview\">\n      <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n    </div>\n\n    <ng-container *ngIf=\"!error\">\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main\"\n        [imageQuality]=\"1\"\n        #webcam\n        fxFlex\n        type=\"document\"\n        [trigger]=\"trigger\"\n        [imageHandler]=\"imageHandler\"\n        (imageCapture)=\"handleImage($event)\"\n        [allowCameraSwitch]=\"allowCameraSwitch\"\n        [videoOptions]=\"videoOptions\"\n        [switchCamera]=\"cameraProvider.nextWebcamObservable\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        [width]=\"width\"\n        [height]=\"height\"\n        (destroyed)=\"cameraOff($event)\"\n        (videoReady)=\"videoReady($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      fxLayout=\"row\"\n      fxFlex\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"z-index: 20; position: absolute; width: 100%; height: 100%\"\n    >\n      <div class=\"p-16 error\" *ngIf=\"error\">\n        <div>\n          <div class=\"title\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n            <mat-icon>error_outline</mat-icon\n            ><span class=\"ml-8\">{{\n              \"pms.dialogs.components.scanProfile.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ng-container *ngIf=\"errorCode === '1001'\">\n            <div>\n              Could not classify the given object as a supported document.\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"errorCode === '1002'\">\n            <div>\n              Something is wrong with extraction data. Please try again.\n            </div>\n          </ng-container>\n\n          <ul *ngIf=\"errorCode === '1000'\">\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.placeIdCloseToDevice\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.ensureSufficientLight\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.holdDocumentSteady\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureAllEdgesOfTheIdAreVisible\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureThereAreNoGlareAndShadowsOnTheId\"\n                  | translate\n              }}\n            </li>\n          </ul>\n        </div>\n      </div>\n\n      <div\n        class=\"scanPreview\"\n        fxFlex\n        fxLayout=\"column\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <!-- <div class=\"py-16\" style=\"font-size: 16px\">\n          {{\n            \"pms.dialogs.components.scanProfile.ensureAllTextsAreVisible\"\n              | translate\n          }}\n        </div> -->\n        <div\n          fxFlex\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer>\n    <div\n      class=\"displayInfo\"\n      ngClass.lt-sm=\"mobile\"\n      *ngIf=\"!preview && cameraReady\"\n    >\n      {{ displayInfo }}\n    </div>\n    <!-- <div style=\"height: 26px\">\n      <div\n        style=\"text-align: center; font-size: 18px\"\n        *ngIf=\"idScan && !preview && cameraReady\"\n      >\n        <ng-container *ngIf=\"idScan === 'BACK'\">\n          Turn document and:\n          {{ \"pms.dialogs.components.scanProfile.captureBack\" | translate }}\n        </ng-container>\n        <ng-container *ngIf=\"idScan === 'FRONT'\">\n          Turn document and:\n          {{ \"pms.dialogs.components.scanProfile.captureFront\" | translate }}\n        </ng-container>\n      </div>\n    </div> -->\n\n    <div class=\"actions\" *ngIf=\"preview\">\n      <button fxFlex class=\"mr-4\" mat-raised-button (click)=\"retry()\">\n        {{ \"pms.dialogs.components.scanProfile.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        fxFlex\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{\n          \"pms.dialogs.components.scanProfile.continueWithSelectedImage\"\n            | translate\n        }}\n      </button>\n    </div>\n  </footer>\n</section>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden}section{flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden}.wraper{position:relative;overflow:hidden;display:flex;flex-direction:column;flex:1}.wraper .loading{position:absolute;inset:0;z-index:20;background-color:#f5f5f5}.documentTurnOver{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.documentTurnOver mat-icon{width:200px;color:#fff;height:200px;font-size:100px}.displayInfo{text-align:center;flex:1;width:100%;background-color:#000;height:50px;line-height:50px;color:#fff;z-index:200}.displayInfo.mobile{font-size:12px}.preview{width:100%;border-radius:1%}footer button{box-shadow:none!important;height:45px;min-height:45px;text-transform:uppercase}footer .actions{display:flex;flex-direction:row;align-items:center;padding:8px}footer .actions button{flex:1}.error{display:flex;align-items:center;justify-content:center;flex:1}.error .title{font-size:20px;margin-bottom:8px}.error .title mat-icon{margin-right:8px}.error ul{font-size:18px;list-style-type:none}mat-card{box-shadow:none!important}.mr-4{margin-right:4px}.ml-4{margin-left:4px}.p-16{padding:16px}.p-8{padding:8px}.py-16{padding:16px 0}.w-100-p{width:100%}.scanPreview{padding:16px}.scanPreview .image{background-position:center;background-repeat:no-repeat;background-size:contain}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}\n"] }]
+            args: [{ selector: 'ngx-scan', changeDetection: ChangeDetectionStrategy.OnPush, template: "<section *ngIf=\"result\">\n  <ngx-scan-results\n    (action)=\"selfie()\"\n    [form]=\"form\"\n    [model]=\"model\"\n    [images]=\"images\"\n  ></ngx-scan-results>\n\n  <footer>\n    <div class=\"actions\">\n      <button class=\"mr-4\" mat-raised-button (click)=\"retake()\">\n      retake\n      </button>\n      <button\n        [disabled]=\"error || form.invalid\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"use()\"\n      >\n       use\n      </button>\n    </div>\n  </footer>\n</section>\n\n<section *ngIf=\"!result && documentTypeSelected\">\n  <div #wraper class=\"wraper\">\n    <div class=\"loading\" *ngIf=\"!cameraReady && !preview\">\n      <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n    </div>\n\n    <ng-container *ngIf=\"!error\">\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main\"\n        [imageQuality]=\"1\"\n        #webcam\n        type=\"document\"\n        [trigger]=\"trigger\"\n        [imageHandler]=\"imageHandler\"\n        (imageCapture)=\"handleImage($event)\"\n        [allowCameraSwitch]=\"allowCameraSwitch\"\n        [videoOptions]=\"videoOptions\"\n        [switchCamera]=\"cameraProvider.nextWebcamObservable\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        [width]=\"width\"\n        [height]=\"height\"\n        (destroyed)=\"cameraOff($event)\"\n        (videoReady)=\"videoReady($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"z-index: 20; position: absolute; width: 100%; height: 100%\"\n    >\n      <div class=\"p-16 error\" *ngIf=\"error\">\n        <div>\n          <div class=\"title\">\n            <mat-icon>error_outline</mat-icon\n            ><span class=\"ml-8\">{{\n              \"pms.dialogs.components.scanProfile.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ng-container *ngIf=\"errorCode === '1001'\">\n            <div>\n              Could not classify the given object as a supported document.\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"errorCode === '1002'\">\n            <div>\n              Something is wrong with extraction data. Please try again.\n            </div>\n          </ng-container>\n\n          <ul *ngIf=\"errorCode === '1000'\">\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.placeIdCloseToDevice\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.ensureSufficientLight\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.holdDocumentSteady\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureAllEdgesOfTheIdAreVisible\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureThereAreNoGlareAndShadowsOnTheId\"\n                  | translate\n              }}\n            </li>\n          </ul>\n        </div>\n      </div>\n\n      <div class=\"scanPreview\" *ngIf=\"!error && !scaning\">\n        <!-- <div class=\"py-16\" style=\"font-size: 16px\">\n          {{\n            \"pms.dialogs.components.scanProfile.ensureAllTextsAreVisible\"\n              | translate\n          }}\n        </div> -->\n        <div\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer>\n    <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      {{ displayInfo }}\n    </div>\n    <!-- <div style=\"height: 26px\">\n      <div\n        style=\"text-align: center; font-size: 18px\"\n        *ngIf=\"idScan && !preview && cameraReady\"\n      >\n        <ng-container *ngIf=\"idScan === 'BACK'\">\n          Turn document and:\n          {{ \"pms.dialogs.components.scanProfile.captureBack\" | translate }}\n        </ng-container>\n        <ng-container *ngIf=\"idScan === 'FRONT'\">\n          Turn document and:\n          {{ \"pms.dialogs.components.scanProfile.captureFront\" | translate }}\n        </ng-container>\n      </div>\n    </div> -->\n\n    <div class=\"actions\" *ngIf=\"preview\">\n      <button class=\"mr-4\" mat-raised-button (click)=\"retry()\">\n        {{ \"pms.dialogs.components.scanProfile.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{\n          \"pms.dialogs.components.scanProfile.continueWithSelectedImage\"\n            | translate\n        }}\n      </button>\n    </div>\n  </footer>\n</section>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden}section{flex:1;display:flex;flex-direction:column;position:relative;overflow:hidden}.wraper{position:relative;overflow:hidden;display:flex;flex-direction:column;flex:1}.wraper .loading{position:absolute;inset:0;z-index:20;background-color:#f5f5f5}.documentTurnOver{position:absolute;width:100%;height:100%;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.documentTurnOver mat-icon{width:200px;color:#fff;height:200px;font-size:100px}.displayInfo{text-align:center;flex:1;width:100%;background-color:#000;height:50px;display:flex;flex-direction:row;align-items:center;justify-content:center;color:#fff;z-index:200}.displayInfo.mobile{font-size:12px}.preview{width:100%;border-radius:1%}footer button{box-shadow:none!important;height:45px;min-height:45px;text-transform:uppercase}footer .actions{display:flex;flex-direction:row;align-items:center;padding:8px}footer .actions button{flex:1}.error{display:flex;align-items:center;justify-content:center;flex:1}.error .title{font-size:20px;margin-bottom:8px}.error .title mat-icon{margin-right:8px}.error ul{font-size:18px;list-style-type:none}mat-card{box-shadow:none!important}.mr-4{margin-right:4px}.ml-4{margin-left:4px}.p-16{padding:16px}.p-8{padding:8px}.py-16{padding:16px 0}.w-100-p{width:100%}.scanPreview{padding:16px}.scanPreview .image{background-position:center;background-repeat:no-repeat;background-size:contain}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: i1$2.TranslateService }, { type: NgxScandocCameraProvider }, { type: i0.Injector }, { type: LayoutProvider }, { type: AuthProvider }]; }, propDecorators: { type: [{
                 type: Input
             }], dialogs: [{
@@ -3434,7 +3436,7 @@ class ConfirmComponent {
     close() { }
 }
 ConfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-ConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfirmComponent, selector: "app-confirm", host: { listeners: { "document:keyup.enter": "onEnterPress($event)", "document:keyup.escape": "onEscapePress($event)" } }, ngImport: i0, template: "<header class=\"page-header\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n\n\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">\n    {{ data.title | translate }}\n\n    <!-- {{ data.text.statusText }} {{ data.text.status }} -->\n  </div>\n\n  <span fxFlex></span>\n\n  <!-- <div class=\"separator\"></div>\n\n  <button mat-button (click)=\"close()\">\n    <mat-icon>close</mat-icon>\n  </button> -->\n  <!-- <mat-icon class=\"mr-16\" style=\"color:#888;\">info_outline</mat-icon> -->\n</header>\n\n<div fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <!-- <img\n    style=\"height: 240px; margin: 34px 0px;display: none;\"\n    [src]=\"'/assets/images/illustrations/' + images[type]\"\n  /> -->\n  <!-- <img style=\"width:60px;\" src=\"/assets/images/illustrations/door-lock.png\"> -->\n\n  <div class=\"text\" *ngIf=\"data.text\">\n    <span [innerHtml]=\"data.text\"></span>\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n\n  <div class=\"actions\" fxLayout=\"row\" fxLayoutAlign=\"end center\">\n    <button\n      *ngIf=\"!data.alert && !options?.hideCancelButton\"\n      (click)=\"action(false)\"\n      mat-raised-button\n    >\n      {{ data.cancel || 'core.page.cancel' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"data.no && !options?.hideNoButton\"\n      (click)=\"action('no')\"\n\n      mat-raised-button\n    >\n      {{ data.no }}\n    </button>\n    <button\n      *ngIf=\"!data.hideOkButton && !options?.hideOkButton\"\n      (click)=\"action(true)\"\n      color=\"accent\"\n      mat-raised-button\n    >\n      <ng-container *ngIf=\"!data.alert\">\n        {{ data.ok || 'core.page.confirm' | translate }}\n      </ng-container>\n\n      <ng-container *ngIf=\"data.alert\">\n        {{ data.ok || 'core.page.close' | translate }}\n      </ng-container>\n    </button>\n  </div>\n</footer>\n", styles: [":host{display:flex;flex-direction:column;flex:1;height:100%;width:100%}.title{font-size:18px}.text{padding:0 30px;text-align:center;font-size:16px;margin:40px 0}.actions{min-height:60px}.actions button{min-width:120px;margin-right:16px;box-shadow:none;text-transform:uppercase}footer{background-color:#fff}footer button{box-shadow:none!important;border:1px solid rgba(0,0,0,.12);font-size:13px}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$3.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
+ConfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfirmComponent, selector: "app-confirm", host: { listeners: { "document:keyup.enter": "onEnterPress($event)", "document:keyup.escape": "onEscapePress($event)" } }, ngImport: i0, template: "<header class=\"page-header\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n\n\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">\n    {{ data.title | translate }}\n\n    <!-- {{ data.text.statusText }} {{ data.text.status }} -->\n  </div>\n\n  <span fxFlex></span>\n\n  <!-- <div class=\"separator\"></div>\n\n  <button mat-button (click)=\"close()\">\n    <mat-icon>close</mat-icon>\n  </button> -->\n  <!-- <mat-icon class=\"mr-16\" style=\"color:#888;\">info_outline</mat-icon> -->\n</header>\n\n<div fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <!-- <img\n    style=\"height: 240px; margin: 34px 0px;display: none;\"\n    [src]=\"'/assets/images/illustrations/' + images[type]\"\n  /> -->\n  <!-- <img style=\"width:60px;\" src=\"/assets/images/illustrations/door-lock.png\"> -->\n\n  <div class=\"text\" *ngIf=\"data.text\">\n    <span [innerHtml]=\"data.text\"></span>\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n\n  <div class=\"actions\" fxLayout=\"row\" fxLayoutAlign=\"end center\">\n    <button\n      *ngIf=\"!data.alert && !options?.hideCancelButton\"\n      (click)=\"action(false)\"\n      mat-raised-button\n    >\n      {{ data.cancel || 'core.page.cancel' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"data.no && !options?.hideNoButton\"\n      (click)=\"action('no')\"\n\n      mat-raised-button\n    >\n      {{ data.no }}\n    </button>\n    <button\n      *ngIf=\"!data.hideOkButton && !options?.hideOkButton\"\n      (click)=\"action(true)\"\n      color=\"accent\"\n      mat-raised-button\n    >\n      <ng-container *ngIf=\"!data.alert\">\n        {{ data.ok || 'core.page.confirm' | translate }}\n      </ng-container>\n\n      <ng-container *ngIf=\"data.alert\">\n        {{ data.ok || 'core.page.close' | translate }}\n      </ng-container>\n    </button>\n  </div>\n</footer>\n", styles: [":host{display:flex;flex-direction:column;flex:1;height:100%;width:100%}.title{font-size:18px}.text{padding:0 30px;text-align:center;font-size:16px;margin:40px 0}.actions{min-height:60px}.actions button{min-width:120px;margin-right:16px;box-shadow:none;text-transform:uppercase}footer{background-color:#fff}footer button{box-shadow:none!important;border:1px solid rgba(0,0,0,.12);font-size:13px}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-confirm', template: "<header class=\"page-header\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n\n\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">\n    {{ data.title | translate }}\n\n    <!-- {{ data.text.statusText }} {{ data.text.status }} -->\n  </div>\n\n  <span fxFlex></span>\n\n  <!-- <div class=\"separator\"></div>\n\n  <button mat-button (click)=\"close()\">\n    <mat-icon>close</mat-icon>\n  </button> -->\n  <!-- <mat-icon class=\"mr-16\" style=\"color:#888;\">info_outline</mat-icon> -->\n</header>\n\n<div fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <!-- <img\n    style=\"height: 240px; margin: 34px 0px;display: none;\"\n    [src]=\"'/assets/images/illustrations/' + images[type]\"\n  /> -->\n  <!-- <img style=\"width:60px;\" src=\"/assets/images/illustrations/door-lock.png\"> -->\n\n  <div class=\"text\" *ngIf=\"data.text\">\n    <span [innerHtml]=\"data.text\"></span>\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n\n  <div class=\"actions\" fxLayout=\"row\" fxLayoutAlign=\"end center\">\n    <button\n      *ngIf=\"!data.alert && !options?.hideCancelButton\"\n      (click)=\"action(false)\"\n      mat-raised-button\n    >\n      {{ data.cancel || 'core.page.cancel' | translate }}\n    </button>\n\n    <button\n      *ngIf=\"data.no && !options?.hideNoButton\"\n      (click)=\"action('no')\"\n\n      mat-raised-button\n    >\n      {{ data.no }}\n    </button>\n    <button\n      *ngIf=\"!data.hideOkButton && !options?.hideOkButton\"\n      (click)=\"action(true)\"\n      color=\"accent\"\n      mat-raised-button\n    >\n      <ng-container *ngIf=\"!data.alert\">\n        {{ data.ok || 'core.page.confirm' | translate }}\n      </ng-container>\n\n      <ng-container *ngIf=\"data.alert\">\n        {{ data.ok || 'core.page.close' | translate }}\n      </ng-container>\n    </button>\n  </div>\n</footer>\n", styles: [":host{display:flex;flex-direction:column;flex:1;height:100%;width:100%}.title{font-size:18px}.text{padding:0 30px;text-align:center;font-size:16px;margin:40px 0}.actions{min-height:60px}.actions button{min-width:120px;margin-right:16px;box-shadow:none;text-transform:uppercase}footer{background-color:#fff}footer button{box-shadow:none!important;border:1px solid rgba(0,0,0,.12);font-size:13px}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"] }]
@@ -3805,10 +3807,10 @@ class ScanSelfieComponent {
     selfie() { }
 }
 ScanSelfieComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanSelfieComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ScanProvider }, { token: DialogsCoreProvider }, { token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
-ScanSelfieComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScanSelfieComponent, selector: "app-scan-selfie", inputs: { type: "type" }, outputs: { actions: "actions" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "wraper", first: true, predicate: ["wraper"], descendants: true }], ngImport: i0, template: "<header class=\"page-header\" fxLayout=\"row\">\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">Selfie</div>\n\n  <span fxFlex></span>\n  <ng-container\n    *ngIf=\"\n      documentTypeSelected &&\n      !result &&\n      !error &&\n      multipleWebcamsAvailable &&\n      !preview\n    \"\n  >\n    <div class=\"separator\"></div>\n    <div style=\"padding: 0px 16px\">\n      <div fxLayout=\"row\" fxLayoutAlign=\"end center\">\n        <mat-form-field\n          style=\"font-size: 14px; width: 200px; margin-top: 8px\"\n          class=\"w-200 mr-16 mt-8\"\n        >\n          <mat-label> Camera </mat-label>\n          <mat-select\n            (selectionChange)=\"selectCamera($event)\"\n            [(ngModel)]=\"deviceId\"\n          >\n            <mat-option\n              *ngFor=\"let device of mediaDevices\"\n              [value]=\"device.deviceId\"\n            >\n              {{ device.label }}\n            </mat-option>\n          </mat-select>\n        </mat-form-field>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-container>\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container>\n  <!-- <ng-container *ngIf=\"type === 'desktop'\">\n    <div class=\"separator\"></div>\n    <button mat-button (click)=\"sendMobile()\">\n      <mat-icon>tablet_mac</mat-icon>\n    </button>\n\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container> -->\n</header>\n\n<div *ngIf=\"!result\" fxFlex fxLayout=\"column\">\n  <div fxFlex #wraper class=\"wraper\" fxLayout=\"row\">\n    <div\n      style=\"\n        position: absolute;\n        top: 0px;\n        left: 0px;\n        right: 0px;\n        bottom: 0px;\n        z-index: 20;\n        background-color: whitesmoke;\n      \"\n      *ngIf=\"!cameraReady && !preview\"\n    >\n      <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n    </div>\n\n    <ng-container *ngIf=\"!error\">\n      <!-- <div\n      class=\"rectangle\"\n      [ngStyle]=\"{\n        'width.px': videoHeight * 0.75 * 1.588,\n        'height.px': videoHeight * 0.75\n      }\"\n    ></div>\n    <svg\n      *ngIf=\"videoWidth\"\n      style=\"position: absolute; left: 0px; top: 0px\"\n      width=\"0\"\n      height=\"0\"\n    >\n      <defs>\n        <clipPath id=\"myClip\">\n          <rect\n            stroke-width=\"6\"\n            stroke-color=\"red\"\n            [attr.x]=\"(videoWidth - videoHeight * 0.75 * 1.588) / 2\"\n            [attr.y]=\"(videoHeight * 0.25) / 2\"\n            [attr.width]=\"videoHeight * 0.75 * 1.588\"\n            [attr.height]=\"videoHeight * 0.75\"\n            rx=\"25\"\n          />\n        </clipPath>\n      </defs>\n    </svg> -->\n\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main\"\n        [imageQuality]=\"1\"\n        #webcam\n        fxFlex\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n        [allowCameraSwitch]=\"allowCameraSwitch\"\n        [videoOptions]=\"videoOptions\"\n        [switchCamera]=\"nextWebcamObservable\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        type=\"selfie\"\n        [width]=\"width\"\n        [height]=\"height\"\n        (destroyed)=\"cameraOff($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      fxLayout=\"row\"\n      fxFlex\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"z-index: 20; position: absolute; width: 100%; height: 100%\"\n    >\n      <div\n        class=\"scanPreview\"\n        fxFlex\n        fxLayout=\"column\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <div\n          fxFlex\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer fxLayout=\"row\" class=\"p-8\">\n    <button\n      [disabled]=\"!cameraReady\"\n      class=\"w-100-p\"\n      *ngIf=\"!preview\"\n      mat-raised-button\n      (click)=\"scan()\"\n    >\n      <ng-container>\n        TAKE SELFIE\n      </ng-container>\n    </button>\n\n    <div\n      class=\"w-100-p\"\n      *ngIf=\"preview\"\n      fxLayout=\"row\"\n      fxLayoutAlign=\"start center\"\n      fxFlex\n    >\n      <button fxFlex class=\"mr-4\" mat-raised-button (click)=\"retry()\">\n        RETRY\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        fxFlex\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n      CONTINUE\n\n      </button>\n    </div>\n  </footer>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}.element{margin-bottom:8px}.element label{font-size:14px}.element div{font-size:18px}.wraper{position:relative;overflow:hidden}h3{color:#459ae5;font-size:16px}.preview{width:100%;border-radius:1%}.documentTypeWraper{width:400px}.documentTypeWraper .label{font-size:14px;margin-bottom:20px}.documentTypeWraper button{box-shadow:none}.overPane{position:absolute;width:100%;height:100%;top:0;left:0}.overPane app-webcam{clip-path:url(#myClip)}.subhead{height:55px;padding-top:8px}.rectangle{z-index:2;position:absolute;top:50%;left:50%;width:85.6mm;height:53.98mm;transform:translate(-50%,-50%);box-sizing:border-box;border:2px dashed #459be5;border-radius:3mm}.mask{z-index:1;position:absolute;width:100%;height:100%;background-position:center center;background-size:380mm;background-repeat:no-repeat}.label{font-size:11px;margin-top:4px}footer button{box-shadow:none!important;height:45px;min-height:45px;border:1px solid rgba(0,0,0,.12);text-transform:uppercase}h4{font-size:16px}.images label{font-size:11px;color:#888;line-height:20px}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px}.error .title{font-size:22px}.error ul{font-size:18px}.photo{width:120px;height:120px;overflow:hidden}.signature{width:200px}mat-card{box-shadow:none!important}.scanBlastWraper button{text-transform:uppercase}.scanBlastWraper.mobile mat-card{margin:4px!important}.scanBlastWraper.mobile .description{font-size:12px;flex-direction:row!important}.scanBlastWraper.mobile .description .imgWrap{padding:0!important}.scanBlastWraper.mobile .description .btnActions{position:absolute;right:0}.scanBlastWraper.mobile .description button{font-size:11px!important;margin:0!important;position:absolute;right:16px}.scanBlastWraper.mobile .description button.rotateButton{top:58px}.scanBlastWraper.mobile .description button.remButton{top:8px}.scanBlastWraper.mobile .description button mat-icon{margin:0!important}.scanBlastWraper.mobile .description button div.label{display:none}.mobile .scanBlast button{font-size:11px!important}.scanBlast{display:flex;flex-direction:row;flex:1;padding:0 4px}.scanBlast mat-card{padding:0;box-shadow:none;margin:8px 4px;flex:1}.scanBlast mat-card .head{display:flex;flex-direction:row;align-items:center;justify-items:center;border-bottom:1px solid rgba(0,0,0,.12);height:60px;padding:8px}.scanBlast mat-card .head.small{height:30px!important;padding:4px 8px!important}.scanBlast mat-card .head.small .title{font-size:12px!important;margin-left:4px!important}.scanBlast mat-card .head button{max-width:120px;height:40px;box-shadow:none;border:1px solid rgba(0,0,0,.12)}.scanBlast mat-card .head .title{margin-left:16px;color:#459ae5;font-size:16px}.scanBlast mat-card .content{margin:8px;flex:1}.scanBlast mat-card .description{text-align:center;color:#888;font-size:14px}.scanBlast mat-card .actions{background-color:#e9e9e9;display:flex;flex-direction:row}.scanBlast mat-card .actions .mat-button-disabled{background-color:#fff!important}.scanBlast mat-card .actions button{box-shadow:none;width:50%;margin:8px;height:40px;font-size:12px}.scanBlast mat-card .actions button mat-icon{margin-right:8px}.scanBlast mat-card .previewPlaceholder{flex:1;border-radius:6px;display:flex;flex-direction:column}.scanBlast mat-card .previewPlaceholder .description{display:flex;flex:1;flex-direction:column;justify-content:center}.scanBlast mat-card .previewPlaceholder button{box-shadow:none;margin-top:8px;height:40px;font-size:12px}.scanBlast mat-card .previewPlaceholder button mat-icon{margin-right:8px}.scanBlast mat-card .previewPlaceholder .imgWrap{flex-direction:column;flex:1;padding:8px;background-color:#f5f5f5;border-radius:4px}.scanBlast mat-card .previewPlaceholder .imgWrap img{width:100%;border-radius:4px}.scanBlast mat-card .previewPlaceholder .imgWrap .image{background-position:center;background-repeat:no-repeat;background-size:contain}.mr-4{margin-right:4px}.ml-4{margin-left:4px}.p-16{padding:16px}.p-8{padding:8px}.py-16{padding:16px 0}.w-100-p{width:100%}.scanPreview{padding:16px}.scanPreview .image{background-position:center;background-repeat:no-repeat;background-size:contain}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.summary label{font-size:12px;color:#888;margin-top:2px}.summary .name{font-size:14px}.selfieContainer{display:flex;flex-direction:column;margin-bottom:20px}.selfieContainer button{box-shadow:none;border:1px solid rgba(0,0,0,.12)}.selfieContainer .selfie{margin:8px auto;width:120px;height:120px;border-radius:60px;border:1px solid rgba(0,0,0,.12)}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "component", type: i5$2.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i7$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "id", "type", "width", "height", "videoOptions", "allowCameraSwitch", "mirrorImage", "captureImageData", "imageType", "imageQuality", "trigger", "switchCamera"], outputs: ["imageCapture", "initError", "imageClick", "cameraSwitched", "videoReady", "destroyed"] }, { kind: "directive", type: i4$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$3.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ScanSelfieComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScanSelfieComponent, selector: "app-scan-selfie", inputs: { type: "type" }, outputs: { actions: "actions" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "wraper", first: true, predicate: ["wraper"], descendants: true }], ngImport: i0, template: "<header class=\"page-header\">\n  <div class=\"title\">Selfie</div>\n\n  <span class=\"flex\"></span>\n  <ng-container\n    *ngIf=\"\n      documentTypeSelected &&\n      !result &&\n      !error &&\n      multipleWebcamsAvailable &&\n      !preview\n    \"\n  >\n    <div class=\"separator\"></div>\n    <div style=\"padding: 0px 16px\">\n      <div class=\"flex-column\">\n        <mat-form-field\n          style=\"font-size: 14px; width: 200px; margin-top: 8px\"\n          class=\"w-200 mr-16 mt-8\"\n        >\n          <mat-label> Camera </mat-label>\n          <mat-select\n            (selectionChange)=\"selectCamera($event)\"\n            [(ngModel)]=\"deviceId\"\n          >\n            <mat-option\n              *ngFor=\"let device of mediaDevices\"\n              [value]=\"device.deviceId\"\n            >\n              {{ device.label }}\n            </mat-option>\n          </mat-select>\n        </mat-form-field>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-container>\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container>\n  <!-- <ng-container *ngIf=\"type === 'desktop'\">\n    <div class=\"separator\"></div>\n    <button mat-button (click)=\"sendMobile()\">\n      <mat-icon>tablet_mac</mat-icon>\n    </button>\n\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container> -->\n</header>\n\n<div *ngIf=\"!result\" class=\"flex-column flex\">\n  <div #wraper class=\"wraper flex flex-row\">\n    <div\n      style=\"\n        position: absolute;\n        top: 0px;\n        left: 0px;\n        right: 0px;\n        bottom: 0px;\n        z-index: 20;\n        background-color: whitesmoke;\n      \"\n      *ngIf=\"!cameraReady && !preview\"\n    >\n      <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n    </div>\n\n    <ng-container *ngIf=\"!error\">\n      <!-- <div\n      class=\"rectangle\"\n      [ngStyle]=\"{\n        'width.px': videoHeight * 0.75 * 1.588,\n        'height.px': videoHeight * 0.75\n      }\"\n    ></div>\n    <svg\n      *ngIf=\"videoWidth\"\n      style=\"position: absolute; left: 0px; top: 0px\"\n      width=\"0\"\n      height=\"0\"\n    >\n      <defs>\n        <clipPath id=\"myClip\">\n          <rect\n            stroke-width=\"6\"\n            stroke-color=\"red\"\n            [attr.x]=\"(videoWidth - videoHeight * 0.75 * 1.588) / 2\"\n            [attr.y]=\"(videoHeight * 0.25) / 2\"\n            [attr.width]=\"videoHeight * 0.75 * 1.588\"\n            [attr.height]=\"videoHeight * 0.75\"\n            rx=\"25\"\n          />\n        </clipPath>\n      </defs>\n    </svg> -->\n\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main flex\"\n        [imageQuality]=\"1\"\n        #webcam\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n        [allowCameraSwitch]=\"allowCameraSwitch\"\n        [videoOptions]=\"videoOptions\"\n        [switchCamera]=\"nextWebcamObservable\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        type=\"selfie\"\n        [width]=\"width\"\n        [height]=\"height\"\n        (destroyed)=\"cameraOff($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"\n        z-index: 20;\n        position: absolute;\n        width: 100%;\n        height: 100%;\n        flex: 1;\n        display: flex;\n        flex-direction: row;\n      \"\n    >\n      <div\n        class=\"scanPreview\"\n        style=\"display: flex; flex-direction: column; flex: 1\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <div\n          style=\"flex: 1\"\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer class=\"p-8 flex-row\">\n    <button\n      [disabled]=\"!cameraReady\"\n      class=\"w-100-p\"\n      *ngIf=\"!preview\"\n      mat-raised-button\n      (click)=\"scan()\"\n    >\n      <ng-container> TAKE SELFIE </ng-container>\n    </button>\n\n    <div\n      class=\"w-100-p flex-row flex\"\n      *ngIf=\"preview\"\n      style=\"align-items: center\"\n    >\n      <button style=\"flex: 1\" class=\"mr-4\" mat-raised-button (click)=\"retry()\">\n        RETRY\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        style=\"flex: 1\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        CONTINUE\n      </button>\n    </div>\n  </footer>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}.page-header{display:flex;flex-direction:row}.flex{flex:1}.flex-column{display:flex;flex-direction:column}.flex-row{display:flex;flex-direction:row}.element{margin-bottom:8px}.element label{font-size:14px}.element div{font-size:18px}.wraper{position:relative;overflow:hidden}h3{color:#459ae5;font-size:16px}.preview{width:100%;border-radius:1%}.documentTypeWraper{width:400px}.documentTypeWraper .label{font-size:14px;margin-bottom:20px}.documentTypeWraper button{box-shadow:none}.overPane{position:absolute;width:100%;height:100%;top:0;left:0}.overPane app-webcam{clip-path:url(#myClip)}.subhead{height:55px;padding-top:8px}.rectangle{z-index:2;position:absolute;top:50%;left:50%;width:85.6mm;height:53.98mm;transform:translate(-50%,-50%);box-sizing:border-box;border:2px dashed #459be5;border-radius:3mm}.mask{z-index:1;position:absolute;width:100%;height:100%;background-position:center center;background-size:380mm;background-repeat:no-repeat}.label{font-size:11px;margin-top:4px}footer button{box-shadow:none!important;height:45px;min-height:45px;border:1px solid rgba(0,0,0,.12);text-transform:uppercase}h4{font-size:16px}.images label{font-size:11px;color:#888;line-height:20px}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px}.error .title{font-size:22px}.error ul{font-size:18px}.photo{width:120px;height:120px;overflow:hidden}.signature{width:200px}mat-card{box-shadow:none!important}.scanBlastWraper button{text-transform:uppercase}.scanBlastWraper.mobile mat-card{margin:4px!important}.scanBlastWraper.mobile .description{font-size:12px;flex-direction:row!important}.scanBlastWraper.mobile .description .imgWrap{padding:0!important}.scanBlastWraper.mobile .description .btnActions{position:absolute;right:0}.scanBlastWraper.mobile .description button{font-size:11px!important;margin:0!important;position:absolute;right:16px}.scanBlastWraper.mobile .description button.rotateButton{top:58px}.scanBlastWraper.mobile .description button.remButton{top:8px}.scanBlastWraper.mobile .description button mat-icon{margin:0!important}.scanBlastWraper.mobile .description button div.label{display:none}.mobile .scanBlast button{font-size:11px!important}.scanBlast{display:flex;flex-direction:row;flex:1;padding:0 4px}.scanBlast mat-card{padding:0;box-shadow:none;margin:8px 4px;flex:1}.scanBlast mat-card .head{display:flex;flex-direction:row;align-items:center;justify-items:center;border-bottom:1px solid rgba(0,0,0,.12);height:60px;padding:8px}.scanBlast mat-card .head.small{height:30px!important;padding:4px 8px!important}.scanBlast mat-card .head.small .title{font-size:12px!important;margin-left:4px!important}.scanBlast mat-card .head button{max-width:120px;height:40px;box-shadow:none;border:1px solid rgba(0,0,0,.12)}.scanBlast mat-card .head .title{margin-left:16px;color:#459ae5;font-size:16px}.scanBlast mat-card .content{margin:8px;flex:1}.scanBlast mat-card .description{text-align:center;color:#888;font-size:14px}.scanBlast mat-card .actions{background-color:#e9e9e9;display:flex;flex-direction:row}.scanBlast mat-card .actions .mat-button-disabled{background-color:#fff!important}.scanBlast mat-card .actions button{box-shadow:none;width:50%;margin:8px;height:40px;font-size:12px}.scanBlast mat-card .actions button mat-icon{margin-right:8px}.scanBlast mat-card .previewPlaceholder{flex:1;border-radius:6px;display:flex;flex-direction:column}.scanBlast mat-card .previewPlaceholder .description{display:flex;flex:1;flex-direction:column;justify-content:center}.scanBlast mat-card .previewPlaceholder button{box-shadow:none;margin-top:8px;height:40px;font-size:12px}.scanBlast mat-card .previewPlaceholder button mat-icon{margin-right:8px}.scanBlast mat-card .previewPlaceholder .imgWrap{flex-direction:column;flex:1;padding:8px;background-color:#f5f5f5;border-radius:4px}.scanBlast mat-card .previewPlaceholder .imgWrap img{width:100%;border-radius:4px}.scanBlast mat-card .previewPlaceholder .imgWrap .image{background-position:center;background-repeat:no-repeat;background-size:contain}.mr-4{margin-right:4px}.ml-4{margin-left:4px}.p-16{padding:16px}.p-8{padding:8px}.py-16{padding:16px 0}.w-100-p{width:100%}.scanPreview{padding:16px}.scanPreview .image{background-position:center;background-repeat:no-repeat;background-size:contain}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.summary label{font-size:12px;color:#888;margin-top:2px}.summary .name{font-size:14px}.selfieContainer{display:flex;flex-direction:column;margin-bottom:20px}.selfieContainer button{box-shadow:none;border:1px solid rgba(0,0,0,.12)}.selfieContainer .selfie{margin:8px auto;width:120px;height:120px;border-radius:60px;border:1px solid rgba(0,0,0,.12)}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "component", type: i5$2.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "component", type: i7$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i9.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "id", "type", "width", "height", "videoOptions", "allowCameraSwitch", "mirrorImage", "captureImageData", "imageType", "imageQuality", "trigger", "switchCamera"], outputs: ["imageCapture", "initError", "imageClick", "cameraSwitched", "videoReady", "destroyed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanSelfieComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-scan-selfie', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"page-header\" fxLayout=\"row\">\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">Selfie</div>\n\n  <span fxFlex></span>\n  <ng-container\n    *ngIf=\"\n      documentTypeSelected &&\n      !result &&\n      !error &&\n      multipleWebcamsAvailable &&\n      !preview\n    \"\n  >\n    <div class=\"separator\"></div>\n    <div style=\"padding: 0px 16px\">\n      <div fxLayout=\"row\" fxLayoutAlign=\"end center\">\n        <mat-form-field\n          style=\"font-size: 14px; width: 200px; margin-top: 8px\"\n          class=\"w-200 mr-16 mt-8\"\n        >\n          <mat-label> Camera </mat-label>\n          <mat-select\n            (selectionChange)=\"selectCamera($event)\"\n            [(ngModel)]=\"deviceId\"\n          >\n            <mat-option\n              *ngFor=\"let device of mediaDevices\"\n              [value]=\"device.deviceId\"\n            >\n              {{ device.label }}\n            </mat-option>\n          </mat-select>\n        </mat-form-field>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-container>\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container>\n  <!-- <ng-container *ngIf=\"type === 'desktop'\">\n    <div class=\"separator\"></div>\n    <button mat-button (click)=\"sendMobile()\">\n      <mat-icon>tablet_mac</mat-icon>\n    </button>\n\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container> -->\n</header>\n\n<div *ngIf=\"!result\" fxFlex fxLayout=\"column\">\n  <div fxFlex #wraper class=\"wraper\" fxLayout=\"row\">\n    <div\n      style=\"\n        position: absolute;\n        top: 0px;\n        left: 0px;\n        right: 0px;\n        bottom: 0px;\n        z-index: 20;\n        background-color: whitesmoke;\n      \"\n      *ngIf=\"!cameraReady && !preview\"\n    >\n      <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n    </div>\n\n    <ng-container *ngIf=\"!error\">\n      <!-- <div\n      class=\"rectangle\"\n      [ngStyle]=\"{\n        'width.px': videoHeight * 0.75 * 1.588,\n        'height.px': videoHeight * 0.75\n      }\"\n    ></div>\n    <svg\n      *ngIf=\"videoWidth\"\n      style=\"position: absolute; left: 0px; top: 0px\"\n      width=\"0\"\n      height=\"0\"\n    >\n      <defs>\n        <clipPath id=\"myClip\">\n          <rect\n            stroke-width=\"6\"\n            stroke-color=\"red\"\n            [attr.x]=\"(videoWidth - videoHeight * 0.75 * 1.588) / 2\"\n            [attr.y]=\"(videoHeight * 0.25) / 2\"\n            [attr.width]=\"videoHeight * 0.75 * 1.588\"\n            [attr.height]=\"videoHeight * 0.75\"\n            rx=\"25\"\n          />\n        </clipPath>\n      </defs>\n    </svg> -->\n\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main\"\n        [imageQuality]=\"1\"\n        #webcam\n        fxFlex\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n        [allowCameraSwitch]=\"allowCameraSwitch\"\n        [videoOptions]=\"videoOptions\"\n        [switchCamera]=\"nextWebcamObservable\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        type=\"selfie\"\n        [width]=\"width\"\n        [height]=\"height\"\n        (destroyed)=\"cameraOff($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      fxLayout=\"row\"\n      fxFlex\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"z-index: 20; position: absolute; width: 100%; height: 100%\"\n    >\n      <div\n        class=\"scanPreview\"\n        fxFlex\n        fxLayout=\"column\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <div\n          fxFlex\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer fxLayout=\"row\" class=\"p-8\">\n    <button\n      [disabled]=\"!cameraReady\"\n      class=\"w-100-p\"\n      *ngIf=\"!preview\"\n      mat-raised-button\n      (click)=\"scan()\"\n    >\n      <ng-container>\n        TAKE SELFIE\n      </ng-container>\n    </button>\n\n    <div\n      class=\"w-100-p\"\n      *ngIf=\"preview\"\n      fxLayout=\"row\"\n      fxLayoutAlign=\"start center\"\n      fxFlex\n    >\n      <button fxFlex class=\"mr-4\" mat-raised-button (click)=\"retry()\">\n        RETRY\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        fxFlex\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n      CONTINUE\n\n      </button>\n    </div>\n  </footer>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}.element{margin-bottom:8px}.element label{font-size:14px}.element div{font-size:18px}.wraper{position:relative;overflow:hidden}h3{color:#459ae5;font-size:16px}.preview{width:100%;border-radius:1%}.documentTypeWraper{width:400px}.documentTypeWraper .label{font-size:14px;margin-bottom:20px}.documentTypeWraper button{box-shadow:none}.overPane{position:absolute;width:100%;height:100%;top:0;left:0}.overPane app-webcam{clip-path:url(#myClip)}.subhead{height:55px;padding-top:8px}.rectangle{z-index:2;position:absolute;top:50%;left:50%;width:85.6mm;height:53.98mm;transform:translate(-50%,-50%);box-sizing:border-box;border:2px dashed #459be5;border-radius:3mm}.mask{z-index:1;position:absolute;width:100%;height:100%;background-position:center center;background-size:380mm;background-repeat:no-repeat}.label{font-size:11px;margin-top:4px}footer button{box-shadow:none!important;height:45px;min-height:45px;border:1px solid rgba(0,0,0,.12);text-transform:uppercase}h4{font-size:16px}.images label{font-size:11px;color:#888;line-height:20px}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px}.error .title{font-size:22px}.error ul{font-size:18px}.photo{width:120px;height:120px;overflow:hidden}.signature{width:200px}mat-card{box-shadow:none!important}.scanBlastWraper button{text-transform:uppercase}.scanBlastWraper.mobile mat-card{margin:4px!important}.scanBlastWraper.mobile .description{font-size:12px;flex-direction:row!important}.scanBlastWraper.mobile .description .imgWrap{padding:0!important}.scanBlastWraper.mobile .description .btnActions{position:absolute;right:0}.scanBlastWraper.mobile .description button{font-size:11px!important;margin:0!important;position:absolute;right:16px}.scanBlastWraper.mobile .description button.rotateButton{top:58px}.scanBlastWraper.mobile .description button.remButton{top:8px}.scanBlastWraper.mobile .description button mat-icon{margin:0!important}.scanBlastWraper.mobile .description button div.label{display:none}.mobile .scanBlast button{font-size:11px!important}.scanBlast{display:flex;flex-direction:row;flex:1;padding:0 4px}.scanBlast mat-card{padding:0;box-shadow:none;margin:8px 4px;flex:1}.scanBlast mat-card .head{display:flex;flex-direction:row;align-items:center;justify-items:center;border-bottom:1px solid rgba(0,0,0,.12);height:60px;padding:8px}.scanBlast mat-card .head.small{height:30px!important;padding:4px 8px!important}.scanBlast mat-card .head.small .title{font-size:12px!important;margin-left:4px!important}.scanBlast mat-card .head button{max-width:120px;height:40px;box-shadow:none;border:1px solid rgba(0,0,0,.12)}.scanBlast mat-card .head .title{margin-left:16px;color:#459ae5;font-size:16px}.scanBlast mat-card .content{margin:8px;flex:1}.scanBlast mat-card .description{text-align:center;color:#888;font-size:14px}.scanBlast mat-card .actions{background-color:#e9e9e9;display:flex;flex-direction:row}.scanBlast mat-card .actions .mat-button-disabled{background-color:#fff!important}.scanBlast mat-card .actions button{box-shadow:none;width:50%;margin:8px;height:40px;font-size:12px}.scanBlast mat-card .actions button mat-icon{margin-right:8px}.scanBlast mat-card .previewPlaceholder{flex:1;border-radius:6px;display:flex;flex-direction:column}.scanBlast mat-card .previewPlaceholder .description{display:flex;flex:1;flex-direction:column;justify-content:center}.scanBlast mat-card .previewPlaceholder button{box-shadow:none;margin-top:8px;height:40px;font-size:12px}.scanBlast mat-card .previewPlaceholder button mat-icon{margin-right:8px}.scanBlast mat-card .previewPlaceholder .imgWrap{flex-direction:column;flex:1;padding:8px;background-color:#f5f5f5;border-radius:4px}.scanBlast mat-card .previewPlaceholder .imgWrap img{width:100%;border-radius:4px}.scanBlast mat-card .previewPlaceholder .imgWrap .image{background-position:center;background-repeat:no-repeat;background-size:contain}.mr-4{margin-right:4px}.ml-4{margin-left:4px}.p-16{padding:16px}.p-8{padding:8px}.py-16{padding:16px 0}.w-100-p{width:100%}.scanPreview{padding:16px}.scanPreview .image{background-position:center;background-repeat:no-repeat;background-size:contain}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.summary label{font-size:12px;color:#888;margin-top:2px}.summary .name{font-size:14px}.selfieContainer{display:flex;flex-direction:column;margin-bottom:20px}.selfieContainer button{box-shadow:none;border:1px solid rgba(0,0,0,.12)}.selfieContainer .selfie{margin:8px auto;width:120px;height:120px;border-radius:60px;border:1px solid rgba(0,0,0,.12)}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"] }]
+            args: [{ selector: 'app-scan-selfie', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"page-header\">\n  <div class=\"title\">Selfie</div>\n\n  <span class=\"flex\"></span>\n  <ng-container\n    *ngIf=\"\n      documentTypeSelected &&\n      !result &&\n      !error &&\n      multipleWebcamsAvailable &&\n      !preview\n    \"\n  >\n    <div class=\"separator\"></div>\n    <div style=\"padding: 0px 16px\">\n      <div class=\"flex-column\">\n        <mat-form-field\n          style=\"font-size: 14px; width: 200px; margin-top: 8px\"\n          class=\"w-200 mr-16 mt-8\"\n        >\n          <mat-label> Camera </mat-label>\n          <mat-select\n            (selectionChange)=\"selectCamera($event)\"\n            [(ngModel)]=\"deviceId\"\n          >\n            <mat-option\n              *ngFor=\"let device of mediaDevices\"\n              [value]=\"device.deviceId\"\n            >\n              {{ device.label }}\n            </mat-option>\n          </mat-select>\n        </mat-form-field>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-container>\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container>\n  <!-- <ng-container *ngIf=\"type === 'desktop'\">\n    <div class=\"separator\"></div>\n    <button mat-button (click)=\"sendMobile()\">\n      <mat-icon>tablet_mac</mat-icon>\n    </button>\n\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container> -->\n</header>\n\n<div *ngIf=\"!result\" class=\"flex-column flex\">\n  <div #wraper class=\"wraper flex flex-row\">\n    <div\n      style=\"\n        position: absolute;\n        top: 0px;\n        left: 0px;\n        right: 0px;\n        bottom: 0px;\n        z-index: 20;\n        background-color: whitesmoke;\n      \"\n      *ngIf=\"!cameraReady && !preview\"\n    >\n      <mat-progress-bar mode=\"indeterminate\"></mat-progress-bar>\n    </div>\n\n    <ng-container *ngIf=\"!error\">\n      <!-- <div\n      class=\"rectangle\"\n      [ngStyle]=\"{\n        'width.px': videoHeight * 0.75 * 1.588,\n        'height.px': videoHeight * 0.75\n      }\"\n    ></div>\n    <svg\n      *ngIf=\"videoWidth\"\n      style=\"position: absolute; left: 0px; top: 0px\"\n      width=\"0\"\n      height=\"0\"\n    >\n      <defs>\n        <clipPath id=\"myClip\">\n          <rect\n            stroke-width=\"6\"\n            stroke-color=\"red\"\n            [attr.x]=\"(videoWidth - videoHeight * 0.75 * 1.588) / 2\"\n            [attr.y]=\"(videoHeight * 0.25) / 2\"\n            [attr.width]=\"videoHeight * 0.75 * 1.588\"\n            [attr.height]=\"videoHeight * 0.75\"\n            rx=\"25\"\n          />\n        </clipPath>\n      </defs>\n    </svg> -->\n\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main flex\"\n        [imageQuality]=\"1\"\n        #webcam\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n        [allowCameraSwitch]=\"allowCameraSwitch\"\n        [videoOptions]=\"videoOptions\"\n        [switchCamera]=\"nextWebcamObservable\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        type=\"selfie\"\n        [width]=\"width\"\n        [height]=\"height\"\n        (destroyed)=\"cameraOff($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"\n        z-index: 20;\n        position: absolute;\n        width: 100%;\n        height: 100%;\n        flex: 1;\n        display: flex;\n        flex-direction: row;\n      \"\n    >\n      <div\n        class=\"scanPreview\"\n        style=\"display: flex; flex-direction: column; flex: 1\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <div\n          style=\"flex: 1\"\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer class=\"p-8 flex-row\">\n    <button\n      [disabled]=\"!cameraReady\"\n      class=\"w-100-p\"\n      *ngIf=\"!preview\"\n      mat-raised-button\n      (click)=\"scan()\"\n    >\n      <ng-container> TAKE SELFIE </ng-container>\n    </button>\n\n    <div\n      class=\"w-100-p flex-row flex\"\n      *ngIf=\"preview\"\n      style=\"align-items: center\"\n    >\n      <button style=\"flex: 1\" class=\"mr-4\" mat-raised-button (click)=\"retry()\">\n        RETRY\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        style=\"flex: 1\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        CONTINUE\n      </button>\n    </div>\n  </footer>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}.page-header{display:flex;flex-direction:row}.flex{flex:1}.flex-column{display:flex;flex-direction:column}.flex-row{display:flex;flex-direction:row}.element{margin-bottom:8px}.element label{font-size:14px}.element div{font-size:18px}.wraper{position:relative;overflow:hidden}h3{color:#459ae5;font-size:16px}.preview{width:100%;border-radius:1%}.documentTypeWraper{width:400px}.documentTypeWraper .label{font-size:14px;margin-bottom:20px}.documentTypeWraper button{box-shadow:none}.overPane{position:absolute;width:100%;height:100%;top:0;left:0}.overPane app-webcam{clip-path:url(#myClip)}.subhead{height:55px;padding-top:8px}.rectangle{z-index:2;position:absolute;top:50%;left:50%;width:85.6mm;height:53.98mm;transform:translate(-50%,-50%);box-sizing:border-box;border:2px dashed #459be5;border-radius:3mm}.mask{z-index:1;position:absolute;width:100%;height:100%;background-position:center center;background-size:380mm;background-repeat:no-repeat}.label{font-size:11px;margin-top:4px}footer button{box-shadow:none!important;height:45px;min-height:45px;border:1px solid rgba(0,0,0,.12);text-transform:uppercase}h4{font-size:16px}.images label{font-size:11px;color:#888;line-height:20px}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px}.error .title{font-size:22px}.error ul{font-size:18px}.photo{width:120px;height:120px;overflow:hidden}.signature{width:200px}mat-card{box-shadow:none!important}.scanBlastWraper button{text-transform:uppercase}.scanBlastWraper.mobile mat-card{margin:4px!important}.scanBlastWraper.mobile .description{font-size:12px;flex-direction:row!important}.scanBlastWraper.mobile .description .imgWrap{padding:0!important}.scanBlastWraper.mobile .description .btnActions{position:absolute;right:0}.scanBlastWraper.mobile .description button{font-size:11px!important;margin:0!important;position:absolute;right:16px}.scanBlastWraper.mobile .description button.rotateButton{top:58px}.scanBlastWraper.mobile .description button.remButton{top:8px}.scanBlastWraper.mobile .description button mat-icon{margin:0!important}.scanBlastWraper.mobile .description button div.label{display:none}.mobile .scanBlast button{font-size:11px!important}.scanBlast{display:flex;flex-direction:row;flex:1;padding:0 4px}.scanBlast mat-card{padding:0;box-shadow:none;margin:8px 4px;flex:1}.scanBlast mat-card .head{display:flex;flex-direction:row;align-items:center;justify-items:center;border-bottom:1px solid rgba(0,0,0,.12);height:60px;padding:8px}.scanBlast mat-card .head.small{height:30px!important;padding:4px 8px!important}.scanBlast mat-card .head.small .title{font-size:12px!important;margin-left:4px!important}.scanBlast mat-card .head button{max-width:120px;height:40px;box-shadow:none;border:1px solid rgba(0,0,0,.12)}.scanBlast mat-card .head .title{margin-left:16px;color:#459ae5;font-size:16px}.scanBlast mat-card .content{margin:8px;flex:1}.scanBlast mat-card .description{text-align:center;color:#888;font-size:14px}.scanBlast mat-card .actions{background-color:#e9e9e9;display:flex;flex-direction:row}.scanBlast mat-card .actions .mat-button-disabled{background-color:#fff!important}.scanBlast mat-card .actions button{box-shadow:none;width:50%;margin:8px;height:40px;font-size:12px}.scanBlast mat-card .actions button mat-icon{margin-right:8px}.scanBlast mat-card .previewPlaceholder{flex:1;border-radius:6px;display:flex;flex-direction:column}.scanBlast mat-card .previewPlaceholder .description{display:flex;flex:1;flex-direction:column;justify-content:center}.scanBlast mat-card .previewPlaceholder button{box-shadow:none;margin-top:8px;height:40px;font-size:12px}.scanBlast mat-card .previewPlaceholder button mat-icon{margin-right:8px}.scanBlast mat-card .previewPlaceholder .imgWrap{flex-direction:column;flex:1;padding:8px;background-color:#f5f5f5;border-radius:4px}.scanBlast mat-card .previewPlaceholder .imgWrap img{width:100%;border-radius:4px}.scanBlast mat-card .previewPlaceholder .imgWrap .image{background-position:center;background-repeat:no-repeat;background-size:contain}.mr-4{margin-right:4px}.ml-4{margin-left:4px}.p-16{padding:16px}.p-8{padding:8px}.py-16{padding:16px 0}.w-100-p{width:100%}.scanPreview{padding:16px}.scanPreview .image{background-position:center;background-repeat:no-repeat;background-size:contain}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.summary label{font-size:12px;color:#888;margin-top:2px}.summary .name{font-size:14px}.selfieContainer{display:flex;flex-direction:column;margin-bottom:20px}.selfieContainer button{box-shadow:none;border:1px solid rgba(0,0,0,.12)}.selfieContainer .selfie{margin:8px auto;width:120px;height:120px;border-radius:60px;border:1px solid rgba(0,0,0,.12)}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: ScanProvider }, { type: DialogsCoreProvider }, { type: i1$2.TranslateService }]; }, propDecorators: { type: [{
                 type: Input
             }], actions: [{
@@ -3835,10 +3837,10 @@ class TurnDocumentComponent {
     }
 }
 TurnDocumentComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TurnDocumentComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
-TurnDocumentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TurnDocumentComponent, selector: "app-turndocuments", ngImport: i0, template: "<div class=\"inner\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <!-- <img\n    style=\"height: 240px; margin: 34px 0px;display: none;\"\n    [src]=\"'/assets/images/illustrations/' + images[type]\"\n  /> -->\n  <!-- <img style=\"width:60px;\" src=\"/assets/images/illustrations/door-lock.png\"> -->\n\n  <mat-icon>360</mat-icon>\n  <div class=\"text\">\n    <ng-container *ngIf=\"data.idScan === 'BACK'\">\n      Turn document and:\n      {{ \"pms.dialogs.components.scanProfile.captureBack\" | translate }}\n    </ng-container>\n    <ng-container *ngIf=\"data.idScan === 'FRONT'\">\n      Turn document and:\n      {{ \"pms.dialogs.components.scanProfile.captureFront\" | translate }}\n    </ng-container>\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n  <button (click)=\"close()\" mat-raised-button>Ok</button>\n</footer>\n", styles: [":host{display:flex;flex-direction:column;flex:1;height:100%;width:100%}.inner{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px 0}.inner mat-icon{width:60px;height:60px;font-size:60px}.inner .text{margin:20px 0}footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}footer button{min-width:200px;box-shadow:none;border:1px solid #ccc}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "directive", type: i4$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
+TurnDocumentComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: TurnDocumentComponent, selector: "app-turndocuments", ngImport: i0, template: "<div class=\"inner\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <!-- <img\n    style=\"height: 240px; margin: 34px 0px;display: none;\"\n    [src]=\"'/assets/images/illustrations/' + images[type]\"\n  /> -->\n  <!-- <img style=\"width:60px;\" src=\"/assets/images/illustrations/door-lock.png\"> -->\n\n  <mat-icon>360</mat-icon>\n  <div class=\"text\">\n    <ng-container *ngIf=\"data.idScan === 'BACK'\">\n      Turn document and capture back image of document.\n\n    </ng-container>\n    <ng-container *ngIf=\"data.idScan === 'FRONT'\">\n      Turn document and capture front image of document.\n    </ng-container>\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n  <button (click)=\"close()\" mat-raised-button>Ok</button>\n</footer>\n", styles: [":host{display:flex;flex-direction:column;flex:1;height:100%;width:100%}.inner{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px 0}.inner mat-icon{width:60px;height:60px;font-size:60px}.inner .text{margin:20px 0}footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}footer button{min-width:200px;box-shadow:none;border:1px solid #ccc}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TurnDocumentComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-turndocuments', template: "<div class=\"inner\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <!-- <img\n    style=\"height: 240px; margin: 34px 0px;display: none;\"\n    [src]=\"'/assets/images/illustrations/' + images[type]\"\n  /> -->\n  <!-- <img style=\"width:60px;\" src=\"/assets/images/illustrations/door-lock.png\"> -->\n\n  <mat-icon>360</mat-icon>\n  <div class=\"text\">\n    <ng-container *ngIf=\"data.idScan === 'BACK'\">\n      Turn document and:\n      {{ \"pms.dialogs.components.scanProfile.captureBack\" | translate }}\n    </ng-container>\n    <ng-container *ngIf=\"data.idScan === 'FRONT'\">\n      Turn document and:\n      {{ \"pms.dialogs.components.scanProfile.captureFront\" | translate }}\n    </ng-container>\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n  <button (click)=\"close()\" mat-raised-button>Ok</button>\n</footer>\n", styles: [":host{display:flex;flex-direction:column;flex:1;height:100%;width:100%}.inner{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px 0}.inner mat-icon{width:60px;height:60px;font-size:60px}.inner .text{margin:20px 0}footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}footer button{min-width:200px;box-shadow:none;border:1px solid #ccc}\n"] }]
+            args: [{ selector: 'app-turndocuments', template: "<div class=\"inner\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n  <!-- <img\n    style=\"height: 240px; margin: 34px 0px;display: none;\"\n    [src]=\"'/assets/images/illustrations/' + images[type]\"\n  /> -->\n  <!-- <img style=\"width:60px;\" src=\"/assets/images/illustrations/door-lock.png\"> -->\n\n  <mat-icon>360</mat-icon>\n  <div class=\"text\">\n    <ng-container *ngIf=\"data.idScan === 'BACK'\">\n      Turn document and capture back image of document.\n\n    </ng-container>\n    <ng-container *ngIf=\"data.idScan === 'FRONT'\">\n      Turn document and capture front image of document.\n    </ng-container>\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n  <button (click)=\"close()\" mat-raised-button>Ok</button>\n</footer>\n", styles: [":host{display:flex;flex-direction:column;flex:1;height:100%;width:100%}.inner{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px 20px 0}.inner mat-icon{width:60px;height:60px;font-size:60px}.inner .text{margin:20px 0}footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}footer button{min-width:200px;box-shadow:none;border:1px solid #ccc}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
@@ -3972,10 +3974,10 @@ class ScanProfileComponent extends BaseComponent {
     }
 }
 ScanProfileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanProfileComponent, deps: [{ token: DialogsCoreProvider }, { token: i1$4.MatDialogRef }], target: i0.ɵɵFactoryTarget.Component });
-ScanProfileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScanProfileComponent, selector: "app-scan-profile", inputs: { type: "type" }, usesInheritance: true, ngImport: i0, template: "<header class=\"page-header\">\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">Scan</div>\n\n  <span fxFlex></span>\n\n  <!-- <mat-slide-toggle style=\"margin:0px 20px\" [(ngModel)]=\"isDebug\"\n    >Debug</mat-slide-toggle\n  > -->\n\n  <ng-container\n\n  >\n    <div class=\"separator\"></div>\n    <div style=\"padding: 0px 16px\">\n      <div fxLayout=\"row\" fxLayoutAlign=\"end center\">\n       <ngx-scan-camera-switch></ngx-scan-camera-switch>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"type === 'desktop'\">\n    <!-- <div  class=\"separator\"></div>\n  <button mat-button (click)=\"sendMobile()\">\n    <mat-icon>tablet_mac</mat-icon>\n  </button> -->\n\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container>\n</header>\n\n<ngx-scan (actions)=\"actions($event)\" [showDialog]=\"showDialog\" [dialogs]=\"dialogs\"></ngx-scan>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: ScanComponent, selector: "ngx-scan", inputs: ["type", "dialogs", "showDialog"], outputs: ["actions"] }, { kind: "component", type: CameraSwitchComponent, selector: "ngx-scan-camera-switch" }, { kind: "directive", type: i4$2.DefaultLayoutDirective, selector: "  [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md],  [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md],  [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm],  [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i4$2.DefaultLayoutAlignDirective, selector: "  [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md],  [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md],  [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm],  [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i4$2.DefaultFlexDirective, selector: "  [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md],  [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md],  [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm],  [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$3.DefaultClassDirective, selector: "  [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl],  [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl],  [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ScanProfileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScanProfileComponent, selector: "app-scan-profile", inputs: { type: "type" }, usesInheritance: true, ngImport: i0, template: "<header class=\"page-header\">\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">Scan</div>\n\n  <span style=\"flex: 1\"></span>\n\n  <ng-container>\n    <div class=\"separator\"></div>\n    <div style=\"padding: 0px 16px\">\n      <ngx-scan-camera-switch></ngx-scan-camera-switch>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"type === 'desktop'\">\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container>\n</header>\n\n<ngx-scan\n  (actions)=\"actions($event)\"\n  [showDialog]=\"showDialog\"\n  [dialogs]=\"dialogs\"\n></ngx-scan>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i7$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: ScanComponent, selector: "ngx-scan", inputs: ["type", "dialogs", "showDialog"], outputs: ["actions"] }, { kind: "component", type: CameraSwitchComponent, selector: "ngx-scan-camera-switch" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanProfileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'app-scan-profile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"page-header\">\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">Scan</div>\n\n  <span fxFlex></span>\n\n  <!-- <mat-slide-toggle style=\"margin:0px 20px\" [(ngModel)]=\"isDebug\"\n    >Debug</mat-slide-toggle\n  > -->\n\n  <ng-container\n\n  >\n    <div class=\"separator\"></div>\n    <div style=\"padding: 0px 16px\">\n      <div fxLayout=\"row\" fxLayoutAlign=\"end center\">\n       <ngx-scan-camera-switch></ngx-scan-camera-switch>\n      </div>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"type === 'desktop'\">\n    <!-- <div  class=\"separator\"></div>\n  <button mat-button (click)=\"sendMobile()\">\n    <mat-icon>tablet_mac</mat-icon>\n  </button> -->\n\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container>\n</header>\n\n<ngx-scan (actions)=\"actions($event)\" [showDialog]=\"showDialog\" [dialogs]=\"dialogs\"></ngx-scan>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"] }]
+            args: [{ selector: 'app-scan-profile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"page-header\">\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">Scan</div>\n\n  <span style=\"flex: 1\"></span>\n\n  <ng-container>\n    <div class=\"separator\"></div>\n    <div style=\"padding: 0px 16px\">\n      <ngx-scan-camera-switch></ngx-scan-camera-switch>\n    </div>\n  </ng-container>\n\n  <ng-container *ngIf=\"type === 'desktop'\">\n    <div class=\"separator\"></div>\n\n    <button mat-button (click)=\"close()\">\n      <mat-icon>close</mat-icon>\n    </button>\n  </ng-container>\n</header>\n\n<ngx-scan\n  (actions)=\"actions($event)\"\n  [showDialog]=\"showDialog\"\n  [dialogs]=\"dialogs\"\n></ngx-scan>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}\n", ".page-header{z-index:2000;height:64px;padding:0;background-color:#fff;border-bottom:1px solid rgba(0,0,0,.12)}.page-header .title{padding-left:24px;line-height:64px;font-size:18px}.page-header .separator{width:1px;background-color:#0000001f;height:100%}.page-header .total{line-height:64px}.page-header .total span{font-weight:700}.page-footer{height:64px}.page-footer button{margin-left:24px;box-shadow:none!important}\n"] }]
         }], ctorParameters: function () { return [{ type: DialogsCoreProvider }, { type: i1$4.MatDialogRef }]; }, propDecorators: { type: [{
                 type: Input
             }] } });
@@ -3996,9 +3998,7 @@ DialogsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version:
         TranslateModule,
         MaterialModule,
         CoreComponentsModule,
-        CorePipesModule,
-        FlexModule,
-        FlexLayoutModule], exports: [ScanProfileComponent,
+        CorePipesModule], exports: [ScanProfileComponent,
         LoadingComponent,
         BlankComponent,
         TurnDocumentComponent,
@@ -4012,9 +4012,7 @@ DialogsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
         TranslateModule,
         MaterialModule,
         CoreComponentsModule,
-        CorePipesModule,
-        FlexModule,
-        FlexLayoutModule, MaterialModule] });
+        CorePipesModule, MaterialModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: DialogsModule, decorators: [{
             type: NgModule,
             args: [{
@@ -4044,8 +4042,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                         MaterialModule,
                         CoreComponentsModule,
                         CorePipesModule,
-                        FlexModule,
-                        FlexLayoutModule,
+                        // FlexModule,
+                        // FlexLayoutModule,
                     ],
                     providers: [DialogsCoreProvider],
                 }]