ngx-scandoc 1.2.1 → 1.2.3

package/fesm2015/ngx-scandoc.mjs

@@ -1,9 +1,9 @@
 import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Component, Input, Output, ViewChild, HostListener, NgModule, Inject, ChangeDetectionStrategy, HostBinding, Pipe, ViewContainerRef } from '@angular/core';
-import * as i5 from '@angular/common';
+import { Injectable, EventEmitter, Component, Input, Output, ViewChild, HostListener, NgModule, Inject, InjectionToken, Optional, ChangeDetectionStrategy, HostBinding, Pipe, ViewContainerRef } from '@angular/core';
+import * as i2$1 from '@angular/common';
 import { CommonModule } from '@angular/common';
-import { Observable, from, Subject, of, tap as tap$1, distinctUntilChanged, throwError } from 'rxjs';
-import { tap, switchMap, takeUntil, map, share, catchError } from 'rxjs/operators';
+import { Observable, from, Subject, of, tap as tap$1, distinctUntilChanged, throwError, forkJoin } from 'rxjs';
+import { tap, switchMap, takeUntil, map, catchError, share, retry } from 'rxjs/operators';
 import * as i1 from '@angular/cdk/layout';
 import { Breakpoints } from '@angular/cdk/layout';
 import * as i2 from '@angular/cdk/platform';
@@ -23,7 +23,7 @@ import * as i6 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import * as i9 from '@angular/material/progress-bar';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
-import * as i5$1 from '@angular/material/card';
+import * as i5 from '@angular/material/card';
 import { MatCardModule } from '@angular/material/card';
 import * as i7 from '@ngx-formly/core';
 import { FormlyModule } from '@ngx-formly/core';
@@ -41,7 +41,7 @@ import { MatListModule } from '@angular/material/list';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatPaginatorModule } from '@angular/material/paginator';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
-import * as i5$2 from '@angular/material/select';
+import * as i5$1 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
 import { MatSlideToggleModule } from '@angular/material/slide-toggle';
 import { MatSliderModule } from '@angular/material/slider';
@@ -522,7 +522,7 @@ class WebcamComponent extends BaseComponent {
         });
     }
     onResize() {
-        this.videoReady.next(false);
+        // this.videoReady.next(false);
         this.resizeStage();
     }
     /**
@@ -674,6 +674,7 @@ class WebcamComponent extends BaseComponent {
                     this.worker = new Worker(url);
                     this.worker.onmessage = ({ data }) => {
                         if (data.base64) {
+                            console.log(data);
                             data.type == 'data';
                             this.imageHandler.next(data);
                         }
@@ -1047,6 +1048,7 @@ class WebcamComponent extends BaseComponent {
      * Init webcam live view
      */
     initWebcam(deviceId, userVideoTrackConstraints) {
+        console.log('INIT WEBCAM');
         const _video = this.nativeVideoElement;
         // const videoStreamer = this.videoStreamer.nativeElement;
         // const videoSmall = document.createElement('video');
@@ -1247,7 +1249,7 @@ 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;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"] }] });
+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: i2$1.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;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"] }]
@@ -1838,38 +1840,88 @@ class AuthProvider {
         this.http = http;
         this.config = config;
         this.token = '';
+        this.refresh_token = '';
         this.tokenTimestamps = {
-            exp: 0,
-            iat: 0,
+            Time: 0,
+            Client: 0,
+            SubClient: 0,
         };
     }
+    setSubClient(name) {
+        this.subClient = name;
+    }
     setConfig() { }
     get tokenExpired() {
-        if (this.token == '' || this.tokenTimestamps.exp === 0) {
+        console.log(this.tokenTimestamps, this.token);
+        if (this.token == '' || this.tokenTimestamps.Time === 0) {
             console.log('EXPIRED');
             return true;
         }
-        const { iat, exp } = this.tokenTimestamps;
-        return iat + 20 > exp;
+        const { Time } = this.tokenTimestamps;
+        const tokenDate = moment(Time);
+        const isValid = moment(tokenDate).isBefore(moment().add(5, 'minutes'));
+        console.log('VALID', isValid);
+        return !isValid;
     }
     resetToken() {
-        this.token = '';
+        // this.token = '';
     }
     get accesToken() {
-        return this.tokenExpired ? this.getToken() : of(this.token);
+        console.log('AT');
+        return this.tokenExpired ? this.fetchToken() : of(this.token);
+    }
+    fetchToken() {
+        if (this.token && this.refresh_token) {
+            return this.refreshToken();
+        }
+        return this.getToken();
+    }
+    refreshToken() {
+        const { path, refresh } = this.config;
+        return this.http
+            .post(`${path}${refresh}`, {
+            refresh_token: this.refresh_token,
+        })
+            .pipe(tap((token) => {
+            // console.log(this.token);
+            this.token = token.access_token;
+            this.updateToken();
+            // this.token = token.access_token;
+            // console.log('TOKEN', this.token);
+            // this.refresh_token = token.refresh_token;
+            // const decoded: any = jwt_decode(this.token);
+            // console.log(decoded);
+            // const { Time, Client, SubClient } = decoded;
+            // this.tokenTimestamps = { Time, Client, SubClient };
+        }), map((data) => data.access_token));
+    }
+    get user_key() {
+        return this.config.clientId;
+    }
+    get sub_client() {
+        return this.config.tokenName ? this.config.tokenName : this.subClient;
+    }
+    updateToken() {
+        const decoded = jwt_decode(this.token);
+        console.log(decoded);
+        const { Time, Client, SubClient } = decoded;
+        this.tokenTimestamps = { Time, Client, SubClient };
     }
     getToken() {
+        console.log('GET');
+        const { path, login } = this.config;
         return this.http
-            .post(this.config.path, {
-            clientId: this.config.clientId,
-            token: this.config.tokenName,
+            .post(`${path}${login}`, {
+            user_key: this.user_key,
+            sub_client: this.sub_client,
         })
-            .pipe(map((data) => data.accessToken), tap((token) => {
-            this.token = token;
-            const decoded = jwt_decode(this.token);
-            const { iat, exp } = decoded;
-            this.tokenTimestamps = { iat, exp };
-        }));
+            .pipe(tap((token) => {
+            console.log(this.token);
+            this.token = token.access_token;
+            console.log('TOKEN', this.token);
+            this.refresh_token = token.refresh_token;
+            this.updateToken();
+        }), map((data) => data.access_token));
     }
 }
 AuthProvider.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AuthProvider, deps: [{ token: i1$1.HttpClient }, { token: 'configAuth' }], target: i0.ɵɵFactoryTarget.Injectable });
@@ -1886,9 +1938,77 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
                     }] }];
     } });
 
-class TranslationProvider {
-    constructor(translate) {
+const TRANSLATION_PROVIDER = new InjectionToken('Injection token for translation providers.');
+class NgxScanDocTranslationProvider {
+    constructor(translate, providers, platformLocation) {
         this.translate = translate;
+        this.platformLocation = platformLocation;
+        console.log(this.translate);
+        this.customLoader = this.translate.currentLoader;
+        this.defaultLang = 'en';
+        translate.setDefaultLang(this.defaultLang);
+        if (providers && providers.length > 0) {
+            for (const provider of providers) {
+                this.addTranslationFolder(provider.name, provider.source);
+            }
+        }
+    }
+    path(path) {
+        return path;
+        // const baseHref = this.platformLocation
+        //   .getBaseHrefFromDOM()
+        //   .split('/')
+        //   .join('');
+        // return baseHref != '' ? `/${baseHref}${path}` : path;
+    }
+    addTranslationFolder(name = '', path = '') {
+        console.log(name, path, this.userLang, this.defaultLang);
+        if (!this.customLoader.providerRegistered(name)) {
+            this.customLoader.registerProvider(name, this.path(path));
+            if (this.userLang) {
+                const existCurrentLang = this.translate.currentLang ? true : false;
+                this.loadTranslation(this.userLang, this.defaultLang, !existCurrentLang);
+            }
+            else {
+                this.loadTranslation(this.defaultLang);
+            }
+        }
+    }
+    loadTranslation(lang, fallback, useLang = true) {
+        this.translate.getTranslation(lang).subscribe((resp) => {
+            this.onTranslationChanged(lang);
+            if (useLang) {
+                setTimeout(() => {
+                    this.translate.use(lang);
+                }, 20);
+            }
+            // this.translate.reloadLang(lang)
+        }, () => {
+            if (fallback && fallback !== lang) {
+                this.loadTranslation(fallback);
+            }
+        });
+    }
+    updateTranslation(lang, fallback) {
+        return this.translate.getTranslation(lang).pipe(catchError(() => {
+            if (fallback && fallback !== lang) {
+                return this.updateTranslation(fallback);
+            }
+            return this.translate.use(lang);
+        }), switchMap(() => {
+            this.onTranslationChanged(lang);
+            return this.translate.use(lang);
+        }));
+    }
+    onTranslationChanged(lang) {
+        this.translate.onTranslationChange.next({
+            lang,
+            translations: this.customLoader.getFullTranslationJSON(lang),
+        });
+    }
+    use(lang) {
+        this.customLoader.init(lang);
+        return this.updateTranslation(lang);
     }
     forms(item, namespace = null) {
         if (item.fieldGroup) {
@@ -1924,14 +2044,21 @@ class TranslationProvider {
         return item;
     }
 }
-TranslationProvider.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TranslationProvider, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
-TranslationProvider.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TranslationProvider, providedIn: 'root' });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TranslationProvider, decorators: [{
+NgxScanDocTranslationProvider.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgxScanDocTranslationProvider, deps: [{ token: i1$2.TranslateService }, { token: TRANSLATION_PROVIDER, optional: true }, { token: i2$1.PlatformLocation }], target: i0.ɵɵFactoryTarget.Injectable });
+NgxScanDocTranslationProvider.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgxScanDocTranslationProvider, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: NgxScanDocTranslationProvider, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: i1$2.TranslateService }]; } });
+        }], ctorParameters: function () {
+        return [{ type: i1$2.TranslateService }, { type: undefined, decorators: [{
+                        type: Optional
+                    }, {
+                        type: Inject,
+                        args: [TRANSLATION_PROVIDER]
+                    }] }, { type: i2$1.PlatformLocation }];
+    } });
 
 class ScanFieldsProvider {
     constructor(translate, provider) {
@@ -1950,7 +2077,7 @@ class ScanFieldsProvider {
                         class: 'checkbox ',
                         defaultValue: true,
                         templateOptions: {
-                            label: 'form.scan.document.update.profile',
+                            label: 'scandoc.form.scan.document.update.profile',
                         },
                     },
                     {
@@ -1960,7 +2087,7 @@ class ScanFieldsProvider {
                         key: 'document',
                         defaultValue: true,
                         templateOptions: {
-                            label: 'form.scan.document.update.document',
+                            label: 'scandoc.form.scan.document.update.document',
                         },
                     },
                     {
@@ -1970,7 +2097,7 @@ class ScanFieldsProvider {
                         key: 'attachment',
                         defaultValue: true,
                         templateOptions: {
-                            label: 'form.scan.document.update.attachment',
+                            label: 'scandoc.form.scan.document.update.attachment',
                         },
                     },
                 ].map((item) => this.translate.forms(item)),
@@ -1990,14 +2117,14 @@ class ScanFieldsProvider {
                             {
                                 type: 'title',
                                 templateOptions: {
-                                    label: 'form.scan.document.guestDetailsTitle',
+                                    label: 'scandoc.form.scan.document.guestDetailsTitle',
                                 },
                             },
                             // {
                             //   type: 'profile-image',
                             //   key: '_avatar',
                             //   templateOptions: {
-                            //     label: 'form.scan.document.firstName',
+                            //     label: 'scandoc.form.scan.document.firstName',
                             //   },
                             // },
                             {
@@ -2005,7 +2132,7 @@ class ScanFieldsProvider {
                                 key: 'firstName',
                                 className: 'small',
                                 templateOptions: {
-                                    label: 'form.scan.document.firstName',
+                                    label: 'scandoc.form.scan.document.firstName',
                                     required: true,
                                 },
                             },
@@ -2014,7 +2141,7 @@ class ScanFieldsProvider {
                                 key: 'lastName',
                                 className: 'small',
                                 templateOptions: {
-                                    label: 'form.scan.document.lastName',
+                                    label: 'scandoc.form.scan.document.lastName',
                                     required: true,
                                 },
                             },
@@ -2024,7 +2151,7 @@ class ScanFieldsProvider {
                                 type: 'input',
                                 templateOptions: {
                                     color: 'accent',
-                                    label: 'form.scan.document.secondLastName',
+                                    label: 'scandoc.form.scan.document.secondLastName',
                                 },
                                 hideExpression: 'model.hideSecondLastName',
                             },
@@ -2033,7 +2160,7 @@ class ScanFieldsProvider {
                                 key: 'middleName',
                                 className: 'small',
                                 templateOptions: {
-                                    label: 'form.scan.document.middleName',
+                                    label: 'scandoc.form.scan.document.middleName',
                                 },
                             },
                             {
@@ -2045,7 +2172,7 @@ class ScanFieldsProvider {
                                         key: 'birthDate',
                                         className: 'w-100-p small mr-8',
                                         templateOptions: {
-                                            label: 'form.scan.document.birthDate',
+                                            label: 'scandoc.form.scan.document.birthDate',
                                         },
                                     },
                                     {
@@ -2053,7 +2180,7 @@ class ScanFieldsProvider {
                                         key: 'gender',
                                         className: 'w-100-p small ml-8',
                                         templateOptions: {
-                                            label: 'form.scan.document.gender',
+                                            label: 'scandoc.form.scan.document.gender',
                                             options: [
                                                 { value: 'MALE', label: 'MALE' },
                                                 { value: 'FEMALE', label: 'FEMALE' },
@@ -2068,7 +2195,7 @@ class ScanFieldsProvider {
                                 key: 'birthPlace',
                                 className: 'small',
                                 templateOptions: {
-                                    label: 'form.scan.document.birthPlace',
+                                    label: 'scandoc.form.scan.document.birthPlace',
                                 },
                             },
                             {
@@ -2076,7 +2203,7 @@ class ScanFieldsProvider {
                                 key: 'birthCountry',
                                 className: 'small',
                                 templateOptions: {
-                                    label: 'form.scan.document.birthCountry',
+                                    label: 'scandoc.form.scan.document.birthCountry',
                                     options: this.provider.countries(),
                                 },
                             },
@@ -2085,7 +2212,7 @@ class ScanFieldsProvider {
                                 key: 'nationality',
                                 type: 'select',
                                 templateOptions: {
-                                    label: 'form.scan.document.nationality',
+                                    label: 'scandoc.form.scan.document.nationality',
                                     //   appearance: 'outline',
                                     //  options: this.profileProvider.nationalities(),
                                     options: this.provider.countries(),
@@ -2100,14 +2227,14 @@ class ScanFieldsProvider {
                             {
                                 type: 'title',
                                 templateOptions: {
-                                    label: 'form.scan.document.documentTitle',
+                                    label: 'scandoc.form.scan.document.documentTitle',
                                 },
                             },
                             {
                                 type: 'select',
                                 key: 'documentType',
                                 templateOptions: {
-                                    label: 'form.scan.document.documentType',
+                                    label: 'scandoc.form.scan.document.documentType',
                                     options: [
                                         { value: 'ID', label: 'Identity Document' },
                                         { value: 'PASS', label: 'Passport' },
@@ -2122,7 +2249,7 @@ class ScanFieldsProvider {
                                 type: 'input',
                                 key: 'documentNumber',
                                 templateOptions: {
-                                    label: 'form.scan.document.documentNumber',
+                                    label: 'scandoc.form.scan.document.documentNumber',
                                     required: true,
                                 },
                             },
@@ -2135,7 +2262,7 @@ class ScanFieldsProvider {
                                         key: 'issueDate',
                                         className: 'small mr-8',
                                         templateOptions: {
-                                            label: 'form.scan.document.issueDate',
+                                            label: 'scandoc.form.scan.document.issueDate',
                                         },
                                     },
                                     {
@@ -2143,7 +2270,7 @@ class ScanFieldsProvider {
                                         key: 'expirationDate',
                                         className: 'small ml-8',
                                         templateOptions: {
-                                            label: 'form.scan.document.expirationDate',
+                                            label: 'scandoc.form.scan.document.expirationDate',
                                         },
                                     },
                                 ],
@@ -2152,7 +2279,7 @@ class ScanFieldsProvider {
                                 type: 'select',
                                 key: 'issueStateCode',
                                 templateOptions: {
-                                    label: 'form.scan.document.issuingStateCode',
+                                    label: 'scandoc.form.scan.document.issuingStateCode',
                                     options: this.provider.countries(),
                                 },
                             },
@@ -2160,7 +2287,7 @@ class ScanFieldsProvider {
                                 type: 'input',
                                 key: 'issuingPlace',
                                 templateOptions: {
-                                    label: 'form.scan.document.issuingPlace',
+                                    label: 'scandoc.form.scan.document.issuingPlace',
                                     required: false,
                                 },
                             },
@@ -2171,7 +2298,7 @@ class ScanFieldsProvider {
                                     {
                                         type: 'title',
                                         templateOptions: {
-                                            label: 'form.scan.document.addressTitle',
+                                            label: 'scandoc.form.scan.document.addressTitle',
                                             badge: 'communications',
                                         },
                                     },
@@ -2182,7 +2309,7 @@ class ScanFieldsProvider {
                             //   key: 'typeID',
                             //   type: 'select',
                             //   templateOptions: {
-                            //     label: 'form.profile.address.type',
+                            //     label: 'scandoc.form.profile.address.type',
                             //     required: true,
                             //     //  options: this.profileProvider.addressTypes(),
                             //     expressionProperties: {
@@ -2208,7 +2335,7 @@ class ScanFieldsProvider {
                                 type: 'select',
                                 templateOptions: {
                                     required: true,
-                                    label: 'form.profile.address.country',
+                                    label: 'scandoc.form.profile.address.country',
                                     options: this.provider.countries(),
                                 },
                                 // expressionProperties: {
@@ -2229,7 +2356,7 @@ class ScanFieldsProvider {
                                         key: 'zip',
                                         type: 'input',
                                         templateOptions: {
-                                            label: 'form.profile.address.zip',
+                                            label: 'scandoc.form.profile.address.zip',
                                             labelProp: (item) => {
                                                 return `${item.zip} (${item.city})`;
                                             },
@@ -2256,7 +2383,7 @@ class ScanFieldsProvider {
                                         key: 'city',
                                         type: 'input',
                                         templateOptions: {
-                                            label: 'form.profile.address.city',
+                                            label: 'scandoc.form.profile.address.city',
                                         },
                                         // expressionProperties: {
                                         //   'templateOptions.disabled': (model: any) =>
@@ -2270,7 +2397,7 @@ class ScanFieldsProvider {
                             //   key: 'state',
                             //   type: 'input',
                             //   templateOptions: {
-                            //     label: 'form.profile.address.state',
+                            //     label: 'scandoc.form.profile.address.state',
                             //   },
                             //   // expressionProperties: {
                             //   //   'templateOptions.disabled': (model: any) => !model.newAddress,
@@ -2281,7 +2408,7 @@ class ScanFieldsProvider {
                             //   key: 'countryStateID',
                             //   type: 'select',
                             //   templateOptions: {
-                            //     label: 'form.profile.address.regionalStatistics',
+                            //     label: 'scandoc.form.profile.address.regionalStatistics',
                             //     options: this.provider.countries(),
                             //   },
                             //   // expressionProperties: {
@@ -2293,7 +2420,7 @@ class ScanFieldsProvider {
                                 key: 'street1',
                                 type: 'input',
                                 templateOptions: {
-                                    label: 'form.profile.address.street',
+                                    label: 'scandoc.form.profile.address.street',
                                 },
                                 // expressionProperties: {
                                 //   'templateOptions.disabled': (model: any) => !model.newAddress,
@@ -2306,14 +2433,14 @@ class ScanFieldsProvider {
         ].map((item) => this.translate.forms(item));
     }
 }
-ScanFieldsProvider.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanFieldsProvider, deps: [{ token: TranslationProvider }, { token: ScanProvider }], target: i0.ɵɵFactoryTarget.Injectable });
+ScanFieldsProvider.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanFieldsProvider, deps: [{ token: NgxScanDocTranslationProvider }, { token: ScanProvider }], target: i0.ɵɵFactoryTarget.Injectable });
 ScanFieldsProvider.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanFieldsProvider, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanFieldsProvider, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: function () { return [{ type: TranslationProvider }, { type: ScanProvider }]; } });
+        }], ctorParameters: function () { return [{ type: NgxScanDocTranslationProvider }, { type: ScanProvider }]; } });
 
 class ScanResultsComponent {
     constructor(cameraProvider, formProvider) {
@@ -2330,10 +2457,10 @@ class ScanResultsComponent {
     }
 }
 ScanResultsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanResultsComponent, deps: [{ token: NgxScandocCameraProvider }, { token: ScanFieldsProvider }], target: i0.ɵɵFactoryTarget.Component });
-ScanResultsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScanResultsComponent, selector: "ngx-scan-results", inputs: { model: "model", images: "images", form: "form" }, outputs: { action: "action" }, ngImport: i0, template: "<div class=\"wraper\">\n  <div style=\"flex: 1\">\n    <mat-card style=\"margin: 4px; padding: 4px 16px\">\n      <h3>Avatar</h3>\n      <div class=\"selfieContainer\">\n        <div class=\"selfie\">\n          <img *ngIf=\"model?._avatar\" class=\"preview\" [src]=\"model._avatar\" />\n        </div>\n        <button (click)=\"selfie()\" mat-raised-button>Take selfie</button>\n      </div>\n    </mat-card>\n\n    <form\n      fxLayout=\"row\"\n      fxLayoutAlign=\"start center\"\n      class=\"px-16 py-0 w-100-p\"\n      [formGroup]=\"form\"\n    >\n      <formly-form\n        ngClass.lt-md=\"mobile\"\n        fxFlex\n        [form]=\"form\"\n        [fields]=\"fields\"\n        [model]=\"model\"\n      >\n      </formly-form>\n    </form>\n  </div>\n  <div style=\"flex: 1\" class=\"pr-16 m-4\">\n    <mat-card style=\"margin: 4px; padding-top: 2px\" class=\"images\">\n      <h3>Images</h3>\n      <ng-container *ngFor=\"let img of images\">\n        <div fxLayout=\"column\">\n          <ng-container *ngIf=\"img.side === 0\">\n            <div class=\"title\">Front Side</div>\n          </ng-container>\n          <ng-container *ngIf=\"img.side === 1\">\n            <div class=\"title\">Back Side</div>\n          </ng-container>\n          <img\n            class=\"preview\"\n            style=\"max-width: 460px; border-radius: 1rem\"\n            [src]=\"img.data\"\n          />\n        </div>\n      </ng-container>\n    </mat-card>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;overflow:hidden}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px;width:100%}.wraper{padding:8px 8px 0 0;overflow:auto;flex:1;display:flex;flex-direction:row}mat-card{box-shadow:none!important}.selfieContainer{display:flex;flex-direction:row;align-items:center}.selfieContainer .selfie{width:150px}.selfieContainer .selfie .preview{width:120px;height:120px;border-radius:80px}.selfieContainer .button{box-shadow:none;border:1px solid rgba(0,0,0,.1)}\n"], dependencies: [{ 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.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { 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: i7.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }] });
+ScanResultsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ScanResultsComponent, selector: "ngx-scan-results", inputs: { model: "model", images: "images", form: "form" }, outputs: { action: "action" }, ngImport: i0, template: "<div class=\"wraper\">\n  <div style=\"flex: 1\">\n    <mat-card style=\"margin: 4px; padding: 4px 16px\">\n      <h3>{{ \"scandoc.result.avatar\" | translate }}</h3>\n      <div class=\"selfieContainer\">\n        <div class=\"selfie\">\n          <img *ngIf=\"model?._avatar\" class=\"preview\" [src]=\"model._avatar\" />\n        </div>\n        <button (click)=\"selfie()\" mat-raised-button>\n          {{ \"scandoc.result.takeSelfie\" | translate }}\n        </button>\n      </div>\n    </mat-card>\n\n    <form\n      fxLayout=\"row\"\n      fxLayoutAlign=\"start center\"\n      class=\"px-16 py-0 w-100-p\"\n      [formGroup]=\"form\"\n    >\n      <formly-form\n        ngClass.lt-md=\"mobile\"\n        fxFlex\n        [form]=\"form\"\n        [fields]=\"fields\"\n        [model]=\"model\"\n      >\n      </formly-form>\n    </form>\n  </div>\n  <div style=\"flex: 1\" class=\"pr-16 m-4\">\n    <mat-card style=\"margin: 4px; padding-top: 2px\" class=\"images\">\n      <h3>{{ \"scandoc.result.images\" | translate }}</h3>\n      <ng-container *ngFor=\"let img of images\">\n        <div fxLayout=\"column\">\n          <ng-container *ngIf=\"img.side === 0\">\n            <div class=\"title\">\n              {{ \"scandoc.result.frontSide\" | translate }}\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"img.side === 1\">\n            <div class=\"title\">{{ \"scandoc.result.backSide\" | translate }}</div>\n          </ng-container>\n          <img\n            class=\"preview\"\n            style=\"max-width: 460px; border-radius: 1rem\"\n            [src]=\"img.data\"\n          />\n        </div>\n      </ng-container>\n    </mat-card>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;overflow:hidden}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px;width:100%}.wraper{padding:8px 8px 0 0;overflow:auto;flex:1;display:flex;flex-direction:row}mat-card{box-shadow:none!important}.selfieContainer{display:flex;flex-direction:row;align-items:center}.selfieContainer .selfie{width:150px}.selfieContainer .selfie .preview{width:120px;height:120px;border-radius:80px}.selfieContainer .button{box-shadow:none;border:1px solid rgba(0,0,0,.1)}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { 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: i7.FormlyForm, selector: "formly-form", inputs: ["form", "model", "fields", "options"], outputs: ["modelChange"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ScanResultsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngx-scan-results', template: "<div class=\"wraper\">\n  <div style=\"flex: 1\">\n    <mat-card style=\"margin: 4px; padding: 4px 16px\">\n      <h3>Avatar</h3>\n      <div class=\"selfieContainer\">\n        <div class=\"selfie\">\n          <img *ngIf=\"model?._avatar\" class=\"preview\" [src]=\"model._avatar\" />\n        </div>\n        <button (click)=\"selfie()\" mat-raised-button>Take selfie</button>\n      </div>\n    </mat-card>\n\n    <form\n      fxLayout=\"row\"\n      fxLayoutAlign=\"start center\"\n      class=\"px-16 py-0 w-100-p\"\n      [formGroup]=\"form\"\n    >\n      <formly-form\n        ngClass.lt-md=\"mobile\"\n        fxFlex\n        [form]=\"form\"\n        [fields]=\"fields\"\n        [model]=\"model\"\n      >\n      </formly-form>\n    </form>\n  </div>\n  <div style=\"flex: 1\" class=\"pr-16 m-4\">\n    <mat-card style=\"margin: 4px; padding-top: 2px\" class=\"images\">\n      <h3>Images</h3>\n      <ng-container *ngFor=\"let img of images\">\n        <div fxLayout=\"column\">\n          <ng-container *ngIf=\"img.side === 0\">\n            <div class=\"title\">Front Side</div>\n          </ng-container>\n          <ng-container *ngIf=\"img.side === 1\">\n            <div class=\"title\">Back Side</div>\n          </ng-container>\n          <img\n            class=\"preview\"\n            style=\"max-width: 460px; border-radius: 1rem\"\n            [src]=\"img.data\"\n          />\n        </div>\n      </ng-container>\n    </mat-card>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;overflow:hidden}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px;width:100%}.wraper{padding:8px 8px 0 0;overflow:auto;flex:1;display:flex;flex-direction:row}mat-card{box-shadow:none!important}.selfieContainer{display:flex;flex-direction:row;align-items:center}.selfieContainer .selfie{width:150px}.selfieContainer .selfie .preview{width:120px;height:120px;border-radius:80px}.selfieContainer .button{box-shadow:none;border:1px solid rgba(0,0,0,.1)}\n"] }]
+            args: [{ selector: 'ngx-scan-results', template: "<div class=\"wraper\">\n  <div style=\"flex: 1\">\n    <mat-card style=\"margin: 4px; padding: 4px 16px\">\n      <h3>{{ \"scandoc.result.avatar\" | translate }}</h3>\n      <div class=\"selfieContainer\">\n        <div class=\"selfie\">\n          <img *ngIf=\"model?._avatar\" class=\"preview\" [src]=\"model._avatar\" />\n        </div>\n        <button (click)=\"selfie()\" mat-raised-button>\n          {{ \"scandoc.result.takeSelfie\" | translate }}\n        </button>\n      </div>\n    </mat-card>\n\n    <form\n      fxLayout=\"row\"\n      fxLayoutAlign=\"start center\"\n      class=\"px-16 py-0 w-100-p\"\n      [formGroup]=\"form\"\n    >\n      <formly-form\n        ngClass.lt-md=\"mobile\"\n        fxFlex\n        [form]=\"form\"\n        [fields]=\"fields\"\n        [model]=\"model\"\n      >\n      </formly-form>\n    </form>\n  </div>\n  <div style=\"flex: 1\" class=\"pr-16 m-4\">\n    <mat-card style=\"margin: 4px; padding-top: 2px\" class=\"images\">\n      <h3>{{ \"scandoc.result.images\" | translate }}</h3>\n      <ng-container *ngFor=\"let img of images\">\n        <div fxLayout=\"column\">\n          <ng-container *ngIf=\"img.side === 0\">\n            <div class=\"title\">\n              {{ \"scandoc.result.frontSide\" | translate }}\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"img.side === 1\">\n            <div class=\"title\">{{ \"scandoc.result.backSide\" | translate }}</div>\n          </ng-container>\n          <img\n            class=\"preview\"\n            style=\"max-width: 460px; border-radius: 1rem\"\n            [src]=\"img.data\"\n          />\n        </div>\n      </ng-container>\n    </mat-card>\n  </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;overflow:hidden}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px;width:100%}.wraper{padding:8px 8px 0 0;overflow:auto;flex:1;display:flex;flex-direction:row}mat-card{box-shadow:none!important}.selfieContainer{display:flex;flex-direction:row;align-items:center}.selfieContainer .selfie{width:150px}.selfieContainer .selfie .preview{width:120px;height:120px;border-radius:80px}.selfieContainer .button{box-shadow:none;border:1px solid rgba(0,0,0,.1)}\n"] }]
         }], ctorParameters: function () { return [{ type: NgxScandocCameraProvider }, { type: ScanFieldsProvider }]; }, propDecorators: { model: [{
                 type: Input
             }], images: [{
@@ -2384,7 +2511,7 @@ class ScanComponent extends BaseComponent {
         this.documentTypeSelected = false;
         this.preview = null;
         this.errorCode = '1000';
-        this.displayInfo = 'Position document inside rectange and hold steady.';
+        this.displayInfo = 'scandoc.info.position';
         this.allowCameraSwitch = true;
         this.verificationErrorSent = false;
         this.error = false;
@@ -2518,7 +2645,7 @@ class ScanComponent extends BaseComponent {
     }
     handleBurstData(imagesArray, images, type = 'plain') {
         this.__subs(this.scanProvider.burst(imagesArray)).subscribe((resp) => {
-            this.displayInfo = resp.Info;
+            this.displayInfo = 'scandoc.info.c' + resp.InfoCode;
             console.timeEnd('validationPOST');
             console.log('AnalysisTime', resp.AnalysisTime);
             const { DocType, Series, Side, InfoCode } = resp;
@@ -2565,7 +2692,7 @@ class ScanComponent extends BaseComponent {
                             });
                         }
                         console.log('ID SIDE', this.idScan);
-                        this.displayInfo = 'Please turn the document over!';
+                        this.displayInfo = 'scandoc.info.turn';
                     }
                 }
                 else {
@@ -2736,6 +2863,8 @@ class ScanComponent extends BaseComponent {
             },
             // CallBackUrl: 'http://demo:5000/report/extracted/',
         };
+        this.frontImage = 'data:image/jpeg;base64,' + payload.DataFields.FrontImage;
+        this.backImage = 'data:image/jpeg;base64,' + payload.DataFields.BackImage;
         if (!this.scanBlastData[1].image) {
             payload.Settings.IgnoreBackImage = true;
         }
@@ -2901,10 +3030,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 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 });
+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<!-- <div style=\"display:none\">\n<img [src]=\"frontImage\">\n<img [src]=\"backImage\">\n</div> -->\n\n  <footer>\n    <div class=\"actions\">\n      <button class=\"mr-4\" mat-raised-button (click)=\"retake()\">\n        {{ \"scandoc.reTake\" | translate }}\n      </button>\n      <button\n        [disabled]=\"error || form.invalid\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"use()\"\n      >\n        {{ \"scandoc.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        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              \"scandoc.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ng-container *ngIf=\"errorCode === '1001'\">\n            <div>\n              {{ \"scandoc.extraction.c1001\" | translate }}\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"errorCode === '1002'\">\n            <div>\n              {{ \"scandoc.extraction.c1002\" | translate }}\n            </div>\n          </ng-container>\n\n          <ul *ngIf=\"errorCode === '1000'\">\n            <li>\n              {{ \"scandoc.placeIdCloseToDevice\" | translate }}\n            </li>\n            <li>\n              {{ \"scandoc.ensureSufficientLight\" | translate }}\n            </li>\n            <li>\n              {{ \"scandoc.holdDocumentSteady\" | translate }}\n            </li>\n            <li>\n              {{ \"scandoc.makeSureAllEdgesOfTheIdAreVisible\" | translate }}\n            </li>\n            <li>\n              {{\n                \"scandoc.makeSureThereAreNoGlareAndShadowsOnTheId\" | 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            \"scandoc.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 | translate }}\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          {{ \"scandoc.captureBack\" | translate }}\n        </ng-container>\n        <ng-container *ngIf=\"idScan === 'FRONT'\">\n          Turn document and:\n          {{ \"scandoc.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        {{ \"scandoc.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{ \"scandoc.continueWithSelectedImage\" | translate }}\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: i2$1.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 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"] }]
+            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<!-- <div style=\"display:none\">\n<img [src]=\"frontImage\">\n<img [src]=\"backImage\">\n</div> -->\n\n  <footer>\n    <div class=\"actions\">\n      <button class=\"mr-4\" mat-raised-button (click)=\"retake()\">\n        {{ \"scandoc.reTake\" | translate }}\n      </button>\n      <button\n        [disabled]=\"error || form.invalid\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"use()\"\n      >\n        {{ \"scandoc.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        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              \"scandoc.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ng-container *ngIf=\"errorCode === '1001'\">\n            <div>\n              {{ \"scandoc.extraction.c1001\" | translate }}\n            </div>\n          </ng-container>\n          <ng-container *ngIf=\"errorCode === '1002'\">\n            <div>\n              {{ \"scandoc.extraction.c1002\" | translate }}\n            </div>\n          </ng-container>\n\n          <ul *ngIf=\"errorCode === '1000'\">\n            <li>\n              {{ \"scandoc.placeIdCloseToDevice\" | translate }}\n            </li>\n            <li>\n              {{ \"scandoc.ensureSufficientLight\" | translate }}\n            </li>\n            <li>\n              {{ \"scandoc.holdDocumentSteady\" | translate }}\n            </li>\n            <li>\n              {{ \"scandoc.makeSureAllEdgesOfTheIdAreVisible\" | translate }}\n            </li>\n            <li>\n              {{\n                \"scandoc.makeSureThereAreNoGlareAndShadowsOnTheId\" | 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            \"scandoc.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 | translate }}\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          {{ \"scandoc.captureBack\" | translate }}\n        </ng-container>\n        <ng-container *ngIf=\"idScan === 'FRONT'\">\n          Turn document and:\n          {{ \"scandoc.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        {{ \"scandoc.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{ \"scandoc.continueWithSelectedImage\" | translate }}\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: [{
@@ -3092,7 +3221,7 @@ AvatarTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
         [ngClass]="width"
       ></ngx-avatars>
     </mat-card>
-  `, isInline: true, styles: ["mat-card{border-radius:0;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i5$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i3.AvatarComponent, selector: "ngx-avatars", inputs: ["round", "size", "textSizeRatio", "bgColor", "fgColor", "borderColor", "style", "cornerRadius", "facebookId", "twitterId", "googleId", "instagramId", "vkontakteId", "skypeId", "gravatarId", "githubId", "src", "name", "value", "referrerpolicy", "placeholder", "initialsSize"], outputs: ["clickOnAvatar"] }] });
+  `, isInline: true, styles: ["mat-card{border-radius:0;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i5.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i3.AvatarComponent, selector: "ngx-avatars", inputs: ["round", "size", "textSizeRatio", "bgColor", "fgColor", "borderColor", "style", "cornerRadius", "facebookId", "twitterId", "googleId", "instagramId", "vkontakteId", "skypeId", "gravatarId", "githubId", "src", "name", "value", "referrerpolicy", "placeholder", "initialsSize"], outputs: ["clickOnAvatar"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AvatarTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-formly-avatar-type', template: `
@@ -3141,7 +3270,7 @@ TitleTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
         {{ to.chip | translate }}
       </div>
     </div>
-  `, isInline: true, styles: [".chip{background:whitesmoke;border-radius:6px;padding:4px 8px;font-size:12px;color:#888;font-weight:600}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
+  `, isInline: true, styles: [".chip{background:whitesmoke;border-radius:6px;padding:4px 8px;font-size:12px;color:#888;font-weight:600}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TitleTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-formly-title-type', template: `
@@ -3194,7 +3323,7 @@ ProfileImageTypeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.
 
       ></ngx-avatars>
     </mat-card>
-  `, isInline: true, styles: ["mat-card{border-radius:0;box-shadow:none!important}.profile-image{width:150px;height:150px;border-radius:50%}\n"], dependencies: [{ kind: "component", type: i5$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i3.AvatarComponent, selector: "ngx-avatars", inputs: ["round", "size", "textSizeRatio", "bgColor", "fgColor", "borderColor", "style", "cornerRadius", "facebookId", "twitterId", "googleId", "instagramId", "vkontakteId", "skypeId", "gravatarId", "githubId", "src", "name", "value", "referrerpolicy", "placeholder", "initialsSize"], outputs: ["clickOnAvatar"] }] });
+  `, isInline: true, styles: ["mat-card{border-radius:0;box-shadow:none!important}.profile-image{width:150px;height:150px;border-radius:50%}\n"], dependencies: [{ kind: "component", type: i5.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { kind: "component", type: i3.AvatarComponent, selector: "ngx-avatars", inputs: ["round", "size", "textSizeRatio", "bgColor", "fgColor", "borderColor", "style", "cornerRadius", "facebookId", "twitterId", "googleId", "instagramId", "vkontakteId", "skypeId", "gravatarId", "githubId", "src", "name", "value", "referrerpolicy", "placeholder", "initialsSize"], outputs: ["clickOnAvatar"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ProfileImageTypeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-formly-profile-image-type', template: `
@@ -3293,10 +3422,10 @@ class CameraSwitchComponent {
     ngOnDestroy() { }
 }
 CameraSwitchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CameraSwitchComponent, deps: [{ token: NgxScandocCameraProvider }], target: i0.ɵɵFactoryTarget.Component });
-CameraSwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CameraSwitchComponent, selector: "ngx-scan-camera-switch", ngImport: i0, template: "<mat-form-field\n  style=\"font-size: 14px; width: 200px; margin-top: 8px\"\n  class=\"w-100 mr-16 mt-8\"\n>\n  <mat-label> Camera </mat-label>\n  <mat-select (selectionChange)=\"cameraProvider.selectCamera($event)\" [(ngModel)]=\"cameraProvider.deviceId\">\n    <mat-option *ngFor=\"let device of cameraProvider.mediaDevices\" [value]=\"device.deviceId\">\n      {{ device.label }}\n    </mat-option>\n  </mat-select>\n</mat-form-field>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1}\n"], dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { 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"] }] });
+CameraSwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: CameraSwitchComponent, selector: "ngx-scan-camera-switch", ngImport: i0, template: "<mat-form-field\n  style=\"font-size: 14px; width: 200px; margin-top: 8px\"\n  class=\"w-100 mr-16 mt-8\"\n>\n  <mat-label> {{ \"scandoc.camera\" | translate }} </mat-label>\n  <mat-select\n    (selectionChange)=\"cameraProvider.selectCamera($event)\"\n    [(ngModel)]=\"cameraProvider.deviceId\"\n  >\n    <mat-option\n      *ngFor=\"let device of cameraProvider.mediaDevices\"\n      [value]=\"device.deviceId\"\n    >\n      {{ device.label }}\n    </mat-option>\n  </mat-select>\n</mat-form-field>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { 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$1.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i6$1.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: CameraSwitchComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngx-scan-camera-switch', template: "<mat-form-field\n  style=\"font-size: 14px; width: 200px; margin-top: 8px\"\n  class=\"w-100 mr-16 mt-8\"\n>\n  <mat-label> Camera </mat-label>\n  <mat-select (selectionChange)=\"cameraProvider.selectCamera($event)\" [(ngModel)]=\"cameraProvider.deviceId\">\n    <mat-option *ngFor=\"let device of cameraProvider.mediaDevices\" [value]=\"device.deviceId\">\n      {{ device.label }}\n    </mat-option>\n  </mat-select>\n</mat-form-field>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1}\n"] }]
+            args: [{ selector: 'ngx-scan-camera-switch', template: "<mat-form-field\n  style=\"font-size: 14px; width: 200px; margin-top: 8px\"\n  class=\"w-100 mr-16 mt-8\"\n>\n  <mat-label> {{ \"scandoc.camera\" | translate }} </mat-label>\n  <mat-select\n    (selectionChange)=\"cameraProvider.selectCamera($event)\"\n    [(ngModel)]=\"cameraProvider.deviceId\"\n  >\n    <mat-option\n      *ngFor=\"let device of cameraProvider.mediaDevices\"\n      [value]=\"device.deviceId\"\n    >\n      {{ device.label }}\n    </mat-option>\n  </mat-select>\n</mat-form-field>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1}\n"] }]
         }], ctorParameters: function () { return [{ type: NgxScandocCameraProvider }]; } });
 
 class CoreComponentsModule {
@@ -3450,7 +3579,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: "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: i2$1.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"] }]
@@ -3829,7 +3958,7 @@ 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\">\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 });
+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: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.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$1.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\">\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"] }]
@@ -3859,10 +3988,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 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"] }] });
+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      {{ \"scandoc.turnAndCapture.back\" | translate }}\n    </ng-container>\n    <ng-container *ngIf=\"data.idScan === 'FRONT'\">\n      {{ \"scandoc.turnAndCapture.front\" | 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: i2$1.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: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
 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 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"] }]
+            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      {{ \"scandoc.turnAndCapture.back\" | translate }}\n    </ng-container>\n    <ng-container *ngIf=\"data.idScan === 'FRONT'\">\n      {{ \"scandoc.turnAndCapture.front\" | 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"] }]
         }], ctorParameters: function () {
         return [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                         type: Inject,
@@ -4003,10 +4132,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 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 });
+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\">\n   {{ \"scandoc.title\" | translate }}\n  </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: i2$1.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: "pipe", type: i1$2.TranslatePipe, name: "translate" }], 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 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"] }]
+            args: [{ selector: 'app-scan-profile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<header class=\"page-header\">\n  <div class=\"title\" ngClass.lt-sm=\"title-small\">\n   {{ \"scandoc.title\" | translate }}\n  </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
             }] } });
@@ -4084,7 +4213,7 @@ class HttpErrorInterceptor {
     }
     intercept(req, next) {
         //console.log(req.url);
-        if (req.url.indexOf('auth') >= 0 || req.url.indexOf('/assets/') >= 0) {
+        if (req.url.indexOf('/ks/') >= 0 || req.url.indexOf('/assets/') >= 0) {
             return next.handle(req);
         }
         const authProvider = this.injector.get(AuthProvider);
@@ -4098,6 +4227,7 @@ class HttpErrorInterceptor {
                 return next.handle(req);
             }
         }
+        console.log('AUTH II');
         this.inflightAuthRequest = authProvider.accesToken;
         return this.inflightAuthRequest.pipe(share(), switchMap((token) => {
             // unset request inflight
@@ -4114,9 +4244,14 @@ class HttpErrorInterceptor {
                 tokenExpired = find ? true : false;
             }
             console.log(err);
-            if (err.status === 401 || tokenExpired) {
-                authProvider.resetToken();
-                return this.intercept(req, next);
+            if (err.status === 401 || err.status === 403 || tokenExpired) {
+                return authProvider.refreshToken().pipe(switchMap((token) => {
+                    const transaction = req.headers.get('TransactionID');
+                    const authReq = req.clone({
+                        headers: this.getHeaders(token, transaction || ''),
+                    });
+                    return next.handle(authReq);
+                }));
             }
             else {
                 return throwError(() => new Error('' + (err && err.status ? ':' + err.status : '')));
@@ -4143,6 +4278,226 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
             type: Injectable
         }], ctorParameters: function () { return [{ type: i0.Injector }]; } });
 
+class Iso11649Reference {
+    constructor() {
+        this.FORMAT_RF = /^RF[0-9]{2}[A-Z0-9]{1,21}$/;
+        this.CHARCODE_A = 'A'.charCodeAt(0);
+        this.CHARCODE_0 = '0'.charCodeAt(0);
+    }
+    validate(rawValue) {
+        const value = rawValue.replace(/ /g, '');
+        // console.log(value);
+        if (!value.match(this.FORMAT_RF)) {
+            return false;
+            //  throw new Error('Invalid Creditor Reference format; expecting: \'' + this.FORMAT_RF + '\', found: \'' + value + '\'');
+        }
+        return (this.computeWithoutCheck(value.substring(4, value.length) + value.substring(0, 4)) === 1);
+    }
+    computeWithoutCheck(rawValue) {
+        return this.mod97(rawValue);
+    }
+    mod97(value) {
+        let buffer = 0;
+        let charCode;
+        for (let i = 0; i < value.length; ++i) {
+            charCode = value.charCodeAt(i);
+            buffer =
+                charCode +
+                    (charCode >= this.CHARCODE_A
+                        ? buffer * 100 - this.CHARCODE_A + 10
+                        : buffer * 10 - this.CHARCODE_0);
+            if (buffer > 1000000) {
+                buffer %= 97;
+            }
+        }
+        return buffer % 97;
+    }
+}
+class ObjectUtils {
+    static getValue(target, key) {
+        if (!target) {
+            return undefined;
+        }
+        const keys = key.split('.');
+        key = '';
+        do {
+            key += keys.shift();
+            const value = target[key];
+            if (value !== undefined && (typeof value === 'object' || !keys.length)) {
+                target = value;
+                key = '';
+            }
+            else if (!keys.length) {
+                target = undefined;
+            }
+            else {
+                key += '.';
+            }
+        } while (keys.length);
+        return target;
+    }
+    static deepCopy(inputObj) {
+        let newObj = inputObj;
+        if (inputObj && typeof inputObj === 'object') {
+            newObj =
+                Object.prototype.toString.call(inputObj) === '[object Array]' ? [] : {};
+            for (const i of Object.keys(inputObj)) {
+                newObj[i] = this.deepCopy(inputObj[i]);
+            }
+            if (Object.prototype.toString.call(inputObj) === '[object Map]') {
+                newObj = new Map();
+                inputObj.forEach((v, k) => {
+                    newObj.set(k, this.deepCopy(v));
+                });
+            }
+        }
+        return newObj;
+    }
+    static copy(item) {
+        return JSON.parse(JSON.stringify(item));
+    }
+    static compare(a, b, isAsc) {
+        return (a < b ? -1 : 1) * (isAsc ? 1 : -1);
+    }
+    static merge(...objects) {
+        const result = {};
+        objects.forEach((source) => {
+            Object.keys(source).forEach((prop) => {
+                if (prop in result && Array.isArray(result[prop])) {
+                    result[prop] = result[prop].concat(source[prop]);
+                }
+                else if (prop in result && typeof result[prop] === 'object') {
+                    result[prop] = ObjectUtils.merge(result[prop], source[prop]);
+                }
+                else {
+                    result[prop] = source[prop];
+                }
+            });
+        });
+        return result;
+    }
+}
+
+class ComponentTranslationModel {
+    constructor(obj) {
+        this.name = obj && obj.name;
+        this.path = obj && obj.path;
+        this.json = (obj && obj.json) || [];
+    }
+}
+class TranslateLoaderProvider {
+    constructor(http) {
+        this.http = http;
+        // private prefix = null;
+        this.suffix = '.json';
+        this.providers = [];
+        this.queue = [];
+    }
+    ngOnDestroy() {
+        console.log('TRANSLATE DESTROY');
+    }
+    registerProvider(name, path) {
+        const registered = this.providers.find((provider) => provider.name === name);
+        if (registered) {
+            registered.path = path;
+        }
+        else {
+            this.providers.push(new ComponentTranslationModel({ name: name, path: path }));
+        }
+    }
+    providerRegistered(name) {
+        return this.providers.find((x) => x.name === name) ? true : false;
+    }
+    getComponentToFetch(lang) {
+        const observableBatch = [];
+        if (!this.queue[lang]) {
+            this.queue[lang] = [];
+        }
+        this.providers.forEach((component) => {
+            if (!this.isComponentInQueue(lang, component.name)) {
+                this.queue[lang].push(component.name);
+                const translationUrl = `${component.path}/${lang}${this.suffix}?v=${Date.now()}`;
+                observableBatch.push(this.http.get(translationUrl).pipe(map((res) => {
+                    component.json[lang] = res;
+                }), retry(3), catchError(() => throwError(`Failed to load ${translationUrl}`))));
+            }
+        });
+        return observableBatch;
+    }
+    init(lang) {
+        if (this.queue[lang] === undefined) {
+            this.queue[lang] = [];
+        }
+    }
+    isComponentInQueue(lang, name) {
+        return (this.queue[lang] || []).find((x) => x === name) ? true : false;
+    }
+    getFullTranslationJSON(lang) {
+        let result = {};
+        this.providers
+            .slice(0)
+            .sort((a, b) => {
+            if (a.name === 'app') {
+                return 1;
+            }
+            if (b.name === 'app') {
+                return -1;
+            }
+            return a.name.localeCompare(b.name);
+        })
+            .forEach((model) => {
+            if (model.json && model.json[lang]) {
+                result = ObjectUtils.merge(result, model.json[lang]);
+            }
+        });
+        return result;
+    }
+    getTranslation(lang) {
+        let hasFailures = false;
+        const batch = [
+            ...this.getComponentToFetch(lang).map((observable) => {
+                return observable.pipe(catchError((error) => {
+                    hasFailures = true;
+                    return of(error);
+                }));
+            }),
+        ];
+        return new Observable((observer) => {
+            if (batch.length > 0) {
+                forkJoin(batch).subscribe(() => {
+                    const fullTranslation = this.getFullTranslationJSON(lang);
+                    if (fullTranslation) {
+                        observer.next(fullTranslation);
+                    }
+                    if (hasFailures) {
+                        observer.error('Failed to load some resources');
+                    }
+                    else {
+                        observer.complete();
+                    }
+                }, (err) => {
+                    observer.error('Failed to load some resources');
+                });
+            }
+            else {
+                const fullTranslation = this.getFullTranslationJSON(lang);
+                if (fullTranslation) {
+                    observer.next(fullTranslation);
+                    observer.complete();
+                }
+            }
+        });
+    }
+}
+TranslateLoaderProvider.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TranslateLoaderProvider, deps: [{ token: i1$1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+TranslateLoaderProvider.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TranslateLoaderProvider, providedIn: 'root' });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: TranslateLoaderProvider, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.HttpClient }]; } });
+
 class webRtcProvider {
     constructor() {
         this.pc = new RTCPeerConnection();
@@ -4236,5 +4591,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { AppFormModule, AuthProvider, BlankComponent, CameraSwitchComponent, CoreComponentsModule, CorePipesModule, DialogsCoreProvider, DialogsModule, HttpErrorInterceptor, LoadingComponent, MaterialModule, NgxScandocModule, SafeResourceUrlPipe, ScanComponent, ScanFieldsProvider, ScanProfileComponent, ScanProvider, ScanSelfieComponent, TranslationProvider, TurnDocumentComponent, WebcamComponent, WebcamModule, webRtcProvider };
+export { AppFormModule, AuthProvider, BlankComponent, CameraSwitchComponent, CoreComponentsModule, CorePipesModule, DialogsCoreProvider, DialogsModule, HttpErrorInterceptor, LoadingComponent, MaterialModule, NgxScanDocTranslationProvider, NgxScandocModule, SafeResourceUrlPipe, ScanComponent, ScanFieldsProvider, ScanProfileComponent, ScanProvider, ScanSelfieComponent, TranslateLoaderProvider, TurnDocumentComponent, WebcamComponent, WebcamModule, webRtcProvider };
 //# sourceMappingURL=ngx-scandoc.mjs.map