kwikid-forms 0.5.5 → 0.5.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/bundles/kwikid-forms.umd.js +49 -38
  2. package/bundles/kwikid-forms.umd.js.map +1 -1
  3. package/esm2015/lib/renderer/form-view/form-view.component.js +16 -8
  4. package/esm2015/lib/renderer/form-view/form-view.module.js +8 -4
  5. package/fesm2015/kwikid-forms.js +22 -10
  6. package/fesm2015/kwikid-forms.js.map +1 -1
  7. package/lib/renderer/form-view/form-view.component.d.ts +2 -0
  8. package/lib/renderer/form-view/form-view.module.d.ts +2 -1
  9. package/package.json +2 -1
package/esm2015/lib/renderer/form-view/form-view.module.js CHANGED
@@ -6,6 +6,7 @@ import { TuiButtonModule, TuiDialogModule, TuiLabelModule, TuiSvgModule } from "
6
6
  import { TuiPushModule } from "@taiga-ui/kit";
7
7
  import { KwikUIModule, KwikUIPipeModule } from "kwikui";
8
8
  import { KwikIDFormViewComponent } from "./form-view.component";
9
+ import { KwikIDFingerprintModule } from "kwikid-verify";
9
10
  import * as i0 from "@angular/core";
10
11
  export class KwikIDFormViewModule {
11
12
  }
@@ -21,7 +22,8 @@ export class KwikIDFormViewModule {
21
22
  TuiPreviewActionModule,
22
23
  TuiDialogModule,
23
24
  KwikUIPipeModule,
24
- KwikUIModule], exports: [KwikIDFormViewComponent] });
25
+ KwikUIModule,
26
+ KwikIDFingerprintModule], exports: [KwikIDFormViewComponent] });
25
27
  /** @nocollapse */ KwikIDFormViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: KwikIDFormViewModule, imports: [[
26
28
  CommonModule,
27
29
  FormsModule,
@@ -34,7 +36,8 @@ export class KwikIDFormViewModule {
34
36
  TuiPreviewActionModule,
35
37
  TuiDialogModule,
36
38
  KwikUIPipeModule,
37
- KwikUIModule
39
+ KwikUIModule,
40
+ KwikIDFingerprintModule
38
41
  ]] });
39
42
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: KwikIDFormViewModule, decorators: [{
40
43
  type: NgModule,
@@ -52,9 +55,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
52
55
  TuiPreviewActionModule,
53
56
  TuiDialogModule,
54
57
  KwikUIPipeModule,
55
- KwikUIModule
58
+ KwikUIModule,
59
+ KwikIDFingerprintModule
56
60
  ],
57
61
  exports: [KwikIDFormViewComponent]
58
62
  }]
59
63
  }] });
60
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS12aWV3Lm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2t3aWtpZC1mb3Jtcy9zcmMvbGliL3JlbmRlcmVyL2Zvcm0tdmlldy9mb3JtLXZpZXcubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxXQUFXLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNsRSxPQUFPLEVBQ0wsc0JBQXNCLEVBQ3RCLGdCQUFnQixFQUNqQixNQUFNLHlCQUF5QixDQUFDO0FBQ2pDLE9BQU8sRUFDTCxlQUFlLEVBQ2YsZUFBZSxFQUNmLGNBQWMsRUFDZCxZQUFZLEVBQ2IsTUFBTSxnQkFBZ0IsQ0FBQztBQUN4QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzlDLE9BQU8sRUFBRSxZQUFZLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxRQUFRLENBQUM7QUFDeEQsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sdUJBQXVCLENBQUM7O0FBb0JoRSxNQUFNLE9BQU8sb0JBQW9COztxSUFBcEIsb0JBQW9CO3NJQUFwQixvQkFBb0IsaUJBakJoQix1QkFBdUIsYUFFcEMsWUFBWTtRQUNaLFdBQVc7UUFDWCxtQkFBbUI7UUFDbkIsY0FBYztRQUNkLGFBQWE7UUFDYixZQUFZO1FBQ1osZ0JBQWdCO1FBQ2hCLGVBQWU7UUFDZixzQkFBc0I7UUFDdEIsZUFBZTtRQUNmLGdCQUFnQjtRQUNoQixZQUFZLGFBRUosdUJBQXVCO3NJQUV0QixvQkFBb0IsWUFoQnRCO1lBQ1AsWUFBWTtZQUNaLFdBQVc7WUFDWCxtQkFBbUI7WUFDbkIsY0FBYztZQUNkLGFBQWE7WUFDYixZQUFZO1lBQ1osZ0JBQWdCO1lBQ2hCLGVBQWU7WUFDZixzQkFBc0I7WUFDdEIsZUFBZTtZQUNmLGdCQUFnQjtZQUNoQixZQUFZO1NBQ2I7NEZBR1Usb0JBQW9CO2tCQWxCaEMsUUFBUTttQkFBQztvQkFDUixZQUFZLEVBQUUsQ0FBQyx1QkFBdUIsQ0FBQztvQkFDdkMsT0FBTyxFQUFFO3dCQUNQLFlBQVk7d0JBQ1osV0FBVzt3QkFDWCxtQkFBbUI7d0JBQ25CLGNBQWM7d0JBQ2QsYUFBYTt3QkFDYixZQUFZO3dCQUNaLGdCQUFnQjt3QkFDaEIsZUFBZTt3QkFDZixzQkFBc0I7d0JBQ3RCLGVBQWU7d0JBQ2YsZ0JBQWdCO3dCQUNoQixZQUFZO3FCQUNiO29CQUNELE9BQU8sRUFBRSxDQUFDLHVCQUF1QixDQUFDO2lCQUNuQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb21tb25cIjtcbmltcG9ydCB7IE5nTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IEZvcm1zTW9kdWxlLCBSZWFjdGl2ZUZvcm1zTW9kdWxlIH0gZnJvbSBcIkBhbmd1bGFyL2Zvcm1zXCI7XG5pbXBvcnQge1xuICBUdWlQcmV2aWV3QWN0aW9uTW9kdWxlLFxuICBUdWlQcmV2aWV3TW9kdWxlXG59IGZyb20gXCJAdGFpZ2EtdWkvYWRkb24tcHJldmlld1wiO1xuaW1wb3J0IHtcbiAgVHVpQnV0dG9uTW9kdWxlLFxuICBUdWlEaWFsb2dNb2R1bGUsXG4gIFR1aUxhYmVsTW9kdWxlLFxuICBUdWlTdmdNb2R1bGVcbn0gZnJvbSBcIkB0YWlnYS11aS9jb3JlXCI7XG5pbXBvcnQgeyBUdWlQdXNoTW9kdWxlIH0gZnJvbSBcIkB0YWlnYS11aS9raXRcIjtcbmltcG9ydCB7IEt3aWtVSU1vZHVsZSwgS3dpa1VJUGlwZU1vZHVsZSB9IGZyb20gXCJrd2lrdWlcIjtcbmltcG9ydCB7IEt3aWtJREZvcm1WaWV3Q29tcG9uZW50IH0gZnJvbSBcIi4vZm9ybS12aWV3LmNvbXBvbmVudFwiO1xuXG5ATmdNb2R1bGUoe1xuICBkZWNsYXJhdGlvbnM6IFtLd2lrSURGb3JtVmlld0NvbXBvbmVudF0sXG4gIGltcG9ydHM6IFtcbiAgICBDb21tb25Nb2R1bGUsXG4gICAgRm9ybXNNb2R1bGUsXG4gICAgUmVhY3RpdmVGb3Jtc01vZHVsZSxcbiAgICBUdWlMYWJlbE1vZHVsZSxcbiAgICBUdWlQdXNoTW9kdWxlLFxuICAgIFR1aVN2Z01vZHVsZSxcbiAgICBUdWlQcmV2aWV3TW9kdWxlLFxuICAgIFR1aUJ1dHRvbk1vZHVsZSxcbiAgICBUdWlQcmV2aWV3QWN0aW9uTW9kdWxlLFxuICAgIFR1aURpYWxvZ01vZHVsZSxcbiAgICBLd2lrVUlQaXBlTW9kdWxlLFxuICAgIEt3aWtVSU1vZHVsZVxuICBdLFxuICBleHBvcnRzOiBbS3dpa0lERm9ybVZpZXdDb21wb25lbnRdXG59KVxuZXhwb3J0IGNsYXNzIEt3aWtJREZvcm1WaWV3TW9kdWxlIHt9XG4iXX0=
64
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS12aWV3Lm1vZHVsZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2t3aWtpZC1mb3Jtcy9zcmMvbGliL3JlbmRlcmVyL2Zvcm0tdmlldy9mb3JtLXZpZXcubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxXQUFXLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNsRSxPQUFPLEVBQ0wsc0JBQXNCLEVBQ3RCLGdCQUFnQixFQUNqQixNQUFNLHlCQUF5QixDQUFDO0FBQ2pDLE9BQU8sRUFDTCxlQUFlLEVBQ2YsZUFBZSxFQUNmLGNBQWMsRUFDZCxZQUFZLEVBQ2IsTUFBTSxnQkFBZ0IsQ0FBQztBQUN4QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzlDLE9BQU8sRUFBRSxZQUFZLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxRQUFRLENBQUM7QUFDeEQsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDaEUsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sZUFBZSxDQUFDOztBQXFCeEQsTUFBTSxPQUFPLG9CQUFvQjs7cUlBQXBCLG9CQUFvQjtzSUFBcEIsb0JBQW9CLGlCQWxCaEIsdUJBQXVCLGFBRXBDLFlBQVk7UUFDWixXQUFXO1FBQ1gsbUJBQW1CO1FBQ25CLGNBQWM7UUFDZCxhQUFhO1FBQ2IsWUFBWTtRQUNaLGdCQUFnQjtRQUNoQixlQUFlO1FBQ2Ysc0JBQXNCO1FBQ3RCLGVBQWU7UUFDZixnQkFBZ0I7UUFDaEIsWUFBWTtRQUNaLHVCQUF1QixhQUVmLHVCQUF1QjtzSUFFdEIsb0JBQW9CLFlBakJ0QjtZQUNQLFlBQVk7WUFDWixXQUFXO1lBQ1gsbUJBQW1CO1lBQ25CLGNBQWM7WUFDZCxhQUFhO1lBQ2IsWUFBWTtZQUNaLGdCQUFnQjtZQUNoQixlQUFlO1lBQ2Ysc0JBQXNCO1lBQ3RCLGVBQWU7WUFDZixnQkFBZ0I7WUFDaEIsWUFBWTtZQUNaLHVCQUF1QjtTQUN4Qjs0RkFHVSxvQkFBb0I7a0JBbkJoQyxRQUFRO21CQUFDO29CQUNSLFlBQVksRUFBRSxDQUFDLHVCQUF1QixDQUFDO29CQUN2QyxPQUFPLEVBQUU7d0JBQ1AsWUFBWTt3QkFDWixXQUFXO3dCQUNYLG1CQUFtQjt3QkFDbkIsY0FBYzt3QkFDZCxhQUFhO3dCQUNiLFlBQVk7d0JBQ1osZ0JBQWdCO3dCQUNoQixlQUFlO3dCQUNmLHNCQUFzQjt3QkFDdEIsZUFBZTt3QkFDZixnQkFBZ0I7d0JBQ2hCLFlBQVk7d0JBQ1osdUJBQXVCO3FCQUN4QjtvQkFDRCxPQUFPLEVBQUUsQ0FBQyx1QkFBdUIsQ0FBQztpQkFDbkMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tIFwiQGFuZ3VsYXIvY29tbW9uXCI7XG5pbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBGb3Jtc01vZHVsZSwgUmVhY3RpdmVGb3Jtc01vZHVsZSB9IGZyb20gXCJAYW5ndWxhci9mb3Jtc1wiO1xuaW1wb3J0IHtcbiAgVHVpUHJldmlld0FjdGlvbk1vZHVsZSxcbiAgVHVpUHJldmlld01vZHVsZVxufSBmcm9tIFwiQHRhaWdhLXVpL2FkZG9uLXByZXZpZXdcIjtcbmltcG9ydCB7XG4gIFR1aUJ1dHRvbk1vZHVsZSxcbiAgVHVpRGlhbG9nTW9kdWxlLFxuICBUdWlMYWJlbE1vZHVsZSxcbiAgVHVpU3ZnTW9kdWxlXG59IGZyb20gXCJAdGFpZ2EtdWkvY29yZVwiO1xuaW1wb3J0IHsgVHVpUHVzaE1vZHVsZSB9IGZyb20gXCJAdGFpZ2EtdWkva2l0XCI7XG5pbXBvcnQgeyBLd2lrVUlNb2R1bGUsIEt3aWtVSVBpcGVNb2R1bGUgfSBmcm9tIFwia3dpa3VpXCI7XG5pbXBvcnQgeyBLd2lrSURGb3JtVmlld0NvbXBvbmVudCB9IGZyb20gXCIuL2Zvcm0tdmlldy5jb21wb25lbnRcIjtcbmltcG9ydCB7IEt3aWtJREZpbmdlcnByaW50TW9kdWxlIH0gZnJvbSBcImt3aWtpZC12ZXJpZnlcIjtcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbS3dpa0lERm9ybVZpZXdDb21wb25lbnRdLFxuICBpbXBvcnRzOiBbXG4gICAgQ29tbW9uTW9kdWxlLFxuICAgIEZvcm1zTW9kdWxlLFxuICAgIFJlYWN0aXZlRm9ybXNNb2R1bGUsXG4gICAgVHVpTGFiZWxNb2R1bGUsXG4gICAgVHVpUHVzaE1vZHVsZSxcbiAgICBUdWlTdmdNb2R1bGUsXG4gICAgVHVpUHJldmlld01vZHVsZSxcbiAgICBUdWlCdXR0b25Nb2R1bGUsXG4gICAgVHVpUHJldmlld0FjdGlvbk1vZHVsZSxcbiAgICBUdWlEaWFsb2dNb2R1bGUsXG4gICAgS3dpa1VJUGlwZU1vZHVsZSxcbiAgICBLd2lrVUlNb2R1bGUsXG4gICAgS3dpa0lERmluZ2VycHJpbnRNb2R1bGVcbiAgXSxcbiAgZXhwb3J0czogW0t3aWtJREZvcm1WaWV3Q29tcG9uZW50XVxufSlcbmV4cG9ydCBjbGFzcyBLd2lrSURGb3JtVmlld01vZHVsZSB7fVxuIl19
package/fesm2015/kwikid-forms.js CHANGED
@@ -13,12 +13,14 @@ import { CommonModule } from '@angular/common';
13
13
  import { trigger, transition, style, animate } from '@angular/animations';
14
14
  import _ from 'lodash';
15
15
  import { TuiDay } from '@taiga-ui/cdk';
16
- import * as i5 from '@taiga-ui/addon-preview';
16
+ import * as i6 from '@taiga-ui/addon-preview';
17
17
  import { TuiPreviewDialogService, TuiPreviewModule, TuiPreviewActionModule } from '@taiga-ui/addon-preview';
18
- import * as i4 from '@taiga-ui/kit';
18
+ import * as i5 from '@taiga-ui/kit';
19
19
  import { TuiPushService, TuiPushModule } from '@taiga-ui/kit';
20
20
  import { pairwise } from 'rxjs/operators';
21
21
  import { v4 } from 'uuid';
22
+ import * as i4 from 'kwikid-verify';
23
+ import { KwikIDFingerprintModule } from 'kwikid-verify';
22
24
  import { DragDropModule } from '@angular/cdk/drag-drop';
23
25
  import { HttpClientModule } from '@angular/common/http';
24
26
 
@@ -3721,6 +3723,13 @@ class KwikIDFormViewComponent {
3721
3723
  type: "popup"
3722
3724
  });
3723
3725
  }
3726
+ // Hardcoded Fingerprint ID
3727
+ handleGetKeyValueFingerprint(e) {
3728
+ this.handleGetKeyValue({ key: "fingerprint", value: e });
3729
+ }
3730
+ handleGetScanningStatus(e) {
3731
+ console.log("Scanning Status", e);
3732
+ }
3724
3733
  showPopupForm(popupFormKey, popupType = "DIALOG") {
3725
3734
  const popupFormConfig = this.formConfig.popupForms[popupFormKey];
3726
3735
  this.onActionShowPopupForm.emit({
@@ -3898,7 +3907,7 @@ class KwikIDFormViewComponent {
3898
3907
  }
3899
3908
  }
3900
3909
  /** @nocollapse */ KwikIDFormViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: KwikIDFormViewComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: KwikIDFormViewService }, { token: TuiPushService }, { token: TuiAlertService }, { token: TuiPreviewDialogService }, { token: TuiDialogService }], target: i0.ɵɵFactoryTarget.Component });
3901
- /** @nocollapse */ KwikIDFormViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormViewComponent, selector: "kwikid-form-view", inputs: { formConfig: "formConfig", formData: "formData", isMobileView: "isMobileView", allFormsData: "allFormsData", userConfig: "userConfig", apiCallResponse: "apiCallResponse", popupFormCallback: "popupFormCallback" }, outputs: { onClickGoBack: "onClickGoBack", onClickViewForms: "onClickViewForms", onClickSaveForm: "onClickSaveForm", onClickApiCall: "onClickApiCall", onActionShowPopupForm: "onActionShowPopupForm" }, providers: [KwikIDFormViewService], viewQueries: [{ propertyName: "preview", first: true, predicate: ["preview"], descendants: true }, { propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"kwikid-form-container\"\n *ngIf=\"!loading\"\n>\n <div\n id=\"uf-form-fields-header-container\"\n *ngIf=\"\n !formConfig.properties?.header?.title?.hidden ||\n !formConfig.properties?.header?.steps?.hidden ||\n !formConfig.properties?.header?.backButton?.hidden\n \"\n >\n <div id=\"uf-form-fields-header-main\">\n <div id=\"uf-form-fields-header-left\">\n <kwikui-button\n *ngIf=\"\n !formConfig.properties?.header.backButton.hidden && isMobileView\n \"\n [disabled]=\"backButton.disabled\"\n [showLoader]=\"backButton.showLoader\"\n appearance=\"mono\"\n icon=\"tuiIconArrowLeft\"\n shape=\"rounded\"\n (onClick)=\"\n handleOnClickGoBack(\n $event,\n formConfig.properties?.header.backButton.mode\n )\n \"\n ></kwikui-button>\n </div>\n <div id=\"uf-form-fields-header-right\">\n <div\n id=\"uf-form-fields-title\"\n *ngIf=\"!formConfig.properties?.header.title.hidden\"\n >{{ formConfig.properties?.header.title.label }}</div\n >\n <div\n id=\"uf-form-fields-steps\"\n *ngIf=\"!formConfig.properties?.header.steps.hidden\"\n >Step {{ formConfig.sequenceNo }} of\n {{ formConfig.formsListLength }}</div\n >\n </div>\n </div>\n <hr\n *ngIf=\"\n !formConfig.properties?.header.title.hidden ||\n !formConfig.properties?.header.steps.hidden ||\n !formConfig.properties?.header.backButton.hidden\n \"\n />\n </div>\n <form\n class=\"kwikid-form show\"\n [formGroup]=\"formGroup\"\n >\n <ng-container\n *ngFor=\"\n let field of formFields;\n let i = index;\n trackBy: getUniqueIdentifier\n \"\n >\n <ng-container [ngSwitch]=\"field.type\">\n <!-- HTML Content -->\n <ng-container *ngSwitchCase=\"'html'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <div [innerHtml]=\"field.html | kwikuiSafeHtml\"></div>\n </div>\n </ng-container>\n <!-- Form Title -->\n <ng-container *ngSwitchCase=\"'title'\">\n <div\n class=\"title\"\n [class.hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <div>\n {{ field.label }}\n </div>\n <kwikui-button\n *ngIf=\"field?.reset\"\n appearance=\"whiteblock\"\n size=\"s\"\n label=\"Reset\"\n (onClick)=\"handleOnClickResetFormFields($event, field)\"\n ></kwikui-button>\n </div>\n </ng-container>\n <!-- Input Text -->\n <ng-container *ngSwitchCase=\"'text'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input\n [case]=\"field?.properties?.case\"\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [type]=\"'text'\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Textarea -->\n <ng-container *ngSwitchCase=\"'textarea'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-textarea\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-textarea>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Checkbox -->\n <ng-container *ngSwitchCase=\"'checkbox'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-checkbox\n [contentAlign]=\"field?.properties?.contentAlign ?? 'left'\"\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.properties?.placeholder\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [size]=\"field?.properties?.size ?? 'l'\"\n [variant]=\"field?.properties?.variant ?? 'block'\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-checkbox>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Number -->\n <ng-container *ngSwitchCase=\"'number'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-number\n [decimal]=\"field?.properties?.decimal\"\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [max]=\"field?.properties?.max\"\n [min]=\"field?.properties?.min\"\n [placeholder]=\"field?.properties?.placeholder\"\n [postfix]=\"field?.properties?.postfix ?? ''\"\n [precision]=\"field?.properties?.precision\"\n [prefix]=\"field?.properties?.prefix ?? ''\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-number>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Date -->\n <ng-container *ngSwitchCase=\"'date'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-date\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [min]=\"field?.properties?.min\"\n [minCalculatedFromToday]=\"\n field?.properties?.minCalculatedFromToday\n \"\n [max]=\"field?.properties?.max\"\n [maxCalculatedFromToday]=\"\n field?.properties?.maxCalculatedFromToday\n \"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-date>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Phone -->\n <ng-container *ngSwitchCase=\"'phone'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-phone\n [countryCode]=\"field?.properties?.countryCode\"\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [phoneMaskAfterCountryCode]=\"\n field?.properties?.phoneMaskAfterCountryCode\n \"\n [removeCountryCodeFromValue]=\"\n field?.properties?.removeCountryCodeFromValue\n \"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-phone>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Radio -->\n <ng-container *ngSwitchCase=\"'radio'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <label\n [tuiLabel]=\"labelTemplate\"\n style=\"min-height: auto; padding: 0px 0.5rem\"\n >\n <kwikui-input-radio\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [items]=\"field?.options\"\n [label]=\"field?.label\"\n [orientation]=\"field?.properties?.orientation\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [size]=\"field?.properties?.size\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-radio>\n </label>\n <ng-template #labelTemplate>\n <p\n class=\"tui-space_bottom-2\"\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <b>\n {{ field.label }}\n <span *ngIf=\"field.validators?.required\">*</span>\n </b>\n </p>\n </ng-template>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Dropdown -->\n <ng-container *ngSwitchCase=\"'select'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-select\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [options]=\"field.options\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-select>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Slider -->\n <ng-container *ngSwitchCase=\"'slider'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-slider\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [max]=\"field?.properties?.max\"\n [min]=\"field?.properties?.min\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [quantum]=\"field?.properties?.quantum\"\n [size]=\"field?.properties?.size\"\n [steps]=\"field?.properties?.steps\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-slider>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- API Call -->\n <ng-container *ngSwitchCase=\"'api'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-button-api-call\n [apiStatus]=\"field?.api?.status?.value\"\n [class]=\"field?.class\"\n [disabled]=\"field?.disabled\"\n [id]=\"field.key\"\n [label]=\"field?.api?.status?.labels[field?.api?.status?.value]\"\n [showLoader]=\"field?.disabled === 'loading'\"\n styles=\"width: fit-content\"\n (onClick)=\"handleOnClickApiCall($event)\"\n ></kwikui-button-api-call>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Mobile OTP -->\n <ng-container *ngSwitchCase=\"'otp'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-otp\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [size]=\"field?.properties?.size\"\n [mode]=\"field?.properties?.mode\"\n [otpLength]=\"field?.properties?.otpLength\"\n [mask]=\"field?.properties?.mask\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-otp>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Aadhaar Number -->\n <ng-container *ngSwitchCase=\"'aadhaar-number'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-aadhaar\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [placeholder]=\"field?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-aadhaar>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Preview Image -->\n <ng-container *ngSwitchCase=\"'image'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-image\n [altText]=\"field?.properties?.altText\"\n [html]=\"field?.properties?.html\"\n [id]=\"field.key\"\n [imageSrc]=\"field?.default?.value?.value\"\n [imageType]=\"field?.properties?.imageType\"\n [loadingType]=\"field?.properties?.loadingType\"\n [styles]=\"field?.properties?.styles\"\n [class]=\"field?.properties?.class\"\n ></kwikui-image>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- File Upload -->\n <ng-container *ngSwitchCase=\"'file'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <label\n [tuiLabel]=\"labelTemplate\"\n style=\"min-height: auto\"\n >\n <kwikui-input-files\n [id]=\"field?.key\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [styles]=\"field?.properties?.styles\"\n [class]=\"field?.properties?.class\"\n [multiple]=\"field?.properties?.multiple\"\n [accept]=\"field?.properties?.accept\"\n [files]=\"files[field.key]\"\n [setFileTypesToForm]=\"['NORMAL']\"\n [label]=\"field?.properties?.label\"\n [link]=\"field?.properties?.link\"\n [maxFileSize]=\"field?.properties?.maxFileSize\"\n [disabled]=\"field?.disabled\"\n [validators]=\"field?.validators\"\n (getRemovedFile)=\"handleRemovedFile($event)\"\n (getKeyValue)=\"handleGetKeyValueFile($event)\"\n ></kwikui-input-files>\n </label>\n <ng-template #labelTemplate>\n <p\n style=\"padding: 0px 0.25rem; margin-bottom: 0.25rem\"\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <b>\n {{ field.label }}\n <span *ngIf=\"field.validators?.required\">*</span>\n </b>\n </p>\n </ng-template>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </form>\n <div class=\"kwikid-form-buttons\">\n <kwikui-button\n *ngIf=\"\n !formConfig.properties.footer.viewFormsButton.hidden && isMobileView\n \"\n [disabled]=\"viewFormsButton.disabled\"\n label=\"{{ formConfig.properties.footer.viewFormsButton.label }}\"\n [showLoader]=\"viewFormsButton.showLoader\"\n appearance=\"secondary\"\n styles=\"width: 100%\"\n (onClick)=\"handleOnClickViewForms($event)\"\n ></kwikui-button>\n <kwikui-button\n *ngIf=\"!formConfig.properties.footer.saveButton.hidden\"\n [disabled]=\"saveFormButton.disabled\"\n label=\"{{ formConfig.properties.footer.saveButton.label }}\"\n [showLoader]=\"saveFormButton.showLoader\"\n styles=\"width: 100%\"\n (onClick)=\"handleOnClickSaveForm($event)\"\n ></kwikui-button>\n </div>\n</div>\n<div\n class=\"kwikid-form-container-loading\"\n *ngIf=\"loading\"\n>\n <div\n *ngFor=\"let item of [].constructor(7); let i = index\"\n class=\"large-wrapper tui-skeleton tui-skeleton_rounded\"\n >\n </div>\n</div>\n\n<kwikui-loader\n [loaderText]=\"'Please wait'\"\n [showLoader]=\"apiLoading\"\n [fullscreen]=\"true\"\n></kwikui-loader>\n\n<tui-push\n id=\"field-error-notification\"\n *tuiPush=\"showErrorNotification\"\n heading=\"Missing/Incorrect Fields!\"\n type=\"Error\"\n (close)=\"toggleErrorNotification(false)\"\n>\n <tui-svg\n src=\"tuiIconXCircle\"\n style=\"color: #fff !important\"\n >\n </tui-svg>\n</tui-push>\n\n<ng-template\n #preview\n let-preview\n>\n <tui-preview\n [rotatable]=\"false\"\n [zoomable]=\"false\"\n class=\"preview-container\"\n >\n <tui-preview-title *ngIf=\"previewProperties.title !== ''\">{{\n previewProperties.title\n }}</tui-preview-title>\n\n <ng-container *ngIf=\"!previewProperties.unavailable\">\n <div\n *ngIf=\"previewProperties?.html?.before !== ''\"\n class=\"preview-html preview-html-before\"\n [style]=\"previewProperties?.html?.beforeStyles\"\n [innerHtml]=\"previewProperties.html.before | kwikuiSafeHtml\"\n ></div>\n\n <!-- Content within the iframe -->\n <div\n class=\"preview-iframe-content\"\n [style]=\"previewProperties?.iframe?.containerStyles\"\n *ngIf=\"previewProperties.iframe.src !== ''\"\n >\n <!-- Your HTML content here -->\n <iframe\n [src]=\"previewProperties.iframe.src | kwikuiSafeUrl\"\n frameborder=\"0\"\n allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\"\n allowfullscreen\n [title]=\"previewProperties.iframe.title\"\n class=\"preview-iframe\"\n scrolling=\"auto\"\n ></iframe>\n </div>\n\n <div\n *ngIf=\"previewProperties?.html?.after !== ''\"\n class=\"preview-html preview-html-after\"\n [style]=\"previewProperties?.html?.afterStyles\"\n [innerHtml]=\"previewProperties.html.after | kwikuiSafeHtml\"\n ></div>\n </ng-container>\n\n <ng-container *ngIf=\"previewProperties.unavailable\">\n <div class=\"preview-unavailable\">\n <tui-svg\n src=\"tuiIconFileLarge\"\n class=\"t-icon\"\n ></tui-svg>\n <div>Preview unavailable</div>\n </div>\n </ng-container>\n\n <button\n tuiIconButton\n tuiPreviewAction\n icon=\"tuiIconCloseLarge\"\n title=\"Close\"\n type=\"button\"\n (click)=\"preview.complete()\"\n ></button>\n </tui-preview>\n</ng-template>\n\n<ng-template\n #dialog\n let-dialog\n>\n <div class=\"preview-container\">\n <ng-container *ngIf=\"!previewProperties.unavailable\">\n <div\n *ngIf=\"previewProperties?.html?.before !== ''\"\n class=\"preview-html preview-html-before\"\n [style]=\"previewProperties?.html?.beforeStyles\"\n [innerHtml]=\"previewProperties.html.before | kwikuiSafeHtml\"\n ></div>\n\n <!-- Content within the iframe -->\n <div\n class=\"preview-iframe-content\"\n [style]=\"previewProperties?.iframe?.containerStyles\"\n *ngIf=\"previewProperties.iframe.src !== ''\"\n >\n <!-- Your HTML content here -->\n <iframe\n [src]=\"previewProperties.iframe.src | kwikuiSafeUrl\"\n frameborder=\"0\"\n allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\"\n allowfullscreen\n [title]=\"previewProperties.iframe.title\"\n class=\"preview-iframe\"\n scrolling=\"auto\"\n ></iframe>\n </div>\n\n <div\n *ngIf=\"previewProperties?.html?.after !== ''\"\n class=\"preview-html preview-html-after\"\n [style]=\"previewProperties?.html?.afterStyles\"\n [innerHtml]=\"previewProperties.html.after | kwikuiSafeHtml\"\n ></div>\n </ng-container>\n\n <ng-container *ngIf=\"previewProperties.unavailable\">\n <div class=\"preview-unavailable\">\n <tui-svg\n src=\"tuiIconFileLarge\"\n class=\"t-icon\"\n ></tui-svg>\n <div>Preview unavailable</div>\n </div>\n </ng-container>\n </div>\n</ng-template>\n", styles: [".kwikid-form-container{width:100%;height:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:center}.kwikid-form.show{width:100%;height:100%;padding:1rem;overflow-y:auto;display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-row-gap:1rem;row-gap:1rem}.kwikid-form-buttons{width:100%;bottom:0px;padding:1rem;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;grid-column-gap:10px;column-gap:10px}.kwikid-form-buttons *{flex-grow:1}#uf-form-fields-header-container{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:flex-start;grid-row-gap:1rem;row-gap:1rem;padding:1rem 1rem 0}#uf-form-fields-header-container #uf-form-fields-header-main{display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;grid-gap:.25rem;gap:.25rem;width:100%}#uf-form-fields-header-container #uf-form-fields-header-main #uf-form-fields-header-right{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:flex-start;grid-row-gap:.5rem;grid-row-gap:.25rem;row-gap:.25rem}#uf-form-fields-header-container hr{width:100%}#uf-form-fields-title{color:#000;font-size:1.75em;font-weight:bold}#uf-form-fields-steps{color:var(--color-on-secondary-container);font-size:1rem}.title{border-left:.25rem solid var(--tui-primary);padding:.75rem;font-size:1.4em;font-weight:bold;background-color:var(--tui-secondary);display:flex;flex-direction:row;align-content:center;justify-content:space-between;align-items:center;grid-gap:.5rem;gap:.5rem}.title:not(:first-child){margin-top:.5rem}.title.hidden{display:none}.large-wrapper{width:100%;height:60px}.large-wrapper:first-child{margin-bottom:auto}.large-wrapper:last-child{margin-top:auto}.kwikid-form-container-loading{width:100%;height:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:center;grid-row-gap:1rem;row-gap:1rem;padding:1rem}#field-error-notification{background-color:var(--tui-error-fill);color:#fff!important}#field-error-notification .t-top{color:#fff!important}#field-error-notification .t-close{color:#fff!important}.preview-container{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;align-content:center;grid-gap:1rem;gap:1rem;height:calc(100vh - 3rem)}.preview-container .preview-html{flex-grow:1}.preview-container .preview-iframe-content{height:100%;flex-grow:1}.preview-container .preview-iframe-content .preview-iframe{width:100%;height:100%}.preview-container .preview-unavailable{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center;grid-gap:1rem;grid-gap:1.4rem;gap:1.4rem;color:#fff;font-size:1.2rem;top:50%;left:50%;width:100%;height:100vh}\n", "::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{border-radius:10px}::-webkit-scrollbar-thumb{background:lightgray;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:gray}\n"], components: [{ type: i2.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }, { type: i2.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIMessagesComponent, selector: "kwikui-messages", inputs: ["messages", "id"] }, { type: i2.KwikUITextareaComponent, selector: "kwikui-textarea", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "size", "placeholder", "properties", "validators"], outputs: ["getKeyValue"] }, { type: i2.KwikUICheckboxComponent, selector: "kwikui-checkbox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "contentAlign", "focus", "invalid", "disabled", "size", "validators", "properties", "variant"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputNumberComponent, selector: "kwikui-input-number", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "min", "max", "prefix", "postfix", "precision", "decimal", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputDateComponent, selector: "kwikui-input-date", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "min", "minCalculatedFromToday", "max", "maxCalculatedFromToday", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputPhoneComponent, selector: "kwikui-input-phone", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "countryCode", "phoneMaskAfterCountryCode", "removeCountryCodeFromValue", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i3.TuiLabelComponent, selector: "label[tuiLabel]", inputs: ["tuiLabel", "context"] }, { type: i2.KwikUIInputRadioComponent, selector: "kwikui-input-radio", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "size", "orientation", "items", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputSelectComponent, selector: "kwikui-input-select", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputSliderComponent, selector: "kwikui-input-slider", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "size", "min", "max", "steps", "quantum", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIButtonApiCallComponent, selector: "kwikui-button-api-call", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "shape", "size", "apiStatus"], outputs: ["onClick"] }, { type: i2.KwikUIInputOtpComponent, selector: "kwikui-input-otp", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "placeholder", "mask", "size", "prefix", "postfix", "mode", "otpLength", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputAadhaarComponent, selector: "kwikui-input-aadhaar", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "placeholder", "mask", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIImageComponent, selector: "kwikui-image", inputs: ["id", "imageSrc", "altText", "imageType", "styles", "class", "loadingType", "html"], outputs: ["onClick"] }, { type: i2.KwikUIInputFilesComponent, selector: "kwikui-input-files", inputs: ["id", "formControlName", "formControl", "styles", "class", "multiple", "accept", "size", "label", "link", "icon", "maxFileSize", "disabled", "showAddedFiles", "setFileTypesToForm", "validators", "files"], outputs: ["getKeyValue", "getRemovedFile"] }, { type: i2.KwikUILoaderComponent, selector: "kwikui-loader", inputs: ["id", "loaderText", "showLoader", "fullscreen", "styles", "class"] }, { type: i4.TuiPushComponent, selector: "tui-push", inputs: ["heading", "type", "timestamp"], outputs: ["close"] }, { type: i3.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i5.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { type: i5.TuiPreviewTitleComponent, selector: "tui-preview-title" }, { type: i3.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i3$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i4.TuiPushDirective, selector: "tui-push" }, { type: i5.TuiPreviewActionDirective, selector: "[tuiPreviewAction]" }], pipes: { "kwikuiSafeHtml": i2.KwikUISafeHtmlPipe, "kwikuiSafeUrl": i2.KwikUISafeUrlPipe } });
3910
+ /** @nocollapse */ KwikIDFormViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormViewComponent, selector: "kwikid-form-view", inputs: { formConfig: "formConfig", formData: "formData", isMobileView: "isMobileView", allFormsData: "allFormsData", userConfig: "userConfig", apiCallResponse: "apiCallResponse", popupFormCallback: "popupFormCallback" }, outputs: { onClickGoBack: "onClickGoBack", onClickViewForms: "onClickViewForms", onClickSaveForm: "onClickSaveForm", onClickApiCall: "onClickApiCall", onActionShowPopupForm: "onActionShowPopupForm" }, providers: [KwikIDFormViewService], viewQueries: [{ propertyName: "preview", first: true, predicate: ["preview"], descendants: true }, { propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"kwikid-form-container\"\n *ngIf=\"!loading\"\n>\n <div\n id=\"uf-form-fields-header-container\"\n *ngIf=\"\n !formConfig.properties?.header?.title?.hidden ||\n !formConfig.properties?.header?.steps?.hidden ||\n !formConfig.properties?.header?.backButton?.hidden\n \"\n >\n <div id=\"uf-form-fields-header-main\">\n <div id=\"uf-form-fields-header-left\">\n <kwikui-button\n *ngIf=\"\n !formConfig.properties?.header.backButton.hidden && isMobileView\n \"\n [disabled]=\"backButton.disabled\"\n [showLoader]=\"backButton.showLoader\"\n appearance=\"mono\"\n icon=\"tuiIconArrowLeft\"\n shape=\"rounded\"\n (onClick)=\"\n handleOnClickGoBack(\n $event,\n formConfig.properties?.header.backButton.mode\n )\n \"\n ></kwikui-button>\n </div>\n <div id=\"uf-form-fields-header-right\">\n <div\n id=\"uf-form-fields-title\"\n *ngIf=\"!formConfig.properties?.header.title.hidden\"\n >{{ formConfig.properties?.header.title.label }}</div\n >\n <div\n id=\"uf-form-fields-steps\"\n *ngIf=\"!formConfig.properties?.header.steps.hidden\"\n >Step {{ formConfig.sequenceNo }} of\n {{ formConfig.formsListLength }}</div\n >\n </div>\n </div>\n <hr\n *ngIf=\"\n !formConfig.properties?.header.title.hidden ||\n !formConfig.properties?.header.steps.hidden ||\n !formConfig.properties?.header.backButton.hidden\n \"\n />\n </div>\n <form\n class=\"kwikid-form show\"\n [formGroup]=\"formGroup\"\n >\n <ng-container\n *ngFor=\"\n let field of formFields;\n let i = index;\n trackBy: getUniqueIdentifier\n \"\n >\n <ng-container [ngSwitch]=\"field.type\">\n <!-- HTML Content -->\n <ng-container *ngSwitchCase=\"'html'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <div [innerHtml]=\"field.html | kwikuiSafeHtml\"></div>\n </div>\n </ng-container>\n <!-- Form Title -->\n <ng-container *ngSwitchCase=\"'title'\">\n <div\n class=\"title\"\n [class.hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <div>\n {{ field.label }}\n </div>\n <kwikui-button\n *ngIf=\"field?.reset\"\n appearance=\"whiteblock\"\n size=\"s\"\n label=\"Reset\"\n (onClick)=\"handleOnClickResetFormFields($event, field)\"\n ></kwikui-button>\n </div>\n </ng-container>\n <!-- Input Text -->\n <ng-container *ngSwitchCase=\"'text'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input\n [case]=\"field?.properties?.case\"\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [type]=\"'text'\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Textarea -->\n <ng-container *ngSwitchCase=\"'textarea'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-textarea\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-textarea>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Checkbox -->\n <ng-container *ngSwitchCase=\"'checkbox'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-checkbox\n [contentAlign]=\"field?.properties?.contentAlign ?? 'left'\"\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.properties?.placeholder\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [size]=\"field?.properties?.size ?? 'l'\"\n [variant]=\"field?.properties?.variant ?? 'block'\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-checkbox>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Number -->\n <ng-container *ngSwitchCase=\"'number'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-number\n [decimal]=\"field?.properties?.decimal\"\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [max]=\"field?.properties?.max\"\n [min]=\"field?.properties?.min\"\n [placeholder]=\"field?.properties?.placeholder\"\n [postfix]=\"field?.properties?.postfix ?? ''\"\n [precision]=\"field?.properties?.precision\"\n [prefix]=\"field?.properties?.prefix ?? ''\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-number>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Date -->\n <ng-container *ngSwitchCase=\"'date'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-date\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [min]=\"field?.properties?.min\"\n [minCalculatedFromToday]=\"\n field?.properties?.minCalculatedFromToday\n \"\n [max]=\"field?.properties?.max\"\n [maxCalculatedFromToday]=\"\n field?.properties?.maxCalculatedFromToday\n \"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-date>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Phone -->\n <ng-container *ngSwitchCase=\"'phone'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-phone\n [countryCode]=\"field?.properties?.countryCode\"\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [phoneMaskAfterCountryCode]=\"\n field?.properties?.phoneMaskAfterCountryCode\n \"\n [removeCountryCodeFromValue]=\"\n field?.properties?.removeCountryCodeFromValue\n \"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-phone>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Radio -->\n <ng-container *ngSwitchCase=\"'radio'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <label\n [tuiLabel]=\"labelTemplate\"\n style=\"min-height: auto; padding: 0px 0.5rem\"\n >\n <kwikui-input-radio\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [items]=\"field?.options\"\n [label]=\"field?.label\"\n [orientation]=\"field?.properties?.orientation\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [size]=\"field?.properties?.size\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-radio>\n </label>\n <ng-template #labelTemplate>\n <p\n class=\"tui-space_bottom-2\"\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <b>\n {{ field.label }}\n <span *ngIf=\"field.validators?.required\">*</span>\n </b>\n </p>\n </ng-template>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Dropdown -->\n <ng-container *ngSwitchCase=\"'select'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-select\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [options]=\"field.options\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-select>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Input Slider -->\n <ng-container *ngSwitchCase=\"'slider'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-slider\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [max]=\"field?.properties?.max\"\n [min]=\"field?.properties?.min\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [quantum]=\"field?.properties?.quantum\"\n [size]=\"field?.properties?.size\"\n [steps]=\"field?.properties?.steps\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-slider>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- API Call -->\n <ng-container *ngSwitchCase=\"'api'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-button-api-call\n [apiStatus]=\"field?.api?.status?.value\"\n [class]=\"field?.class\"\n [disabled]=\"field?.disabled\"\n [id]=\"field.key\"\n [label]=\"field?.api?.status?.labels[field?.api?.status?.value]\"\n [showLoader]=\"field?.disabled === 'loading'\"\n styles=\"width: fit-content\"\n (onClick)=\"handleOnClickApiCall($event)\"\n ></kwikui-button-api-call>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Mobile OTP -->\n <ng-container *ngSwitchCase=\"'otp'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-otp\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [size]=\"field?.properties?.size\"\n [mode]=\"field?.properties?.mode\"\n [otpLength]=\"field?.properties?.otpLength\"\n [mask]=\"field?.properties?.mask\"\n [placeholder]=\"field?.properties?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-otp>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Aadhaar Number -->\n <ng-container *ngSwitchCase=\"'aadhaar-number'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-input-aadhaar\n [disabled]=\"field?.disabled\"\n [focus]=\"field?.focus\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [id]=\"field.key\"\n [invalid]=\"field?.invalid\"\n [label]=\"field?.label\"\n [placeholder]=\"field?.placeholder\"\n [properties]=\"field?.properties\"\n [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input-aadhaar>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Preview Image -->\n <ng-container *ngSwitchCase=\"'image'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-image\n [altText]=\"field?.properties?.altText\"\n [html]=\"field?.properties?.html\"\n [id]=\"field.key\"\n [imageSrc]=\"field?.default?.value?.value\"\n [imageType]=\"field?.properties?.imageType\"\n [loadingType]=\"field?.properties?.loadingType\"\n [styles]=\"field?.properties?.styles\"\n [class]=\"field?.properties?.class\"\n ></kwikui-image>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- Fingerprint -->\n <ng-container *ngSwitchCase=\"'fingerprint'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n class=\"kwikid-fingerprint-container\"\n >\n <kwikid-fingerprint\n [config]=\"field?.config\"\n (getScanningStatus)=\"handleGetScanningStatus($event)\"\n (getKeyValue)=\"handleGetKeyValueFingerprint($event)\"\n ></kwikid-fingerprint>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n <!-- File Upload -->\n <ng-container *ngSwitchCase=\"'file'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <label\n [tuiLabel]=\"labelTemplate\"\n style=\"min-height: auto\"\n >\n <kwikui-input-files\n [id]=\"field?.key\"\n [formControl]=\"formGroup.controls[field.key]\"\n [formControlName]=\"field.key\"\n [styles]=\"field?.properties?.styles\"\n [class]=\"field?.properties?.class\"\n [multiple]=\"field?.properties?.multiple\"\n [accept]=\"field?.properties?.accept\"\n [files]=\"files[field.key]\"\n [setFileTypesToForm]=\"['NORMAL']\"\n [label]=\"field?.properties?.label\"\n [link]=\"field?.properties?.link\"\n [maxFileSize]=\"field?.properties?.maxFileSize\"\n [disabled]=\"field?.disabled\"\n [validators]=\"field?.validators\"\n (getRemovedFile)=\"handleRemovedFile($event)\"\n (getKeyValue)=\"handleGetKeyValueFile($event)\"\n ></kwikui-input-files>\n </label>\n <ng-template #labelTemplate>\n <p\n style=\"padding: 0px 0.25rem; margin-bottom: 0.25rem\"\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <b>\n {{ field.label }}\n <span *ngIf=\"field.validators?.required\">*</span>\n </b>\n </p>\n </ng-template>\n <kwikui-messages\n [messages]=\"field.messages\"\n [id]=\"field.key\"\n ></kwikui-messages>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </form>\n <div class=\"kwikid-form-buttons\">\n <kwikui-button\n *ngIf=\"\n !formConfig.properties.footer.viewFormsButton.hidden && isMobileView\n \"\n [disabled]=\"viewFormsButton.disabled\"\n label=\"{{ formConfig.properties.footer.viewFormsButton.label }}\"\n [showLoader]=\"viewFormsButton.showLoader\"\n appearance=\"secondary\"\n styles=\"width: 100%\"\n (onClick)=\"handleOnClickViewForms($event)\"\n ></kwikui-button>\n <kwikui-button\n *ngIf=\"!formConfig.properties.footer.saveButton.hidden\"\n [disabled]=\"saveFormButton.disabled\"\n label=\"{{ formConfig.properties.footer.saveButton.label }}\"\n [showLoader]=\"saveFormButton.showLoader\"\n styles=\"width: 100%\"\n (onClick)=\"handleOnClickSaveForm($event)\"\n ></kwikui-button>\n </div>\n</div>\n<div\n class=\"kwikid-form-container-loading\"\n *ngIf=\"loading\"\n>\n <div\n *ngFor=\"let item of [].constructor(7); let i = index\"\n class=\"large-wrapper tui-skeleton tui-skeleton_rounded\"\n >\n </div>\n</div>\n\n<kwikui-loader\n [loaderText]=\"'Please wait'\"\n [showLoader]=\"apiLoading\"\n [fullscreen]=\"true\"\n></kwikui-loader>\n\n<tui-push\n id=\"field-error-notification\"\n *tuiPush=\"showErrorNotification\"\n heading=\"Missing/Incorrect Fields!\"\n type=\"Error\"\n (close)=\"toggleErrorNotification(false)\"\n>\n <tui-svg\n src=\"tuiIconXCircle\"\n style=\"color: #fff !important\"\n >\n </tui-svg>\n</tui-push>\n\n<ng-template\n #preview\n let-preview\n>\n <tui-preview\n [rotatable]=\"false\"\n [zoomable]=\"false\"\n class=\"preview-container\"\n >\n <tui-preview-title *ngIf=\"previewProperties.title !== ''\">{{\n previewProperties.title\n }}</tui-preview-title>\n\n <ng-container *ngIf=\"!previewProperties.unavailable\">\n <div\n *ngIf=\"previewProperties?.html?.before !== ''\"\n class=\"preview-html preview-html-before\"\n [style]=\"previewProperties?.html?.beforeStyles\"\n [innerHtml]=\"previewProperties.html.before | kwikuiSafeHtml\"\n ></div>\n\n <!-- Content within the iframe -->\n <div\n class=\"preview-iframe-content\"\n [style]=\"previewProperties?.iframe?.containerStyles\"\n *ngIf=\"previewProperties.iframe.src !== ''\"\n >\n <!-- Your HTML content here -->\n <iframe\n [src]=\"previewProperties.iframe.src | kwikuiSafeUrl\"\n frameborder=\"0\"\n allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\"\n allowfullscreen\n [title]=\"previewProperties.iframe.title\"\n class=\"preview-iframe\"\n scrolling=\"auto\"\n ></iframe>\n </div>\n\n <div\n *ngIf=\"previewProperties?.html?.after !== ''\"\n class=\"preview-html preview-html-after\"\n [style]=\"previewProperties?.html?.afterStyles\"\n [innerHtml]=\"previewProperties.html.after | kwikuiSafeHtml\"\n ></div>\n </ng-container>\n\n <ng-container *ngIf=\"previewProperties.unavailable\">\n <div class=\"preview-unavailable\">\n <tui-svg\n src=\"tuiIconFileLarge\"\n class=\"t-icon\"\n ></tui-svg>\n <div>Preview unavailable</div>\n </div>\n </ng-container>\n\n <button\n tuiIconButton\n tuiPreviewAction\n icon=\"tuiIconCloseLarge\"\n title=\"Close\"\n type=\"button\"\n (click)=\"preview.complete()\"\n ></button>\n </tui-preview>\n</ng-template>\n\n<ng-template\n #dialog\n let-dialog\n>\n <div class=\"preview-container\">\n <ng-container *ngIf=\"!previewProperties.unavailable\">\n <div\n *ngIf=\"previewProperties?.html?.before !== ''\"\n class=\"preview-html preview-html-before\"\n [style]=\"previewProperties?.html?.beforeStyles\"\n [innerHtml]=\"previewProperties.html.before | kwikuiSafeHtml\"\n ></div>\n\n <!-- Content within the iframe -->\n <div\n class=\"preview-iframe-content\"\n [style]=\"previewProperties?.iframe?.containerStyles\"\n *ngIf=\"previewProperties.iframe.src !== ''\"\n >\n <!-- Your HTML content here -->\n <iframe\n [src]=\"previewProperties.iframe.src | kwikuiSafeUrl\"\n frameborder=\"0\"\n allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\"\n allowfullscreen\n [title]=\"previewProperties.iframe.title\"\n class=\"preview-iframe\"\n scrolling=\"auto\"\n ></iframe>\n </div>\n\n <div\n *ngIf=\"previewProperties?.html?.after !== ''\"\n class=\"preview-html preview-html-after\"\n [style]=\"previewProperties?.html?.afterStyles\"\n [innerHtml]=\"previewProperties.html.after | kwikuiSafeHtml\"\n ></div>\n </ng-container>\n\n <ng-container *ngIf=\"previewProperties.unavailable\">\n <div class=\"preview-unavailable\">\n <tui-svg\n src=\"tuiIconFileLarge\"\n class=\"t-icon\"\n ></tui-svg>\n <div>Preview unavailable</div>\n </div>\n </ng-container>\n </div>\n</ng-template>\n", styles: [".kwikid-form-container{width:100%;height:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:center}.kwikid-form.show{width:100%;height:100%;padding:1rem;overflow-y:auto;display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-row-gap:1rem;row-gap:1rem}.kwikid-form-buttons{width:100%;bottom:0px;padding:1rem;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;grid-column-gap:10px;column-gap:10px}.kwikid-form-buttons *{flex-grow:1}#uf-form-fields-header-container{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:flex-start;grid-row-gap:1rem;row-gap:1rem;padding:1rem 1rem 0}#uf-form-fields-header-container #uf-form-fields-header-main{display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;grid-gap:.25rem;gap:.25rem;width:100%}#uf-form-fields-header-container #uf-form-fields-header-main #uf-form-fields-header-right{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:flex-start;grid-row-gap:.5rem;grid-row-gap:.25rem;row-gap:.25rem}#uf-form-fields-header-container hr{width:100%}#uf-form-fields-title{color:#000;font-size:1.75em;font-weight:bold}#uf-form-fields-steps{color:var(--color-on-secondary-container);font-size:1rem}.title{border-left:.25rem solid var(--tui-primary);padding:.75rem;font-size:1.4em;font-weight:bold;background-color:var(--tui-secondary);display:flex;flex-direction:row;align-content:center;justify-content:space-between;align-items:center;grid-gap:.5rem;gap:.5rem}.title:not(:first-child){margin-top:.5rem}.title.hidden{display:none}.large-wrapper{width:100%;height:60px}.large-wrapper:first-child{margin-bottom:auto}.large-wrapper:last-child{margin-top:auto}.kwikid-form-container-loading{width:100%;height:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:center;grid-row-gap:1rem;row-gap:1rem;padding:1rem}.kwikid-fingerprint-container{box-shadow:0 .125rem .1875rem var(--tui-base-03);border-radius:var(--tui-radius-l);border:.5px solid var(--tui-base-03)}#field-error-notification{background-color:var(--tui-error-fill);color:#fff!important}#field-error-notification .t-top{color:#fff!important}#field-error-notification .t-close{color:#fff!important}.preview-container{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;align-content:center;grid-gap:1rem;gap:1rem;height:calc(100vh - 3rem)}.preview-container .preview-html{flex-grow:1}.preview-container .preview-iframe-content{height:100%;flex-grow:1}.preview-container .preview-iframe-content .preview-iframe{width:100%;height:100%}.preview-container .preview-unavailable{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center;grid-gap:1rem;grid-gap:1.4rem;gap:1.4rem;color:#fff;font-size:1.2rem;top:50%;left:50%;width:100%;height:100vh}\n", "::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{border-radius:10px}::-webkit-scrollbar-thumb{background:lightgray;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:gray}\n"], components: [{ type: i2.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }, { type: i2.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIMessagesComponent, selector: "kwikui-messages", inputs: ["messages", "id"] }, { type: i2.KwikUITextareaComponent, selector: "kwikui-textarea", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "size", "placeholder", "properties", "validators"], outputs: ["getKeyValue"] }, { type: i2.KwikUICheckboxComponent, selector: "kwikui-checkbox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "contentAlign", "focus", "invalid", "disabled", "size", "validators", "properties", "variant"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputNumberComponent, selector: "kwikui-input-number", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "min", "max", "prefix", "postfix", "precision", "decimal", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputDateComponent, selector: "kwikui-input-date", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "min", "minCalculatedFromToday", "max", "maxCalculatedFromToday", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputPhoneComponent, selector: "kwikui-input-phone", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "countryCode", "phoneMaskAfterCountryCode", "removeCountryCodeFromValue", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i3.TuiLabelComponent, selector: "label[tuiLabel]", inputs: ["tuiLabel", "context"] }, { type: i2.KwikUIInputRadioComponent, selector: "kwikui-input-radio", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "size", "orientation", "items", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputSelectComponent, selector: "kwikui-input-select", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputSliderComponent, selector: "kwikui-input-slider", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "size", "min", "max", "steps", "quantum", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIButtonApiCallComponent, selector: "kwikui-button-api-call", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "shape", "size", "apiStatus"], outputs: ["onClick"] }, { type: i2.KwikUIInputOtpComponent, selector: "kwikui-input-otp", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "placeholder", "mask", "size", "prefix", "postfix", "mode", "otpLength", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIInputAadhaarComponent, selector: "kwikui-input-aadhaar", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "placeholder", "mask", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i2.KwikUIImageComponent, selector: "kwikui-image", inputs: ["id", "imageSrc", "altText", "imageType", "styles", "class", "loadingType", "html"], outputs: ["onClick"] }, { type: i4.KwikIDFingerprintComponent, selector: "kwikid-fingerprint", inputs: ["config"], outputs: ["getKeyValue", "getScanningStatus"] }, { type: i2.KwikUIInputFilesComponent, selector: "kwikui-input-files", inputs: ["id", "formControlName", "formControl", "styles", "class", "multiple", "accept", "size", "label", "link", "icon", "maxFileSize", "disabled", "showAddedFiles", "setFileTypesToForm", "validators", "files"], outputs: ["getKeyValue", "getRemovedFile"] }, { type: i2.KwikUILoaderComponent, selector: "kwikui-loader", inputs: ["id", "loaderText", "showLoader", "fullscreen", "styles", "class"] }, { type: i5.TuiPushComponent, selector: "tui-push", inputs: ["heading", "type", "timestamp"], outputs: ["close"] }, { type: i3.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i6.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { type: i6.TuiPreviewTitleComponent, selector: "tui-preview-title" }, { type: i3.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i3$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3$2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3$2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i5.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i5.TuiPushDirective, selector: "tui-push" }, { type: i6.TuiPreviewActionDirective, selector: "[tuiPreviewAction]" }], pipes: { "kwikuiSafeHtml": i2.KwikUISafeHtmlPipe, "kwikuiSafeUrl": i2.KwikUISafeUrlPipe } });
3902
3911
  __decorate([
3903
3912
  logMethod
3904
3913
  ], KwikIDFormViewComponent.prototype, "ngOnInit", null);
@@ -4099,13 +4108,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
4099
4108
  styleUrls: ["./form-view.component.scss", "../shared.scss"],
4100
4109
  providers: [KwikIDFormViewService]
4101
4110
  }]
4102
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: KwikIDFormViewService }, { type: i4.TuiPushService, decorators: [{
4111
+ }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: KwikIDFormViewService }, { type: i5.TuiPushService, decorators: [{
4103
4112
  type: Inject,
4104
4113
  args: [TuiPushService]
4105
4114
  }] }, { type: i3.TuiAlertService, decorators: [{
4106
4115
  type: Inject,
4107
4116
  args: [TuiAlertService]
4108
- }] }, { type: i5.TuiPreviewDialogService, decorators: [{
4117
+ }] }, { type: i6.TuiPreviewDialogService, decorators: [{
4109
4118
  type: Inject,
4110
4119
  args: [TuiPreviewDialogService]
4111
4120
  }] }, { type: i3.TuiDialogService, decorators: [{
@@ -5139,7 +5148,7 @@ class KwikIDFormsRendererComponent {
5139
5148
  }
5140
5149
  }
5141
5150
  /** @nocollapse */ KwikIDFormsRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: KwikIDFormsRendererComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: TuiPreviewDialogService }, { token: TuiDialogService }], target: i0.ɵɵFactoryTarget.Component });
5142
- /** @nocollapse */ KwikIDFormsRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormsRendererComponent, selector: "kwikid-forms-renderer", inputs: { stepConfig: "stepConfig", userConfig: "userConfig", formsData: "formsData", activeFormData: "activeFormData", apiCallResponse: "apiCallResponse" }, outputs: { onClickSubmit: "onClickSubmit", getFormData: "getFormData", onClickApiCall: "onClickApiCall" }, host: { listeners: { "window:resize": "windowResizeWatcher($event)" } }, viewQueries: [{ propertyName: "preview", first: true, predicate: ["preview"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div ngClass=\"kwikid-renderer\">\n <div\n ngClass=\"kwikid-layout-container\"\n *ngIf=\"!loading\"\n >\n <div\n ngClass=\"kwikid-sections-container\"\n *ngIf=\"showFormSections\"\n class=\"active\"\n [class.active]=\"showFormSections\"\n [class.mobile]=\"isMobileView\"\n >\n <kwikid-forms-list\n [showFormFields]=\"this.showFormFields\"\n [activeFormConfig]=\"this.activeFormConfig\"\n [userConfig]=\"this.userConfig\"\n [formsList]=\"this.formsList\"\n [stepConfig]=\"this.stepConfig\"\n [formsListCompleted]=\"this.formsListCompleted\"\n [isMobileView]=\"this.isMobileView\"\n (onClickSetActiveForm)=\"this.handleOnClickSetActiveForm($event)\"\n (onClickSubmitForms)=\"this.handleOnClickSubmitForms($event)\"\n ></kwikid-forms-list>\n </div>\n <div\n ngClass=\"kwikid-forms-container\"\n *ngIf=\"\n this.showForm &&\n this.showFormFields &&\n this.activeFormConfig !== undefined\n \"\n [class.active]=\"showFormFields\"\n [class.mobile]=\"isMobileView\"\n [@panelInOut]\n >\n <kwikid-form-view\n *ngIf=\"this.activeFormConfig.type === 'FORM'\"\n [formConfig]=\"this.activeFormConfig\"\n [allFormsData]=\"this.allFormsData\"\n [isMobileView]=\"this.isMobileView\"\n [userConfig]=\"this.userConfig\"\n [popupFormCallback]=\"this.popupFormCallback\"\n [apiCallResponse]=\"this.apiCallResponse\"\n (onClickApiCall)=\"handleOnClickApiCall($event)\"\n (onActionShowPopupForm)=\"\n this.handleOnActionShowPopupForm($event, content)\n \"\n (onClickGoBack)=\"this.handleOnClickGoBack($event)\"\n (onClickViewForms)=\"this.handleOnClickViewForms($event)\"\n (onClickSaveForm)=\"\n this.handleOnClickSaveForm($event, 'FORM', undefined)\n \"\n ></kwikid-form-view>\n </div>\n </div>\n</div>\n\n<kwikui-loader\n [loaderText]=\"'Please wait'\"\n [showLoader]=\"loader\"\n [fullscreen]=\"true\"\n></kwikui-loader>\n\n<tui-push\n id=\"error-notification\"\n *tuiPush=\"showErrorNotification\"\n heading=\"Please complete the required Forms!\"\n type=\"Error\"\n (close)=\"toggleErrorNotification(false)\"\n>\n <tui-svg\n src=\"tuiIconXCircle\"\n style=\"color: #fff !important\"\n >\n </tui-svg>\n</tui-push>\n<ng-template\n #preview\n let-preview\n>\n <tui-preview\n [rotatable]=\"false\"\n [zoomable]=\"false\"\n class=\"preview-container\"\n *ngIf=\"popupFormConfig\"\n >\n <tui-preview-title *ngIf=\"previewProperties.title !== ''\">{{\n previewProperties.title\n }}</tui-preview-title>\n\n <div class=\"kwikid-form-view-popup-container\">\n <kwikid-form-view\n [formData]=\"activePopupFormData\"\n [formConfig]=\"popupFormConfig\"\n [allFormsData]=\"allFormsData\"\n [userConfig]=\"this.userConfig\"\n [isMobileView]=\"this.isMobileView\"\n [apiCallResponse]=\"this.apiCallResponse\"\n (onClickApiCall)=\"handleOnClickApiCall($event)\"\n (onClickSaveForm)=\"\n this.handleOnClickSaveForm($event, 'POPUP_FORM', undefined)\n \"\n ></kwikid-form-view>\n </div>\n\n <button\n tuiIconButton\n tuiPreviewAction\n icon=\"tuiIconCloseLarge\"\n title=\"Close\"\n type=\"button\"\n (click)=\"preview.complete()\"\n ></button>\n </tui-preview>\n</ng-template>\n<ng-template\n #content\n let-context\n>\n <div class=\"kwikid-form-view-popup-container\">\n <kwikid-form-view\n [formData]=\"activePopupFormData\"\n [formConfig]=\"popupFormConfig\"\n [allFormsData]=\"allFormsData\"\n [userConfig]=\"this.userConfig\"\n [isMobileView]=\"this.isMobileView\"\n [apiCallResponse]=\"this.apiCallResponse\"\n (onClickApiCall)=\"handleOnClickApiCall($event)\"\n (onClickSaveForm)=\"\n this.handleOnClickSaveForm($event, 'POPUP_FORM', context)\n \"\n ></kwikid-form-view>\n </div>\n</ng-template>\n", styles: [":host{position:relative;height:100%}.kwikid-root{width:100%;height:100%}.kwikid-renderer{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:center;width:100%;height:100%}.kwikid-layout-container{display:flex;flex-direction:row;padding:0 1rem;height:100%;justify-content:center;align-items:stretch;background:var(--tui-secondary-active);position:relative}.kwikid-sections-container{display:block;width:100%;max-width:400px;height:calc(100% - 2rem);padding:.25rem .5rem 0;border-radius:1rem;background-color:var(--tui-base-01);margin:auto 1rem auto 0;box-shadow:0 0 12px -8px var(--tui-secondary)}.kwikid-sections-container.mobile{position:absolute;top:0;left:0;z-index:5;opacity:1;visibility:visible;transition:all 1s;height:100%;border-radius:0;max-width:unset}.kwikid-forms-container{display:block;width:100%;max-width:50%;margin:auto 0;height:calc(100% - 2rem);padding:.25rem .5rem 0;border-radius:1rem;background-color:var(--tui-base-01);box-shadow:0 0 12px -8px var(--tui-primary)}.kwikid-forms-container.mobile{position:absolute;top:0;left:0;z-index:5;opacity:1;visibility:visible;transition:all 1s;height:100%;border-radius:0;max-width:unset}@media screen and (max-width: 600px){.kwikid-layout-container{padding:0;background:transparent}.kwikid-sections-container{position:absolute;max-width:100%;bottom:-10000px;left:-10000px;opacity:0;padding:0;visibility:hidden}.kwikid-sections-container.active{visibility:visible}.kwikid-sections-container.mobile{height:100%;opacity:1;visibility:visible;transition:all 2s;border-radius:0;box-shadow:none;top:0px;margin:0;position:absolute}.kwikid-forms-container{display:none;max-width:100%;height:100%;padding:0;border-radius:0;box-shadow:none}.kwikid-forms-container.mobile{height:100%;opacity:1;visibility:visible;transition:all 2s;border-radius:0;box-shadow:none;top:0px;margin:0;position:absolute}.kwikid-forms-container.active{display:block}}#error-notification{background-color:var(--tui-error-fill);color:#fff!important}#error-notification .t-top{color:#fff!important}#error-notification .t-close{color:#fff!important}.preview-container{display:flex!important;flex-grow:1!important;flex-direction:column!important;align-content:center!important;justify-content:space-between!important;align-items:stretch!important}.preview-container .preview-iframe{width:100vw;height:100vh}.preview-container .preview-unavailable{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center;grid-gap:1rem;grid-gap:1.4rem;gap:1.4rem;color:#fff;font-size:1.2rem;top:50%;left:50%;width:100%;height:100vh}.kwikid-form-view-popup-container{border-radius:1rem;background:var(--tui-base-01)}\n", "::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{border-radius:10px}::-webkit-scrollbar-thumb{background:lightgray;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:gray}\n"], components: [{ type: KwikIDFormsListComponent, selector: "kwikid-forms-list", inputs: ["showFormFields", "userConfig", "stepConfig", "activeFormConfig", "formsList", "formsListCompleted", "isMobileView"], outputs: ["onClickSetActiveForm", "onClickHideFormsList", "onClickSubmitForms"] }, { type: KwikIDFormViewComponent, selector: "kwikid-form-view", inputs: ["formConfig", "formData", "isMobileView", "allFormsData", "userConfig", "apiCallResponse", "popupFormCallback"], outputs: ["onClickGoBack", "onClickViewForms", "onClickSaveForm", "onClickApiCall", "onActionShowPopupForm"] }, { type: i2.KwikUILoaderComponent, selector: "kwikui-loader", inputs: ["id", "loaderText", "showLoader", "fullscreen", "styles", "class"] }, { type: i4.TuiPushComponent, selector: "tui-push", inputs: ["heading", "type", "timestamp"], outputs: ["close"] }, { type: i3.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i5.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { type: i5.TuiPreviewTitleComponent, selector: "tui-preview-title" }, { type: i3.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i3$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i4.TuiPushDirective, selector: "tui-push" }, { type: i5.TuiPreviewActionDirective, selector: "[tuiPreviewAction]" }], animations: [
5151
+ /** @nocollapse */ KwikIDFormsRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormsRendererComponent, selector: "kwikid-forms-renderer", inputs: { stepConfig: "stepConfig", userConfig: "userConfig", formsData: "formsData", activeFormData: "activeFormData", apiCallResponse: "apiCallResponse" }, outputs: { onClickSubmit: "onClickSubmit", getFormData: "getFormData", onClickApiCall: "onClickApiCall" }, host: { listeners: { "window:resize": "windowResizeWatcher($event)" } }, viewQueries: [{ propertyName: "preview", first: true, predicate: ["preview"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div ngClass=\"kwikid-renderer\">\n <div\n ngClass=\"kwikid-layout-container\"\n *ngIf=\"!loading\"\n >\n <div\n ngClass=\"kwikid-sections-container\"\n *ngIf=\"showFormSections\"\n class=\"active\"\n [class.active]=\"showFormSections\"\n [class.mobile]=\"isMobileView\"\n >\n <kwikid-forms-list\n [showFormFields]=\"this.showFormFields\"\n [activeFormConfig]=\"this.activeFormConfig\"\n [userConfig]=\"this.userConfig\"\n [formsList]=\"this.formsList\"\n [stepConfig]=\"this.stepConfig\"\n [formsListCompleted]=\"this.formsListCompleted\"\n [isMobileView]=\"this.isMobileView\"\n (onClickSetActiveForm)=\"this.handleOnClickSetActiveForm($event)\"\n (onClickSubmitForms)=\"this.handleOnClickSubmitForms($event)\"\n ></kwikid-forms-list>\n </div>\n <div\n ngClass=\"kwikid-forms-container\"\n *ngIf=\"\n this.showForm &&\n this.showFormFields &&\n this.activeFormConfig !== undefined\n \"\n [class.active]=\"showFormFields\"\n [class.mobile]=\"isMobileView\"\n [@panelInOut]\n >\n <kwikid-form-view\n *ngIf=\"this.activeFormConfig.type === 'FORM'\"\n [formConfig]=\"this.activeFormConfig\"\n [allFormsData]=\"this.allFormsData\"\n [isMobileView]=\"this.isMobileView\"\n [userConfig]=\"this.userConfig\"\n [popupFormCallback]=\"this.popupFormCallback\"\n [apiCallResponse]=\"this.apiCallResponse\"\n (onClickApiCall)=\"handleOnClickApiCall($event)\"\n (onActionShowPopupForm)=\"\n this.handleOnActionShowPopupForm($event, content)\n \"\n (onClickGoBack)=\"this.handleOnClickGoBack($event)\"\n (onClickViewForms)=\"this.handleOnClickViewForms($event)\"\n (onClickSaveForm)=\"\n this.handleOnClickSaveForm($event, 'FORM', undefined)\n \"\n ></kwikid-form-view>\n </div>\n </div>\n</div>\n\n<kwikui-loader\n [loaderText]=\"'Please wait'\"\n [showLoader]=\"loader\"\n [fullscreen]=\"true\"\n></kwikui-loader>\n\n<tui-push\n id=\"error-notification\"\n *tuiPush=\"showErrorNotification\"\n heading=\"Please complete the required Forms!\"\n type=\"Error\"\n (close)=\"toggleErrorNotification(false)\"\n>\n <tui-svg\n src=\"tuiIconXCircle\"\n style=\"color: #fff !important\"\n >\n </tui-svg>\n</tui-push>\n<ng-template\n #preview\n let-preview\n>\n <tui-preview\n [rotatable]=\"false\"\n [zoomable]=\"false\"\n class=\"preview-container\"\n *ngIf=\"popupFormConfig\"\n >\n <tui-preview-title *ngIf=\"previewProperties.title !== ''\">{{\n previewProperties.title\n }}</tui-preview-title>\n\n <div class=\"kwikid-form-view-popup-container\">\n <kwikid-form-view\n [formData]=\"activePopupFormData\"\n [formConfig]=\"popupFormConfig\"\n [allFormsData]=\"allFormsData\"\n [userConfig]=\"this.userConfig\"\n [isMobileView]=\"this.isMobileView\"\n [apiCallResponse]=\"this.apiCallResponse\"\n (onClickApiCall)=\"handleOnClickApiCall($event)\"\n (onClickSaveForm)=\"\n this.handleOnClickSaveForm($event, 'POPUP_FORM', undefined)\n \"\n ></kwikid-form-view>\n </div>\n\n <button\n tuiIconButton\n tuiPreviewAction\n icon=\"tuiIconCloseLarge\"\n title=\"Close\"\n type=\"button\"\n (click)=\"preview.complete()\"\n ></button>\n </tui-preview>\n</ng-template>\n<ng-template\n #content\n let-context\n>\n <div class=\"kwikid-form-view-popup-container\">\n <kwikid-form-view\n [formData]=\"activePopupFormData\"\n [formConfig]=\"popupFormConfig\"\n [allFormsData]=\"allFormsData\"\n [userConfig]=\"this.userConfig\"\n [isMobileView]=\"this.isMobileView\"\n [apiCallResponse]=\"this.apiCallResponse\"\n (onClickApiCall)=\"handleOnClickApiCall($event)\"\n (onClickSaveForm)=\"\n this.handleOnClickSaveForm($event, 'POPUP_FORM', context)\n \"\n ></kwikid-form-view>\n </div>\n</ng-template>\n", styles: [":host{position:relative;height:100%}.kwikid-root{width:100%;height:100%}.kwikid-renderer{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:center;width:100%;height:100%}.kwikid-layout-container{display:flex;flex-direction:row;padding:0 1rem;height:100%;justify-content:center;align-items:stretch;background:var(--tui-secondary-active);position:relative}.kwikid-sections-container{display:block;width:100%;max-width:400px;height:calc(100% - 2rem);padding:.25rem .5rem 0;border-radius:1rem;background-color:var(--tui-base-01);margin:auto 1rem auto 0;box-shadow:0 0 12px -8px var(--tui-secondary)}.kwikid-sections-container.mobile{position:absolute;top:0;left:0;z-index:5;opacity:1;visibility:visible;transition:all 1s;height:100%;border-radius:0;max-width:unset}.kwikid-forms-container{display:block;width:100%;max-width:50%;margin:auto 0;height:calc(100% - 2rem);padding:.25rem .5rem 0;border-radius:1rem;background-color:var(--tui-base-01);box-shadow:0 0 12px -8px var(--tui-primary)}.kwikid-forms-container.mobile{position:absolute;top:0;left:0;z-index:5;opacity:1;visibility:visible;transition:all 1s;height:100%;border-radius:0;max-width:unset}@media screen and (max-width: 600px){.kwikid-layout-container{padding:0;background:transparent}.kwikid-sections-container{position:absolute;max-width:100%;bottom:-10000px;left:-10000px;opacity:0;padding:0;visibility:hidden}.kwikid-sections-container.active{visibility:visible}.kwikid-sections-container.mobile{height:100%;opacity:1;visibility:visible;transition:all 2s;border-radius:0;box-shadow:none;top:0px;margin:0;position:absolute}.kwikid-forms-container{display:none;max-width:100%;height:100%;padding:0;border-radius:0;box-shadow:none}.kwikid-forms-container.mobile{height:100%;opacity:1;visibility:visible;transition:all 2s;border-radius:0;box-shadow:none;top:0px;margin:0;position:absolute}.kwikid-forms-container.active{display:block}}#error-notification{background-color:var(--tui-error-fill);color:#fff!important}#error-notification .t-top{color:#fff!important}#error-notification .t-close{color:#fff!important}.preview-container{display:flex!important;flex-grow:1!important;flex-direction:column!important;align-content:center!important;justify-content:space-between!important;align-items:stretch!important}.preview-container .preview-iframe{width:100vw;height:100vh}.preview-container .preview-unavailable{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center;grid-gap:1rem;grid-gap:1.4rem;gap:1.4rem;color:#fff;font-size:1.2rem;top:50%;left:50%;width:100%;height:100vh}.kwikid-form-view-popup-container{border-radius:1rem;background:var(--tui-base-01)}\n", "::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{border-radius:10px}::-webkit-scrollbar-thumb{background:lightgray;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:gray}\n"], components: [{ type: KwikIDFormsListComponent, selector: "kwikid-forms-list", inputs: ["showFormFields", "userConfig", "stepConfig", "activeFormConfig", "formsList", "formsListCompleted", "isMobileView"], outputs: ["onClickSetActiveForm", "onClickHideFormsList", "onClickSubmitForms"] }, { type: KwikIDFormViewComponent, selector: "kwikid-form-view", inputs: ["formConfig", "formData", "isMobileView", "allFormsData", "userConfig", "apiCallResponse", "popupFormCallback"], outputs: ["onClickGoBack", "onClickViewForms", "onClickSaveForm", "onClickApiCall", "onActionShowPopupForm"] }, { type: i2.KwikUILoaderComponent, selector: "kwikui-loader", inputs: ["id", "loaderText", "showLoader", "fullscreen", "styles", "class"] }, { type: i5.TuiPushComponent, selector: "tui-push", inputs: ["heading", "type", "timestamp"], outputs: ["close"] }, { type: i3.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i6.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { type: i6.TuiPreviewTitleComponent, selector: "tui-preview-title" }, { type: i3.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i3$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i5.TuiPushDirective, selector: "tui-push" }, { type: i6.TuiPreviewActionDirective, selector: "[tuiPreviewAction]" }], animations: [
5143
5152
  trigger("panelInOut", [
5144
5153
  transition(":enter", [
5145
5154
  style({ transform: "translateY(100%)" }),
@@ -5225,7 +5234,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
5225
5234
  ])
5226
5235
  ]
5227
5236
  }]
5228
- }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i5.TuiPreviewDialogService, decorators: [{
5237
+ }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i6.TuiPreviewDialogService, decorators: [{
5229
5238
  type: Inject,
5230
5239
  args: [TuiPreviewDialogService]
5231
5240
  }] }, { type: i3.TuiDialogService, decorators: [{
@@ -5370,7 +5379,8 @@ class KwikIDFormViewModule {
5370
5379
  TuiPreviewActionModule,
5371
5380
  TuiDialogModule,
5372
5381
  KwikUIPipeModule,
5373
- KwikUIModule], exports: [KwikIDFormViewComponent] });
5382
+ KwikUIModule,
5383
+ KwikIDFingerprintModule], exports: [KwikIDFormViewComponent] });
5374
5384
  /** @nocollapse */ KwikIDFormViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: KwikIDFormViewModule, imports: [[
5375
5385
  CommonModule,
5376
5386
  FormsModule,
@@ -5383,7 +5393,8 @@ class KwikIDFormViewModule {
5383
5393
  TuiPreviewActionModule,
5384
5394
  TuiDialogModule,
5385
5395
  KwikUIPipeModule,
5386
- KwikUIModule
5396
+ KwikUIModule,
5397
+ KwikIDFingerprintModule
5387
5398
  ]] });
5388
5399
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: KwikIDFormViewModule, decorators: [{
5389
5400
  type: NgModule,
@@ -5401,7 +5412,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
5401
5412
  TuiPreviewActionModule,
5402
5413
  TuiDialogModule,
5403
5414
  KwikUIPipeModule,
5404
- KwikUIModule
5415
+ KwikUIModule,
5416
+ KwikIDFingerprintModule
5405
5417
  ],
5406
5418
  exports: [KwikIDFormViewComponent]
5407
5419
  }]