@pepperi-addons/ngx-lib 0.2.60 → 0.2.61-beta.1

package/fesm2015/pepperi-addons-ngx-lib-files-uploader.js.map

@@ -1 +1 @@
-{"version":3,"file":"pepperi-addons-ngx-lib-files-uploader.js","sources":["../../../projects/ngx-lib/files-uploader/files-uploader.component.ts","../../../projects/ngx-lib/files-uploader/files-uploader.module.ts","../../../projects/ngx-lib/files-uploader/public-api.ts","../../../projects/ngx-lib/files-uploader/pepperi-addons-ngx-lib-files-uploader.ts"],"sourcesContent":["import { Observable } from 'rxjs';\nimport {\n    Component,\n    OnInit,\n    Injectable,\n    Input,\n    Output,\n    EventEmitter,\n    ViewChild,\n    ChangeDetectorRef,\n    ChangeDetectionStrategy,\n    Optional,\n} from '@angular/core';\nimport { TranslateService } from '@ngx-translate/core';\nimport { FileUploader } from 'ng2-file-upload';\nimport { FormGroup } from '@angular/forms';\nimport {\n    PepFileService,\n    PepLayoutType,\n    PepCustomizationService,\n    PepHorizontalAlignment,\n    DEFAULT_HORIZONTAL_ALIGNMENT,\n    IPepFieldClickEvent,\n} from '@pepperi-addons/ngx-lib';\nimport {\n    PepDialogService,\n    PepDialogData,\n} from '@pepperi-addons/ngx-lib/dialog';\nimport { pepIconNoImage2 } from '@pepperi-addons/ngx-lib/icon';\n\nexport interface IPepFileChangeEvent {\n    acceptedExtensions?: string;\n    fileStr?: string;\n    fileName?: string;\n    fileExt?: string;\n}\n\n@Component({\n    selector: 'pep-files-uploader',\n    templateUrl: './files-uploader.component.html',\n    styleUrls: ['./files-uploader.component.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\n@Injectable()\nexport class PepFilesUploaderComponent implements OnInit {\n    @Input() key = '';\n    @Input() src = '';\n    @Input() label = '';\n    @Input() mandatory = false;\n    @Input() disabled = false;\n    @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n\n    private _rowSpan = 1;\n    @Input()\n    set rowSpan(value) {\n        this._rowSpan = value;\n    }\n    get rowSpan(): number {\n        return this._rowSpan;\n    }\n\n    @Input() controlType = '';\n    @Input() sizeLimitMB = 5;\n\n    @Input() form: FormGroup;\n    @Input() standAlone = false;\n    @Input() acceptedExtensions = 'bmp,jpg,jpeg,png,gif,ico,svg,html,css';\n    @Input() layoutType: PepLayoutType = 'form';\n\n    @Output()\n    fileChange: EventEmitter<IPepFileChangeEvent> = new EventEmitter<IPepFileChangeEvent>();\n    @Output()\n    elementClick: EventEmitter<IPepFieldClickEvent> = new EventEmitter<IPepFieldClickEvent>();\n\n    @ViewChild('fileInput') fileInput: any;\n    @ViewChild('imagePreview') imagePreview: any;\n\n    @Input() fieldHeight = '';\n\n    // multiple = false;\n    uploader: FileUploader;\n    progress = 0;\n    // response: string;\n    intervalID: any = null;\n\n    constructor(\n        private dialogService: PepDialogService,\n        private customizationService: PepCustomizationService,\n        private fileService: PepFileService,\n        private translate: TranslateService\n    ) {\n        this.uploader = new FileUploader({ removeAfterUpload: true });\n\n        this.uploader.onAfterAddingFile = (item) => {\n            if (this.fileInput?.nativeElement) {\n                this.fileInput.nativeElement.value = '';\n            }\n            const reader = new FileReader();\n\n            reader.onload = (event: any) => {\n                const fileNameArray = item._file.name.split('.');\n                const fileName = fileNameArray[0];\n                const fileExt = fileNameArray[1]; // item._file.name.split('.').pop();\n                const target = event.target || event.srcElement;\n                const fileStr = target.result;\n                const errorMsg = this.isValidFile(\n                    fileStr,\n                    fileExt,\n                    this.acceptedExtensions,\n                    this.sizeLimitMB\n                );\n                if (errorMsg === '') {\n                    this.src = fileStr;\n                    // this.setIntervalX(25, 75);\n                    // this.setProgress(5);\n                    this.fileChange.emit({\n                        acceptedExtensions: this.acceptedExtensions,\n                        fileStr,\n                        fileName,\n                        fileExt,\n                    });\n                } else {\n                    const title = this.translate.instant(\n                        'MESSAGES.TITLE_NOTICE'\n                    );\n                    const data = new PepDialogData({\n                        title,\n                        content: errorMsg,\n                    });\n                    this.dialogService.openDefaultDialog(data);\n                }\n            };\n            reader.readAsDataURL(item._file);\n        };\n    }\n\n    ngOnInit(): void {\n        /*this.uploader.onCompleteAll = () => {\n            this.fileInput.nativeElement.value = '';\n        }*/\n    }\n\n    isValidFile(\n        fileStr,\n        fileExtension,\n        acceptedExtensions,\n        sizeLimitMB = 5\n    ): string {\n        const file: any = fileStr;\n        let fileSize = 0;\n        let content = '';\n        // check if got file as Base64\n        if (typeof fileStr === 'string' && fileStr.indexOf('data:') > -1) {\n            fileSize = this.getBase64FileSize(fileStr);\n        } else {\n            fileSize = file.size;\n        }\n        // check the size and the extension\n        const sizeOK: boolean =\n            fileSize !== -1 && file != null && fileSize < sizeLimitMB * 1048576;\n        const extensionOK =\n            acceptedExtensions === '' ||\n            acceptedExtensions.indexOf(fileExtension.toLowerCase()) !== -1;\n        if (!extensionOK) {\n            content = this.translate.instant(\n                'MESSAGES.ERROR_FAILD_TO_LOAD_EXTENSION',\n                {\n                    fileExtension:\n                        \"<label class='uppercase bold'>\" +\n                        fileExtension +\n                        '</label>',\n                }\n            );\n        } else if (!sizeOK) {\n            content = this.translate.instant(\n                'MESSAGES.ERROR_FAILD_TO_LOAD_SIZE',\n                {\n                    fileSize:\n                        \"<label class='uppercase bold'>\" +\n                        sizeLimitMB.toString() +\n                        '</label>',\n                }\n            );\n        }\n        return content;\n    }\n\n    getBase64FileSize(base64String: string): number {\n        let fileSize: number;\n\n        try {\n            base64String = base64String.substr(base64String.indexOf(',') + 1);\n            fileSize = atob(base64String).length;\n        } catch (e) {\n            fileSize = -1;\n        }\n\n        return fileSize; // return size in bytes;\n    }\n\n    // setIntervalX(delay, repetitions): void {\n    //     let x = 0;\n    //     this.intervalID = window.setInterval(() => {\n    //         // this.setProgress(this.progress + 5);\n    //         if (++x === repetitions || this.uploader.progress >= 100) {\n    //             window.clearInterval(this.intervalID);\n    //         }\n    //     }, delay);\n    // }\n\n    errorHandler(event): void {\n        event.target.src = this.fileService.getSvgAsImageSrc(\n            pepIconNoImage2.data\n        );\n        event.target.title = this.translate.instant('IMAGE.NO_IMAGE');\n    }\n\n    private setProgress(progress): void {\n        this.progress = progress;\n        this.uploader.progress = progress;\n    }\n\n    deleteFile(): void {\n        this.uploader.clearQueue();\n        window.clearInterval(this.intervalID);\n        this.setProgress(0);\n\n        const empltValue = '';\n        this.src = empltValue;\n\n        this.fileChange.emit(null);\n\n        // this.fileChange.emit({\n        //     acceptedExtensions: this.acceptedExtensions,\n        //     fileStr: null,\n        //     fileExt: null,\n        // });\n    }\n\n    onElementClicked(event): void {\n        this.elementClick.emit({\n            key: this.key,\n            controlType: this.controlType,\n            eventWhich: event.which,\n        });\n    }\n\n    onClick_ChooseFile(event): void {\n        if (this.fileInput?.nativeElement) {\n            this.fileInput.nativeElement.click();\n        }\n    }\n\n    onKeyPress_ChooseFile(event): void {\n        const e = event as KeyboardEvent;\n\n        if ([13, 32].indexOf(e.which) !== -1) {\n            if (this.fileInput?.nativeElement) {\n                this.fileInput.nativeElement.click();\n            }\n        }\n        e.preventDefault();\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatIconModule } from '@angular/material/icon';\n\nimport { FileUploadModule } from 'ng2-file-upload';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport {\n    PepIconModule,\n    PepIconRegistry,\n    pepIconSystemBin,\n    pepIconSystemAttach,\n    pepIconSystemFileUploadCloud,\n    pepIconSystemProcessing,\n} from '@pepperi-addons/ngx-lib/icon';\nimport { PepDialogModule } from '@pepperi-addons/ngx-lib/dialog';\n\nimport { PepFilesUploaderComponent } from './files-uploader.component';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        ReactiveFormsModule,\n        // Material modules,\n        MatCommonModule,\n        MatButtonModule,\n        MatFormFieldModule,\n        MatInputModule,\n        MatIconModule,\n        // External modules\n        FileUploadModule,\n        // ngx-lib modules\n        PepNgxLibModule,\n        PepIconModule,\n        PepDialogModule,\n    ],\n    exports: [PepFilesUploaderComponent],\n    declarations: [PepFilesUploaderComponent],\n})\nexport class PepFilesUploaderModule {\n    constructor(private pepIconRegistry: PepIconRegistry) {\n        this.pepIconRegistry.registerIcons([\n            pepIconSystemBin,\n            pepIconSystemAttach,\n            pepIconSystemFileUploadCloud,\n            pepIconSystemProcessing,\n        ]);\n    }\n}\n","/*\n * Public API Surface of ngx-lib/files-uploader\n */\nexport * from './files-uploader.module';\nexport * from './files-uploader.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"pepperi-addons-ngx-lib-files-uploader.js","sources":["../../../projects/ngx-lib/files-uploader/files-uploader.component.ts","../../../projects/ngx-lib/files-uploader/files-uploader.module.ts","../../../projects/ngx-lib/files-uploader/public-api.ts","../../../projects/ngx-lib/files-uploader/pepperi-addons-ngx-lib-files-uploader.ts"],"sourcesContent":["import { Observable } from 'rxjs';\nimport {\n    Component,\n    OnInit,\n    Injectable,\n    Input,\n    Output,\n    EventEmitter,\n    ViewChild,\n    ChangeDetectorRef,\n    ChangeDetectionStrategy,\n    Optional,\n} from '@angular/core';\nimport { TranslateService } from '@ngx-translate/core';\nimport { FileUploader } from 'ng2-file-upload';\nimport { FormGroup } from '@angular/forms';\nimport {\n    PepFileService,\n    PepLayoutType,\n    PepCustomizationService,\n    PepHorizontalAlignment,\n    DEFAULT_HORIZONTAL_ALIGNMENT,\n    IPepFieldClickEvent,\n} from '@pepperi-addons/ngx-lib';\nimport {\n    PepDialogService,\n    PepDialogData,\n} from '@pepperi-addons/ngx-lib/dialog';\nimport { pepIconNoImage2 } from '@pepperi-addons/ngx-lib/icon';\n\nexport interface IPepFileChangeEvent {\n    acceptedExtensions?: string;\n    fileStr?: string;\n    fileName?: string;\n    fileExt?: string;\n}\n\n@Component({\n    selector: 'pep-files-uploader',\n    templateUrl: './files-uploader.component.html',\n    styleUrls: ['./files-uploader.component.scss', './files-uploader.component.theme.scss'],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n})\n@Injectable()\nexport class PepFilesUploaderComponent implements OnInit {\n    @Input() key = '';\n    @Input() src = '';\n    @Input() label = '';\n    @Input() mandatory = false;\n    @Input() disabled = false;\n    @Input() xAlignment: PepHorizontalAlignment = DEFAULT_HORIZONTAL_ALIGNMENT;\n\n    private _rowSpan = 1;\n    @Input()\n    set rowSpan(value) {\n        this._rowSpan = value;\n    }\n    get rowSpan(): number {\n        return this._rowSpan;\n    }\n\n    @Input() controlType = '';\n    @Input() sizeLimitMB = 5;\n\n    @Input() form: FormGroup;\n    @Input() standAlone = false;\n    @Input() acceptedExtensions = 'bmp,jpg,jpeg,png,gif,ico,svg,html,css';\n    @Input() layoutType: PepLayoutType = 'form';\n\n    @Output()\n    fileChange: EventEmitter<IPepFileChangeEvent> = new EventEmitter<IPepFileChangeEvent>();\n    @Output()\n    elementClick: EventEmitter<IPepFieldClickEvent> = new EventEmitter<IPepFieldClickEvent>();\n\n    @ViewChild('fileInput') fileInput: any;\n    @ViewChild('imagePreview') imagePreview: any;\n\n    @Input() fieldHeight = '';\n\n    // multiple = false;\n    uploader: FileUploader;\n    progress = 0;\n    // response: string;\n    intervalID: any = null;\n\n    constructor(\n        private dialogService: PepDialogService,\n        private customizationService: PepCustomizationService,\n        private fileService: PepFileService,\n        private translate: TranslateService\n    ) {\n        this.uploader = new FileUploader({ removeAfterUpload: true });\n\n        this.uploader.onAfterAddingFile = (item) => {\n            if (this.fileInput?.nativeElement) {\n                this.fileInput.nativeElement.value = '';\n            }\n            const reader = new FileReader();\n\n            reader.onload = (event: any) => {\n                const fileNameArray = item._file.name.split('.');\n                const fileName = fileNameArray[0];\n                const fileExt = fileNameArray[1]; // item._file.name.split('.').pop();\n                const target = event.target || event.srcElement;\n                const fileStr = target.result;\n                const errorMsg = this.isValidFile(\n                    fileStr,\n                    fileExt,\n                    this.acceptedExtensions,\n                    this.sizeLimitMB\n                );\n                if (errorMsg === '') {\n                    this.src = fileStr;\n                    // this.setIntervalX(25, 75);\n                    // this.setProgress(5);\n                    this.fileChange.emit({\n                        acceptedExtensions: this.acceptedExtensions,\n                        fileStr,\n                        fileName,\n                        fileExt,\n                    });\n                } else {\n                    const title = this.translate.instant(\n                        'MESSAGES.TITLE_NOTICE'\n                    );\n                    const data = new PepDialogData({\n                        title,\n                        content: errorMsg,\n                    });\n                    this.dialogService.openDefaultDialog(data);\n                }\n            };\n            reader.readAsDataURL(item._file);\n        };\n    }\n\n    ngOnInit(): void {\n        /*this.uploader.onCompleteAll = () => {\n            this.fileInput.nativeElement.value = '';\n        }*/\n    }\n\n    isValidFile(\n        fileStr,\n        fileExtension,\n        acceptedExtensions,\n        sizeLimitMB = 5\n    ): string {\n        const file: any = fileStr;\n        let fileSize = 0;\n        let content = '';\n        // check if got file as Base64\n        if (typeof fileStr === 'string' && fileStr.indexOf('data:') > -1) {\n            fileSize = this.getBase64FileSize(fileStr);\n        } else {\n            fileSize = file.size;\n        }\n        // check the size and the extension\n        const sizeOK: boolean =\n            fileSize !== -1 && file != null && fileSize < sizeLimitMB * 1048576;\n        const extensionOK =\n            acceptedExtensions === '' ||\n            acceptedExtensions.indexOf(fileExtension.toLowerCase()) !== -1;\n        if (!extensionOK) {\n            content = this.translate.instant(\n                'MESSAGES.ERROR_FAILD_TO_LOAD_EXTENSION',\n                {\n                    fileExtension:\n                        \"<label class='uppercase bold'>\" +\n                        fileExtension +\n                        '</label>',\n                }\n            );\n        } else if (!sizeOK) {\n            content = this.translate.instant(\n                'MESSAGES.ERROR_FAILD_TO_LOAD_SIZE',\n                {\n                    fileSize:\n                        \"<label class='uppercase bold'>\" +\n                        sizeLimitMB.toString() +\n                        '</label>',\n                }\n            );\n        }\n        return content;\n    }\n\n    getBase64FileSize(base64String: string): number {\n        let fileSize: number;\n\n        try {\n            base64String = base64String.substr(base64String.indexOf(',') + 1);\n            fileSize = atob(base64String).length;\n        } catch (e) {\n            fileSize = -1;\n        }\n\n        return fileSize; // return size in bytes;\n    }\n\n    // setIntervalX(delay, repetitions): void {\n    //     let x = 0;\n    //     this.intervalID = window.setInterval(() => {\n    //         // this.setProgress(this.progress + 5);\n    //         if (++x === repetitions || this.uploader.progress >= 100) {\n    //             window.clearInterval(this.intervalID);\n    //         }\n    //     }, delay);\n    // }\n\n    errorHandler(event): void {\n        event.target.src = this.fileService.getSvgAsImageSrc(\n            pepIconNoImage2.data\n        );\n        event.target.title = this.translate.instant('IMAGE.NO_IMAGE');\n    }\n\n    private setProgress(progress): void {\n        this.progress = progress;\n        this.uploader.progress = progress;\n    }\n\n    deleteFile(): void {\n        this.uploader.clearQueue();\n        window.clearInterval(this.intervalID);\n        this.setProgress(0);\n\n        const empltValue = '';\n        this.src = empltValue;\n\n        this.fileChange.emit(null);\n\n        // this.fileChange.emit({\n        //     acceptedExtensions: this.acceptedExtensions,\n        //     fileStr: null,\n        //     fileExt: null,\n        // });\n    }\n\n    onElementClicked(event): void {\n        this.elementClick.emit({\n            key: this.key,\n            controlType: this.controlType,\n            eventWhich: event.which,\n        });\n    }\n\n    onClick_ChooseFile(event): void {\n        if (this.fileInput?.nativeElement) {\n            this.fileInput.nativeElement.click();\n        }\n    }\n\n    onKeyPress_ChooseFile(event): void {\n        const e = event as KeyboardEvent;\n\n        if ([13, 32].indexOf(e.which) !== -1) {\n            if (this.fileInput?.nativeElement) {\n                this.fileInput.nativeElement.click();\n            }\n        }\n        e.preventDefault();\n    }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { ReactiveFormsModule } from '@angular/forms';\n\nimport { MatCommonModule } from '@angular/material/core';\nimport { MatButtonModule } from '@angular/material/button';\nimport { MatFormFieldModule } from '@angular/material/form-field';\nimport { MatInputModule } from '@angular/material/input';\nimport { MatIconModule } from '@angular/material/icon';\n\nimport { FileUploadModule } from 'ng2-file-upload';\n\nimport { PepNgxLibModule } from '@pepperi-addons/ngx-lib';\nimport {\n    PepIconModule,\n    PepIconRegistry,\n    pepIconSystemBin,\n    pepIconSystemAttach,\n    pepIconSystemFileUploadCloud,\n    pepIconSystemProcessing,\n} from '@pepperi-addons/ngx-lib/icon';\nimport { PepDialogModule } from '@pepperi-addons/ngx-lib/dialog';\n\nimport { PepFilesUploaderComponent } from './files-uploader.component';\n\n@NgModule({\n    imports: [\n        CommonModule,\n        ReactiveFormsModule,\n        // Material modules,\n        MatCommonModule,\n        MatButtonModule,\n        MatFormFieldModule,\n        MatInputModule,\n        MatIconModule,\n        // External modules\n        FileUploadModule,\n        // ngx-lib modules\n        PepNgxLibModule,\n        PepIconModule,\n        PepDialogModule,\n    ],\n    exports: [PepFilesUploaderComponent],\n    declarations: [PepFilesUploaderComponent],\n})\nexport class PepFilesUploaderModule {\n    constructor(private pepIconRegistry: PepIconRegistry) {\n        this.pepIconRegistry.registerIcons([\n            pepIconSystemBin,\n            pepIconSystemAttach,\n            pepIconSystemFileUploadCloud,\n            pepIconSystemProcessing,\n        ]);\n    }\n}\n","/*\n * Public API Surface of ngx-lib/files-uploader\n */\nexport * from './files-uploader.module';\nexport * from './files-uploader.component';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2015/pepperi-addons-ngx-lib-form.js

@@ -1339,7 +1339,7 @@ PepIndicatorsComponent.decorators = [
                 selector: 'pep-indicators',
                 template: "<div class=\"indicators-container\" [ngClass]=\"{ 'is-inside-table': layoutType === 'table' }\">\n    <ng-container *ngFor=\"let value of value?.split(';')\">\n        <pep-icon name=\"indicator_dot_placeholder\" class=\"pull-left flip\" [fill]=\"value\"></pep-icon>\n    </ng-container>\n    <ng-container *ngIf=\"key != 'ItemIndicatorsWithoutCampaign' && value?.split(';').length < 4\">\n        <pep-icon name=\"indicator_dot_placeholder\" class=\"pull-left flip\"></pep-icon>\n    </ng-container>\n</div>",
                 changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [":host{height:inherit;display:grid}:host>*{align-self:center}.indicators-container{height:2.5rem}.indicators-container pep-icon{height:1rem;width:1rem;margin:.05rem}.indicators-container.is-inside-table{height:1rem;display:flex;justify-content:center;align-items:center}"]
+                styles: [":host{height:inherit;display:grid}:host>*{align-self:center}.indicators-container{height:2.5rem}.indicators-container pep-icon{height:1rem;width:1rem;margin:.05rem}.indicators-container.is-inside-table{height:1rem;display:flex;justify-content:center;align-items:center}", ".indicators-container .svg-icon{fill:hsla(0,0%,100%,.5);fill:hsla(var(--pep-color-system-primary-invert-h,255),var(--pep-color-system-primary-invert-s,100%),var(--pep-color-system-primary-invert-l,100%),.5)}"]
             },] }
 ];
 PepIndicatorsComponent.propDecorators = {
@@ -1370,7 +1370,7 @@ class PepInternalButtonComponent {
         this.layoutType = 'form';
         this.elementClick = new EventEmitter();
         this.valueChange = new EventEmitter();
-        this.standAlone = false;
+        // standAlone = false;
         this.createNewReference = false;
         this.referenceButtons = [
             {
@@ -1398,20 +1398,23 @@ class PepInternalButtonComponent {
         return this._visible;
     }
     ngOnInit() {
-        if (this.form === null) {
-            this.standAlone = true;
-            // this.form = this.customizationService.getDefaultFromGroup(this.key, this.value, this.mandatory, this.readonly, this.disabled);
-            const pepField = new PepInternalButtonField({
-                key: this.key,
-                value: this.value,
-                mandatory: this.mandatory,
-                readonly: this.readonly,
-                disabled: this.disabled,
-            });
-            this.form = this.customizationService.getDefaultFromGroup(pepField);
-            this.formattedValue = this.formattedValue || this.value;
-            this.renderer.addClass(this.element.nativeElement, PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME);
-        }
+        // if (this.form === null) {
+        //     this.standAlone = true;
+        //     // this.form = this.customizationService.getDefaultFromGroup(this.key, this.value, this.mandatory, this.readonly, this.disabled);
+        //     const pepField = new PepInternalButtonField({
+        //         key: this.key,
+        //         value: this.value,
+        //         mandatory: this.mandatory,
+        //         readonly: this.readonly,
+        //         disabled: this.disabled,
+        //     });
+        //     this.form = this.customizationService.getDefaultFromGroup(pepField);
+        //     this.formattedValue = this.formattedValue || this.value;
+        //     this.renderer.addClass(
+        //         this.element.nativeElement,
+        //         PepCustomizationService.STAND_ALONE_FIELD_CLASS_NAME
+        //     );
+        // }
     }
     ngOnChanges(changes) {
         if (this.type === 'reference') {