ngx-scandoc 19.0.3 → 19.0.4

package/fesm2022/ngx-scandoc.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Output, ViewChild, HostListener, Input, ChangeDetectionStrategy, Component, NgModule, InjectionToken, Optional, Inject, HostBinding, Pipe, ViewContainerRef } from '@angular/core';
+import { Injectable, EventEmitter, Output, ViewChild, HostListener, Input, ChangeDetectionStrategy, Component, NgModule, InjectionToken, HostBinding, Optional, Inject, Pipe, ViewContainerRef } from '@angular/core';
 import * as i4 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import { Subject, of, from, Observable, tap, distinctUntilChanged, switchMap as switchMap$1, throwError, forkJoin } from 'rxjs';
@@ -7,7 +7,7 @@ import { takeUntil, map, switchMap, tap as tap$1, catchError, share, retry } fro
 import * as i1 from '@angular/cdk/layout';
 import * as i2 from '@angular/cdk/platform';
 import { PlatformModule } from '@angular/cdk/platform';
-import * as i5 from '@angular/forms';
+import * as i5$2 from '@angular/forms';
 import { FormGroup, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import moment from 'moment';
 import * as i1$1 from '@angular/common/http';
@@ -20,19 +20,17 @@ import * as i3 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import * as i8 from '@angular/material/progress-bar';
 import { MatProgressBarModule } from '@angular/material/progress-bar';
+import * as i5 from '@angular/material/card';
+import { MatCardModule } from '@angular/material/card';
 import * as i4$1 from '@ngx-translate/core';
 import { TranslateModule } from '@ngx-translate/core';
-import * as i6 from '@angular/material/card';
-import { MatCardModule } from '@angular/material/card';
-import * as i7 from '@ngx-formly/core';
-import { FormlyModule } from '@ngx-formly/core';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
 import { MatBadgeModule } from '@angular/material/badge';
 import { MatCheckboxModule } from '@angular/material/checkbox';
 import { MatChipsModule } from '@angular/material/chips';
 import { MatNativeDateModule } from '@angular/material/core';
 import { MatDatepickerModule } from '@angular/material/datepicker';
-import * as i1$3 from '@angular/material/dialog';
+import * as i1$4 from '@angular/material/dialog';
 import { MatDialogModule, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import * as i4$3 from '@angular/material/input';
 import { MatInputModule } from '@angular/material/input';
@@ -40,18 +38,20 @@ 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$3 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
 import { MatSlideToggleModule } from '@angular/material/slide-toggle';
 import { MatSliderModule } from '@angular/material/slider';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { MatTableModule } from '@angular/material/table';
 import { MatTabsModule } from '@angular/material/tabs';
+import * as i1$2 from '@ngx-formly/core';
+import { FormlyModule } from '@ngx-formly/core';
 import { FieldType, FormlyMaterialModule } from '@ngx-formly/material';
 import { FormlySelectModule } from '@ngx-formly/core/select';
 import { AvatarModule } from 'ngx-avatars';
 import { FormlyMatDatepickerModule } from '@ngx-formly/material/datepicker';
-import * as i1$2 from '@angular/platform-browser';
+import * as i1$3 from '@angular/platform-browser';
 import { webSocket } from 'rxjs/webSocket';
 
 /**
@@ -1647,891 +1647,368 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                 }]
         }], ctorParameters: () => [{ type: i1$1.HttpClient }, { type: i0.Injector }] });
 
-const TRANSLATION_PROVIDER = new InjectionToken('Injection token for translation providers.');
-class NgxScanDocTranslationProvider {
-    constructor(translate, injector, 
-    //@Optional() @Inject(SCAN_CONFIG_TOKEN) config: ScanConfig,
-    providers, platformLocation) {
-        this.translate = translate;
-        this.injector = injector;
-        this.platformLocation = platformLocation;
-        console.log('MM', Math.random());
-        this.customLoader = this.translate.currentLoader;
-        //console.log('config',config)
-        // console.log(this.translate)
-        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;
-    }
-    setDefaultLang(lang) {
-        this.defaultLang = lang;
-        this.translate.setDefaultLang(this.defaultLang);
+class ManualScanComponent extends BaseComponent {
+    get class() {
+        return this.isMobile;
     }
-    registerTranslationFolder(name = '', path = '') {
-        console.log(name, path, this.userLang, this.defaultLang);
-        if (!this.customLoader.providerRegistered(name)) {
-            this.customLoader.registerProvider(name, this.path(path));
+    onResize() {
+        if (this.wraper) {
+            this.width = this.wraper.nativeElement.clientWidth;
+            this.height = this.wraper.nativeElement.clientHeight;
+            setTimeout(() => {
+                const video = this.wraper?.nativeElement.querySelector('video');
+                if (video) {
+                    //   console.log(video.clientWidth, video.clientHeight);
+                    this.videoWidth = video.clientWidth;
+                    this.videoHeight = video.clientHeight;
+                }
+                this.cd.detectChanges();
+            }, 100);
+            this.cd.detectChanges();
         }
     }
-    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);
-            }
-        }
+    constructor(cameraProvider, cd, layoutProvider, zone) {
+        super();
+        this.cameraProvider = cameraProvider;
+        this.cd = cd;
+        this.layoutProvider = layoutProvider;
+        this.zone = zone;
+        this.action = new EventEmitter();
+        this.videoOptions = {
+            width: 1920,
+            height: 1080,
+            facingMode: 'environment',
+        };
+        this.cameraReady = false;
+        this.scanBlastData = [
+            {
+                title: 'scandoc.front',
+                description: 'scandoc.frontDescription',
+                side: 'FRONT',
+            },
+            {
+                title: 'scandoc.back',
+                description: 'scandoc.backDescription',
+                disabled: true,
+                side: 'BACK',
+            },
+        ];
+        this.error = false;
+        this.scaning = false;
+        this.documentTypeSelected = false;
+        this.preview = null;
+        this.scanDatas = [];
+        this.trigger = new Subject();
+        // switch to next / previous / specific webcam; true/false: forward/backwards, string: deviceId
+        this.nextWebcam = new Subject();
+        this.isMobile = false;
     }
-    loadTranslation(lang, fallback, useLang = true) {
-        this.translate.getTranslation(lang).subscribe((resp) => {
-            this.onTranslationChanged(lang);
-            if (useLang) {
+    ngOnInit() {
+        this.__subs(this.layoutProvider.breakpoint$).subscribe((v) => {
+            this.zone.run(() => {
+                this.isMobile = !v.matches;
                 setTimeout(() => {
-                    this.translate.use(lang);
-                }, 20);
-            }
-            // this.translate.reloadLang(lang)
-        }, () => {
-            if (fallback && fallback !== lang) {
-                this.loadTranslation(fallback);
-            }
+                    console.log('WTF');
+                    this.cd.detectChanges();
+                }, 200);
+            });
+            console.log('MNOBILE', this.isMobile);
         });
     }
-    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);
-        }));
+    get nextWebcamObservable() {
+        return this.nextWebcam.asObservable();
     }
-    onTranslationChanged(lang) {
-        this.translate.onTranslationChange.next({
-            lang,
-            translations: this.customLoader.getFullTranslationJSON(lang),
+    cameraWasSwitched(deviceId) {
+        console.log('[active device]', deviceId);
+        // this.deviceId = deviceId;
+        // this.cameraReady = true;
+        // this.defaultDevice = deviceId;
+        setTimeout(() => {
+            this.onResize();
+            // this.scan();
+        }, 300);
+    }
+    handleInitError(error) {
+        console.log(error);
+    }
+    resolutionLimit(file) {
+        const minWidth = 1280;
+        const minHeight = 720;
+        return new Observable((observer) => {
+            const img = new Image();
+            img.src = window.URL.createObjectURL(file);
+            img.onload = () => {
+                const width = img.naturalWidth;
+                const height = img.naturalHeight;
+                let valid = false;
+                if (width > height) {
+                    valid = width >= minWidth && height >= minHeight;
+                }
+                else {
+                    valid = width >= minHeight && height >= minWidth;
+                }
+                observer.next(valid);
+            };
+            img.onerror = (error) => {
+                observer.error(error);
+            };
         });
     }
-    use(lang) {
-        this.customLoader.init(lang);
-        return this.updateTranslation(lang);
+    getImgBase64(num) {
+        return this.scanBlastData[num].image.dataUrl.split(',')[1];
     }
-    forms(item, namespace = null) {
-        if (item.fieldGroup) {
-            item.fieldGroup = item.fieldGroup.map((field) => this.forms(field));
-        }
-        const prefix = namespace ? namespace + '.' : '';
-        if (item.props &&
-            (item.props.label || item.props.placeholder || item.props.options)) {
-            if (!item.expressions) {
-                item.expressions = {};
-            }
-            if (item.props.label) {
-                item.expressions['props.label'] = this.translate.stream(prefix + item.props.label);
-            }
-            if (item.props.placeholder) {
-                item.expressions['props.placeholder'] = this.translate.stream(prefix + item.props.placeholder);
+    getBase64(file) {
+        return new Observable((observer) => {
+            const reader = new FileReader();
+            reader.readAsDataURL(file);
+            reader.onload = () => {
+                observer.next(reader.result);
+            };
+            reader.onerror = (error) => {
+                observer.error(error);
+            };
+        });
+    }
+    handleFileInput(target, event, side) {
+        const files = target.files;
+        this.selectedSide = side;
+        console.log(files);
+        const file = files.item(0);
+        this.resolutionLimit(file)
+            .pipe(switchMap$1((valid) => {
+            return valid ? this.getBase64(file) : of(false);
+        }))
+            .subscribe((imageAsDataUrl) => {
+            // console.log(imageAsDataUrl);
+            event.target.value = null;
+            if (!imageAsDataUrl) {
+                console.warn('MIN RES');
+                // this.dialogs.alert(
+                //   'core.page.error',
+                //   this.translate.instant(
+                //     'pms.dialogs.components.scanProfile.minResolution'
+                //   )
+                // );
             }
-            if (Array.isArray(item.props.options)) {
-                item.expressions['props.options'] = item.props.options.map((m) => {
-                    // console.log(m);
-                    if (m.label) {
-                        m.label = this.translate.instant(prefix + m.label);
-                    }
-                    return m;
-                });
+            else {
+                side.image = {
+                    _imageAsDataUrl: imageAsDataUrl,
+                    imageAsDataUrl: imageAsDataUrl,
+                };
+                if (this.selectedSide.side === 'FRONT') {
+                    this.scanBlastData[1].disabled = false;
+                }
             }
-        }
-        return item;
+            this.cd.detectChanges();
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScanDocTranslationProvider, deps: [{ token: i4$1.TranslateService }, { token: i0.Injector }, { token: TRANSLATION_PROVIDER, optional: true }, { token: i4.PlatformLocation }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScanDocTranslationProvider, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScanDocTranslationProvider, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: () => [{ type: i4$1.TranslateService }, { type: i0.Injector }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [TRANSLATION_PROVIDER]
-                }] }, { type: i4.PlatformLocation }] });
+    cameraOff(ev) { }
+    ngOnDestroy() { }
+    singleScan(side) {
+        this.scanType = side.side;
+        this.preview = null;
+        this.selectedSide = side;
+        this.selectedSide.image = null;
+        this.documentTypeSelected = true;
+        this.scanBlastData[1].disabled = false;
+        this.cameraProvider.$showSwitch.next(true);
+        this.cd.detectChanges();
+        setTimeout(() => {
+            this.onResize();
+        }, 10);
+    }
+    scanBlastFinish() {
+        this.action.emit(this.scanBlastData);
+    }
+    get scanBlastCanUpload() {
+        return this.scanBlastData[0].image ? true : false;
+    }
+    handleImage(webcamImage) {
+        console.log('[received webcam image]', webcamImage);
+        this.webcamImage = webcamImage;
+        this.preview = webcamImage.imageAsDataUrl;
+        this.cameraProvider.$showSwitch.next(false);
+        this.cd.detectChanges();
+    }
+    continue() {
+        this.documentTypeSelected = false;
+        setTimeout(() => {
+            this.selectedSide.image = this.webcamImage;
+            if (this.selectedSide.side === 'FRONT') {
+                this.scanBlastData[1].disabled = false;
+            }
+            this.cd.detectChanges();
+        }, 200);
+    }
+    retry() {
+        this.preview = false;
+        this.cameraProvider.$showSwitch.next(true);
+        // this.result = false;
+        if (this.error) {
+            this.documentTypeSelected = false;
+            this.scanBlastData.forEach((element) => {
+                element.image = null;
+            });
+        }
+        this.error = false;
+    }
+    triggerSnapshot() {
+        this.trigger.next(0);
+    }
+    scan() {
+        console.log('SCAN');
+        this.triggerSnapshot();
+        this.scanDatas[0] = true;
+        console.log(this.cameraProvider);
+        this.cd.detectChanges();
+    }
+    rotateBase64Image(base64data) {
+        return new Observable((observer) => {
+            const canvas = document.createElement('canvas');
+            const ctx = canvas.getContext('2d');
+            var image = new Image();
+            image.src = base64data;
+            image.onload = () => {
+                console.log(canvas);
+                canvas.width = image.height;
+                canvas.height = image.width;
+                if (ctx) {
+                    ctx.rotate((90 * Math.PI) / 180);
+                    ctx.translate(0, -canvas.width);
+                    ctx.drawImage(image, 0, 0);
+                    observer.next(canvas.toDataURL());
+                }
+                else {
+                    observer.error({ type: 'generic error' });
+                }
+            };
+            image.onerror = (e) => {
+                observer.error(e);
+            };
+        });
+    }
+    singleScanRotate(side) {
+        console.log(side);
+        this.rotateBase64Image(side.image.imageAsDataUrl).subscribe((data) => {
+            side.image = { imageAsDataUrl: data };
+            this.cd.detectChanges();
+        });
+    }
+    videoReady(event) {
+        console.log('READY', event);
+        this.cameraReady = event;
+    }
+    singleScanRemove(side) {
+        side.image = null;
+        if (side.side === 'FRONT') {
+            this.scanBlastData[1].disabled = true;
+        }
+        this.cd.detectChanges();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ManualScanComponent, deps: [{ token: NgxScandocCameraProvider }, { token: i0.ChangeDetectorRef }, { token: LayoutProvider }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ManualScanComponent, isStandalone: false, selector: "ngx-manual-scan", outputs: { action: "action" }, 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: "\n\n<ng-container *ngIf=\"!result\">\n\n<ng-container *ngIf=\"!documentTypeSelected\">\n  <section\n    class=\"scanBlastWraper\"\n    ngClass.lt-md=\"mobile\"\n    fxFlex\n    fxLayout=\"column\"\n  >\n    <div class=\"scanBlast\" fxFlex fxLayout.lt-md=\"column\" fxLayout=\"row\">\n      <mat-card\n        appearance=\"outlined\"\n        style=\"display: flex; flex-direction: column\"\n        fxLayout=\"column\"\n        *ngFor=\"let side of scanBlastData\"\n      >\n        <div ngClass.lt-sm=\"small\" class=\"head\">\n          <div class=\"title\" fxFlex>{{ side.title | translate }}</div>\n        </div>\n        <div class=\"actions\" style=\"display: flex; flex-direction: row\">\n          <button\n            (click)=\"singleScan(side)\"\n            [disabled]=\"side.disabled\"\n            style=\"margin-right: 4px\"\n            mat-raised-button\n          >\n            <div class=\"buttonWrap\">\n              <mat-icon>camera</mat-icon>\n              <div>\n                {{ \"scandoc.scanCamera\" | translate }}\n              </div>\n            </div>\n          </button>\n          <button\n            (click)=\"file.click()\"\n            [disabled]=\"side.disabled\"\n            style=\"margin-left: 4px\"\n            mat-raised-button\n          >\n            <input\n              accept=\"image/*\"\n              type=\"file\"\n              style=\"display: none\"\n              (change)=\"handleFileInput($event.target, $event, side)\"\n              #file\n            />\n            <div class=\"buttonWrap\">\n              <mat-icon>file_upload</mat-icon>\n              <div>\n                {{ \"scandoc.useFromDisk\" | translate }}\n              </div>\n            </div>\n          </button>\n        </div>\n        <div class=\"content\" style=\"display: flex\">\n          <div style=\"flex: 1\" class=\"previewPlaceholder\">\n            <div class=\"description\">\n              <ng-container *ngIf=\"side.image\">\n                <div class=\"imgWrap\">\n                  <div\n                    style=\"flex: 1\"\n                    class=\"image\"\n                    [style.background-image]=\"\n                      'url(' + side.image.imageAsDataUrl + ')'\n                    \"\n                  ></div>\n\n                  <div\n                    class=\"btnActions\"\n                    fxLayout.lt-md=\"column\"\n                    fxLayout=\"row\"\n                    style=\"display: flex; flex-direction: row\"\n                  >\n                    <button\n                      (click)=\"singleScanRemove(side)\"\n                      class=\"mr-4 remButton flex\"\n                      mat-raised-button\n                    >\n                      <div class=\"buttonWrap\">\n                        <mat-icon>delete</mat-icon>\n                        <div class=\"label\">\n                          {{ \"scandoc.remove\" | translate }}\n                        </div>\n                      </div>\n                    </button>\n                    <button\n                      class=\"ml-4 rotateButton flex\"\n                      mat-raised-button\n                      (click)=\"singleScanRotate(side)\"\n                    >\n                      <div class=\"buttonWrap\">\n                        <mat-icon>rotate_90_degrees_cw</mat-icon>\n                        <div class=\"label\">\n                          {{ \"scandoc.rotate\" | translate }}\n                        </div>\n                      </div>\n                    </button>\n                  </div>\n                </div>\n              </ng-container>\n\n              <ng-container *ngIf=\"!side.image\">\n                <div class=\"empty\">\n                  {{ side.description | translate }}\n                </div>\n              </ng-container>\n            </div>\n          </div>\n        </div>\n      </mat-card>\n    </div>\n    <footer>\n      <div\n        class=\"px-8 pb-8\"\n        style=\"padding: 0px 8px 8px 8px; display: flex; flex-direction: row\"\n      >\n        <button\n          (click)=\"scanBlastFinish()\"\n          [disabled]=\"!scanBlastCanUpload\"\n          style=\"flex: 1\"\n          mat-raised-button\n        >\n          {{ \"scandoc.upload\" | translate }}\n        </button>\n      </div>\n    </footer>\n  </section>\n</ng-container>\n\n<div\n  style=\"position: relative; display: flex; flex-direction: column; flex: 1\"\n  *ngIf=\"documentTypeSelected\"\n>\n  <div\n    style=\"display: flex; flex-direction: row; flex: 1\"\n    #wraper\n    class=\"wraper\"\n  >\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      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main flex\"\n\n        #webcam\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n(videoReady)=\"videoReady($event)\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        type=\"manual\"\n\n        (destroyed)=\"cameraOff($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"\n        display: flex;\n        flex-direction: row;\n        flex: 1;\n        z-index: 20;\n        position: absolute;\n        width: 100%;\n        height: 100%;\n      \"\n    >\n      <div class=\"p-16 error\" *ngIf=\"error\">\n        <div>\n          <div class=\"title\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n            <mat-icon>error_outline</mat-icon\n            ><span class=\"ml-8\">{{\n              \"pms.dialogs.components.scanProfile.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ul>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.placeIdCloseToDevice\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.ensureSufficientLight\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.holdDocumentSteady\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureAllEdgesOfTheIdAreVisible\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureThereAreNoGlareAndShadowsOnTheId\"\n                  | translate\n              }}\n            </li>\n          </ul>\n        </div>\n      </div>\n\n      <div\n        class=\"scanPreview\"\n        style=\"display: flex; flex-direction: column; flex: 1\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <!-- <div class=\"py-16\" style=\"font-size: 16px\">\n          {{\n            \"pms.dialogs.components.scanProfile.ensureAllTextsAreVisible\"\n              | translate\n          }}\n        </div> -->\n        <div\n          style=\"flex: 1\"\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer fxLayout=\"row\" class=\"p-8\">\n    <!-- <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      {{ displayInfo }}\n    </div>\n    <div style=\"height: 26px;\">\n    <div style=\"text-align: center; font-size: 18px;\" *ngIf=\"idScan && !preview && cameraReady\">\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    <button\n      [disabled]=\"!cameraReady\"\n      class=\"w-100-p\"\n      *ngIf=\"!preview\"\n      mat-raised-button\n      (click)=\"scan()\"\n    >\n      <ng-container>\n        <ng-container *ngIf=\"scanType === 'FRONT'\">{{\n          \"scandoc.captureFront\" | translate\n        }}</ng-container>\n        <ng-container *ngIf=\"scanType === 'BACK'\">{{\n          \"scandoc.captureBack\" | translate\n        }}</ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"scanSide === 1\">{{\n        \"pms.dialogs.components.scanProfile.captureBackOfId\" | translate\n      }}</ng-container>\n    </button>\n\n    <div\n      class=\"w-100-p\"\n      *ngIf=\"preview\"\n      style=\"display: flex; flex-direction: row; align-items: center; flex: 1\"\n    >\n      <button class=\"flex mr-4\" mat-raised-button (click)=\"retry()\">\n        {{ \"scandoc.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        class=\"ml-4 flex\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{ \"scandoc.continueWithSelectedImage\" | translate }}\n      </button>\n    </div>\n  </footer>\n</div>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}:host.mobile .buttonWrap div{font-size:11px!important}:host.mobile .scanBlastWraper .head{height:30px!important}:host.mobile .scanBlastWraper .head .title{font-size:12px!important}:host.mobile .scanBlastWraper .scanBlast{flex-direction:column}:host.mobile .scanBlastWraper mat-card{margin:4px!important}:host.mobile .scanBlastWraper .description{flex-direction:row!important}:host.mobile .scanBlastWraper .description .imgWrap{padding:0!important}:host.mobile .scanBlastWraper .description .btnActions{position:absolute;right:0}:host.mobile .scanBlastWraper .description button{margin:0!important;position:absolute;right:16px}:host.mobile .scanBlastWraper .description button.rotateButton{top:58px}:host.mobile .scanBlastWraper .description button.remButton{top:8px}:host.mobile .scanBlastWraper .description button mat-icon{margin:0!important}:host.mobile .scanBlastWraper .description button div.label{display:none}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}.debug{position:absolute;left:0;width:100%;height:80px;top:0;border-bottom:1px solid #ccc;background-color:#f8f8f8;display:flex;overflow:hidden;color:#000}.debug img{height:50px;border:1px solid #000}.displayInfo{text-align:center;height:20px;flex:1;position:absolute;width:100%;background-color:#000;height:30px;bottom:55px;left:0;line-height:30px;color:#fff;z-index:200}.element{margin-bottom:8px}.element label{font-size:14px}.element div{font-size:18px}.wraper{position:relative;overflow:hidden}.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;text-transform:uppercase}h4{font-size:16px}.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{overflow:hidden;display:flex;flex-direction:column;flex:1}.scanBlastWraper button{text-transform:uppercase;overflow:hidden}.scanBlastWraper .buttonWrap{display:flex;flex-direction:row;align-items:center;justify-content:center}.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}.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;display:flex;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}.result{display:flex;flex-direction:column}.result .wrap{overflow:auto;flex:1;display:flex;flex-direction:row}.result .wrap .panel{flex:1}.result .wrap form{display:flex;flex-direction:row;padding:0 16px;width:100%}.result .wrap form formly-form{flex:1}.flex{flex:1}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "type", "trigger", "refresh"], outputs: ["cameraSwitched", "videoReady", "imageCapture", "initError"] }, { kind: "component", type: i5.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ManualScanComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngx-manual-scan', standalone: false, template: "\n\n<ng-container *ngIf=\"!result\">\n\n<ng-container *ngIf=\"!documentTypeSelected\">\n  <section\n    class=\"scanBlastWraper\"\n    ngClass.lt-md=\"mobile\"\n    fxFlex\n    fxLayout=\"column\"\n  >\n    <div class=\"scanBlast\" fxFlex fxLayout.lt-md=\"column\" fxLayout=\"row\">\n      <mat-card\n        appearance=\"outlined\"\n        style=\"display: flex; flex-direction: column\"\n        fxLayout=\"column\"\n        *ngFor=\"let side of scanBlastData\"\n      >\n        <div ngClass.lt-sm=\"small\" class=\"head\">\n          <div class=\"title\" fxFlex>{{ side.title | translate }}</div>\n        </div>\n        <div class=\"actions\" style=\"display: flex; flex-direction: row\">\n          <button\n            (click)=\"singleScan(side)\"\n            [disabled]=\"side.disabled\"\n            style=\"margin-right: 4px\"\n            mat-raised-button\n          >\n            <div class=\"buttonWrap\">\n              <mat-icon>camera</mat-icon>\n              <div>\n                {{ \"scandoc.scanCamera\" | translate }}\n              </div>\n            </div>\n          </button>\n          <button\n            (click)=\"file.click()\"\n            [disabled]=\"side.disabled\"\n            style=\"margin-left: 4px\"\n            mat-raised-button\n          >\n            <input\n              accept=\"image/*\"\n              type=\"file\"\n              style=\"display: none\"\n              (change)=\"handleFileInput($event.target, $event, side)\"\n              #file\n            />\n            <div class=\"buttonWrap\">\n              <mat-icon>file_upload</mat-icon>\n              <div>\n                {{ \"scandoc.useFromDisk\" | translate }}\n              </div>\n            </div>\n          </button>\n        </div>\n        <div class=\"content\" style=\"display: flex\">\n          <div style=\"flex: 1\" class=\"previewPlaceholder\">\n            <div class=\"description\">\n              <ng-container *ngIf=\"side.image\">\n                <div class=\"imgWrap\">\n                  <div\n                    style=\"flex: 1\"\n                    class=\"image\"\n                    [style.background-image]=\"\n                      'url(' + side.image.imageAsDataUrl + ')'\n                    \"\n                  ></div>\n\n                  <div\n                    class=\"btnActions\"\n                    fxLayout.lt-md=\"column\"\n                    fxLayout=\"row\"\n                    style=\"display: flex; flex-direction: row\"\n                  >\n                    <button\n                      (click)=\"singleScanRemove(side)\"\n                      class=\"mr-4 remButton flex\"\n                      mat-raised-button\n                    >\n                      <div class=\"buttonWrap\">\n                        <mat-icon>delete</mat-icon>\n                        <div class=\"label\">\n                          {{ \"scandoc.remove\" | translate }}\n                        </div>\n                      </div>\n                    </button>\n                    <button\n                      class=\"ml-4 rotateButton flex\"\n                      mat-raised-button\n                      (click)=\"singleScanRotate(side)\"\n                    >\n                      <div class=\"buttonWrap\">\n                        <mat-icon>rotate_90_degrees_cw</mat-icon>\n                        <div class=\"label\">\n                          {{ \"scandoc.rotate\" | translate }}\n                        </div>\n                      </div>\n                    </button>\n                  </div>\n                </div>\n              </ng-container>\n\n              <ng-container *ngIf=\"!side.image\">\n                <div class=\"empty\">\n                  {{ side.description | translate }}\n                </div>\n              </ng-container>\n            </div>\n          </div>\n        </div>\n      </mat-card>\n    </div>\n    <footer>\n      <div\n        class=\"px-8 pb-8\"\n        style=\"padding: 0px 8px 8px 8px; display: flex; flex-direction: row\"\n      >\n        <button\n          (click)=\"scanBlastFinish()\"\n          [disabled]=\"!scanBlastCanUpload\"\n          style=\"flex: 1\"\n          mat-raised-button\n        >\n          {{ \"scandoc.upload\" | translate }}\n        </button>\n      </div>\n    </footer>\n  </section>\n</ng-container>\n\n<div\n  style=\"position: relative; display: flex; flex-direction: column; flex: 1\"\n  *ngIf=\"documentTypeSelected\"\n>\n  <div\n    style=\"display: flex; flex-direction: row; flex: 1\"\n    #wraper\n    class=\"wraper\"\n  >\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      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main flex\"\n\n        #webcam\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n(videoReady)=\"videoReady($event)\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        type=\"manual\"\n\n        (destroyed)=\"cameraOff($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"\n        display: flex;\n        flex-direction: row;\n        flex: 1;\n        z-index: 20;\n        position: absolute;\n        width: 100%;\n        height: 100%;\n      \"\n    >\n      <div class=\"p-16 error\" *ngIf=\"error\">\n        <div>\n          <div class=\"title\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n            <mat-icon>error_outline</mat-icon\n            ><span class=\"ml-8\">{{\n              \"pms.dialogs.components.scanProfile.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ul>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.placeIdCloseToDevice\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.ensureSufficientLight\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.holdDocumentSteady\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureAllEdgesOfTheIdAreVisible\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureThereAreNoGlareAndShadowsOnTheId\"\n                  | translate\n              }}\n            </li>\n          </ul>\n        </div>\n      </div>\n\n      <div\n        class=\"scanPreview\"\n        style=\"display: flex; flex-direction: column; flex: 1\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <!-- <div class=\"py-16\" style=\"font-size: 16px\">\n          {{\n            \"pms.dialogs.components.scanProfile.ensureAllTextsAreVisible\"\n              | translate\n          }}\n        </div> -->\n        <div\n          style=\"flex: 1\"\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer fxLayout=\"row\" class=\"p-8\">\n    <!-- <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      {{ displayInfo }}\n    </div>\n    <div style=\"height: 26px;\">\n    <div style=\"text-align: center; font-size: 18px;\" *ngIf=\"idScan && !preview && cameraReady\">\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    <button\n      [disabled]=\"!cameraReady\"\n      class=\"w-100-p\"\n      *ngIf=\"!preview\"\n      mat-raised-button\n      (click)=\"scan()\"\n    >\n      <ng-container>\n        <ng-container *ngIf=\"scanType === 'FRONT'\">{{\n          \"scandoc.captureFront\" | translate\n        }}</ng-container>\n        <ng-container *ngIf=\"scanType === 'BACK'\">{{\n          \"scandoc.captureBack\" | translate\n        }}</ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"scanSide === 1\">{{\n        \"pms.dialogs.components.scanProfile.captureBackOfId\" | translate\n      }}</ng-container>\n    </button>\n\n    <div\n      class=\"w-100-p\"\n      *ngIf=\"preview\"\n      style=\"display: flex; flex-direction: row; align-items: center; flex: 1\"\n    >\n      <button class=\"flex mr-4\" mat-raised-button (click)=\"retry()\">\n        {{ \"scandoc.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        class=\"ml-4 flex\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{ \"scandoc.continueWithSelectedImage\" | translate }}\n      </button>\n    </div>\n  </footer>\n</div>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}:host.mobile .buttonWrap div{font-size:11px!important}:host.mobile .scanBlastWraper .head{height:30px!important}:host.mobile .scanBlastWraper .head .title{font-size:12px!important}:host.mobile .scanBlastWraper .scanBlast{flex-direction:column}:host.mobile .scanBlastWraper mat-card{margin:4px!important}:host.mobile .scanBlastWraper .description{flex-direction:row!important}:host.mobile .scanBlastWraper .description .imgWrap{padding:0!important}:host.mobile .scanBlastWraper .description .btnActions{position:absolute;right:0}:host.mobile .scanBlastWraper .description button{margin:0!important;position:absolute;right:16px}:host.mobile .scanBlastWraper .description button.rotateButton{top:58px}:host.mobile .scanBlastWraper .description button.remButton{top:8px}:host.mobile .scanBlastWraper .description button mat-icon{margin:0!important}:host.mobile .scanBlastWraper .description button div.label{display:none}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}.debug{position:absolute;left:0;width:100%;height:80px;top:0;border-bottom:1px solid #ccc;background-color:#f8f8f8;display:flex;overflow:hidden;color:#000}.debug img{height:50px;border:1px solid #000}.displayInfo{text-align:center;height:20px;flex:1;position:absolute;width:100%;background-color:#000;height:30px;bottom:55px;left:0;line-height:30px;color:#fff;z-index:200}.element{margin-bottom:8px}.element label{font-size:14px}.element div{font-size:18px}.wraper{position:relative;overflow:hidden}.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;text-transform:uppercase}h4{font-size:16px}.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{overflow:hidden;display:flex;flex-direction:column;flex:1}.scanBlastWraper button{text-transform:uppercase;overflow:hidden}.scanBlastWraper .buttonWrap{display:flex;flex-direction:row;align-items:center;justify-content:center}.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}.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;display:flex;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}.result{display:flex;flex-direction:column}.result .wrap{overflow:auto;flex:1;display:flex;flex-direction:row}.result .wrap .panel{flex:1}.result .wrap form{display:flex;flex-direction:row;padding:0 16px;width:100%}.result .wrap form formly-form{flex:1}.flex{flex:1}\n"] }]
+        }], ctorParameters: () => [{ type: NgxScandocCameraProvider }, { type: i0.ChangeDetectorRef }, { type: LayoutProvider }, { type: i0.NgZone }], propDecorators: { action: [{
+                type: Output
+            }], wraper: [{
+                type: ViewChild,
+                args: ['wraper']
+            }], class: [{
+                type: HostBinding,
+                args: ['class.mobile']
+            }], onResize: [{
+                type: HostListener,
+                args: ['window:resize', ['$event']]
+            }] } });
 
-class NgxScandocFieldsProvider {
-    constructor(translate, provider) {
-        this.translate = translate;
-        this.provider = provider;
-        this.selfie$ = new Subject();
+class ScanComponent extends BaseComponent {
+    get class() {
+        return this.isMobile;
     }
-    update() {
-        return [
+    onResize() {
+        if (this.result) {
+            this.cd.detectChanges();
+        }
+    }
+    constructor(cd, zone, cameraProvider, injector, layoutProvider, platform, deviceService, auth) {
+        super();
+        this.cd = cd;
+        this.zone = zone;
+        this.cameraProvider = cameraProvider;
+        this.injector = injector;
+        this.layoutProvider = layoutProvider;
+        this.platform = platform;
+        this.deviceService = deviceService;
+        this.auth = auth;
+        this.scanBlastData = [
             {
-                fieldGroupClassName: 'px-16',
-                fieldGroup: [
-                    {
-                        wrappers: [],
-                        type: 'checkbox',
-                        key: 'profile',
-                        class: 'checkbox ',
-                        defaultValue: true,
-                        props: {
-                            label: 'scandoc.form.scan.document.update.profile',
-                        },
-                    },
-                    {
-                        wrappers: [],
-                        type: 'checkbox',
-                        class: 'checkbox ',
-                        key: 'document',
-                        defaultValue: true,
-                        props: {
-                            label: 'scandoc.form.scan.document.update.document',
-                        },
-                    },
-                    {
-                        wrappers: [],
-                        type: 'checkbox',
-                        class: 'checkbox ',
-                        key: 'attachment',
-                        defaultValue: true,
-                        props: {
-                            label: 'scandoc.form.scan.document.update.attachment',
-                        },
-                    },
-                ].map((item) => this.translate.forms(item)),
+                title: 'pms.dialogs.components.scanProfile.front',
+                description: 'pms.dialogs.components.scanProfile.frontDescription',
+                side: 'FRONT',
+            },
+            {
+                title: 'pms.dialogs.components.scanProfile.back',
+                description: 'pms.dialogs.components.scanProfile.backDescription',
+                disabled: true,
+                side: 'BACK',
             },
         ];
-    }
-    document() {
-        if (this.customFields) {
-            return this.customFields;
-        }
-        return [
-            {
-                className: 'w-100-p',
-                fieldGroupClassName: 'form-flex-row  profile-details',
-                fieldGroup: [
-                    {
-                        className: 'w-100-p ',
-                        fieldGroupClassName: 'card-group',
-                        fieldGroup: [
-                            {
-                                type: 'title',
-                                props: {
-                                    label: 'scandoc.form.scan.document.guestDetailsTitle',
-                                },
-                            },
-                            {
-                                type: 'profile-image',
-                                key: '_avatar',
-                                props: {
-                                    label: 'scandoc.form.scan.document.firstName',
-                                },
-                            },
-                            {
-                                type: 'input',
-                                key: 'firstName',
-                                className: 'small',
-                                props: {
-                                    label: 'scandoc.form.scan.document.firstName',
-                                    required: true,
-                                },
-                            },
-                            {
-                                type: 'input',
-                                key: 'lastName',
-                                className: 'small',
-                                props: {
-                                    label: 'scandoc.form.scan.document.lastName',
-                                    required: true,
-                                },
-                            },
-                            {
-                                className: 'small',
-                                key: 'secondName',
-                                type: 'input',
-                                props: {
-                                    label: 'scandoc.form.scan.document.secondLastName',
-                                },
-                                hideExpression: 'model.hideSecondLastName',
-                            },
-                            {
-                                type: 'input',
-                                key: 'middleName',
-                                className: 'small',
-                                props: {
-                                    label: 'scandoc.form.scan.document.middleName',
-                                },
-                            },
-                            {
-                                className: '',
-                                fieldGroupClassName: 'form-flex-row space-between',
-                                fieldGroup: [
-                                    {
-                                        type: 'datepicker',
-                                        key: 'birthDate',
-                                        className: 'w-100-p small mr-8',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.birthDate',
-                                        },
-                                    },
-                                    {
-                                        type: 'select',
-                                        key: 'gender',
-                                        className: 'w-100-p small ml-8',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.gender',
-                                            options: [
-                                                { value: 'MALE', label: 'MALE' },
-                                                { value: 'FEMALE', label: 'FEMALE' },
-                                                { value: 'NA', label: 'N/A' },
-                                            ],
-                                        },
-                                    },
-                                ],
-                            },
-                            {
-                                className: '',
-                                fieldGroupClassName: 'form-flex-row space-between',
-                                fieldGroup: [
-                                    {
-                                        type: 'input',
-                                        key: 'birthPlace',
-                                        className: 'small w-100-p mr-8',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.birthPlace',
-                                        },
-                                    },
-                                    {
-                                        type: 'select',
-                                        key: 'birthCountry',
-                                        className: 'small w-100-p ml-8',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.birthCountry',
-                                            options: this.provider.countries(),
-                                        },
-                                    },
-                                ],
-                            },
-                            {
-                                className: 'small',
-                                key: 'nationality',
-                                type: 'select',
-                                props: {
-                                    label: 'scandoc.form.scan.document.nationality',
-                                    //   appearance: 'outline',
-                                    //  options: this.profileProvider.nationalities(),
-                                    options: this.provider.countries(),
-                                },
-                            },
-                        ],
-                    },
-                    {
-                        className: 'w-100-p',
-                        fieldGroupClassName: 'form-flex-column',
-                        fieldGroup: [
-                            {
-                                className: 'w-100-p',
-                                fieldGroupClassName: 'card-group',
-                                fieldGroup: [
-                                    {
-                                        type: 'title',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.documentTitle',
-                                        },
-                                    },
-                                    {
-                                        type: 'select',
-                                        key: 'documentType',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.documentType',
-                                            options: [
-                                                { value: 'ID', label: 'Identity Document' },
-                                                { value: 'PASS', label: 'Passport' },
-                                                { value: 'DL', label: 'Driver Licence' },
-                                            ],
-                                            //  valueProp: 'id',
-                                            //  labelProp: 'value',
-                                            required: true,
-                                        },
-                                    },
-                                    {
-                                        type: 'input',
-                                        key: 'documentNumber',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.documentNumber',
-                                            required: true,
-                                        },
-                                    },
-                                    {
-                                        className: '',
-                                        fieldGroupClassName: 'form-flex-row space-between',
-                                        fieldGroup: [
-                                            {
-                                                type: 'datepicker',
-                                                key: 'issueDate',
-                                                className: 'small mr-8',
-                                                props: {
-                                                    label: 'scandoc.form.scan.document.issueDate',
-                                                },
-                                            },
-                                            {
-                                                type: 'datepicker',
-                                                key: 'expirationDate',
-                                                className: 'small ml-8',
-                                                props: {
-                                                    label: 'scandoc.form.scan.document.expirationDate',
-                                                },
-                                            },
-                                        ],
-                                    },
-                                    {
-                                        type: 'select',
-                                        key: 'issueStateCode',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.issuingStateCode',
-                                            options: this.provider.countries(),
-                                        },
-                                    },
-                                    {
-                                        type: 'input',
-                                        key: 'issuingPlace',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.issuingPlace',
-                                            required: false,
-                                        },
-                                    },
-                                ],
-                            },
-                            {
-                                className: 'w-100-p',
-                                fieldGroupClassName: 'card-group',
-                                fieldGroup: [
-                                    {
-                                        type: 'title',
-                                        props: {
-                                            label: 'scandoc.form.scan.document.addressTitle',
-                                            badge: 'communications',
-                                        },
-                                    },
-                                    {
-                                        className: 'small',
-                                        key: 'country',
-                                        type: 'select',
-                                        props: {
-                                            required: true,
-                                            label: 'scandoc.form.profile.address.country',
-                                            options: this.provider.countries(),
-                                        },
-                                        // expressionProperties: {
-                                        //   'props.disabled': (model: any) => !model.newAddress,
-                                        // },
-                                        hooks: {
-                                            onInit: (model) => {
-                                                console.log(model);
-                                            },
-                                        },
-                                    },
-                                    {
-                                        className: '',
-                                        fieldGroupClassName: 'form-flex-row space-between',
-                                        fieldGroup: [
-                                            {
-                                                className: 'mr-8 w-100-p',
-                                                key: 'zip',
-                                                type: 'input',
-                                                props: {
-                                                    label: 'scandoc.form.profile.address.zip',
-                                                    labelProp: (item) => {
-                                                        return `${item.zip} (${item.city})`;
-                                                    },
-                                                    set: (field, option) => {
-                                                        // console.log(option, field);
-                                                        field.formControl.setValue(option.value.zip);
-                                                        // set CITY
-                                                        field.form.get('city').setValue(option.value.city);
-                                                    },
-                                                    filter: (key, field) => {
-                                                        // return this.profileProvider.zipCodes({
-                                                        //   countryCode: field.form.get('country').value,
-                                                        //   zip: key,
-                                                        // });
-                                                    },
-                                                },
-                                                // expressionProperties: {
-                                                //   'props.disabled': (model: any) =>
-                                                //     !model.newAddress,
-                                                // },
-                                            },
-                                            {
-                                                className: 'small w-100-p ml-8',
-                                                key: 'city',
-                                                type: 'input',
-                                                props: {
-                                                    label: 'scandoc.form.profile.address.city',
-                                                },
-                                            },
-                                        ],
-                                    },
-                                    {
-                                        className: 'small w-100-p',
-                                        key: 'street1',
-                                        type: 'input',
-                                        props: {
-                                            label: 'scandoc.form.profile.address.street',
-                                        },
-                                    },
-                                ],
-                            },
-                        ],
-                    },
-                ],
-            },
-        ].map((item) => this.translate.forms(item));
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocFieldsProvider, deps: [{ token: NgxScanDocTranslationProvider }, { token: ScanProvider }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocFieldsProvider, providedIn: 'root' }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocFieldsProvider, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root',
-                }]
-        }], ctorParameters: () => [{ type: NgxScanDocTranslationProvider }, { type: ScanProvider }] });
-
-class ScanResultsComponent extends BaseComponent {
-    constructor(cameraProvider, formProvider, provider, cd, zone) {
-        super();
-        this.cameraProvider = cameraProvider;
-        this.formProvider = formProvider;
-        this.provider = provider;
-        this.cd = cd;
-        this.zone = zone;
-        this.action = new EventEmitter();
-    }
-    ngOnInit() {
-        console.time('fields');
-        this.fields = this.formProvider.document();
-        console.timeEnd('fields');
-        this.__subs(this.data).subscribe((resp) => {
-            this.zone.run(() => {
-                switch (resp.type) {
-                    case 'avatar':
-                        this.model._avatar = resp.data;
-                        this.form = new FormGroup({});
-                        console.log(this.model);
-                        break;
-                    case 'model':
-                        this.model = resp.data;
-                        break;
-                }
-                console.timeEnd('results');
-                this.cd.detectChanges();
-            });
-        });
-    }
-    ngOnDestroy() {
-        this.__destroy();
-    }
-    selfie() {
-        this.action.emit({ selfie: true });
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanResultsComponent, deps: [{ token: NgxScandocCameraProvider }, { token: NgxScandocFieldsProvider }, { token: ScanProvider }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ScanResultsComponent, isStandalone: false, selector: "ngx-scan-results", inputs: { data: "data", images: "images", form: "form" }, outputs: { action: "action" }, usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"model\" class=\"wraper\">\n  <div style=\"flex: 1\">\n\n\n    <form class=\"py-0 w-100-p\" [formGroup]=\"form\">\n      <formly-form fxFlex [form]=\"form\" [fields]=\"fields\" [model]=\"model\">\n      </formly-form>\n    </form>\n  </div>\n  <div style=\"flex: 1\" >\n    <mat-card appearance=\"outlined\" style=\"margin:0px 4px; padding: 16px\" class=\"images\">\n      <h3>{{ \"scandoc.result.images\" | translate }}</h3>\n      <ng-container *ngFor=\"let img of model.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-y:auto;overflow-x:hidden}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px;width:100%}.wraper{padding:4px;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: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i6.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i7.LegacyFormlyForm, selector: "formly-form" }, { kind: "directive", type: i5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanResultsComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ngx-scan-results', standalone: false, template: "<div *ngIf=\"model\" class=\"wraper\">\n  <div style=\"flex: 1\">\n\n\n    <form class=\"py-0 w-100-p\" [formGroup]=\"form\">\n      <formly-form fxFlex [form]=\"form\" [fields]=\"fields\" [model]=\"model\">\n      </formly-form>\n    </form>\n  </div>\n  <div style=\"flex: 1\" >\n    <mat-card appearance=\"outlined\" style=\"margin:0px 4px; padding: 16px\" class=\"images\">\n      <h3>{{ \"scandoc.result.images\" | translate }}</h3>\n      <ng-container *ngFor=\"let img of model.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-y:auto;overflow-x:hidden}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px;width:100%}.wraper{padding:4px;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: () => [{ type: NgxScandocCameraProvider }, { type: NgxScandocFieldsProvider }, { type: ScanProvider }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { data: [{
-                type: Input
-            }], images: [{
-                type: Input
-            }], form: [{
-                type: Input
-            }], action: [{
-                type: Output
-            }] } });
-
-class ManualScanComponent extends BaseComponent {
-    get class() {
-        return this.isMobile;
-    }
-    onResize() {
-        if (this.wraper) {
-            this.width = this.wraper.nativeElement.clientWidth;
-            this.height = this.wraper.nativeElement.clientHeight;
-            setTimeout(() => {
-                const video = this.wraper?.nativeElement.querySelector('video');
-                if (video) {
-                    //   console.log(video.clientWidth, video.clientHeight);
-                    this.videoWidth = video.clientWidth;
-                    this.videoHeight = video.clientHeight;
-                }
-                this.cd.detectChanges();
-            }, 100);
-            this.cd.detectChanges();
-        }
-    }
-    constructor(cameraProvider, cd, layoutProvider, zone) {
-        super();
-        this.cameraProvider = cameraProvider;
-        this.cd = cd;
-        this.layoutProvider = layoutProvider;
-        this.zone = zone;
-        this.action = new EventEmitter();
-        this.videoOptions = {
-            width: 1920,
-            height: 1080,
-            facingMode: 'environment',
-        };
-        this.cameraReady = false;
-        this.scanBlastData = [
-            {
-                title: 'scandoc.front',
-                description: 'scandoc.frontDescription',
-                side: 'FRONT',
-            },
-            {
-                title: 'scandoc.back',
-                description: 'scandoc.backDescription',
-                disabled: true,
-                side: 'BACK',
-            },
-        ];
-        this.error = false;
-        this.scaning = false;
-        this.documentTypeSelected = false;
-        this.preview = null;
-        this.scanDatas = [];
-        this.trigger = new Subject();
-        // switch to next / previous / specific webcam; true/false: forward/backwards, string: deviceId
-        this.nextWebcam = new Subject();
-        this.isMobile = false;
-    }
-    ngOnInit() {
-        this.__subs(this.layoutProvider.breakpoint$).subscribe((v) => {
-            this.zone.run(() => {
-                this.isMobile = !v.matches;
-                setTimeout(() => {
-                    console.log('WTF');
-                    this.cd.detectChanges();
-                }, 200);
-            });
-            console.log('MNOBILE', this.isMobile);
-        });
-    }
-    get nextWebcamObservable() {
-        return this.nextWebcam.asObservable();
-    }
-    cameraWasSwitched(deviceId) {
-        console.log('[active device]', deviceId);
-        // this.deviceId = deviceId;
-        // this.cameraReady = true;
-        // this.defaultDevice = deviceId;
-        setTimeout(() => {
-            this.onResize();
-            // this.scan();
-        }, 300);
-    }
-    handleInitError(error) {
-        console.log(error);
-    }
-    resolutionLimit(file) {
-        const minWidth = 1280;
-        const minHeight = 720;
-        return new Observable((observer) => {
-            const img = new Image();
-            img.src = window.URL.createObjectURL(file);
-            img.onload = () => {
-                const width = img.naturalWidth;
-                const height = img.naturalHeight;
-                let valid = false;
-                if (width > height) {
-                    valid = width >= minWidth && height >= minHeight;
-                }
-                else {
-                    valid = width >= minHeight && height >= minWidth;
-                }
-                observer.next(valid);
-            };
-            img.onerror = (error) => {
-                observer.error(error);
-            };
-        });
-    }
-    getImgBase64(num) {
-        return this.scanBlastData[num].image.dataUrl.split(',')[1];
-    }
-    getBase64(file) {
-        return new Observable((observer) => {
-            const reader = new FileReader();
-            reader.readAsDataURL(file);
-            reader.onload = () => {
-                observer.next(reader.result);
-            };
-            reader.onerror = (error) => {
-                observer.error(error);
-            };
-        });
-    }
-    handleFileInput(target, event, side) {
-        const files = target.files;
-        this.selectedSide = side;
-        console.log(files);
-        const file = files.item(0);
-        this.resolutionLimit(file)
-            .pipe(switchMap$1((valid) => {
-            return valid ? this.getBase64(file) : of(false);
-        }))
-            .subscribe((imageAsDataUrl) => {
-            // console.log(imageAsDataUrl);
-            event.target.value = null;
-            if (!imageAsDataUrl) {
-                console.warn('MIN RES');
-                // this.dialogs.alert(
-                //   'core.page.error',
-                //   this.translate.instant(
-                //     'pms.dialogs.components.scanProfile.minResolution'
-                //   )
-                // );
-            }
-            else {
-                side.image = {
-                    _imageAsDataUrl: imageAsDataUrl,
-                    imageAsDataUrl: imageAsDataUrl,
-                };
-                if (this.selectedSide.side === 'FRONT') {
-                    this.scanBlastData[1].disabled = false;
-                }
-            }
-            this.cd.detectChanges();
-        });
-    }
-    cameraOff(ev) { }
-    ngOnDestroy() { }
-    singleScan(side) {
-        this.scanType = side.side;
-        this.preview = null;
-        this.selectedSide = side;
-        this.selectedSide.image = null;
-        this.documentTypeSelected = true;
-        this.scanBlastData[1].disabled = false;
-        this.cameraProvider.$showSwitch.next(true);
-        this.cd.detectChanges();
-        setTimeout(() => {
-            this.onResize();
-        }, 10);
-    }
-    scanBlastFinish() {
-        this.action.emit(this.scanBlastData);
-    }
-    get scanBlastCanUpload() {
-        return this.scanBlastData[0].image ? true : false;
-    }
-    handleImage(webcamImage) {
-        console.log('[received webcam image]', webcamImage);
-        this.webcamImage = webcamImage;
-        this.preview = webcamImage.imageAsDataUrl;
-        this.cameraProvider.$showSwitch.next(false);
-        this.cd.detectChanges();
-    }
-    continue() {
-        this.documentTypeSelected = false;
-        setTimeout(() => {
-            this.selectedSide.image = this.webcamImage;
-            if (this.selectedSide.side === 'FRONT') {
-                this.scanBlastData[1].disabled = false;
-            }
-            this.cd.detectChanges();
-        }, 200);
-    }
-    retry() {
-        this.preview = false;
-        this.cameraProvider.$showSwitch.next(true);
-        // this.result = false;
-        if (this.error) {
-            this.documentTypeSelected = false;
-            this.scanBlastData.forEach((element) => {
-                element.image = null;
-            });
-        }
-        this.error = false;
-    }
-    triggerSnapshot() {
-        this.trigger.next(0);
-    }
-    scan() {
-        console.log('SCAN');
-        this.triggerSnapshot();
-        this.scanDatas[0] = true;
-        console.log(this.cameraProvider);
-        this.cd.detectChanges();
-    }
-    rotateBase64Image(base64data) {
-        return new Observable((observer) => {
-            const canvas = document.createElement('canvas');
-            const ctx = canvas.getContext('2d');
-            var image = new Image();
-            image.src = base64data;
-            image.onload = () => {
-                console.log(canvas);
-                canvas.width = image.height;
-                canvas.height = image.width;
-                if (ctx) {
-                    ctx.rotate((90 * Math.PI) / 180);
-                    ctx.translate(0, -canvas.width);
-                    ctx.drawImage(image, 0, 0);
-                    observer.next(canvas.toDataURL());
-                }
-                else {
-                    observer.error({ type: 'generic error' });
-                }
-            };
-            image.onerror = (e) => {
-                observer.error(e);
-            };
-        });
-    }
-    singleScanRotate(side) {
-        console.log(side);
-        this.rotateBase64Image(side.image.imageAsDataUrl).subscribe((data) => {
-            side.image = { imageAsDataUrl: data };
-            this.cd.detectChanges();
-        });
-    }
-    videoReady(event) {
-        console.log('READY', event);
-        this.cameraReady = event;
-    }
-    singleScanRemove(side) {
-        side.image = null;
-        if (side.side === 'FRONT') {
-            this.scanBlastData[1].disabled = true;
-        }
-        this.cd.detectChanges();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ManualScanComponent, deps: [{ token: NgxScandocCameraProvider }, { token: i0.ChangeDetectorRef }, { token: LayoutProvider }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ManualScanComponent, isStandalone: false, selector: "ngx-manual-scan", outputs: { action: "action" }, 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: "\n\n<ng-container *ngIf=\"!result\">\n\n<ng-container *ngIf=\"!documentTypeSelected\">\n  <section\n    class=\"scanBlastWraper\"\n    ngClass.lt-md=\"mobile\"\n    fxFlex\n    fxLayout=\"column\"\n  >\n    <div class=\"scanBlast\" fxFlex fxLayout.lt-md=\"column\" fxLayout=\"row\">\n      <mat-card\n        appearance=\"outlined\"\n        style=\"display: flex; flex-direction: column\"\n        fxLayout=\"column\"\n        *ngFor=\"let side of scanBlastData\"\n      >\n        <div ngClass.lt-sm=\"small\" class=\"head\">\n          <div class=\"title\" fxFlex>{{ side.title | translate }}</div>\n        </div>\n        <div class=\"actions\" style=\"display: flex; flex-direction: row\">\n          <button\n            (click)=\"singleScan(side)\"\n            [disabled]=\"side.disabled\"\n            style=\"margin-right: 4px\"\n            mat-raised-button\n          >\n            <div class=\"buttonWrap\">\n              <mat-icon>camera</mat-icon>\n              <div>\n                {{ \"scandoc.scanCamera\" | translate }}\n              </div>\n            </div>\n          </button>\n          <button\n            (click)=\"file.click()\"\n            [disabled]=\"side.disabled\"\n            style=\"margin-left: 4px\"\n            mat-raised-button\n          >\n            <input\n              accept=\"image/*\"\n              type=\"file\"\n              style=\"display: none\"\n              (change)=\"handleFileInput($event.target, $event, side)\"\n              #file\n            />\n            <div class=\"buttonWrap\">\n              <mat-icon>file_upload</mat-icon>\n              <div>\n                {{ \"scandoc.useFromDisk\" | translate }}\n              </div>\n            </div>\n          </button>\n        </div>\n        <div class=\"content\" style=\"display: flex\">\n          <div style=\"flex: 1\" class=\"previewPlaceholder\">\n            <div class=\"description\">\n              <ng-container *ngIf=\"side.image\">\n                <div class=\"imgWrap\">\n                  <div\n                    style=\"flex: 1\"\n                    class=\"image\"\n                    [style.background-image]=\"\n                      'url(' + side.image.imageAsDataUrl + ')'\n                    \"\n                  ></div>\n\n                  <div\n                    class=\"btnActions\"\n                    fxLayout.lt-md=\"column\"\n                    fxLayout=\"row\"\n                    style=\"display: flex; flex-direction: row\"\n                  >\n                    <button\n                      (click)=\"singleScanRemove(side)\"\n                      class=\"mr-4 remButton flex\"\n                      mat-raised-button\n                    >\n                      <div class=\"buttonWrap\">\n                        <mat-icon>delete</mat-icon>\n                        <div class=\"label\">\n                          {{ \"scandoc.remove\" | translate }}\n                        </div>\n                      </div>\n                    </button>\n                    <button\n                      class=\"ml-4 rotateButton flex\"\n                      mat-raised-button\n                      (click)=\"singleScanRotate(side)\"\n                    >\n                      <div class=\"buttonWrap\">\n                        <mat-icon>rotate_90_degrees_cw</mat-icon>\n                        <div class=\"label\">\n                          {{ \"scandoc.rotate\" | translate }}\n                        </div>\n                      </div>\n                    </button>\n                  </div>\n                </div>\n              </ng-container>\n\n              <ng-container *ngIf=\"!side.image\">\n                <div class=\"empty\">\n                  {{ side.description | translate }}\n                </div>\n              </ng-container>\n            </div>\n          </div>\n        </div>\n      </mat-card>\n    </div>\n    <footer>\n      <div\n        class=\"px-8 pb-8\"\n        style=\"padding: 0px 8px 8px 8px; display: flex; flex-direction: row\"\n      >\n        <button\n          (click)=\"scanBlastFinish()\"\n          [disabled]=\"!scanBlastCanUpload\"\n          style=\"flex: 1\"\n          mat-raised-button\n        >\n          {{ \"scandoc.upload\" | translate }}\n        </button>\n      </div>\n    </footer>\n  </section>\n</ng-container>\n\n<div\n  style=\"position: relative; display: flex; flex-direction: column; flex: 1\"\n  *ngIf=\"documentTypeSelected\"\n>\n  <div\n    style=\"display: flex; flex-direction: row; flex: 1\"\n    #wraper\n    class=\"wraper\"\n  >\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      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main flex\"\n\n        #webcam\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n(videoReady)=\"videoReady($event)\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        type=\"manual\"\n\n        (destroyed)=\"cameraOff($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"\n        display: flex;\n        flex-direction: row;\n        flex: 1;\n        z-index: 20;\n        position: absolute;\n        width: 100%;\n        height: 100%;\n      \"\n    >\n      <div class=\"p-16 error\" *ngIf=\"error\">\n        <div>\n          <div class=\"title\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n            <mat-icon>error_outline</mat-icon\n            ><span class=\"ml-8\">{{\n              \"pms.dialogs.components.scanProfile.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ul>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.placeIdCloseToDevice\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.ensureSufficientLight\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.holdDocumentSteady\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureAllEdgesOfTheIdAreVisible\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureThereAreNoGlareAndShadowsOnTheId\"\n                  | translate\n              }}\n            </li>\n          </ul>\n        </div>\n      </div>\n\n      <div\n        class=\"scanPreview\"\n        style=\"display: flex; flex-direction: column; flex: 1\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <!-- <div class=\"py-16\" style=\"font-size: 16px\">\n          {{\n            \"pms.dialogs.components.scanProfile.ensureAllTextsAreVisible\"\n              | translate\n          }}\n        </div> -->\n        <div\n          style=\"flex: 1\"\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer fxLayout=\"row\" class=\"p-8\">\n    <!-- <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      {{ displayInfo }}\n    </div>\n    <div style=\"height: 26px;\">\n    <div style=\"text-align: center; font-size: 18px;\" *ngIf=\"idScan && !preview && cameraReady\">\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    <button\n      [disabled]=\"!cameraReady\"\n      class=\"w-100-p\"\n      *ngIf=\"!preview\"\n      mat-raised-button\n      (click)=\"scan()\"\n    >\n      <ng-container>\n        <ng-container *ngIf=\"scanType === 'FRONT'\">{{\n          \"scandoc.captureFront\" | translate\n        }}</ng-container>\n        <ng-container *ngIf=\"scanType === 'BACK'\">{{\n          \"scandoc.captureBack\" | translate\n        }}</ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"scanSide === 1\">{{\n        \"pms.dialogs.components.scanProfile.captureBackOfId\" | translate\n      }}</ng-container>\n    </button>\n\n    <div\n      class=\"w-100-p\"\n      *ngIf=\"preview\"\n      style=\"display: flex; flex-direction: row; align-items: center; flex: 1\"\n    >\n      <button class=\"flex mr-4\" mat-raised-button (click)=\"retry()\">\n        {{ \"scandoc.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        class=\"ml-4 flex\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{ \"scandoc.continueWithSelectedImage\" | translate }}\n      </button>\n    </div>\n  </footer>\n</div>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}:host.mobile .buttonWrap div{font-size:11px!important}:host.mobile .scanBlastWraper .head{height:30px!important}:host.mobile .scanBlastWraper .head .title{font-size:12px!important}:host.mobile .scanBlastWraper .scanBlast{flex-direction:column}:host.mobile .scanBlastWraper mat-card{margin:4px!important}:host.mobile .scanBlastWraper .description{flex-direction:row!important}:host.mobile .scanBlastWraper .description .imgWrap{padding:0!important}:host.mobile .scanBlastWraper .description .btnActions{position:absolute;right:0}:host.mobile .scanBlastWraper .description button{margin:0!important;position:absolute;right:16px}:host.mobile .scanBlastWraper .description button.rotateButton{top:58px}:host.mobile .scanBlastWraper .description button.remButton{top:8px}:host.mobile .scanBlastWraper .description button mat-icon{margin:0!important}:host.mobile .scanBlastWraper .description button div.label{display:none}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}.debug{position:absolute;left:0;width:100%;height:80px;top:0;border-bottom:1px solid #ccc;background-color:#f8f8f8;display:flex;overflow:hidden;color:#000}.debug img{height:50px;border:1px solid #000}.displayInfo{text-align:center;height:20px;flex:1;position:absolute;width:100%;background-color:#000;height:30px;bottom:55px;left:0;line-height:30px;color:#fff;z-index:200}.element{margin-bottom:8px}.element label{font-size:14px}.element div{font-size:18px}.wraper{position:relative;overflow:hidden}.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;text-transform:uppercase}h4{font-size:16px}.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{overflow:hidden;display:flex;flex-direction:column;flex:1}.scanBlastWraper button{text-transform:uppercase;overflow:hidden}.scanBlastWraper .buttonWrap{display:flex;flex-direction:row;align-items:center;justify-content:center}.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}.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;display:flex;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}.result{display:flex;flex-direction:column}.result .wrap{overflow:auto;flex:1;display:flex;flex-direction:row}.result .wrap .panel{flex:1}.result .wrap form{display:flex;flex-direction:row;padding:0 16px;width:100%}.result .wrap form formly-form{flex:1}.flex{flex:1}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "type", "trigger", "refresh"], outputs: ["cameraSwitched", "videoReady", "imageCapture", "initError"] }, { kind: "component", type: i6.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ManualScanComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'ngx-manual-scan', standalone: false, template: "\n\n<ng-container *ngIf=\"!result\">\n\n<ng-container *ngIf=\"!documentTypeSelected\">\n  <section\n    class=\"scanBlastWraper\"\n    ngClass.lt-md=\"mobile\"\n    fxFlex\n    fxLayout=\"column\"\n  >\n    <div class=\"scanBlast\" fxFlex fxLayout.lt-md=\"column\" fxLayout=\"row\">\n      <mat-card\n        appearance=\"outlined\"\n        style=\"display: flex; flex-direction: column\"\n        fxLayout=\"column\"\n        *ngFor=\"let side of scanBlastData\"\n      >\n        <div ngClass.lt-sm=\"small\" class=\"head\">\n          <div class=\"title\" fxFlex>{{ side.title | translate }}</div>\n        </div>\n        <div class=\"actions\" style=\"display: flex; flex-direction: row\">\n          <button\n            (click)=\"singleScan(side)\"\n            [disabled]=\"side.disabled\"\n            style=\"margin-right: 4px\"\n            mat-raised-button\n          >\n            <div class=\"buttonWrap\">\n              <mat-icon>camera</mat-icon>\n              <div>\n                {{ \"scandoc.scanCamera\" | translate }}\n              </div>\n            </div>\n          </button>\n          <button\n            (click)=\"file.click()\"\n            [disabled]=\"side.disabled\"\n            style=\"margin-left: 4px\"\n            mat-raised-button\n          >\n            <input\n              accept=\"image/*\"\n              type=\"file\"\n              style=\"display: none\"\n              (change)=\"handleFileInput($event.target, $event, side)\"\n              #file\n            />\n            <div class=\"buttonWrap\">\n              <mat-icon>file_upload</mat-icon>\n              <div>\n                {{ \"scandoc.useFromDisk\" | translate }}\n              </div>\n            </div>\n          </button>\n        </div>\n        <div class=\"content\" style=\"display: flex\">\n          <div style=\"flex: 1\" class=\"previewPlaceholder\">\n            <div class=\"description\">\n              <ng-container *ngIf=\"side.image\">\n                <div class=\"imgWrap\">\n                  <div\n                    style=\"flex: 1\"\n                    class=\"image\"\n                    [style.background-image]=\"\n                      'url(' + side.image.imageAsDataUrl + ')'\n                    \"\n                  ></div>\n\n                  <div\n                    class=\"btnActions\"\n                    fxLayout.lt-md=\"column\"\n                    fxLayout=\"row\"\n                    style=\"display: flex; flex-direction: row\"\n                  >\n                    <button\n                      (click)=\"singleScanRemove(side)\"\n                      class=\"mr-4 remButton flex\"\n                      mat-raised-button\n                    >\n                      <div class=\"buttonWrap\">\n                        <mat-icon>delete</mat-icon>\n                        <div class=\"label\">\n                          {{ \"scandoc.remove\" | translate }}\n                        </div>\n                      </div>\n                    </button>\n                    <button\n                      class=\"ml-4 rotateButton flex\"\n                      mat-raised-button\n                      (click)=\"singleScanRotate(side)\"\n                    >\n                      <div class=\"buttonWrap\">\n                        <mat-icon>rotate_90_degrees_cw</mat-icon>\n                        <div class=\"label\">\n                          {{ \"scandoc.rotate\" | translate }}\n                        </div>\n                      </div>\n                    </button>\n                  </div>\n                </div>\n              </ng-container>\n\n              <ng-container *ngIf=\"!side.image\">\n                <div class=\"empty\">\n                  {{ side.description | translate }}\n                </div>\n              </ng-container>\n            </div>\n          </div>\n        </div>\n      </mat-card>\n    </div>\n    <footer>\n      <div\n        class=\"px-8 pb-8\"\n        style=\"padding: 0px 8px 8px 8px; display: flex; flex-direction: row\"\n      >\n        <button\n          (click)=\"scanBlastFinish()\"\n          [disabled]=\"!scanBlastCanUpload\"\n          style=\"flex: 1\"\n          mat-raised-button\n        >\n          {{ \"scandoc.upload\" | translate }}\n        </button>\n      </div>\n    </footer>\n  </section>\n</ng-container>\n\n<div\n  style=\"position: relative; display: flex; flex-direction: column; flex: 1\"\n  *ngIf=\"documentTypeSelected\"\n>\n  <div\n    style=\"display: flex; flex-direction: row; flex: 1\"\n    #wraper\n    class=\"wraper\"\n  >\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      <ngx-scandoc-webcam\n        *ngIf=\"!preview && !scaning\"\n        class=\"main flex\"\n\n        #webcam\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n(videoReady)=\"videoReady($event)\"\n        (cameraSwitched)=\"cameraWasSwitched($event)\"\n        (initError)=\"handleInitError($event)\"\n        type=\"manual\"\n\n        (destroyed)=\"cameraOff($event)\"\n      >\n      </ngx-scandoc-webcam>\n    </ng-container>\n    <div\n      class=\"previewData\"\n      *ngIf=\"preview\"\n      style=\"\n        display: flex;\n        flex-direction: row;\n        flex: 1;\n        z-index: 20;\n        position: absolute;\n        width: 100%;\n        height: 100%;\n      \"\n    >\n      <div class=\"p-16 error\" *ngIf=\"error\">\n        <div>\n          <div class=\"title\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\n            <mat-icon>error_outline</mat-icon\n            ><span class=\"ml-8\">{{\n              \"pms.dialogs.components.scanProfile.unableToDetectId\" | translate\n            }}</span>\n          </div>\n\n          <ul>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.placeIdCloseToDevice\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.ensureSufficientLight\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.holdDocumentSteady\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureAllEdgesOfTheIdAreVisible\"\n                  | translate\n              }}\n            </li>\n            <li>\n              {{\n                \"pms.dialogs.components.scanProfile.makeSureThereAreNoGlareAndShadowsOnTheId\"\n                  | translate\n              }}\n            </li>\n          </ul>\n        </div>\n      </div>\n\n      <div\n        class=\"scanPreview\"\n        style=\"display: flex; flex-direction: column; flex: 1\"\n        *ngIf=\"!error && !scaning\"\n      >\n        <!-- <div class=\"py-16\" style=\"font-size: 16px\">\n          {{\n            \"pms.dialogs.components.scanProfile.ensureAllTextsAreVisible\"\n              | translate\n          }}\n        </div> -->\n        <div\n          style=\"flex: 1\"\n          class=\"image\"\n          [style.background-image]=\"'url(' + preview + ')'\"\n        ></div>\n      </div>\n    </div>\n  </div>\n\n  <footer fxLayout=\"row\" class=\"p-8\">\n    <!-- <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      {{ displayInfo }}\n    </div>\n    <div style=\"height: 26px;\">\n    <div style=\"text-align: center; font-size: 18px;\" *ngIf=\"idScan && !preview && cameraReady\">\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    <button\n      [disabled]=\"!cameraReady\"\n      class=\"w-100-p\"\n      *ngIf=\"!preview\"\n      mat-raised-button\n      (click)=\"scan()\"\n    >\n      <ng-container>\n        <ng-container *ngIf=\"scanType === 'FRONT'\">{{\n          \"scandoc.captureFront\" | translate\n        }}</ng-container>\n        <ng-container *ngIf=\"scanType === 'BACK'\">{{\n          \"scandoc.captureBack\" | translate\n        }}</ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"scanSide === 1\">{{\n        \"pms.dialogs.components.scanProfile.captureBackOfId\" | translate\n      }}</ng-container>\n    </button>\n\n    <div\n      class=\"w-100-p\"\n      *ngIf=\"preview\"\n      style=\"display: flex; flex-direction: row; align-items: center; flex: 1\"\n    >\n      <button class=\"flex mr-4\" mat-raised-button (click)=\"retry()\">\n        {{ \"scandoc.retry\" | translate }}\n      </button>\n\n      <button\n        [disabled]=\"error\"\n        class=\"ml-4 flex\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{ \"scandoc.continueWithSelectedImage\" | translate }}\n      </button>\n    </div>\n  </footer>\n</div>\n</ng-container>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}:host.mobile .buttonWrap div{font-size:11px!important}:host.mobile .scanBlastWraper .head{height:30px!important}:host.mobile .scanBlastWraper .head .title{font-size:12px!important}:host.mobile .scanBlastWraper .scanBlast{flex-direction:column}:host.mobile .scanBlastWraper mat-card{margin:4px!important}:host.mobile .scanBlastWraper .description{flex-direction:row!important}:host.mobile .scanBlastWraper .description .imgWrap{padding:0!important}:host.mobile .scanBlastWraper .description .btnActions{position:absolute;right:0}:host.mobile .scanBlastWraper .description button{margin:0!important;position:absolute;right:16px}:host.mobile .scanBlastWraper .description button.rotateButton{top:58px}:host.mobile .scanBlastWraper .description button.remButton{top:8px}:host.mobile .scanBlastWraper .description button mat-icon{margin:0!important}:host.mobile .scanBlastWraper .description button div.label{display:none}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}.debug{position:absolute;left:0;width:100%;height:80px;top:0;border-bottom:1px solid #ccc;background-color:#f8f8f8;display:flex;overflow:hidden;color:#000}.debug img{height:50px;border:1px solid #000}.displayInfo{text-align:center;height:20px;flex:1;position:absolute;width:100%;background-color:#000;height:30px;bottom:55px;left:0;line-height:30px;color:#fff;z-index:200}.element{margin-bottom:8px}.element label{font-size:14px}.element div{font-size:18px}.wraper{position:relative;overflow:hidden}.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;text-transform:uppercase}h4{font-size:16px}.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{overflow:hidden;display:flex;flex-direction:column;flex:1}.scanBlastWraper button{text-transform:uppercase;overflow:hidden}.scanBlastWraper .buttonWrap{display:flex;flex-direction:row;align-items:center;justify-content:center}.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}.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;display:flex;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}.result{display:flex;flex-direction:column}.result .wrap{overflow:auto;flex:1;display:flex;flex-direction:row}.result .wrap .panel{flex:1}.result .wrap form{display:flex;flex-direction:row;padding:0 16px;width:100%}.result .wrap form formly-form{flex:1}.flex{flex:1}\n"] }]
-        }], ctorParameters: () => [{ type: NgxScandocCameraProvider }, { type: i0.ChangeDetectorRef }, { type: LayoutProvider }, { type: i0.NgZone }], propDecorators: { action: [{
-                type: Output
-            }], wraper: [{
-                type: ViewChild,
-                args: ['wraper']
-            }], class: [{
-                type: HostBinding,
-                args: ['class.mobile']
-            }], onResize: [{
-                type: HostListener,
-                args: ['window:resize', ['$event']]
-            }] } });
-
-class ScanComponent extends BaseComponent {
-    get class() {
-        return this.isMobile;
-    }
-    onResize() {
-        if (this.result) {
-            this.cd.detectChanges();
-        }
-    }
-    constructor(cd, zone, cameraProvider, injector, layoutProvider, platform, deviceService, auth) {
-        super();
-        this.cd = cd;
-        this.zone = zone;
-        this.cameraProvider = cameraProvider;
-        this.injector = injector;
-        this.layoutProvider = layoutProvider;
-        this.platform = platform;
-        this.deviceService = deviceService;
-        this.auth = auth;
-        this.scanBlastData = [
-            {
-                title: 'pms.dialogs.components.scanProfile.front',
-                description: 'pms.dialogs.components.scanProfile.frontDescription',
-                side: 'FRONT',
-            },
-            {
-                title: 'pms.dialogs.components.scanProfile.back',
-                description: 'pms.dialogs.components.scanProfile.backDescription',
-                disabled: true,
-                side: 'BACK',
-            },
-        ];
-        this.type = 'desktop';
-        this.actions = new EventEmitter();
-        this.scanResults = new Subject();
-        this.scanSecondSide = false;
-        this.startTime = 0;
-        this.scanInProgress = false;
-        // webcam snapshot trigger
-        this.documentTypeSelected = false;
-        this.preview = null;
-        this.errorCode = '1000';
-        this.displayInfo = 'scandoc.info.position';
-        this.verificationErrorSent = false;
-        this.error = false;
-        this.cameraReady = false;
-        this.scaning = false;
-        this.promptManual = false;
-        this.imageHandler = new Subject();
-        this.manualDataSet = false;
-        this.logData = {
-            AcceptTermsAndConditions: true,
-            Request: null,
-            Response: null,
-            ExpectedOutput: null,
-        };
-        this.scanDatas = [];
-        this.idScan = null;
-        this.validation = false;
-        this.scannedImages = [];
-        this.scanDelay = 0;
-        this.trigger = new Subject();
-        // switch to next / previous / specific webcam; true/false: forward/backwards, string: deviceId
-        this.nextWebcam = new Subject();
-        this.imageVerified = false;
-        this.form = new FormGroup({});
-        this.manual = false;
-        this.isMobile = this.platform.IOS || this.platform.ANDROID;
-        this.showDialog = false;
-        this.scanImageTimestamps = {
-            time: 0,
-            load: 0,
-        };
-        this.numberOfValidations = 0;
-        this.validationDebug = [];
-        this.blurValues = [];
-        this.scanProvider = this.injector.get(ScanProvider);
-        if (!this.scanProvider.config.development) {
-            // console = {
-            //   log: (...args: any) => {},
-            //   time: (...args: any) => {},
-            //   timeEnd: (...args: any) => {},
-            //   warn: (...args: any) => {},
-            //   error: (...args: any) => {},
-            // };
+        this.type = 'desktop';
+        this.actions = new EventEmitter();
+        this.scanResults = new Subject();
+        this.scanSecondSide = false;
+        this.startTime = 0;
+        this.scanInProgress = false;
+        // webcam snapshot trigger
+        this.documentTypeSelected = false;
+        this.preview = null;
+        this.errorCode = '1000';
+        this.displayInfo = 'scandoc.info.position';
+        this.verificationErrorSent = false;
+        this.error = false;
+        this.cameraReady = false;
+        this.scaning = false;
+        this.promptManual = false;
+        this.imageHandler = new Subject();
+        this.manualDataSet = false;
+        this.logData = {
+            AcceptTermsAndConditions: true,
+            Request: null,
+            Response: null,
+            ExpectedOutput: null,
+        };
+        this.scanDatas = [];
+        this.idScan = null;
+        this.validation = false;
+        this.scannedImages = [];
+        this.scanDelay = 0;
+        this.trigger = new Subject();
+        // switch to next / previous / specific webcam; true/false: forward/backwards, string: deviceId
+        this.nextWebcam = new Subject();
+        this.imageVerified = false;
+        this.form = new FormGroup({});
+        this.manual = false;
+        this.isMobile = this.platform.IOS || this.platform.ANDROID;
+        this.showDialog = false;
+        this.scanImageTimestamps = {
+            time: 0,
+            load: 0,
+        };
+        this.numberOfValidations = 0;
+        this.validationDebug = [];
+        this.blurValues = [];
+        this.scanProvider = this.injector.get(ScanProvider);
+        if (!this.scanProvider.config.development) {
+            // console = {
+            //   log: (...args: any) => {},
+            //   time: (...args: any) => {},
+            //   timeEnd: (...args: any) => {},
+            //   warn: (...args: any) => {},
+            //   error: (...args: any) => {},
+            // };
         }
     }
     resetLogData() {
@@ -3136,11 +2613,11 @@ class ScanComponent extends BaseComponent {
         this.__destroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: NgxScandocCameraProvider }, { token: i0.Injector }, { token: LayoutProvider }, { token: i2.Platform }, { token: i4$2.DeviceDetectorService }, { token: NgxScandocAuthProvider }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ScanComponent, isStandalone: false, selector: "ngx-scan", inputs: { type: "type", dialogs: "dialogs", refresh: "refresh", showDialog: "showDialog" }, outputs: { actions: "actions" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class.mobile": "this.class" } }, usesInheritance: true, ngImport: i0, template: "<ng-container\n  *ngIf=\"cameraProvider.rectPosition.t > 0 && displayInfo && !result && !manual\"\n>\n  <div class=\"hint\" [ngStyle]=\"{ top: cameraProvider.hintPosition + 'px' }\">\n    <span class=\"text\">\n      {{ displayInfo | translate }}\n    </span>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"showDialog\">\n  <div class=\"pageTurn\">\n    <div class=\"content\">\n      <div class=\"inner\">\n        <mat-icon>360</mat-icon>\n        <div class=\"text\">\n          <ng-container *ngIf=\"idScan === 'BACK'\">\n            {{ \"scandoc.turnAndCapture.back\" | translate }}\n          </ng-container>\n          <ng-container *ngIf=\"idScan === 'FRONT'\">\n            {{ \"scandoc.turnAndCapture.front\" | translate }}\n          </ng-container>\n        </div>\n      </div>\n      <footer>\n        <button (click)=\"closeDialog()\" mat-raised-button>Ok</button>\n      </footer>\n    </div>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"promptManual\">\n  <div class=\"manualMode\">\n    <div class=\"content\">\n      <div class=\"inner\">\n        <mat-icon>screenshot</mat-icon>\n        <div class=\"text\">\n          {{ \"scandoc.manual\" | translate }}\n        </div>\n      </div>\n      <footer>\n        <button\n          style=\"margin-right: 8px\"\n          (click)=\"manualSet(true)\"\n          mat-raised-button\n        >\n          {{ \"scandoc.yes\" | translate }}\n        </button>\n        <button\n          style=\"margin-left: 8px\"\n          (click)=\"manualSet(false)\"\n          mat-raised-button\n        >\n          {{ \"scandoc.no\" | translate }}\n        </button>\n      </footer>\n    </div>\n  </div>\n</ng-container>\n<ng-container *ngIf=\"result\">\n  <section>\n    <ngx-scan-results\n      (action)=\"selfie()\"\n      [form]=\"form\"\n      [data]=\"scanResults\"\n    ></ngx-scan-results>\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</ng-container>\n\n<ng-container *ngIf=\"manual\">\n  <section>\n    <ngx-manual-scan (action)=\"manualScanData($event)\"></ngx-manual-scan>\n  </section>\n</ng-container>\n<ng-container *ngIf=\"!result && documentTypeSelected && !manual\">\n  <section>\n    <div #wraper class=\"wraper\">\n      <div class=\"loading\" *ngIf=\"(!cameraReady && !preview) || scaning\">\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          #webcam\n          type=\"document\"\n          [trigger]=\"trigger\"\n          [imageHandler]=\"imageHandler\"\n          (imageCapture)=\"handleImage($event)\"\n          (initError)=\"handleInitError($event)\"\n          (destroyed)=\"cameraOff($event)\"\n          (videoReady)=\"videoReady($event)\"\n          [refresh]=\"refresh\"\n        >\n        </ngx-scandoc-webcam>\n      </ng-container>\n      <div\n        class=\"previewData\"\n        *ngIf=\"preview\"\n        style=\"\n          z-index: 20;\n          display: flex;\n          position: absolute;\n          width: 100%;\n          height: 100%;\n        \"\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 *ngIf=\"preview\">\n      <!-- <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      <ng-container *ngIf=\"displayInfo\">\n        {{ displayInfo | translate }}\n      </ng-container>\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</ng-container>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden;position:relative}:host.mobile .hint{font-size:13px}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}.manualMode{position:absolute;width:100%;height:100%;z-index:200;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.manualMode .content{margin-top:20px;background-color:#fff;border-radius:6px;max-width:300px;width:100%;display:flex;flex-direction:column;padding:30px 20px 0}.manualMode .inner{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:14px}.manualMode .inner mat-icon{width:60px;height:60px;font-size:60px}.manualMode .inner .text{margin:20px 0}.manualMode footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}.manualMode footer button{min-width:140px;box-shadow:none;border:1px solid #ccc}.pageTurn{position:absolute;width:100%;height:100%;z-index:200;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.pageTurn .content{background-color:#fff;border-radius:6px;max-width:300px;width:100%;display:flex;flex-direction:column;padding:30px 20px 0}.pageTurn .inner{display:flex;flex-direction:column;align-items:center;justify-content:center}.pageTurn .inner mat-icon{width:60px;height:60px;font-size:60px}.pageTurn .inner .text{margin:20px 0;font-size:14px}.pageTurn footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}.pageTurn footer button{min-width:200px;box-shadow:none;border:1px solid #ccc}.hint{position:absolute;z-index:5;font-size:18px;line-height:18px;display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%}.hint .text{border-radius:3px;padding:4px 8px;background-color:#000;color:#fff;text-align:center;display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "type", "trigger", "refresh"], outputs: ["cameraSwitched", "videoReady", "imageCapture", "initError"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: ScanResultsComponent, selector: "ngx-scan-results", inputs: ["data", "images", "form"], outputs: ["action"] }, { kind: "component", type: ManualScanComponent, selector: "ngx-manual-scan", outputs: ["action"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ScanComponent, isStandalone: false, selector: "ngx-scan", inputs: { type: "type", dialogs: "dialogs", refresh: "refresh", showDialog: "showDialog" }, outputs: { actions: "actions" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class.mobile": "this.class" } }, usesInheritance: true, ngImport: i0, template: "<ng-container\n  *ngIf=\"cameraProvider.rectPosition.t > 0 && displayInfo && !result && !manual\"\n>\n  <div class=\"hint\" [ngStyle]=\"{ top: cameraProvider.hintPosition + 'px' }\">\n    <span class=\"text\">\n      {{ displayInfo | translate }}\n    </span>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"showDialog\">\n  <div class=\"pageTurn\">\n    <div class=\"content\">\n      <div class=\"inner\">\n        <mat-icon>360</mat-icon>\n        <div class=\"text\">\n          <ng-container *ngIf=\"idScan === 'BACK'\">\n            {{ \"scandoc.turnAndCapture.back\" | translate }}\n          </ng-container>\n          <ng-container *ngIf=\"idScan === 'FRONT'\">\n            {{ \"scandoc.turnAndCapture.front\" | translate }}\n          </ng-container>\n        </div>\n      </div>\n      <footer>\n        <button (click)=\"closeDialog()\" mat-raised-button>Ok</button>\n      </footer>\n    </div>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"promptManual\">\n  <div class=\"manualMode\">\n    <div class=\"content\">\n      <div class=\"inner\">\n        <mat-icon>screenshot</mat-icon>\n        <div class=\"text\">\n          {{ \"scandoc.manual\" | translate }}\n        </div>\n      </div>\n      <footer>\n        <button\n          style=\"margin-right: 8px\"\n          (click)=\"manualSet(true)\"\n          mat-raised-button\n        >\n          {{ \"scandoc.yes\" | translate }}\n        </button>\n        <button\n          style=\"margin-left: 8px\"\n          (click)=\"manualSet(false)\"\n          mat-raised-button\n        >\n          {{ \"scandoc.no\" | translate }}\n        </button>\n      </footer>\n    </div>\n  </div>\n</ng-container>\n<ng-container *ngIf=\"result\">\n  <section>\n    <!-- <ngx-scan-results\n      (action)=\"selfie()\"\n      [form]=\"form\"\n      [data]=\"scanResults\"\n    ></ngx-scan-results> -->\n\n    hum\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</ng-container>\n\n<ng-container *ngIf=\"manual\">\n  <section>\n    <ngx-manual-scan (action)=\"manualScanData($event)\"></ngx-manual-scan>\n  </section>\n</ng-container>\n<ng-container *ngIf=\"!result && documentTypeSelected && !manual\">\n  <section>\n    <div #wraper class=\"wraper\">\n      <div class=\"loading\" *ngIf=\"(!cameraReady && !preview) || scaning\">\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          #webcam\n          type=\"document\"\n          [trigger]=\"trigger\"\n          [imageHandler]=\"imageHandler\"\n          (imageCapture)=\"handleImage($event)\"\n          (initError)=\"handleInitError($event)\"\n          (destroyed)=\"cameraOff($event)\"\n          (videoReady)=\"videoReady($event)\"\n          [refresh]=\"refresh\"\n        >\n        </ngx-scandoc-webcam>\n      </ng-container>\n      <div\n        class=\"previewData\"\n        *ngIf=\"preview\"\n        style=\"\n          z-index: 20;\n          display: flex;\n          position: absolute;\n          width: 100%;\n          height: 100%;\n        \"\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 *ngIf=\"preview\">\n      <!-- <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      <ng-container *ngIf=\"displayInfo\">\n        {{ displayInfo | translate }}\n      </ng-container>\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</ng-container>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden;position:relative}:host.mobile .hint{font-size:13px}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}.manualMode{position:absolute;width:100%;height:100%;z-index:200;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.manualMode .content{margin-top:20px;background-color:#fff;border-radius:6px;max-width:300px;width:100%;display:flex;flex-direction:column;padding:30px 20px 0}.manualMode .inner{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:14px}.manualMode .inner mat-icon{width:60px;height:60px;font-size:60px}.manualMode .inner .text{margin:20px 0}.manualMode footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}.manualMode footer button{min-width:140px;box-shadow:none;border:1px solid #ccc}.pageTurn{position:absolute;width:100%;height:100%;z-index:200;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.pageTurn .content{background-color:#fff;border-radius:6px;max-width:300px;width:100%;display:flex;flex-direction:column;padding:30px 20px 0}.pageTurn .inner{display:flex;flex-direction:column;align-items:center;justify-content:center}.pageTurn .inner mat-icon{width:60px;height:60px;font-size:60px}.pageTurn .inner .text{margin:20px 0;font-size:14px}.pageTurn footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}.pageTurn footer button{min-width:200px;box-shadow:none;border:1px solid #ccc}.hint{position:absolute;z-index:5;font-size:18px;line-height:18px;display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%}.hint .text{border-radius:3px;padding:4px 8px;background-color:#000;color:#fff;text-align:center;display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "type", "trigger", "refresh"], outputs: ["cameraSwitched", "videoReady", "imageCapture", "initError"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: ManualScanComponent, selector: "ngx-manual-scan", outputs: ["action"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngx-scan', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container\n  *ngIf=\"cameraProvider.rectPosition.t > 0 && displayInfo && !result && !manual\"\n>\n  <div class=\"hint\" [ngStyle]=\"{ top: cameraProvider.hintPosition + 'px' }\">\n    <span class=\"text\">\n      {{ displayInfo | translate }}\n    </span>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"showDialog\">\n  <div class=\"pageTurn\">\n    <div class=\"content\">\n      <div class=\"inner\">\n        <mat-icon>360</mat-icon>\n        <div class=\"text\">\n          <ng-container *ngIf=\"idScan === 'BACK'\">\n            {{ \"scandoc.turnAndCapture.back\" | translate }}\n          </ng-container>\n          <ng-container *ngIf=\"idScan === 'FRONT'\">\n            {{ \"scandoc.turnAndCapture.front\" | translate }}\n          </ng-container>\n        </div>\n      </div>\n      <footer>\n        <button (click)=\"closeDialog()\" mat-raised-button>Ok</button>\n      </footer>\n    </div>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"promptManual\">\n  <div class=\"manualMode\">\n    <div class=\"content\">\n      <div class=\"inner\">\n        <mat-icon>screenshot</mat-icon>\n        <div class=\"text\">\n          {{ \"scandoc.manual\" | translate }}\n        </div>\n      </div>\n      <footer>\n        <button\n          style=\"margin-right: 8px\"\n          (click)=\"manualSet(true)\"\n          mat-raised-button\n        >\n          {{ \"scandoc.yes\" | translate }}\n        </button>\n        <button\n          style=\"margin-left: 8px\"\n          (click)=\"manualSet(false)\"\n          mat-raised-button\n        >\n          {{ \"scandoc.no\" | translate }}\n        </button>\n      </footer>\n    </div>\n  </div>\n</ng-container>\n<ng-container *ngIf=\"result\">\n  <section>\n    <ngx-scan-results\n      (action)=\"selfie()\"\n      [form]=\"form\"\n      [data]=\"scanResults\"\n    ></ngx-scan-results>\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</ng-container>\n\n<ng-container *ngIf=\"manual\">\n  <section>\n    <ngx-manual-scan (action)=\"manualScanData($event)\"></ngx-manual-scan>\n  </section>\n</ng-container>\n<ng-container *ngIf=\"!result && documentTypeSelected && !manual\">\n  <section>\n    <div #wraper class=\"wraper\">\n      <div class=\"loading\" *ngIf=\"(!cameraReady && !preview) || scaning\">\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          #webcam\n          type=\"document\"\n          [trigger]=\"trigger\"\n          [imageHandler]=\"imageHandler\"\n          (imageCapture)=\"handleImage($event)\"\n          (initError)=\"handleInitError($event)\"\n          (destroyed)=\"cameraOff($event)\"\n          (videoReady)=\"videoReady($event)\"\n          [refresh]=\"refresh\"\n        >\n        </ngx-scandoc-webcam>\n      </ng-container>\n      <div\n        class=\"previewData\"\n        *ngIf=\"preview\"\n        style=\"\n          z-index: 20;\n          display: flex;\n          position: absolute;\n          width: 100%;\n          height: 100%;\n        \"\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 *ngIf=\"preview\">\n      <!-- <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      <ng-container *ngIf=\"displayInfo\">\n        {{ displayInfo | translate }}\n      </ng-container>\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</ng-container>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden;position:relative}:host.mobile .hint{font-size:13px}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}.manualMode{position:absolute;width:100%;height:100%;z-index:200;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.manualMode .content{margin-top:20px;background-color:#fff;border-radius:6px;max-width:300px;width:100%;display:flex;flex-direction:column;padding:30px 20px 0}.manualMode .inner{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:14px}.manualMode .inner mat-icon{width:60px;height:60px;font-size:60px}.manualMode .inner .text{margin:20px 0}.manualMode footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}.manualMode footer button{min-width:140px;box-shadow:none;border:1px solid #ccc}.pageTurn{position:absolute;width:100%;height:100%;z-index:200;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.pageTurn .content{background-color:#fff;border-radius:6px;max-width:300px;width:100%;display:flex;flex-direction:column;padding:30px 20px 0}.pageTurn .inner{display:flex;flex-direction:column;align-items:center;justify-content:center}.pageTurn .inner mat-icon{width:60px;height:60px;font-size:60px}.pageTurn .inner .text{margin:20px 0;font-size:14px}.pageTurn footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}.pageTurn footer button{min-width:200px;box-shadow:none;border:1px solid #ccc}.hint{position:absolute;z-index:5;font-size:18px;line-height:18px;display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%}.hint .text{border-radius:3px;padding:4px 8px;background-color:#000;color:#fff;text-align:center;display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone}\n"] }]
+            args: [{ selector: 'ngx-scan', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container\n  *ngIf=\"cameraProvider.rectPosition.t > 0 && displayInfo && !result && !manual\"\n>\n  <div class=\"hint\" [ngStyle]=\"{ top: cameraProvider.hintPosition + 'px' }\">\n    <span class=\"text\">\n      {{ displayInfo | translate }}\n    </span>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"showDialog\">\n  <div class=\"pageTurn\">\n    <div class=\"content\">\n      <div class=\"inner\">\n        <mat-icon>360</mat-icon>\n        <div class=\"text\">\n          <ng-container *ngIf=\"idScan === 'BACK'\">\n            {{ \"scandoc.turnAndCapture.back\" | translate }}\n          </ng-container>\n          <ng-container *ngIf=\"idScan === 'FRONT'\">\n            {{ \"scandoc.turnAndCapture.front\" | translate }}\n          </ng-container>\n        </div>\n      </div>\n      <footer>\n        <button (click)=\"closeDialog()\" mat-raised-button>Ok</button>\n      </footer>\n    </div>\n  </div>\n</ng-container>\n\n<ng-container *ngIf=\"promptManual\">\n  <div class=\"manualMode\">\n    <div class=\"content\">\n      <div class=\"inner\">\n        <mat-icon>screenshot</mat-icon>\n        <div class=\"text\">\n          {{ \"scandoc.manual\" | translate }}\n        </div>\n      </div>\n      <footer>\n        <button\n          style=\"margin-right: 8px\"\n          (click)=\"manualSet(true)\"\n          mat-raised-button\n        >\n          {{ \"scandoc.yes\" | translate }}\n        </button>\n        <button\n          style=\"margin-left: 8px\"\n          (click)=\"manualSet(false)\"\n          mat-raised-button\n        >\n          {{ \"scandoc.no\" | translate }}\n        </button>\n      </footer>\n    </div>\n  </div>\n</ng-container>\n<ng-container *ngIf=\"result\">\n  <section>\n    <!-- <ngx-scan-results\n      (action)=\"selfie()\"\n      [form]=\"form\"\n      [data]=\"scanResults\"\n    ></ngx-scan-results> -->\n\n    hum\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</ng-container>\n\n<ng-container *ngIf=\"manual\">\n  <section>\n    <ngx-manual-scan (action)=\"manualScanData($event)\"></ngx-manual-scan>\n  </section>\n</ng-container>\n<ng-container *ngIf=\"!result && documentTypeSelected && !manual\">\n  <section>\n    <div #wraper class=\"wraper\">\n      <div class=\"loading\" *ngIf=\"(!cameraReady && !preview) || scaning\">\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          #webcam\n          type=\"document\"\n          [trigger]=\"trigger\"\n          [imageHandler]=\"imageHandler\"\n          (imageCapture)=\"handleImage($event)\"\n          (initError)=\"handleInitError($event)\"\n          (destroyed)=\"cameraOff($event)\"\n          (videoReady)=\"videoReady($event)\"\n          [refresh]=\"refresh\"\n        >\n        </ngx-scandoc-webcam>\n      </ng-container>\n      <div\n        class=\"previewData\"\n        *ngIf=\"preview\"\n        style=\"\n          z-index: 20;\n          display: flex;\n          position: absolute;\n          width: 100%;\n          height: 100%;\n        \"\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 *ngIf=\"preview\">\n      <!-- <div class=\"displayInfo\" *ngIf=\"!preview && cameraReady\">\n      <ng-container *ngIf=\"displayInfo\">\n        {{ displayInfo | translate }}\n      </ng-container>\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</ng-container>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5;overflow:hidden;position:relative}:host.mobile .hint{font-size:13px}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}.manualMode{position:absolute;width:100%;height:100%;z-index:200;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.manualMode .content{margin-top:20px;background-color:#fff;border-radius:6px;max-width:300px;width:100%;display:flex;flex-direction:column;padding:30px 20px 0}.manualMode .inner{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:14px}.manualMode .inner mat-icon{width:60px;height:60px;font-size:60px}.manualMode .inner .text{margin:20px 0}.manualMode footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}.manualMode footer button{min-width:140px;box-shadow:none;border:1px solid #ccc}.pageTurn{position:absolute;width:100%;height:100%;z-index:200;top:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.pageTurn .content{background-color:#fff;border-radius:6px;max-width:300px;width:100%;display:flex;flex-direction:column;padding:30px 20px 0}.pageTurn .inner{display:flex;flex-direction:column;align-items:center;justify-content:center}.pageTurn .inner mat-icon{width:60px;height:60px;font-size:60px}.pageTurn .inner .text{margin:20px 0;font-size:14px}.pageTurn footer{display:flex;flex-direction:row;align-items:center;justify-content:center;padding-bottom:20px}.pageTurn footer button{min-width:200px;box-shadow:none;border:1px solid #ccc}.hint{position:absolute;z-index:5;font-size:18px;line-height:18px;display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%}.hint .text{border-radius:3px;padding:4px 8px;background-color:#000;color:#fff;text-align:center;display:inline;-webkit-box-decoration-break:clone;box-decoration-break:clone}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }, { type: NgxScandocCameraProvider }, { type: i0.Injector }, { type: LayoutProvider }, { type: i2.Platform }, { type: i4$2.DeviceDetectorService }, { type: NgxScandocAuthProvider }], propDecorators: { type: [{
                 type: Input
             }], dialogs: [{
@@ -3270,254 +2747,777 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                         MatSliderModule,
                         MatSlideToggleModule,
                     ],
-                    exports: [
-                        MatNativeDateModule,
-                        MatDatepickerModule,
-                        MatSelectModule,
-                        MatCardModule,
-                        MatMenuModule,
-                        MatIconModule,
-                        MatButtonModule,
-                        MatDialogModule,
-                        MatInputModule,
-                        MatSnackBarModule,
-                        MatProgressBarModule,
-                        MatProgressSpinnerModule,
-                        MatTableModule,
-                        MatPaginatorModule,
-                        MatChipsModule,
-                        MatBadgeModule,
-                        MatCheckboxModule,
-                        MatListModule,
-                        MatTabsModule,
-                        MatSlideToggleModule,
-                        MatAutocompleteModule,
+                    exports: [
+                        MatNativeDateModule,
+                        MatDatepickerModule,
+                        MatSelectModule,
+                        MatCardModule,
+                        MatMenuModule,
+                        MatIconModule,
+                        MatButtonModule,
+                        MatDialogModule,
+                        MatInputModule,
+                        MatSnackBarModule,
+                        MatProgressBarModule,
+                        MatProgressSpinnerModule,
+                        MatTableModule,
+                        MatPaginatorModule,
+                        MatChipsModule,
+                        MatBadgeModule,
+                        MatCheckboxModule,
+                        MatListModule,
+                        MatTabsModule,
+                        MatSlideToggleModule,
+                        MatAutocompleteModule,
+                    ],
+                    providers: [],
+                }]
+        }] });
+
+class AvatarTypeComponent extends FieldType {
+    constructor(cd) {
+        super();
+        this.cd = cd;
+        this.width = 'w-120';
+        this.padding = 'px-32 pt-8 pb-8';
+    }
+    ngOnChange() { }
+    selfie() { }
+    ;
+    ngAfterViewInit() {
+        if (this.to.width) {
+            this.width = this.to.width;
+        }
+        if (this.to.padding) {
+            this.padding = this.to.padding;
+        }
+        this.cd.detectChanges();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AvatarTypeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AvatarTypeComponent, isStandalone: false, selector: "app-formly-avatar-type", usesInheritance: true, ngImport: i0, template: `
+    <mat-card appearance="outlined" style="margin: 4px; padding:16px">
+      <div class="card-title">{{ 'scandoc.result.avatar' | translate }}</div>
+      <div class="selfieContainer">
+        <div class="selfie">
+          <img *ngIf="model?._avatar" class="preview" [src]="model._avatar" />
+        </div>
+        <button (click)="selfie()" mat-raised-button>
+          {{ 'scandoc.result.takeSelfie' | translate }}
+        </button>
+      </div>
+    </mat-card>
+  `, isInline: true, styles: ["mat-card{border-radius:0;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AvatarTypeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-formly-avatar-type', template: `
+    <mat-card appearance="outlined" style="margin: 4px; padding:16px">
+      <div class="card-title">{{ 'scandoc.result.avatar' | translate }}</div>
+      <div class="selfieContainer">
+        <div class="selfie">
+          <img *ngIf="model?._avatar" class="preview" [src]="model._avatar" />
+        </div>
+        <button (click)="selfie()" mat-raised-button>
+          {{ 'scandoc.result.takeSelfie' | translate }}
+        </button>
+      </div>
+    </mat-card>
+  `, standalone: false, styles: ["mat-card{border-radius:0;box-shadow:none!important}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+
+class TitleTypeComponent extends FieldType {
+    constructor(cd) {
+        super();
+        this.cd = cd;
+    }
+    ngOnInit() {
+        this.opt = {
+            badge: this.to.badge,
+        };
+    }
+    ngAfterViewInit() {
+        this.cd.detectChanges();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TitleTypeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TitleTypeComponent, isStandalone: false, selector: "app-formly-title-type", usesInheritance: true, ngImport: i0, template: `
+    <div class="card-title">
+      {{ to.label }}
+    </div>
+  `, isInline: true, styles: [""] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TitleTypeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-formly-title-type', template: `
+    <div class="card-title">
+      {{ to.label }}
+    </div>
+  `, standalone: false }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+
+class ProfileImageTypeComponent extends FieldType {
+    constructor(cd, cameraProvider, scanProvider) {
+        super();
+        this.cd = cd;
+        this.cameraProvider = cameraProvider;
+        this.scanProvider = scanProvider;
+    }
+    selfie() {
+        this.cameraProvider.selfie$.next(true);
+    }
+    ngOnChange() { }
+    ngAfterViewInit() { }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ProfileImageTypeComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NgxScandocCameraProvider }, { token: ScanProvider }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ProfileImageTypeComponent, isStandalone: false, selector: "app-formly-profile-image-type", usesInheritance: true, ngImport: i0, template: `
+    <mat-form-field>
+      <mat-label>{{ 'scandoc.result.avatar' | translate }} </mat-label>
+      <input matInput style="display:none" />
+      <div class="selfieContainer">
+        <div class="selfie">
+          <img *ngIf="model?._avatar" class="preview" [src]="model._avatar" />
+        </div>
+        <button
+          *ngIf="scanProvider.enableVerification"
+          (click)="selfie()"
+          mat-raised-button
+        >
+          {{ 'scandoc.result.takeSelfie' | translate }}
+        </button>
+      </div>
+    </mat-form-field>
+  `, isInline: true, styles: [".selfieContainer{display:flex;flex-direction:column;align-items:center;justify-content:center}.selfieContainer button{margin-top:6px;box-shadow:none!important;border:1px solid rgba(0,0,0,.12);text-transform:uppercase;font-size:12px}.selfie{width:126px;height:126px;border-radius:70px;background:#f5f5f5;display:flex;flex-direction:column;align-items:center;justify-content:center}.selfie img{width:120px;height:120px;border-radius:60px}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$3.MatLabel, selector: "mat-label" }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: i4$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ProfileImageTypeComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'app-formly-profile-image-type', template: `
+    <mat-form-field>
+      <mat-label>{{ 'scandoc.result.avatar' | translate }} </mat-label>
+      <input matInput style="display:none" />
+      <div class="selfieContainer">
+        <div class="selfie">
+          <img *ngIf="model?._avatar" class="preview" [src]="model._avatar" />
+        </div>
+        <button
+          *ngIf="scanProvider.enableVerification"
+          (click)="selfie()"
+          mat-raised-button
+        >
+          {{ 'scandoc.result.takeSelfie' | translate }}
+        </button>
+      </div>
+    </mat-form-field>
+  `, standalone: false, styles: [".selfieContainer{display:flex;flex-direction:column;align-items:center;justify-content:center}.selfieContainer button{margin-top:6px;box-shadow:none!important;border:1px solid rgba(0,0,0,.12);text-transform:uppercase;font-size:12px}.selfie{width:126px;height:126px;border-radius:70px;background:#f5f5f5;display:flex;flex-direction:column;align-items:center;justify-content:center}.selfie img{width:120px;height:120px;border-radius:60px}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: NgxScandocCameraProvider }, { type: ScanProvider }] });
+
+class AppFormModule {
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: AppFormModule, declarations: [TitleTypeComponent,
+            AvatarTypeComponent,
+            ProfileImageTypeComponent], imports: [CommonModule,
+            FormsModule,
+            FormlyMatDatepickerModule,
+            FormlySelectModule,
+            MaterialModule,
+            AvatarModule,
+            TranslateModule,
+            FormlyMaterialModule, i1$2.FormlyModule], exports: [FormlyModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppFormModule, imports: [CommonModule,
+            FormsModule,
+            FormlyMatDatepickerModule,
+            FormlySelectModule,
+            MaterialModule,
+            AvatarModule,
+            TranslateModule,
+            FormlyMaterialModule,
+            FormlyModule.forChild({
+                types: [
+                    {
+                        name: 'title',
+                        component: TitleTypeComponent,
+                        wrappers: [],
+                    },
+                    {
+                        name: 'profile-image',
+                        component: ProfileImageTypeComponent,
+                        wrappers: [],
+                    },
+                ],
+            }), FormlyModule] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppFormModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        TitleTypeComponent,
+                        AvatarTypeComponent,
+                        ProfileImageTypeComponent,
+                    ],
+                    imports: [
+                        CommonModule,
+                        FormsModule,
+                        FormlyMatDatepickerModule,
+                        FormlySelectModule,
+                        MaterialModule,
+                        AvatarModule,
+                        TranslateModule,
+                        FormlyMaterialModule,
+                        FormlyModule.forChild({
+                            types: [
+                                {
+                                    name: 'title',
+                                    component: TitleTypeComponent,
+                                    wrappers: [],
+                                },
+                                {
+                                    name: 'profile-image',
+                                    component: ProfileImageTypeComponent,
+                                    wrappers: [],
+                                },
+                            ],
+                        }),
                     ],
                     providers: [],
+                    exports: [FormlyModule],
                 }]
         }] });
 
-class AvatarTypeComponent extends FieldType {
-    constructor(cd) {
-        super();
-        this.cd = cd;
-        this.width = 'w-120';
-        this.padding = 'px-32 pt-8 pb-8';
+class CameraSwitchComponent {
+    constructor(cameraProvider) {
+        this.cameraProvider = cameraProvider;
     }
-    ngOnChange() { }
-    selfie() { }
-    ;
     ngAfterViewInit() {
-        if (this.to.width) {
-            this.width = this.to.width;
+        // this.cameraProvider.setDefault();
+    }
+    ngOnDestroy() { }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CameraSwitchComponent, deps: [{ token: NgxScandocCameraProvider }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: CameraSwitchComponent, isStandalone: false, selector: "ngx-scan-camera-switch", ngImport: i0, template: "<mat-form-field\n  style=\"font-size: 14px;  margin-top: 8px\"\n  class=\"w-100-p mr-16 mt-8\"\n\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: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$3.MatLabel, selector: "mat-label" }, { kind: "component", type: i5$3.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5$3.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CameraSwitchComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'ngx-scan-camera-switch', standalone: false, template: "<mat-form-field\n  style=\"font-size: 14px;  margin-top: 8px\"\n  class=\"w-100-p mr-16 mt-8\"\n\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: () => [{ type: NgxScandocCameraProvider }] });
+
+const TRANSLATION_PROVIDER = new InjectionToken('Injection token for translation providers.');
+class NgxScanDocTranslationProvider {
+    constructor(translate, injector, 
+    //@Optional() @Inject(SCAN_CONFIG_TOKEN) config: ScanConfig,
+    providers, platformLocation) {
+        this.translate = translate;
+        this.injector = injector;
+        this.platformLocation = platformLocation;
+        console.log('MM', Math.random());
+        this.customLoader = this.translate.currentLoader;
+        //console.log('config',config)
+        // console.log(this.translate)
+        if (providers && providers.length > 0) {
+            for (const provider of providers) {
+                this.addTranslationFolder(provider.name, provider.source);
+            }
         }
-        if (this.to.padding) {
-            this.padding = this.to.padding;
+    }
+    path(path) {
+        return path;
+        // const baseHref = this.platformLocation
+        //   .getBaseHrefFromDOM()
+        //   .split('/')
+        //   .join('');
+        // return baseHref != '' ? `/${baseHref}${path}` : path;
+    }
+    setDefaultLang(lang) {
+        this.defaultLang = lang;
+        this.translate.setDefaultLang(this.defaultLang);
+    }
+    registerTranslationFolder(name = '', path = '') {
+        console.log(name, path, this.userLang, this.defaultLang);
+        if (!this.customLoader.providerRegistered(name)) {
+            this.customLoader.registerProvider(name, this.path(path));
         }
-        this.cd.detectChanges();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AvatarTypeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: AvatarTypeComponent, isStandalone: false, selector: "app-formly-avatar-type", usesInheritance: true, ngImport: i0, template: `
-    <mat-card appearance="outlined" style="margin: 4px; padding:16px">
-      <div class="card-title">{{ 'scandoc.result.avatar' | translate }}</div>
-      <div class="selfieContainer">
-        <div class="selfie">
-          <img *ngIf="model?._avatar" class="preview" [src]="model._avatar" />
-        </div>
-        <button (click)="selfie()" mat-raised-button>
-          {{ 'scandoc.result.takeSelfie' | translate }}
-        </button>
-      </div>
-    </mat-card>
-  `, isInline: true, styles: ["mat-card{border-radius:0;box-shadow:none!important}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+    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) {
+            item.fieldGroup = item.fieldGroup.map((field) => this.forms(field));
+        }
+        const prefix = namespace ? namespace + '.' : '';
+        if (item.props &&
+            (item.props.label || item.props.placeholder || item.props.options)) {
+            if (!item.expressions) {
+                item.expressions = {};
+            }
+            if (item.props.label) {
+                item.expressions['props.label'] = this.translate.stream(prefix + item.props.label);
+            }
+            if (item.props.placeholder) {
+                item.expressions['props.placeholder'] = this.translate.stream(prefix + item.props.placeholder);
+            }
+            if (Array.isArray(item.props.options)) {
+                item.expressions['props.options'] = item.props.options.map((m) => {
+                    // console.log(m);
+                    if (m.label) {
+                        m.label = this.translate.instant(prefix + m.label);
+                    }
+                    return m;
+                });
+            }
+        }
+        return item;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScanDocTranslationProvider, deps: [{ token: i4$1.TranslateService }, { token: i0.Injector }, { token: TRANSLATION_PROVIDER, optional: true }, { token: i4.PlatformLocation }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScanDocTranslationProvider, providedIn: 'root' }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScanDocTranslationProvider, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [{ type: i4$1.TranslateService }, { type: i0.Injector }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [TRANSLATION_PROVIDER]
+                }] }, { type: i4.PlatformLocation }] });
+
+class NgxScandocFieldsProvider {
+    constructor(translate, provider) {
+        this.translate = translate;
+        this.provider = provider;
+        this.selfie$ = new Subject();
+    }
+    update() {
+        return [
+            {
+                fieldGroupClassName: 'px-16',
+                fieldGroup: [
+                    {
+                        wrappers: [],
+                        type: 'checkbox',
+                        key: 'profile',
+                        class: 'checkbox ',
+                        defaultValue: true,
+                        props: {
+                            label: 'scandoc.form.scan.document.update.profile',
+                        },
+                    },
+                    {
+                        wrappers: [],
+                        type: 'checkbox',
+                        class: 'checkbox ',
+                        key: 'document',
+                        defaultValue: true,
+                        props: {
+                            label: 'scandoc.form.scan.document.update.document',
+                        },
+                    },
+                    {
+                        wrappers: [],
+                        type: 'checkbox',
+                        class: 'checkbox ',
+                        key: 'attachment',
+                        defaultValue: true,
+                        props: {
+                            label: 'scandoc.form.scan.document.update.attachment',
+                        },
+                    },
+                ].map((item) => this.translate.forms(item)),
+            },
+        ];
+    }
+    document() {
+        if (this.customFields) {
+            return this.customFields;
+        }
+        return [
+            {
+                className: 'w-100-p',
+                fieldGroupClassName: 'form-flex-row  profile-details',
+                fieldGroup: [
+                    {
+                        className: 'w-100-p ',
+                        fieldGroupClassName: 'card-group',
+                        fieldGroup: [
+                            {
+                                type: 'title',
+                                props: {
+                                    label: 'scandoc.form.scan.document.guestDetailsTitle',
+                                },
+                            },
+                            {
+                                type: 'profile-image',
+                                key: '_avatar',
+                                props: {
+                                    label: 'scandoc.form.scan.document.firstName',
+                                },
+                            },
+                            {
+                                type: 'input',
+                                key: 'firstName',
+                                className: 'small',
+                                props: {
+                                    label: 'scandoc.form.scan.document.firstName',
+                                    required: true,
+                                },
+                            },
+                            {
+                                type: 'input',
+                                key: 'lastName',
+                                className: 'small',
+                                props: {
+                                    label: 'scandoc.form.scan.document.lastName',
+                                    required: true,
+                                },
+                            },
+                            {
+                                className: 'small',
+                                key: 'secondName',
+                                type: 'input',
+                                props: {
+                                    label: 'scandoc.form.scan.document.secondLastName',
+                                },
+                                hideExpression: 'model.hideSecondLastName',
+                            },
+                            {
+                                type: 'input',
+                                key: 'middleName',
+                                className: 'small',
+                                props: {
+                                    label: 'scandoc.form.scan.document.middleName',
+                                },
+                            },
+                            {
+                                className: '',
+                                fieldGroupClassName: 'form-flex-row space-between',
+                                fieldGroup: [
+                                    {
+                                        type: 'datepicker',
+                                        key: 'birthDate',
+                                        className: 'w-100-p small mr-8',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.birthDate',
+                                        },
+                                    },
+                                    {
+                                        type: 'select',
+                                        key: 'gender',
+                                        className: 'w-100-p small ml-8',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.gender',
+                                            options: [
+                                                { value: 'MALE', label: 'MALE' },
+                                                { value: 'FEMALE', label: 'FEMALE' },
+                                                { value: 'NA', label: 'N/A' },
+                                            ],
+                                        },
+                                    },
+                                ],
+                            },
+                            {
+                                className: '',
+                                fieldGroupClassName: 'form-flex-row space-between',
+                                fieldGroup: [
+                                    {
+                                        type: 'input',
+                                        key: 'birthPlace',
+                                        className: 'small w-100-p mr-8',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.birthPlace',
+                                        },
+                                    },
+                                    {
+                                        type: 'select',
+                                        key: 'birthCountry',
+                                        className: 'small w-100-p ml-8',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.birthCountry',
+                                            options: this.provider.countries(),
+                                        },
+                                    },
+                                ],
+                            },
+                            {
+                                className: 'small',
+                                key: 'nationality',
+                                type: 'select',
+                                props: {
+                                    label: 'scandoc.form.scan.document.nationality',
+                                    //   appearance: 'outline',
+                                    //  options: this.profileProvider.nationalities(),
+                                    options: this.provider.countries(),
+                                },
+                            },
+                        ],
+                    },
+                    {
+                        className: 'w-100-p',
+                        fieldGroupClassName: 'form-flex-column',
+                        fieldGroup: [
+                            {
+                                className: 'w-100-p',
+                                fieldGroupClassName: 'card-group',
+                                fieldGroup: [
+                                    {
+                                        type: 'title',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.documentTitle',
+                                        },
+                                    },
+                                    {
+                                        type: 'select',
+                                        key: 'documentType',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.documentType',
+                                            options: [
+                                                { value: 'ID', label: 'Identity Document' },
+                                                { value: 'PASS', label: 'Passport' },
+                                                { value: 'DL', label: 'Driver Licence' },
+                                            ],
+                                            //  valueProp: 'id',
+                                            //  labelProp: 'value',
+                                            required: true,
+                                        },
+                                    },
+                                    {
+                                        type: 'input',
+                                        key: 'documentNumber',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.documentNumber',
+                                            required: true,
+                                        },
+                                    },
+                                    {
+                                        className: '',
+                                        fieldGroupClassName: 'form-flex-row space-between',
+                                        fieldGroup: [
+                                            {
+                                                type: 'datepicker',
+                                                key: 'issueDate',
+                                                className: 'small mr-8',
+                                                props: {
+                                                    label: 'scandoc.form.scan.document.issueDate',
+                                                },
+                                            },
+                                            {
+                                                type: 'datepicker',
+                                                key: 'expirationDate',
+                                                className: 'small ml-8',
+                                                props: {
+                                                    label: 'scandoc.form.scan.document.expirationDate',
+                                                },
+                                            },
+                                        ],
+                                    },
+                                    {
+                                        type: 'select',
+                                        key: 'issueStateCode',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.issuingStateCode',
+                                            options: this.provider.countries(),
+                                        },
+                                    },
+                                    {
+                                        type: 'input',
+                                        key: 'issuingPlace',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.issuingPlace',
+                                            required: false,
+                                        },
+                                    },
+                                ],
+                            },
+                            {
+                                className: 'w-100-p',
+                                fieldGroupClassName: 'card-group',
+                                fieldGroup: [
+                                    {
+                                        type: 'title',
+                                        props: {
+                                            label: 'scandoc.form.scan.document.addressTitle',
+                                            badge: 'communications',
+                                        },
+                                    },
+                                    {
+                                        className: 'small',
+                                        key: 'country',
+                                        type: 'select',
+                                        props: {
+                                            required: true,
+                                            label: 'scandoc.form.profile.address.country',
+                                            options: this.provider.countries(),
+                                        },
+                                        // expressionProperties: {
+                                        //   'props.disabled': (model: any) => !model.newAddress,
+                                        // },
+                                        hooks: {
+                                            onInit: (model) => {
+                                                console.log(model);
+                                            },
+                                        },
+                                    },
+                                    {
+                                        className: '',
+                                        fieldGroupClassName: 'form-flex-row space-between',
+                                        fieldGroup: [
+                                            {
+                                                className: 'mr-8 w-100-p',
+                                                key: 'zip',
+                                                type: 'input',
+                                                props: {
+                                                    label: 'scandoc.form.profile.address.zip',
+                                                    labelProp: (item) => {
+                                                        return `${item.zip} (${item.city})`;
+                                                    },
+                                                    set: (field, option) => {
+                                                        // console.log(option, field);
+                                                        field.formControl.setValue(option.value.zip);
+                                                        // set CITY
+                                                        field.form.get('city').setValue(option.value.city);
+                                                    },
+                                                    filter: (key, field) => {
+                                                        // return this.profileProvider.zipCodes({
+                                                        //   countryCode: field.form.get('country').value,
+                                                        //   zip: key,
+                                                        // });
+                                                    },
+                                                },
+                                                // expressionProperties: {
+                                                //   'props.disabled': (model: any) =>
+                                                //     !model.newAddress,
+                                                // },
+                                            },
+                                            {
+                                                className: 'small w-100-p ml-8',
+                                                key: 'city',
+                                                type: 'input',
+                                                props: {
+                                                    label: 'scandoc.form.profile.address.city',
+                                                },
+                                            },
+                                        ],
+                                    },
+                                    {
+                                        className: 'small w-100-p',
+                                        key: 'street1',
+                                        type: 'input',
+                                        props: {
+                                            label: 'scandoc.form.profile.address.street',
+                                        },
+                                    },
+                                ],
+                            },
+                        ],
+                    },
+                ],
+            },
+        ].map((item) => this.translate.forms(item));
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocFieldsProvider, deps: [{ token: NgxScanDocTranslationProvider }, { token: ScanProvider }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocFieldsProvider, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AvatarTypeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-formly-avatar-type', template: `
-    <mat-card appearance="outlined" style="margin: 4px; padding:16px">
-      <div class="card-title">{{ 'scandoc.result.avatar' | translate }}</div>
-      <div class="selfieContainer">
-        <div class="selfie">
-          <img *ngIf="model?._avatar" class="preview" [src]="model._avatar" />
-        </div>
-        <button (click)="selfie()" mat-raised-button>
-          {{ 'scandoc.result.takeSelfie' | translate }}
-        </button>
-      </div>
-    </mat-card>
-  `, standalone: false, styles: ["mat-card{border-radius:0;box-shadow:none!important}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocFieldsProvider, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [{ type: NgxScanDocTranslationProvider }, { type: ScanProvider }] });
 
-class TitleTypeComponent extends FieldType {
-    constructor(cd) {
+class ScanResultsComponent extends BaseComponent {
+    constructor(cameraProvider, formProvider, provider, cd, zone) {
         super();
+        this.cameraProvider = cameraProvider;
+        this.formProvider = formProvider;
+        this.provider = provider;
         this.cd = cd;
+        this.zone = zone;
+        this.action = new EventEmitter();
     }
     ngOnInit() {
-        this.opt = {
-            badge: this.to.badge,
-        };
-    }
-    ngAfterViewInit() {
-        this.cd.detectChanges();
+        console.time('fields');
+        this.fields = this.formProvider.document();
+        console.timeEnd('fields');
+        this.__subs(this.data).subscribe((resp) => {
+            this.zone.run(() => {
+                switch (resp.type) {
+                    case 'avatar':
+                        this.model._avatar = resp.data;
+                        this.form = new FormGroup({});
+                        console.log(this.model);
+                        break;
+                    case 'model':
+                        this.model = resp.data;
+                        break;
+                }
+                console.timeEnd('results');
+                this.cd.detectChanges();
+            });
+        });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TitleTypeComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TitleTypeComponent, isStandalone: false, selector: "app-formly-title-type", usesInheritance: true, ngImport: i0, template: `
-    <div class="card-title">
-      {{ to.label }}
-    </div>
-  `, isInline: true, styles: [""] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TitleTypeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-formly-title-type', template: `
-    <div class="card-title">
-      {{ to.label }}
-    </div>
-  `, standalone: false }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }] });
-
-class ProfileImageTypeComponent extends FieldType {
-    constructor(cd, cameraProvider, scanProvider) {
-        super();
-        this.cd = cd;
-        this.cameraProvider = cameraProvider;
-        this.scanProvider = scanProvider;
+    ngOnDestroy() {
+        this.__destroy();
     }
     selfie() {
-        this.cameraProvider.selfie$.next(true);
-    }
-    ngOnChange() { }
-    ngAfterViewInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ProfileImageTypeComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: NgxScandocCameraProvider }, { token: ScanProvider }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ProfileImageTypeComponent, isStandalone: false, selector: "app-formly-profile-image-type", usesInheritance: true, ngImport: i0, template: `
-    <mat-form-field>
-      <mat-label>{{ 'scandoc.result.avatar' | translate }} </mat-label>
-      <input matInput style="display:none" />
-      <div class="selfieContainer">
-        <div class="selfie">
-          <img *ngIf="model?._avatar" class="preview" [src]="model._avatar" />
-        </div>
-        <button
-          *ngIf="scanProvider.enableVerification"
-          (click)="selfie()"
-          mat-raised-button
-        >
-          {{ 'scandoc.result.takeSelfie' | translate }}
-        </button>
-      </div>
-    </mat-form-field>
-  `, isInline: true, styles: [".selfieContainer{display:flex;flex-direction:column;align-items:center;justify-content:center}.selfieContainer button{margin-top:6px;box-shadow:none!important;border:1px solid rgba(0,0,0,.12);text-transform:uppercase;font-size:12px}.selfie{width:126px;height:126px;border-radius:70px;background:#f5f5f5;display:flex;flex-direction:column;align-items:center;justify-content:center}.selfie img{width:120px;height:120px;border-radius:60px}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$3.MatLabel, selector: "mat-label" }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "directive", type: i4$3.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ProfileImageTypeComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'app-formly-profile-image-type', template: `
-    <mat-form-field>
-      <mat-label>{{ 'scandoc.result.avatar' | translate }} </mat-label>
-      <input matInput style="display:none" />
-      <div class="selfieContainer">
-        <div class="selfie">
-          <img *ngIf="model?._avatar" class="preview" [src]="model._avatar" />
-        </div>
-        <button
-          *ngIf="scanProvider.enableVerification"
-          (click)="selfie()"
-          mat-raised-button
-        >
-          {{ 'scandoc.result.takeSelfie' | translate }}
-        </button>
-      </div>
-    </mat-form-field>
-  `, standalone: false, styles: [".selfieContainer{display:flex;flex-direction:column;align-items:center;justify-content:center}.selfieContainer button{margin-top:6px;box-shadow:none!important;border:1px solid rgba(0,0,0,.12);text-transform:uppercase;font-size:12px}.selfie{width:126px;height:126px;border-radius:70px;background:#f5f5f5;display:flex;flex-direction:column;align-items:center;justify-content:center}.selfie img{width:120px;height:120px;border-radius:60px}\n"] }]
-        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: NgxScandocCameraProvider }, { type: ScanProvider }] });
-
-class AppFormModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppFormModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: AppFormModule, declarations: [TitleTypeComponent,
-            AvatarTypeComponent,
-            ProfileImageTypeComponent], imports: [CommonModule,
-            FormsModule,
-            FormlyMatDatepickerModule,
-            FormlySelectModule,
-            MaterialModule,
-            AvatarModule,
-            TranslateModule,
-            FormlyMaterialModule, i7.FormlyModule], exports: [FormlyModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppFormModule, imports: [CommonModule,
-            FormsModule,
-            FormlyMatDatepickerModule,
-            FormlySelectModule,
-            MaterialModule,
-            AvatarModule,
-            TranslateModule,
-            FormlyMaterialModule,
-            FormlyModule.forChild({
-                types: [
-                    {
-                        name: 'title',
-                        component: TitleTypeComponent,
-                        wrappers: [],
-                    },
-                    {
-                        name: 'profile-image',
-                        component: ProfileImageTypeComponent,
-                        wrappers: [],
-                    },
-                ],
-            }), FormlyModule] }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: AppFormModule, decorators: [{
-            type: NgModule,
-            args: [{
-                    declarations: [
-                        TitleTypeComponent,
-                        AvatarTypeComponent,
-                        ProfileImageTypeComponent,
-                    ],
-                    imports: [
-                        CommonModule,
-                        FormsModule,
-                        FormlyMatDatepickerModule,
-                        FormlySelectModule,
-                        MaterialModule,
-                        AvatarModule,
-                        TranslateModule,
-                        FormlyMaterialModule,
-                        FormlyModule.forChild({
-                            types: [
-                                {
-                                    name: 'title',
-                                    component: TitleTypeComponent,
-                                    wrappers: [],
-                                },
-                                {
-                                    name: 'profile-image',
-                                    component: ProfileImageTypeComponent,
-                                    wrappers: [],
-                                },
-                            ],
-                        }),
-                    ],
-                    providers: [],
-                    exports: [FormlyModule],
-                }]
-        }] });
-
-class CameraSwitchComponent {
-    constructor(cameraProvider) {
-        this.cameraProvider = cameraProvider;
-    }
-    ngAfterViewInit() {
-        // this.cameraProvider.setDefault();
+        this.action.emit({ selfie: true });
     }
-    ngOnDestroy() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CameraSwitchComponent, deps: [{ token: NgxScandocCameraProvider }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: CameraSwitchComponent, isStandalone: false, selector: "ngx-scan-camera-switch", ngImport: i0, template: "<mat-form-field\n  style=\"font-size: 14px;  margin-top: 8px\"\n  class=\"w-100-p mr-16 mt-8\"\n\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: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$3.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$3.MatLabel, selector: "mat-label" }, { kind: "component", type: i5$2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "component", type: i5$2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanResultsComponent, deps: [{ token: NgxScandocCameraProvider }, { token: NgxScandocFieldsProvider }, { token: ScanProvider }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ScanResultsComponent, isStandalone: false, selector: "ngx-scan-results", inputs: { data: "data", images: "images", form: "form" }, outputs: { action: "action" }, usesInheritance: true, ngImport: i0, template: "<div *ngIf=\"model\" class=\"wraper\">\n  <div style=\"flex: 1\">\n\n\n    <form class=\"py-0 w-100-p\" [formGroup]=\"form\">\n      <formly-form fxFlex [form]=\"form\" [fields]=\"fields\" [model]=\"model\">\n      </formly-form>\n    </form>\n  </div>\n  <div style=\"flex: 1\" >\n    <mat-card appearance=\"outlined\" style=\"margin:0px 4px; padding: 16px\" class=\"images\">\n      <h3>{{ \"scandoc.result.images\" | translate }}</h3>\n      <ng-container *ngFor=\"let img of model.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-y:auto;overflow-x:hidden}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px;width:100%}.wraper{padding:4px;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: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "component", type: i1$2.LegacyFormlyForm, selector: "formly-form" }, { kind: "directive", type: i5$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CameraSwitchComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanResultsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ngx-scan-camera-switch', standalone: false, template: "<mat-form-field\n  style=\"font-size: 14px;  margin-top: 8px\"\n  class=\"w-100-p mr-16 mt-8\"\n\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: () => [{ type: NgxScandocCameraProvider }] });
+            args: [{ selector: 'ngx-scan-results', standalone: false, template: "<div *ngIf=\"model\" class=\"wraper\">\n  <div style=\"flex: 1\">\n\n\n    <form class=\"py-0 w-100-p\" [formGroup]=\"form\">\n      <formly-form fxFlex [form]=\"form\" [fields]=\"fields\" [model]=\"model\">\n      </formly-form>\n    </form>\n  </div>\n  <div style=\"flex: 1\" >\n    <mat-card appearance=\"outlined\" style=\"margin:0px 4px; padding: 16px\" class=\"images\">\n      <h3>{{ \"scandoc.result.images\" | translate }}</h3>\n      <ng-container *ngFor=\"let img of model.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-y:auto;overflow-x:hidden}.images .title{padding:8px 0;font-weight:600}.images img{margin-bottom:16px;width:100%}.wraper{padding:4px;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: () => [{ type: NgxScandocCameraProvider }, { type: NgxScandocFieldsProvider }, { type: ScanProvider }, { type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { data: [{
+                type: Input
+            }], images: [{
+                type: Input
+            }], form: [{
+                type: Input
+            }], action: [{
+                type: Output
+            }] } });
 
 //import { NgxScandocCameraProvider } from '../../providers/camera.provider';
 class CoreComponentsModule {
@@ -3586,7 +3586,7 @@ class SafeResourceUrlPipe {
         // return this.sanitizer.bypassSecurityTrustStyle(style);
         // return this.sanitizer.bypassSecurityTrustXxx(style); - see docs
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SafeResourceUrlPipe, deps: [{ token: i1$2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SafeResourceUrlPipe, deps: [{ token: i1$3.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe }); }
     static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.14", ngImport: i0, type: SafeResourceUrlPipe, isStandalone: false, name: "safeResourceUrl" }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: SafeResourceUrlPipe, decorators: [{
@@ -3595,7 +3595,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
                     name: 'safeResourceUrl',
                     standalone: false
                 }]
-        }], ctorParameters: () => [{ type: i1$2.DomSanitizer }] });
+        }], ctorParameters: () => [{ type: i1$3.DomSanitizer }] });
 
 class CorePipesModule {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: CorePipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
@@ -3667,13 +3667,13 @@ class ScanProfileComponent extends BaseComponent {
     close() {
         this.dialogRef?.close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanProfileComponent, deps: [{ token: NgxScandocCameraProvider }, { token: ScanProvider }, { token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanProfileComponent, deps: [{ token: NgxScandocCameraProvider }, { token: ScanProvider }, { token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ScanProfileComponent, isStandalone: false, selector: "ngx-scandoc-profile", inputs: { type: "type" }, host: { listeners: { "touchmove": "handleTouchMove($event)" } }, usesInheritance: true, ngImport: i0, template: "<header class=\"page-header\">\n  <div class=\"title\">\n    {{ \"scandoc.title\" | translate }}\n  </div>\n\n  <span style=\"flex: 1\"></span>\n\n  <ng-container *ngIf=\"cameraProvider.$showSwitch | async\">\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%}@media only screen and (max-width: 768px){header .title{font-size:12px!important;line-height:18px!important}}\n", ".page-header{z-index:2000;height:64px;padding:0;overflow:hidden;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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: ScanComponent, selector: "ngx-scan", inputs: ["type", "dialogs", "refresh", "showDialog"], outputs: ["actions"] }, { kind: "component", type: CameraSwitchComponent, selector: "ngx-scan-camera-switch" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanProfileComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-scandoc-profile', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<header class=\"page-header\">\n  <div class=\"title\">\n    {{ \"scandoc.title\" | translate }}\n  </div>\n\n  <span style=\"flex: 1\"></span>\n\n  <ng-container *ngIf=\"cameraProvider.$showSwitch | async\">\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%}@media only screen and (max-width: 768px){header .title{font-size:12px!important;line-height:18px!important}}\n", ".page-header{z-index:2000;height:64px;padding:0;overflow:hidden;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: () => [{ type: NgxScandocCameraProvider }, { type: ScanProvider }, { type: i1$3.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: NgxScandocCameraProvider }, { type: ScanProvider }, { type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }], propDecorators: { type: [{
@@ -3711,13 +3711,13 @@ class BlankComponent {
             this.init();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BlankComponent, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BlankComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: BlankComponent, isStandalone: false, selector: "ngx-scandoc-blank", viewQueries: [{ propertyName: "body", first: true, predicate: ["body"], descendants: true, read: ViewContainerRef, static: true }], ngImport: i0, template: "<ng-template #body></ng-template>\n", styles: [":host{display:flex;flex:1;flex-direction:column;overflow:hidden;height:100%}\n"] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: BlankComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-scandoc-blank', standalone: false, template: "<ng-template #body></ng-template>\n", styles: [":host{display:flex;flex:1;flex-direction:column;overflow:hidden;height:100%}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }, { type: i0.ChangeDetectorRef }], propDecorators: { body: [{
@@ -3761,13 +3761,13 @@ class ConfirmComponent {
         this.dialogRef.close(key);
     }
     close() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ConfirmComponent, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ConfirmComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ConfirmComponent, isStandalone: false, selector: "ngx-scandoc-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  <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  <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 || \"scandoc.cancel\" | translate }}\n    </button>\n\n    <button\n      *ngIf=\"data.no && !options?.hideNoButton\"\n      (click)=\"action('no')\"\n      mat-raised-button\n    >\n      {{ data.no }}\n    </button>\n    <button\n      *ngIf=\"!data.hideOkButton && !options?.hideOkButton\"\n      (click)=\"action(true)\"\n      mat-raised-button\n    >\n      <ng-container *ngIf=\"!data.alert\">\n        {{ data.ok || \"scandoc.confirm\" | translate }}\n      </ng-container>\n\n      <ng-container *ngIf=\"data.alert\">\n        {{ data.ok || \"scandoc.ok\" | 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;padding:0 20px}.actions button{min-width:120px;margin-right:16px;text-transform:uppercase;box-shadow:none;border:1px solid rgba(0,0,0,.12)}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;overflow:hidden;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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ConfirmComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-scandoc-confirm', standalone: false, template: "<header class=\"page-header\" fxLayout=\"row\" fxLayoutAlign=\"start center\">\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  <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 || \"scandoc.cancel\" | translate }}\n    </button>\n\n    <button\n      *ngIf=\"data.no && !options?.hideNoButton\"\n      (click)=\"action('no')\"\n      mat-raised-button\n    >\n      {{ data.no }}\n    </button>\n    <button\n      *ngIf=\"!data.hideOkButton && !options?.hideOkButton\"\n      (click)=\"action(true)\"\n      mat-raised-button\n    >\n      <ng-container *ngIf=\"!data.alert\">\n        {{ data.ok || \"scandoc.confirm\" | translate }}\n      </ng-container>\n\n      <ng-container *ngIf=\"data.alert\">\n        {{ data.ok || \"scandoc.ok\" | 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;padding:0 20px}.actions button{min-width:120px;margin-right:16px;text-transform:uppercase;box-shadow:none;border:1px solid rgba(0,0,0,.12)}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;overflow:hidden;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: () => [{ type: i1$3.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }], propDecorators: { onEnterPress: [{
@@ -3846,13 +3846,13 @@ class ScanSelfieComponent extends BaseComponent {
     close() {
         this.dialogRef.close(null);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanSelfieComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$3.MatDialogRef }, { token: NgxScandocCameraProvider }, { token: ScanProvider }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanSelfieComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$4.MatDialogRef }, { token: NgxScandocCameraProvider }, { token: ScanProvider }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ScanSelfieComponent, isStandalone: false, selector: "ngx-scandoc-selfie", outputs: { actions: "actions" }, usesInheritance: true, ngImport: i0, template: "<header class=\"page-header\">\n  <div class=\"title\">\n    {{ \"scandoc.result.takeSelfie\" | translate }}\n  </div>\n\n  <span style=\"flex: 1\"></span>\n\n  <ng-container *ngIf=\"cameraProvider.$showSwitchSelfie | async\">\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>\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\n<div 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>\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview\"\n        class=\"main flex\"\n        #webcam\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n        (initError)=\"handleInitError($event)\"\n        (videoReady)=\"videoReady($event)\"\n        type=\"selfie\"\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      >\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> {{ \"scandoc.result.takeSelfie\" | translate }} </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        {{ \"scandoc.retry\" | translate }}\n      </button>\n\n      <button\n        style=\"flex: 1\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{ \"scandoc.continueWithSelectedImage\" | translate }}\n      </button>\n    </div>\n  </footer>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}.flex{flex:1}.flex-column{display:flex;flex-direction:column}.flex-row{display:flex;flex-direction:row}.wraper{position:relative;overflow:hidden}h3{color:#459ae5;font-size:16px}.preview{width:100%;border-radius:1%}.subhead{height:55px;padding-top:8px}footer button{box-shadow:none!important;height:45px;min-height:45px;border:1px solid rgba(0,0,0,.12);text-transform:uppercase}.error .title{font-size:22px}.error ul{font-size:18px}.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}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}@media only screen and (max-width: 768px){header .title{font-size:12px!important;line-height:18px!important}}\n", ".page-header{z-index:2000;height:64px;padding:0;overflow:hidden;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.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i8.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: WebcamComponent, selector: "ngx-scandoc-webcam", inputs: ["imageHandler", "type", "trigger", "refresh"], outputs: ["cameraSwitched", "videoReady", "imageCapture", "initError"] }, { kind: "component", type: CameraSwitchComponent, selector: "ngx-scan-camera-switch" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ScanSelfieComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-scandoc-selfie', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<header class=\"page-header\">\n  <div class=\"title\">\n    {{ \"scandoc.result.takeSelfie\" | translate }}\n  </div>\n\n  <span style=\"flex: 1\"></span>\n\n  <ng-container *ngIf=\"cameraProvider.$showSwitchSelfie | async\">\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>\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\n<div 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>\n      <ngx-scandoc-webcam\n        *ngIf=\"!preview\"\n        class=\"main flex\"\n        #webcam\n        [trigger]=\"trigger\"\n        (imageCapture)=\"handleImage($event)\"\n        (initError)=\"handleInitError($event)\"\n        (videoReady)=\"videoReady($event)\"\n        type=\"selfie\"\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      >\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> {{ \"scandoc.result.takeSelfie\" | translate }} </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        {{ \"scandoc.retry\" | translate }}\n      </button>\n\n      <button\n        style=\"flex: 1\"\n        class=\"ml-4\"\n        mat-raised-button\n        (click)=\"continue()\"\n      >\n        {{ \"scandoc.continueWithSelectedImage\" | translate }}\n      </button>\n    </div>\n  </footer>\n</div>\n", styles: [":host{display:flex;flex-direction:column!important;flex:1;background-color:#f5f5f5}.flex{flex:1}.flex-column{display:flex;flex-direction:column}.flex-row{display:flex;flex-direction:row}.wraper{position:relative;overflow:hidden}h3{color:#459ae5;font-size:16px}.preview{width:100%;border-radius:1%}.subhead{height:55px;padding-top:8px}footer button{box-shadow:none!important;height:45px;min-height:45px;border:1px solid rgba(0,0,0,.12);text-transform:uppercase}.error .title{font-size:22px}.error ul{font-size:18px}.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}.page-header{display:flex;flex-direction:row;align-items:center}.page-header button{height:100%}@media only screen and (max-width: 768px){header .title{font-size:12px!important;line-height:18px!important}}\n", ".page-header{z-index:2000;height:64px;padding:0;overflow:hidden;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: () => [{ type: i0.ChangeDetectorRef }, { type: i1$3.MatDialogRef }, { type: NgxScandocCameraProvider }, { type: ScanProvider }], propDecorators: { actions: [{
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$4.MatDialogRef }, { type: NgxScandocCameraProvider }, { type: ScanProvider }], propDecorators: { actions: [{
                 type: Output
             }] } });
 
@@ -3868,13 +3868,13 @@ class TurnDocumentComponent {
         console.log(this.dialogRef);
         this.dialogRef.close();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TurnDocumentComponent, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TurnDocumentComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: TurnDocumentComponent, isStandalone: false, selector: "ngx-scandoc-turn-document", 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: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TurnDocumentComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-scandoc-turn-document', standalone: false, 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: () => [{ type: i1$3.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }] });
@@ -3891,13 +3891,13 @@ class PromptManualComponent {
         console.log(this.dialogRef);
         this.dialogRef.close(key);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PromptManualComponent, deps: [{ token: i1$3.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PromptManualComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: PromptManualComponent, isStandalone: false, selector: "ngx-scandoc-prompt-manual", 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>screenshot_keyboard</mat-icon>\n  <div class=\"text\">\n    {{ \"scandoc.manual\" | translate }}\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n  <button style=\"margin-right: 8px\" (click)=\"close(true)\" mat-raised-button>\n    {{ \"scandoc.yes\" | translate }}\n  </button>\n  <button style=\"margin-left: 8px\" (click)=\"close(false)\" mat-raised-button>\n    {{ \"scandoc.no\" | translate }}\n  </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:10px}footer button{max-width:120px;box-shadow:none;border:1px solid #ccc;flex:1}\n"], dependencies: [{ kind: "component", type: i5$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "pipe", type: i4$1.TranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: PromptManualComponent, decorators: [{
             type: Component,
             args: [{ selector: 'ngx-scandoc-prompt-manual', standalone: false, 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>screenshot_keyboard</mat-icon>\n  <div class=\"text\">\n    {{ \"scandoc.manual\" | translate }}\n  </div>\n</div>\n\n<!--  -->\n\n<footer>\n  <button style=\"margin-right: 8px\" (click)=\"close(true)\" mat-raised-button>\n    {{ \"scandoc.yes\" | translate }}\n  </button>\n  <button style=\"margin-left: 8px\" (click)=\"close(false)\" mat-raised-button>\n    {{ \"scandoc.no\" | translate }}\n  </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:10px}footer button{max-width:120px;box-shadow:none;border:1px solid #ccc;flex:1}\n"] }]
-        }], ctorParameters: () => [{ type: i1$3.MatDialogRef }, { type: undefined, decorators: [{
+        }], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [MAT_DIALOG_DATA]
                 }] }] });
@@ -4003,7 +4003,7 @@ class NgxScandocDialogsCoreProvider {
             data,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocDialogsCoreProvider, deps: [{ token: i1$3.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocDialogsCoreProvider, deps: [{ token: i1$4.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocDialogsCoreProvider, providedIn: 'root' }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: NgxScandocDialogsCoreProvider, decorators: [{
@@ -4011,7 +4011,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: i1$3.MatDialog }] });
+        }], ctorParameters: () => [{ type: i1$4.MatDialog }] });
 
 //import { NgxScandocCameraProvider } from '../providers/camera.provider';
 //import { NgxScandocCameraProvider } from '../providers/camera.provider';