kwikid-forms 0.3.7 → 0.3.9

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 (24) hide show
  1. package/bundles/kwikid-forms.umd.js +1182 -379
  2. package/bundles/kwikid-forms.umd.js.map +1 -1
  3. package/esm2015/lib/renderer/config-converter.helper.js +11 -32
  4. package/esm2015/lib/renderer/form-view/definitions/form-view.actions.definition.js +15 -2
  5. package/esm2015/lib/renderer/form-view/definitions/form-view.commons.definition.js +6 -1
  6. package/esm2015/lib/renderer/form-view/form-view.component.js +530 -136
  7. package/esm2015/lib/renderer/form-view/form-view.module.js +18 -4
  8. package/esm2015/lib/renderer/form-view/helpers/form-view.apis.helper.js +5 -1
  9. package/esm2015/lib/renderer/form-view/helpers/form-view.tasks.helper.js +28 -0
  10. package/esm2015/lib/renderer/form-view/pipes/safe-url.pipe.js +25 -0
  11. package/esm2015/lib/renderer/forms-list/forms-list.component.js +7 -1
  12. package/esm2015/lib/renderer/renderer.component.js +176 -14
  13. package/esm2015/lib/renderer/renderer.module.js +15 -2
  14. package/fesm2015/kwikid-forms.js +815 -185
  15. package/fesm2015/kwikid-forms.js.map +1 -1
  16. package/lib/renderer/form-view/definitions/form-view.actions.definition.d.ts +28 -2
  17. package/lib/renderer/form-view/definitions/form-view.commons.definition.d.ts +5 -0
  18. package/lib/renderer/form-view/form-view.component.d.ts +45 -7
  19. package/lib/renderer/form-view/form-view.module.d.ts +8 -6
  20. package/lib/renderer/form-view/helpers/form-view.tasks.helper.d.ts +7 -0
  21. package/lib/renderer/form-view/pipes/safe-url.pipe.d.ts +15 -0
  22. package/lib/renderer/renderer.component.d.ts +33 -4
  23. package/lib/renderer/renderer.module.d.ts +2 -1
  24. package/package.json +2 -2
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/cdk/drag-drop'), require('@angular/core'), require('@angular/forms'), require('kwikid-toolkit'), require('kwikui'), require('@angular/common'), require('lodash'), require('@taiga-ui/core'), require('@taiga-ui/kit'), require('rxjs/operators'), require('@taiga-ui/cdk'), require('@angular/platform-browser'), require('@angular/animations'), require('@angular/common/http')) :
3
- typeof define === 'function' && define.amd ? define('kwikid-forms', ['exports', '@angular/cdk/drag-drop', '@angular/core', '@angular/forms', 'kwikid-toolkit', 'kwikui', '@angular/common', 'lodash', '@taiga-ui/core', '@taiga-ui/kit', 'rxjs/operators', '@taiga-ui/cdk', '@angular/platform-browser', '@angular/animations', '@angular/common/http'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["kwikid-forms"] = {}, global.ng.cdk.dragDrop, global.ng.core, global.ng.forms, global["kwikid-toolkit"], global.kwikui, global.ng.common, global.lodash, global["@taiga-ui/core"], global["@taiga-ui/kit"], global.rxjs.operators, global["@taiga-ui/cdk"], global.ng.platformBrowser, global.ng.animations, global.ng.common.http));
5
- })(this, (function (exports, i4, i0, i2, kwikidToolkit, i1, i5, _, i3, i4$1, operators, cdk, i1$1, animations, http) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/cdk/drag-drop'), require('@angular/core'), require('@angular/forms'), require('kwikid-toolkit'), require('kwikui'), require('@angular/common'), require('lodash'), require('@taiga-ui/addon-preview'), require('@taiga-ui/core'), require('@taiga-ui/kit'), require('rxjs/operators'), require('@taiga-ui/cdk'), require('@angular/platform-browser'), require('@angular/animations'), require('@angular/common/http')) :
3
+ typeof define === 'function' && define.amd ? define('kwikid-forms', ['exports', '@angular/cdk/drag-drop', '@angular/core', '@angular/forms', 'kwikid-toolkit', 'kwikui', '@angular/common', 'lodash', '@taiga-ui/addon-preview', '@taiga-ui/core', '@taiga-ui/kit', 'rxjs/operators', '@taiga-ui/cdk', '@angular/platform-browser', '@angular/animations', '@angular/common/http'], factory) :
4
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["kwikid-forms"] = {}, global.ng.cdk.dragDrop, global.ng.core, global.ng.forms, global["kwikid-toolkit"], global.kwikui, global.ng.common, global.lodash, global["@taiga-ui/addon-preview"], global["@taiga-ui/core"], global["@taiga-ui/kit"], global.rxjs.operators, global["@taiga-ui/cdk"], global.ng.platformBrowser, global.ng.animations, global.ng.common.http));
5
+ })(this, (function (exports, i4, i0, i2, kwikidToolkit, i1, i3, _, i5, i3$1, i4$1, operators, cdk, i1$1, animations, http) { 'use strict';
6
6
 
7
7
  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
8
 
@@ -28,9 +28,10 @@
28
28
  var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
29
29
  var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
30
30
  var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
31
- var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
32
- var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
33
31
  var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
32
+ var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
33
+ var i5__namespace = /*#__PURE__*/_interopNamespace(i5);
34
+ var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
34
35
  var i4__namespace$1 = /*#__PURE__*/_interopNamespace(i4$1);
35
36
  var i1__namespace$1 = /*#__PURE__*/_interopNamespace(i1$1);
36
37
 
@@ -763,7 +764,7 @@
763
764
  return BasicRadioConfigEditor;
764
765
  }());
765
766
  /** @nocollapse */ BasicRadioConfigEditor.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BasicRadioConfigEditor, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
766
- /** @nocollapse */ BasicRadioConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: BasicRadioConfigEditor, selector: "basic-radio-config-editor", inputs: { saveBasicClickCounter: "saveBasicClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <form [formGroup]=\"basicRadioFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Options</legend>\n <div formArrayName=\"options\">\n <ng-container\n *ngFor=\"let option of optionsArray.controls; let i = index\"\n >\n <div [formGroupName]=\"i\">\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Label'\"\n [id]=\"'basic-radio-config-placeholder'\"\n [type]=\"'text'\"\n [formControlName]=\"'label'\"\n [formControl]=\"\n basicRadioFormGroup['controls'].options['controls'][i][\n 'controls'\n ].label\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your label'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'disabled'\"\n [id]=\"'basic-radio-config-disabled'\"\n size=\"m\"\n [formControlName]=\"'disabled'\"\n [formControl]=\"\n basicRadioFormGroup['controls'].options['controls'][i][\n 'controls'\n ].disabled\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Description'\"\n [id]=\"'basic-radio-config-description'\"\n [type]=\"'text'\"\n [formControlName]=\"'description'\"\n [formControl]=\"\n basicRadioFormGroup['controls'].options['controls'][i][\n 'controls'\n ].description\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your description'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-array-actions\">\n <kwikui-button\n [disabled]=\"false\"\n label=\"Remove\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"'rounded'\"\n size=\"s\"\n (onClick)=\"removeOption(i)\"\n ></kwikui-button>\n <kwikui-button\n [disabled]=\"false\"\n label=\"Add\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"'rounded'\"\n size=\"s\"\n (onClick)=\"addOption()\"\n ></kwikui-button>\n </div>\n </div>\n </ng-container>\n </div>\n </fieldset>\n\n <div formGroupName=\"properties\">\n <fieldset>\n <legend class=\"form-group-title\">Miscellaneous</legend>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"['horizontal', 'vertical']\"\n [label]=\"'Orientation'\"\n [id]=\"'basic-radio-config-orientation'\"\n size=\"m\"\n [formControlName]=\"'orientation'\"\n [formControl]=\"\n basicRadioFormGroup['controls'].properties['controls']\n .orientation\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select orientation'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n </form>\n ", isInline: true, styles: ["\n .form-array-actions {\n display: flex;\n flex-direction: row;\n align-content: center;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUISelectComboboxComponent, selector: "kwikui-select-combobox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }], directives: [{ type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
767
+ /** @nocollapse */ BasicRadioConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: BasicRadioConfigEditor, selector: "basic-radio-config-editor", inputs: { saveBasicClickCounter: "saveBasicClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <form [formGroup]=\"basicRadioFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Options</legend>\n <div formArrayName=\"options\">\n <ng-container\n *ngFor=\"let option of optionsArray.controls; let i = index\"\n >\n <div [formGroupName]=\"i\">\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Label'\"\n [id]=\"'basic-radio-config-placeholder'\"\n [type]=\"'text'\"\n [formControlName]=\"'label'\"\n [formControl]=\"\n basicRadioFormGroup['controls'].options['controls'][i][\n 'controls'\n ].label\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your label'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'disabled'\"\n [id]=\"'basic-radio-config-disabled'\"\n size=\"m\"\n [formControlName]=\"'disabled'\"\n [formControl]=\"\n basicRadioFormGroup['controls'].options['controls'][i][\n 'controls'\n ].disabled\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Description'\"\n [id]=\"'basic-radio-config-description'\"\n [type]=\"'text'\"\n [formControlName]=\"'description'\"\n [formControl]=\"\n basicRadioFormGroup['controls'].options['controls'][i][\n 'controls'\n ].description\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your description'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-array-actions\">\n <kwikui-button\n [disabled]=\"false\"\n label=\"Remove\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"'rounded'\"\n size=\"s\"\n (onClick)=\"removeOption(i)\"\n ></kwikui-button>\n <kwikui-button\n [disabled]=\"false\"\n label=\"Add\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"'rounded'\"\n size=\"s\"\n (onClick)=\"addOption()\"\n ></kwikui-button>\n </div>\n </div>\n </ng-container>\n </div>\n </fieldset>\n\n <div formGroupName=\"properties\">\n <fieldset>\n <legend class=\"form-group-title\">Miscellaneous</legend>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"['horizontal', 'vertical']\"\n [label]=\"'Orientation'\"\n [id]=\"'basic-radio-config-orientation'\"\n size=\"m\"\n [formControlName]=\"'orientation'\"\n [formControl]=\"\n basicRadioFormGroup['controls'].properties['controls']\n .orientation\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select orientation'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n </form>\n ", isInline: true, styles: ["\n .form-array-actions {\n display: flex;\n flex-direction: row;\n align-content: center;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUISelectComboboxComponent, selector: "kwikui-select-combobox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }], directives: [{ type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
767
768
  __decorate([
768
769
  kwikidToolkit.logMethod
769
770
  ], BasicRadioConfigEditor.prototype, "ngOnInit", null);
@@ -900,7 +901,7 @@
900
901
  return BasicDropdownWithSearchConfigEditor;
901
902
  }());
902
903
  /** @nocollapse */ BasicDropdownWithSearchConfigEditor.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BasicDropdownWithSearchConfigEditor, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
903
- /** @nocollapse */ BasicDropdownWithSearchConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: BasicDropdownWithSearchConfigEditor, selector: "basic-dropdown-with-search-config-editor", inputs: { saveBasicClickCounter: "saveBasicClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <form [formGroup]=\"basicDropdownWithSearchFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Options</legend>\n <div formArrayName=\"options\">\n <ng-container\n *ngFor=\"let option of optionsArray.controls; let i = index\"\n >\n <div [formGroupName]=\"i\">\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Title'\"\n [id]=\"'basic-dropdown-with-search-config-title'\"\n [type]=\"'text'\"\n [formControlName]=\"'title'\"\n [formControl]=\"\n basicDropdownWithSearchFormGroup['controls'].options['controls'][i][\n 'controls'\n ].title\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your title'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Value'\"\n [id]=\"'basic-dropdown-with-search-config-value'\"\n [type]=\"'text'\"\n [formControlName]=\"'value'\"\n [formControl]=\"\n basicDropdownWithSearchFormGroup['controls'].options['controls'][i][\n 'controls'\n ].value\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-array-actions\">\n <kwikui-button\n [disabled]=\"false\"\n label=\"Remove\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"'rounded'\"\n size=\"s\"\n (onClick)=\"removeOption(i)\"\n ></kwikui-button>\n <kwikui-button\n [disabled]=\"false\"\n label=\"Add\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"'rounded'\"\n size=\"s\"\n (onClick)=\"addOption()\"\n ></kwikui-button>\n </div>\n </div>\n </ng-container>\n </div>\n </fieldset>\n </form>\n ", isInline: true, styles: ["\n .form-array-actions {\n display: flex;\n flex-direction: row;\n align-content: center;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }], directives: [{ type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
904
+ /** @nocollapse */ BasicDropdownWithSearchConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: BasicDropdownWithSearchConfigEditor, selector: "basic-dropdown-with-search-config-editor", inputs: { saveBasicClickCounter: "saveBasicClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <form [formGroup]=\"basicDropdownWithSearchFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Options</legend>\n <div formArrayName=\"options\">\n <ng-container\n *ngFor=\"let option of optionsArray.controls; let i = index\"\n >\n <div [formGroupName]=\"i\">\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Title'\"\n [id]=\"'basic-dropdown-with-search-config-title'\"\n [type]=\"'text'\"\n [formControlName]=\"'title'\"\n [formControl]=\"\n basicDropdownWithSearchFormGroup['controls'].options['controls'][i][\n 'controls'\n ].title\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your title'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Value'\"\n [id]=\"'basic-dropdown-with-search-config-value'\"\n [type]=\"'text'\"\n [formControlName]=\"'value'\"\n [formControl]=\"\n basicDropdownWithSearchFormGroup['controls'].options['controls'][i][\n 'controls'\n ].value\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-array-actions\">\n <kwikui-button\n [disabled]=\"false\"\n label=\"Remove\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"'rounded'\"\n size=\"s\"\n (onClick)=\"removeOption(i)\"\n ></kwikui-button>\n <kwikui-button\n [disabled]=\"false\"\n label=\"Add\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"'rounded'\"\n size=\"s\"\n (onClick)=\"addOption()\"\n ></kwikui-button>\n </div>\n </div>\n </ng-container>\n </div>\n </fieldset>\n </form>\n ", isInline: true, styles: ["\n .form-array-actions {\n display: flex;\n flex-direction: row;\n align-content: center;\n justify-content: center;\n align-items: center;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }], directives: [{ type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2__namespace.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] });
904
905
  __decorate([
905
906
  kwikidToolkit.logMethod
906
907
  ], BasicDropdownWithSearchConfigEditor.prototype, "ngOnInit", null);
@@ -1270,7 +1271,7 @@
1270
1271
  return BasicElementConfigEditor;
1271
1272
  }());
1272
1273
  /** @nocollapse */ BasicElementConfigEditor.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: BasicElementConfigEditor, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1273
- /** @nocollapse */ BasicElementConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: BasicElementConfigEditor, selector: "basic-element-config-editor", inputs: { saveClickCounter: "saveClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <ng-container *ngIf=\"elementConfig !== undefined\">\n <kwikui-table\n style=\"width: 100%; height: 100%; overflow: auto; box-shadow: 0px 0px 10px -6px #000; border: 0px solid gray; border-radius: 1rem;\"\n [columns]=\"['id', 'type', 'category']\"\n [headers]=\"{ id: 'ID', type: 'Type', category: 'Category' }\"\n [data]=\"[\n {\n id: elementConfig.elementId,\n type: elementConfig.elementType,\n category: elementConfig.elementCategory\n }\n ]\"\n (onClick)=\"(undefined)\"\n ></kwikui-table>\n </ng-container>\n <form [formGroup]=\"basicFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Standard</legend>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Label'\"\n [id]=\"'basic-field-label'\"\n [type]=\"'text'\"\n [formControlName]=\"'label'\"\n [formControl]=\"basicFormGroup.controls['label']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Label'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Key'\"\n [id]=\"'basic-field-key'\"\n [type]=\"'text'\"\n [formControlName]=\"'key'\"\n [formControl]=\"basicFormGroup.controls['key']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Key'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'Disabled'\"\n [id]=\"'basic-input-property-disabled'\"\n size=\"m\"\n [formControlName]=\"'disabled'\"\n [formControl]=\"basicFormGroup.controls['disabled']\"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n\n <div formGroupName=\"default\">\n <fieldset>\n <legend class=\"form-group-title\">Default</legend>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'value'\"\n [id]=\"'basic-input-property-value'\"\n size=\"m\"\n [formControlName]=\"'value'\"\n [formControl]=\"\n basicFormGroup['controls'].default['controls'].value\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <div formGroupName=\"validators\">\n <fieldset>\n <legend class=\"form-group-title\">Validators</legend>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'min'\"\n [id]=\"'basic-input-validators-min'\"\n [formControlName]=\"'min'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].min\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your minimum value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'max'\"\n [id]=\"'basic-input-validators-max'\"\n [formControlName]=\"'max'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].max\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your maximum value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'minLength'\"\n [id]=\"'basic-input-validators-minLength'\"\n [formControlName]=\"'minLength'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].minLength\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your minimum length value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'maxLength'\"\n [id]=\"'basic-input-validators-maxLength'\"\n [formControlName]=\"'maxLength'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].maxLength\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your maximum length value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'required'\"\n [id]=\"'basic-input-property-required'\"\n size=\"m\"\n [formControlName]=\"'required'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].required\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <div formGroupName=\"properties\">\n <fieldset>\n <legend class=\"form-group-title\">Properties</legend>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Placeholder'\"\n [id]=\"'basic-field-placeholder'\"\n [type]=\"'text'\"\n [formControlName]=\"'placeholder'\"\n [formControl]=\"\n basicFormGroup.controls.properties['controls'].placeholder\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your placeholder'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'readOnly'\"\n [id]=\"'basic-input-property-readOnly'\"\n size=\"m\"\n [formControlName]=\"'readOnly'\"\n [formControl]=\"\n basicFormGroup['controls'].properties['controls'].readOnly\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <ng-container [ngSwitch]=\"elementType\">\n <ng-container *ngSwitchCase=\"'text'\">\n <basic-text-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-text-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'number'\">\n <basic-number-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-number-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'radio'\">\n <basic-radio-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-radio-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'dropdown-with-search'\">\n <basic-dropdown-with-search-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-dropdown-with-search-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'checkbox'\">\n <basic-checkbox-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-checkbox-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'date'\">\n <basic-checkbox-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-checkbox-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'otp'\">\n <basic-otp-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-otp-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'phone'\">\n <basic-phone-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-phone-config-editor>\n </ng-container>\n </ng-container>\n </form>\n ", isInline: true, styles: ["\n :host {\n display: flex;\n flex-direction: column;\n align-content: center;\n justify-content: flex-start;\n align-items: stretch;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUITableComponent, selector: "kwikui-table", inputs: ["id", "columns", "headers", "data"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUISelectComboboxComponent, selector: "kwikui-select-combobox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.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: BasicTextConfigEditor, selector: "basic-text-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicNumberConfigEditor, selector: "basic-number-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicRadioConfigEditor, selector: "basic-radio-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicDropdownWithSearchConfigEditor, selector: "basic-dropdown-with-search-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicCheckboxConfigEditor, selector: "basic-checkbox-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicOtpConfigEditor, selector: "basic-otp-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicPhoneConfigEditor, selector: "basic-phone-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2__namespace.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i5__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
1274
+ /** @nocollapse */ BasicElementConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: BasicElementConfigEditor, selector: "basic-element-config-editor", inputs: { saveClickCounter: "saveClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <ng-container *ngIf=\"elementConfig !== undefined\">\n <kwikui-table\n style=\"width: 100%; height: 100%; overflow: auto; box-shadow: 0px 0px 10px -6px #000; border: 0px solid gray; border-radius: 1rem;\"\n [columns]=\"['id', 'type', 'category']\"\n [headers]=\"{ id: 'ID', type: 'Type', category: 'Category' }\"\n [data]=\"[\n {\n id: elementConfig.elementId,\n type: elementConfig.elementType,\n category: elementConfig.elementCategory\n }\n ]\"\n (onClick)=\"(undefined)\"\n ></kwikui-table>\n </ng-container>\n <form [formGroup]=\"basicFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Standard</legend>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Label'\"\n [id]=\"'basic-field-label'\"\n [type]=\"'text'\"\n [formControlName]=\"'label'\"\n [formControl]=\"basicFormGroup.controls['label']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Label'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Key'\"\n [id]=\"'basic-field-key'\"\n [type]=\"'text'\"\n [formControlName]=\"'key'\"\n [formControl]=\"basicFormGroup.controls['key']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Key'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'Disabled'\"\n [id]=\"'basic-input-property-disabled'\"\n size=\"m\"\n [formControlName]=\"'disabled'\"\n [formControl]=\"basicFormGroup.controls['disabled']\"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n\n <div formGroupName=\"default\">\n <fieldset>\n <legend class=\"form-group-title\">Default</legend>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'value'\"\n [id]=\"'basic-input-property-value'\"\n size=\"m\"\n [formControlName]=\"'value'\"\n [formControl]=\"\n basicFormGroup['controls'].default['controls'].value\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <div formGroupName=\"validators\">\n <fieldset>\n <legend class=\"form-group-title\">Validators</legend>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'min'\"\n [id]=\"'basic-input-validators-min'\"\n [formControlName]=\"'min'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].min\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your minimum value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'max'\"\n [id]=\"'basic-input-validators-max'\"\n [formControlName]=\"'max'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].max\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your maximum value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'minLength'\"\n [id]=\"'basic-input-validators-minLength'\"\n [formControlName]=\"'minLength'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].minLength\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your minimum length value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'maxLength'\"\n [id]=\"'basic-input-validators-maxLength'\"\n [formControlName]=\"'maxLength'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].maxLength\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your maximum length value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'required'\"\n [id]=\"'basic-input-property-required'\"\n size=\"m\"\n [formControlName]=\"'required'\"\n [formControl]=\"\n basicFormGroup['controls'].validators['controls'].required\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <div formGroupName=\"properties\">\n <fieldset>\n <legend class=\"form-group-title\">Properties</legend>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Placeholder'\"\n [id]=\"'basic-field-placeholder'\"\n [type]=\"'text'\"\n [formControlName]=\"'placeholder'\"\n [formControl]=\"\n basicFormGroup.controls.properties['controls'].placeholder\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your placeholder'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'readOnly'\"\n [id]=\"'basic-input-property-readOnly'\"\n size=\"m\"\n [formControlName]=\"'readOnly'\"\n [formControl]=\"\n basicFormGroup['controls'].properties['controls'].readOnly\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <ng-container [ngSwitch]=\"elementType\">\n <ng-container *ngSwitchCase=\"'text'\">\n <basic-text-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-text-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'number'\">\n <basic-number-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-number-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'radio'\">\n <basic-radio-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-radio-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'dropdown-with-search'\">\n <basic-dropdown-with-search-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-dropdown-with-search-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'checkbox'\">\n <basic-checkbox-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-checkbox-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'date'\">\n <basic-checkbox-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-checkbox-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'otp'\">\n <basic-otp-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-otp-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'phone'\">\n <basic-phone-config-editor\n [saveBasicClickCounter]=\"saveBasicClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-phone-config-editor>\n </ng-container>\n </ng-container>\n </form>\n ", isInline: true, styles: ["\n :host {\n display: flex;\n flex-direction: column;\n align-content: center;\n justify-content: flex-start;\n align-items: stretch;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUITableComponent, selector: "kwikui-table", inputs: ["id", "columns", "headers", "data"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUISelectComboboxComponent, selector: "kwikui-select-combobox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.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: BasicTextConfigEditor, selector: "basic-text-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicNumberConfigEditor, selector: "basic-number-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicRadioConfigEditor, selector: "basic-radio-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicDropdownWithSearchConfigEditor, selector: "basic-dropdown-with-search-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicCheckboxConfigEditor, selector: "basic-checkbox-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicOtpConfigEditor, selector: "basic-otp-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: BasicPhoneConfigEditor, selector: "basic-phone-config-editor", inputs: ["saveBasicClickCounter", "elementConfig"], outputs: ["updateElement"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2__namespace.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
1274
1275
  __decorate([
1275
1276
  kwikidToolkit.logMethod
1276
1277
  ], BasicElementConfigEditor.prototype, "ngOnInit", null);
@@ -1568,7 +1569,7 @@
1568
1569
  return DocumentElementConfigEditor;
1569
1570
  }());
1570
1571
  /** @nocollapse */ DocumentElementConfigEditor.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: DocumentElementConfigEditor, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1571
- /** @nocollapse */ DocumentElementConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DocumentElementConfigEditor, selector: "document-element-config-editor", inputs: { saveClickCounter: "saveClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <ng-container *ngIf=\"elementConfig !== undefined\">\n <kwikui-table\n style=\"width: 100%; height: 100%; overflow: auto; box-shadow: 0px 0px 10px -6px #000; border: 0px solid gray; border-radius: 1rem;\"\n [columns]=\"['id', 'type', 'category']\"\n [headers]=\"{ id: 'ID', type: 'Type', category: 'Category' }\"\n [data]=\"[\n {\n id: elementConfig.elementId,\n type: elementConfig.elementType,\n category: elementConfig.elementCategory\n }\n ]\"\n (onClick)=\"(undefined)\"\n ></kwikui-table>\n </ng-container>\n <form [formGroup]=\"documentFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Standard</legend>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Label'\"\n [id]=\"'document-field-label'\"\n [type]=\"'text'\"\n [formControlName]=\"'label'\"\n [formControl]=\"documentFormGroup.controls['label']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Label'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Key'\"\n [id]=\"'document-field-key'\"\n [type]=\"'text'\"\n [formControlName]=\"'key'\"\n [formControl]=\"documentFormGroup.controls['key']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Key'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'Disabled'\"\n [id]=\"'document-input-property-disabled'\"\n size=\"m\"\n [formControlName]=\"'disabled'\"\n [formControl]=\"documentFormGroup.controls['disabled']\"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n\n <div formGroupName=\"default\">\n <fieldset>\n <legend class=\"form-group-title\">Default</legend>\n <div class=\"form-group\">\n <kwikui-select-combobox\n size=\"m\"\n [options]=\"[true, false]\"\n [label]=\"'value'\"\n [id]=\"'document-input-property-value'\"\n [formControlName]=\"'value'\"\n [formControl]=\"\n documentFormGroup['controls'].default['controls'].value\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <div formGroupName=\"validators\">\n <fieldset>\n <legend class=\"form-group-title\">Validators</legend>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'min'\"\n [id]=\"'document-input-validators-min'\"\n [formControlName]=\"'min'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].min\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your minimum value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'max'\"\n [id]=\"'document-input-validators-max'\"\n [formControlName]=\"'max'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].max\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your maximum value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'minLength'\"\n [id]=\"'document-input-validators-minLength'\"\n [formControlName]=\"'minLength'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].minLength\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your minimum length value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'maxLength'\"\n [id]=\"'document-input-validators-maxLength'\"\n [formControlName]=\"'maxLength'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].maxLength\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your maximum length value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n size=\"m\"\n [options]=\"[true, false]\"\n [label]=\"'required'\"\n [id]=\"'document-input-property-required'\"\n [formControlName]=\"'required'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].required\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <div formGroupName=\"properties\">\n <fieldset>\n <legend class=\"form-group-title\">Properties</legend>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Placeholder'\"\n [id]=\"'document-field-placeholder'\"\n [type]=\"'text'\"\n [formControlName]=\"'placeholder'\"\n [formControl]=\"\n documentFormGroup.controls.properties['controls'].placeholder\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your placeholder'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'readOnly'\"\n [id]=\"'document-input-property-readOnly'\"\n [formControlName]=\"'readOnly'\"\n [formControl]=\"\n documentFormGroup['controls'].properties['controls'].readOnly\n \"\n size=\"m\"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <ng-container [ngSwitch]=\"elementType\">\n <ng-container *ngSwitchCase=\"'aadhaar-number'\">\n <document-aadhaar-number-config-editor\n [saveDocumentClickCounter]=\"saveDocumentClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></document-aadhaar-number-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'pan-number'\">\n <document-pan-number-config-editor\n [saveDocumentClickCounter]=\"saveDocumentClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></document-pan-number-config-editor>\n </ng-container>\n </ng-container>\n </form>\n ", isInline: true, styles: ["\n :host {\n display: flex;\n flex-direction: column;\n align-content: center;\n justify-content: flex-start;\n align-items: stretch;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUITableComponent, selector: "kwikui-table", inputs: ["id", "columns", "headers", "data"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUISelectComboboxComponent, selector: "kwikui-select-combobox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.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: DocumentAadhaarNumberConfigEditor, selector: "document-aadhaar-number-config-editor", inputs: ["saveDocumentClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: DocumentPanNumberConfigEditor, selector: "document-pan-number-config-editor", inputs: ["saveDocumentClickCounter", "elementConfig"], outputs: ["updateElement"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2__namespace.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i5__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
1572
+ /** @nocollapse */ DocumentElementConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DocumentElementConfigEditor, selector: "document-element-config-editor", inputs: { saveClickCounter: "saveClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <ng-container *ngIf=\"elementConfig !== undefined\">\n <kwikui-table\n style=\"width: 100%; height: 100%; overflow: auto; box-shadow: 0px 0px 10px -6px #000; border: 0px solid gray; border-radius: 1rem;\"\n [columns]=\"['id', 'type', 'category']\"\n [headers]=\"{ id: 'ID', type: 'Type', category: 'Category' }\"\n [data]=\"[\n {\n id: elementConfig.elementId,\n type: elementConfig.elementType,\n category: elementConfig.elementCategory\n }\n ]\"\n (onClick)=\"(undefined)\"\n ></kwikui-table>\n </ng-container>\n <form [formGroup]=\"documentFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Standard</legend>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Label'\"\n [id]=\"'document-field-label'\"\n [type]=\"'text'\"\n [formControlName]=\"'label'\"\n [formControl]=\"documentFormGroup.controls['label']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Label'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Key'\"\n [id]=\"'document-field-key'\"\n [type]=\"'text'\"\n [formControlName]=\"'key'\"\n [formControl]=\"documentFormGroup.controls['key']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Key'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'Disabled'\"\n [id]=\"'document-input-property-disabled'\"\n size=\"m\"\n [formControlName]=\"'disabled'\"\n [formControl]=\"documentFormGroup.controls['disabled']\"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n\n <div formGroupName=\"default\">\n <fieldset>\n <legend class=\"form-group-title\">Default</legend>\n <div class=\"form-group\">\n <kwikui-select-combobox\n size=\"m\"\n [options]=\"[true, false]\"\n [label]=\"'value'\"\n [id]=\"'document-input-property-value'\"\n [formControlName]=\"'value'\"\n [formControl]=\"\n documentFormGroup['controls'].default['controls'].value\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <div formGroupName=\"validators\">\n <fieldset>\n <legend class=\"form-group-title\">Validators</legend>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'min'\"\n [id]=\"'document-input-validators-min'\"\n [formControlName]=\"'min'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].min\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your minimum value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'max'\"\n [id]=\"'document-input-validators-max'\"\n [formControlName]=\"'max'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].max\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your maximum value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'minLength'\"\n [id]=\"'document-input-validators-minLength'\"\n [formControlName]=\"'minLength'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].minLength\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your minimum length value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-input-number\n [label]=\"'maxLength'\"\n [id]=\"'document-input-validators-maxLength'\"\n [formControlName]=\"'maxLength'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].maxLength\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your maximum length value'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n size=\"m\"\n ></kwikui-input-number>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n size=\"m\"\n [options]=\"[true, false]\"\n [label]=\"'required'\"\n [id]=\"'document-input-property-required'\"\n [formControlName]=\"'required'\"\n [formControl]=\"\n documentFormGroup['controls'].validators['controls'].required\n \"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <div formGroupName=\"properties\">\n <fieldset>\n <legend class=\"form-group-title\">Properties</legend>\n <div class=\"form-group\">\n <kwikui-input\n [label]=\"'Placeholder'\"\n [id]=\"'document-field-placeholder'\"\n [type]=\"'text'\"\n [formControlName]=\"'placeholder'\"\n [formControl]=\"\n documentFormGroup.controls.properties['controls'].placeholder\n \"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your placeholder'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </div>\n <div class=\"form-group\">\n <kwikui-select-combobox\n [options]=\"[true, false]\"\n [label]=\"'readOnly'\"\n [id]=\"'document-input-property-readOnly'\"\n [formControlName]=\"'readOnly'\"\n [formControl]=\"\n documentFormGroup['controls'].properties['controls'].readOnly\n \"\n size=\"m\"\n [focus]=\"false\"\n [disabled]=\"false\"\n [invalid]=\"false\"\n [placeholder]=\"'Please select either true or false'\"\n ></kwikui-select-combobox>\n </div>\n </fieldset>\n </div>\n\n <ng-container [ngSwitch]=\"elementType\">\n <ng-container *ngSwitchCase=\"'aadhaar-number'\">\n <document-aadhaar-number-config-editor\n [saveDocumentClickCounter]=\"saveDocumentClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></document-aadhaar-number-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'pan-number'\">\n <document-pan-number-config-editor\n [saveDocumentClickCounter]=\"saveDocumentClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></document-pan-number-config-editor>\n </ng-container>\n </ng-container>\n </form>\n ", isInline: true, styles: ["\n :host {\n display: flex;\n flex-direction: column;\n align-content: center;\n justify-content: flex-start;\n align-items: stretch;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUITableComponent, selector: "kwikui-table", inputs: ["id", "columns", "headers", "data"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUISelectComboboxComponent, selector: "kwikui-select-combobox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.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: DocumentAadhaarNumberConfigEditor, selector: "document-aadhaar-number-config-editor", inputs: ["saveDocumentClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: DocumentPanNumberConfigEditor, selector: "document-pan-number-config-editor", inputs: ["saveDocumentClickCounter", "elementConfig"], outputs: ["updateElement"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2__namespace.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
1572
1573
  __decorate([
1573
1574
  kwikidToolkit.logMethod
1574
1575
  ], DocumentElementConfigEditor.prototype, "ngOnInit", null);
@@ -1808,7 +1809,7 @@
1808
1809
  return OtherElementConfigEditor;
1809
1810
  }());
1810
1811
  /** @nocollapse */ OtherElementConfigEditor.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: OtherElementConfigEditor, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1811
- /** @nocollapse */ OtherElementConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: OtherElementConfigEditor, selector: "other-element-config-editor", inputs: { saveClickCounter: "saveClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <ng-container *ngIf=\"elementConfig !== undefined\">\n <kwikui-table\n style=\"width: 100%; height: 100%; overflow: auto; box-shadow: 0px 0px 10px -6px #000; border: 0px solid gray; border-radius: 1rem;\"\n [columns]=\"['id', 'type', 'category']\"\n [headers]=\"{ id: 'ID', type: 'Type', category: 'Category' }\"\n [data]=\"[\n {\n id: elementConfig.elementId,\n type: elementConfig.elementType,\n category: elementConfig.elementCategory\n }\n ]\"\n (onClick)=\"(undefined)\"\n ></kwikui-table>\n </ng-container>\n <form [formGroup]=\"otherFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Standard</legend>\n <kwikui-input\n [label]=\"'Key'\"\n [id]=\"'basic-field-key'\"\n [type]=\"'text'\"\n [formControlName]=\"'key'\"\n [formControl]=\"otherFormGroup.controls['key']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Field Key'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </fieldset>\n\n <ng-container [ngSwitch]=\"elementType\">\n <ng-container *ngSwitchCase=\"'html'\">\n <other-html-config-editor\n [saveOtherClickCounter]=\"saveOtherClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></other-html-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'title'\">\n <other-title-config-editor\n [saveOtherClickCounter]=\"saveOtherClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></other-title-config-editor>\n </ng-container>\n </ng-container>\n </form>\n ", isInline: true, styles: ["\n :host {\n display: flex;\n flex-direction: column;\n align-content: center;\n justify-content: flex-start;\n align-items: stretch;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUITableComponent, selector: "kwikui-table", inputs: ["id", "columns", "headers", "data"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: OtherHTMLConfigEditor, selector: "other-html-config-editor", inputs: ["saveOtherClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: OtherTitleConfigEditor, selector: "other-title-config-editor", inputs: ["saveOtherClickCounter", "elementConfig"], outputs: ["updateElement"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i5__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
1812
+ /** @nocollapse */ OtherElementConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: OtherElementConfigEditor, selector: "other-element-config-editor", inputs: { saveClickCounter: "saveClickCounter", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "\n <ng-container *ngIf=\"elementConfig !== undefined\">\n <kwikui-table\n style=\"width: 100%; height: 100%; overflow: auto; box-shadow: 0px 0px 10px -6px #000; border: 0px solid gray; border-radius: 1rem;\"\n [columns]=\"['id', 'type', 'category']\"\n [headers]=\"{ id: 'ID', type: 'Type', category: 'Category' }\"\n [data]=\"[\n {\n id: elementConfig.elementId,\n type: elementConfig.elementType,\n category: elementConfig.elementCategory\n }\n ]\"\n (onClick)=\"(undefined)\"\n ></kwikui-table>\n </ng-container>\n <form [formGroup]=\"otherFormGroup\">\n <fieldset>\n <legend class=\"form-group-title\">Standard</legend>\n <kwikui-input\n [label]=\"'Key'\"\n [id]=\"'basic-field-key'\"\n [type]=\"'text'\"\n [formControlName]=\"'key'\"\n [formControl]=\"otherFormGroup.controls['key']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter your Field Key'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n ></kwikui-input>\n </fieldset>\n\n <ng-container [ngSwitch]=\"elementType\">\n <ng-container *ngSwitchCase=\"'html'\">\n <other-html-config-editor\n [saveOtherClickCounter]=\"saveOtherClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></other-html-config-editor>\n </ng-container>\n <ng-container *ngSwitchCase=\"'title'\">\n <other-title-config-editor\n [saveOtherClickCounter]=\"saveOtherClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></other-title-config-editor>\n </ng-container>\n </ng-container>\n </form>\n ", isInline: true, styles: ["\n :host {\n display: flex;\n flex-direction: column;\n align-content: center;\n justify-content: flex-start;\n align-items: stretch;\n gap: 1rem;\n }\n "], components: [{ type: i1__namespace.KwikUITableComponent, selector: "kwikui-table", inputs: ["id", "columns", "headers", "data"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: OtherHTMLConfigEditor, selector: "other-html-config-editor", inputs: ["saveOtherClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: OtherTitleConfigEditor, selector: "other-title-config-editor", inputs: ["saveOtherClickCounter", "elementConfig"], outputs: ["updateElement"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }] });
1812
1813
  __decorate([
1813
1814
  kwikidToolkit.logMethod
1814
1815
  ], OtherElementConfigEditor.prototype, "ngOnInit", null);
@@ -1897,7 +1898,7 @@
1897
1898
  return ElementConfigEditor;
1898
1899
  }());
1899
1900
  /** @nocollapse */ ElementConfigEditor.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ElementConfigEditor, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
1900
- /** @nocollapse */ ElementConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ElementConfigEditor, selector: "element-config-editor", inputs: { formKey: "formKey", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div\n class=\"container\"\n *ngIf=\"elementConfig\"\n>\n <div class=\"element-config-editor-header\">\n '{{ elementConfig.elementType }}' Element Config Editor\n </div>\n <div class=\"element-config-editor-body\"\n ><ng-container [ngSwitch]=\"elementCategory\">\n <!-- Basic -->\n <ng-container *ngSwitchCase=\"'basic'\">\n <basic-element-config-editor\n [saveClickCounter]=\"saveClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-element-config-editor>\n </ng-container>\n <!-- Document -->\n <ng-container *ngSwitchCase=\"'document'\">\n <document-element-config-editor\n [saveClickCounter]=\"saveClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></document-element-config-editor>\n </ng-container>\n <!-- Other -->\n <ng-container *ngSwitchCase=\"'other'\">\n <other-element-config-editor\n [saveClickCounter]=\"saveClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></other-element-config-editor>\n </ng-container>\n </ng-container>\n </div>\n <div class=\"element-config-editor-footer\">\n <!-- <button\n class=\"save-button\"\n type=\"submit\"\n (click)=\"handleOnClickSave()\"\n >\n Save\n </button> -->\n <kwikui-button\n [disabled]=\"false\"\n label=\"Save\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"primary\"\n icon=\"\"\n iconRight=\"\"\n size=\"m\"\n (onClick)=\"handleOnClickSave()\"\n ></kwikui-button>\n </div>\n</div>\n", styles: ["form{display:flex;align-content:center;justify-content:flex-start;flex:1;flex-direction:column;align-items:stretch;grid-gap:1rem;gap:1rem}.form-group{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;padding:.5rem 0}.form-group-title{margin-top:1rem}.container{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-gap:1rem;gap:1rem}.container .element-config-editor-footer{display:flex;flex-direction:row;align-items:center;justify-content:center;align-content:center;grid-gap:1rem;gap:1rem}\n", "kwikid-forms-builder fieldset{display:flex;flex-direction:column;justify-content:center;align-items:stretch;align-content:center;grid-gap:.5rem;gap:.5rem;padding:.5rem 1rem 1rem;box-shadow:0 0 10px -6px #000;border:0px solid gray;border-radius:1rem}kwikid-forms-builder table,kwikid-forms-builder tr,kwikid-forms-builder td{border:1px solid black;padding:.5rem 1rem}kwikui-table table{width:100%;box-shadow:0 0 10px -6px #000;border:0px solid gray;padding:0}\n"], components: [{ type: BasicElementConfigEditor, selector: "basic-element-config-editor", inputs: ["saveClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: DocumentElementConfigEditor, selector: "document-element-config-editor", inputs: ["saveClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: OtherElementConfigEditor, selector: "other-element-config-editor", inputs: ["saveClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
1901
+ /** @nocollapse */ ElementConfigEditor.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ElementConfigEditor, selector: "element-config-editor", inputs: { formKey: "formKey", elementConfig: "elementConfig" }, outputs: { updateElement: "updateElement" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div\n class=\"container\"\n *ngIf=\"elementConfig\"\n>\n <div class=\"element-config-editor-header\">\n '{{ elementConfig.elementType }}' Element Config Editor\n </div>\n <div class=\"element-config-editor-body\"\n ><ng-container [ngSwitch]=\"elementCategory\">\n <!-- Basic -->\n <ng-container *ngSwitchCase=\"'basic'\">\n <basic-element-config-editor\n [saveClickCounter]=\"saveClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></basic-element-config-editor>\n </ng-container>\n <!-- Document -->\n <ng-container *ngSwitchCase=\"'document'\">\n <document-element-config-editor\n [saveClickCounter]=\"saveClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></document-element-config-editor>\n </ng-container>\n <!-- Other -->\n <ng-container *ngSwitchCase=\"'other'\">\n <other-element-config-editor\n [saveClickCounter]=\"saveClickCounter\"\n [elementConfig]=\"elementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></other-element-config-editor>\n </ng-container>\n </ng-container>\n </div>\n <div class=\"element-config-editor-footer\">\n <!-- <button\n class=\"save-button\"\n type=\"submit\"\n (click)=\"handleOnClickSave()\"\n >\n Save\n </button> -->\n <kwikui-button\n [disabled]=\"false\"\n label=\"Save\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"save-button\"\n type=\"button\"\n appearance=\"primary\"\n icon=\"\"\n iconRight=\"\"\n size=\"m\"\n (onClick)=\"handleOnClickSave()\"\n ></kwikui-button>\n </div>\n</div>\n", styles: ["form{display:flex;align-content:center;justify-content:flex-start;flex:1;flex-direction:column;align-items:stretch;grid-gap:1rem;gap:1rem}.form-group{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;padding:.5rem 0}.form-group-title{margin-top:1rem}.container{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-gap:1rem;gap:1rem}.container .element-config-editor-footer{display:flex;flex-direction:row;align-items:center;justify-content:center;align-content:center;grid-gap:1rem;gap:1rem}\n", "kwikid-forms-builder fieldset{display:flex;flex-direction:column;justify-content:center;align-items:stretch;align-content:center;grid-gap:.5rem;gap:.5rem;padding:.5rem 1rem 1rem;box-shadow:0 0 10px -6px #000;border:0px solid gray;border-radius:1rem}kwikid-forms-builder table,kwikid-forms-builder tr,kwikid-forms-builder td{border:1px solid black;padding:.5rem 1rem}kwikui-table table{width:100%;box-shadow:0 0 10px -6px #000;border:0px solid gray;padding:0}\n"], components: [{ type: BasicElementConfigEditor, selector: "basic-element-config-editor", inputs: ["saveClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: DocumentElementConfigEditor, selector: "document-element-config-editor", inputs: ["saveClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: OtherElementConfigEditor, selector: "other-element-config-editor", inputs: ["saveClickCounter", "elementConfig"], outputs: ["updateElement"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], encapsulation: i0__namespace.ViewEncapsulation.None });
1901
1902
  __decorate([
1902
1903
  kwikidToolkit.logMethod
1903
1904
  ], ElementConfigEditor.prototype, "ngOnInit", null);
@@ -2197,7 +2198,7 @@
2197
2198
  return KwikIDFormsBuilderComponent;
2198
2199
  }());
2199
2200
  /** @nocollapse */ KwikIDFormsBuilderComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsBuilderComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
2200
- /** @nocollapse */ KwikIDFormsBuilderComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormsBuilderComponent, selector: "kwikid-forms-builder", ngImport: i0__namespace, template: "<div class=\"container\">\n <div class=\"wrapper\">\n <div class=\"builder-header\">\n <div class=\"builder-title\">KwikID Form Builder</div>\n <form\n [formGroup]=\"builderFormGroup\"\n class=\"builder-form\"\n >\n <kwikui-input\n [label]=\"'Form Key'\"\n [id]=\"'form_key'\"\n [type]=\"'text'\"\n [formControlName]=\"'formKey'\"\n [formControl]=\"builderFormGroup.controls['formKey']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter a Form Key'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'upper'\"\n size=\"m\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input>\n <kwikui-input\n [label]=\"'Form Title'\"\n [id]=\"'form_title'\"\n [type]=\"'text'\"\n [formControlName]=\"'formTitle'\"\n [formControl]=\"builderFormGroup.controls['formTitle']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter a Form Title'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input>\n <kwikui-button\n [disabled]=\"!builderFormGroup.valid\"\n id=\"save_form_btn\"\n label=\"Save Form\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"\"\n type=\"button\"\n appearance=\"primary\"\n icon=\"\"\n iconRight=\"\"\n size=\"m\"\n (onClick)=\"handleOnClickSaveForms($event)\"\n ></kwikui-button>\n </form>\n </div>\n <div class=\"builder-body\">\n <div class=\"form-elements-drag-wrapper\">\n <div\n class=\"form-elements-drag\"\n cdkDropList\n [cdkDropListData]=\"formElementsDragList\"\n cdkDropListSortingDisabled\n [cdkDropListConnectedTo]=\"[formElementsList]\"\n (cdkDropListExited)=\"exit($event, 'other')\"\n (cdkDropListEntered)=\"enter($event, 'other')\"\n >\n <ng-container\n *ngFor=\"let formElementDragItem of formElementsDragList\"\n >\n <ng-container *ngIf=\"formElementDragItem.isElement\">\n <div\n class=\"form-element-drag\"\n cdkDrag\n [cdkDragData]=\"formElementDragItem\"\n >\n &#8942;&#8942;&nbsp;&nbsp;{{ formElementDragItem.elementTitle }}\n <!-- <ng-container *ngComponentOutlet=\"formElementDragItem.component\"></ng-container> -->\n </div>\n <div\n class=\"form-element-drag\"\n *cdkDragPlaceholder\n >\n {{ formElementDragItem.elementTitle }}\n </div>\n </ng-container>\n <ng-container *ngIf=\"!formElementDragItem.isElement\">\n <div class=\"form-element-category\">\n {{ formElementDragItem.elementTitle }}\n </div>\n </ng-container>\n </ng-container>\n </div>\n </div>\n <div\n class=\"form-elements-drop-wrapper\"\n cdkDropList\n #formElementsList=\"cdkDropList\"\n [cdkDropListData]=\"formElementsDropList\"\n (cdkDropListDropped)=\"drop($event, '')\"\n [cdkDropListEnterPredicate]=\"isElementPredicate\"\n >\n <ng-container\n *ngFor=\"\n let formElementDropItem of formElementsDropList;\n let idx = index\n \"\n >\n <div\n class=\"form-drop-element\"\n cdkDrag\n >\n <div class=\"form-drop-element-grab-symbol\">&#8942;&#8942;</div>\n <div class=\"form-drop-element-main\">\n <div class=\"form-drop-element-header\">\n <div class=\"form-drop-element-title\">\n {{ formElementDropItem.elementTitle }}\n </div>\n <div class=\"form-drop-element-actions\">\n <kwikui-button-icon\n [disabled]=\"false\"\n [id]=\"'edit-element'\"\n [showLoader]=\"false\"\n [styles]=\"\"\n [class]=\"\"\n [type]=\"'button'\"\n [appearance]=\"'secondary'\"\n [icon]=\"'tuiIconEdit'\"\n [shape]=\"'rounded'\"\n [size]=\"'s'\"\n (onClick)=\"editElement(idx, formElementDropItem)\"\n ></kwikui-button-icon>\n <kwikui-button-icon\n [disabled]=\"false\"\n [id]=\"'remove-element'\"\n [showLoader]=\"false\"\n [styles]=\"\"\n [class]=\"\"\n [type]=\"'button'\"\n [appearance]=\"'accent'\"\n [icon]=\"'tuiIconCloseLarge'\"\n [shape]=\"'rounded'\"\n [size]=\"'s'\"\n (onClick)=\"removeElement(idx, formElementDropItem)\"\n ></kwikui-button-icon>\n <!-- <button\n (click)=\"editElement(idx, formElementDropItem)\"\n title=\"edit element properties\"\n >\n &#9998;\n </button>\n <button\n (click)=\"removeElement(idx, formElementDropItem)\"\n title=\"delete element\"\n >\n &#10006;\n </button> -->\n </div>\n </div>\n <div class=\"form-drop-element-body\"> </div>\n <div class=\"form-drop-element-footer\">\n <div class=\"form-drop-element-id\">\n {{ formElementDropItem.elementId }}\n </div>\n <div class=\"form-drop-element-category\">\n {{ formElementDropItem.elementCategory }}\n </div>\n <div class=\"form-drop-element-type\">\n {{ formElementDropItem.elementType }}\n </div>\n </div>\n <div\n class=\"example-custom-placeholder\"\n *cdkDragPlaceholder\n ></div>\n <!-- <ng-container *ngComponentOutlet=\"formElementDropItem.component\"> </ng-container> -->\n <!-- <ng-container *ngTemplateOutlet=\"formModal; context: formElementDropItem\"></ng-container> -->\n </div>\n </div>\n </ng-container>\n </div>\n <div class=\"element-property-editor-wrapper\">\n <element-config-editor\n [elementConfig]=\"elementEditorElementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></element-config-editor>\n </div>\n </div>\n <div class=\"builder-footer\"> &copy; Baiju Dodhia, KwikID </div>\n </div>\n <div\n class=\"modal\"\n *ngIf=\"finalJSONConfig\"\n >\n <div class=\"modal-box\">\n <div class=\"modal-content\">\n <div class=\"modal-heading\">\n <div class=\"modal-title\">{{ formTitle }}</div>\n <div class=\"modal-actions\">\n <div\n class=\"modal-code-download\"\n (click)=\"downloadJSON()\"\n >Download JSON</div\n >\n <div\n class=\"modal-code-copy\"\n (click)=\"copyToClipboard()\"\n >Copy to Clipboard</div\n >\n <div\n class=\"modal-close\"\n (click)=\"closeJSONPopup()\"\n >\n Close\n </div>\n </div>\n </div>\n <pre>\n <code>{{JSON.stringify(finalJSONConfig, undefined, 2)}}</code>\n </pre>\n </div>\n </div>\n </div>\n</div>\n", styles: ["kwikid-forms-builder fieldset{display:flex;flex-direction:column;justify-content:center;align-items:stretch;align-content:center;grid-gap:.5rem;gap:.5rem;padding:.5rem 1rem 1rem;box-shadow:0 0 10px -6px #000;border:0px solid gray;border-radius:1rem}kwikid-forms-builder table,kwikid-forms-builder tr,kwikid-forms-builder td{border:1px solid black;padding:.5rem 1rem}kwikui-table table{width:100%;box-shadow:0 0 10px -6px #000;border:0px solid gray;padding:0}\n", ":host{all:unset;position:relative;width:100%;height:100%}.container{width:100%;height:100%;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center}.container .wrapper{width:100%;height:100%;display:flex;flex-direction:column;align-content:center;justify-content:space-between;align-items:stretch}.container .wrapper .builder-header{display:flex;flex-direction:row;align-content:center;justify-content:space-between;align-items:center;grid-column-gap:1rem;column-gap:1rem;padding:1rem;max-height:max-content;border:1px solid lightgray;box-shadow:0 2px 10px -6px #000}.container .wrapper .builder-header .builder-title{font-weight:bold;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;font-size:1rem}.container .wrapper .builder-header .builder-form{display:flex;align-content:center;justify-content:flex-end;flex:1;flex-direction:row;align-items:center;grid-gap:1rem;gap:1rem;width:100%}.container .wrapper .builder-header .builder-form kwikui-input{width:16rem}.container .wrapper .builder-body{display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:stretch;grid-gap:1rem;gap:1rem;flex:1;padding:1rem;overflow:auto}.container .wrapper .builder-body>*{width:100%;border:1px solid lightgray;overflow:auto;box-shadow:0 2px 10px -6px #000}.container .wrapper .builder-body .form-elements-drag-wrapper{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-gap:1rem;gap:1rem;padding:1rem;min-width:16rem;max-width:16rem}.container .wrapper .builder-body .form-elements-drag-wrapper .form-elements-drag{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-gap:1rem;gap:1rem;border-bottom:none}.container .wrapper .builder-body .form-elements-drag-wrapper .form-elements-drag .form-element-drag{display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;grid-gap:1rem;gap:1rem;border-radius:.5rem;padding:1rem;cursor:grab;box-shadow:0 2px 10px -6px #000;text-transform:capitalize}.container .wrapper .builder-body .form-elements-drag-wrapper .form-elements-drag .form-element-category{display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;grid-gap:1rem;gap:1rem;border-left:.25rem solid var(--tui-primary);padding:1rem;background:var(--tui-secondary)}.container .wrapper .builder-body .form-elements-drop-wrapper{padding:1rem;display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-gap:1rem;gap:1rem;min-width:20rem;max-width:28rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder{display:flex;justify-content:flex-start;justify-items:start;align-items:center;padding:1rem;border-radius:1rem;box-shadow:0 2px 10px -6px #000;cursor:grab;flex-direction:row;position:relative;grid-gap:1rem;gap:1rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main{flex:1;display:flex;justify-content:space-between;justify-items:start;align-items:stretch;flex-direction:column;width:100%;grid-gap:.5rem;gap:.5rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header{display:flex;flex-direction:row;align-content:center;justify-content:space-between;align-items:center;grid-column-gap:1rem;column-gap:1rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header .form-drop-element-actions,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header .form-drop-element-actions{display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;grid-gap:1rem;gap:1rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header .form-drop-element-actions button,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header .form-drop-element-actions button{width:1.6rem;height:1.6rem;transform:rotate(90deg)!important}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header .form-drop-element-actions button:first-child,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header .form-drop-element-actions button:first-child{background-color:#dc143c!important;color:#fff!important}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header .form-drop-element-actions button:last-child,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header .form-drop-element-actions button:last-child{background-color:gray!important;color:#fff!important}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-body,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-body{border-top:1px dashed lightgray;border-bottom:1px dashed lightgray}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-footer,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-footer{display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;grid-gap:.5rem;gap:.5rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-footer .form-drop-element-id,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-footer .form-drop-element-id{background:var(--tui-secondary);padding:0 .3rem;border-radius:1rem;color:var(--tui-primary)}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-footer .form-drop-element-category,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-footer .form-drop-element-category{background:var(--tui-primary);padding:0 .3rem;border-radius:1rem;color:#fff}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-footer .form-drop-element-type,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-footer .form-drop-element-type{background:var(--tui-positive);padding:0 .3rem;border-radius:1rem;color:#fff}.container .wrapper .builder-body .element-property-editor-wrapper{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;padding:1rem;min-width:20rem;grid-gap:1rem;gap:1rem}.container .wrapper .builder-footer{display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;grid-column-gap:1rem;column-gap:1rem;padding:1rem;max-height:30px;border:1px solid lightgray;box-shadow:0 -2px 10px -6px #000;font-weight:bold}.cdk-drag-preview{width:-moz-fit-content;width:fit-content;height:auto;box-sizing:border-box;background-color:transparent;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;cursor:grabbing}.cdk-drag-placeholder{opacity:1}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-custom-placeholder{background:#ccc;border:dotted 3px #999;min-height:60px;transition:transform .25s cubic-bezier(0,0,.2,1)}.modal{position:absolute;background-color:#0000004d;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.modal-box{width:75%;height:75%;margin:auto;background-color:#fff;border:1px solid lightgray;box-shadow:0 2px 10px -6px #000}.modal-content{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center;width:100%;height:100%}.modal-heading{padding:1rem;width:100%;display:flex;flex-direction:row;justify-content:space-between;border:1px solid lightgray;box-shadow:0 2px 10px -6px #000}.modal-title{font-weight:bold;font-size:1rem}.modal-actions{display:flex;flex-direction:row;grid-gap:1rem;gap:1rem;cursor:pointer}pre{float:left;justify-content:center;width:100%;height:100%;box-sizing:border-box;overflow:auto}::-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: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIButtonIconComponent, selector: "kwikui-button-icon", inputs: ["disabled", "id", "showLoader", "styles", "class", "type", "appearance", "icon", "shape", "size"], outputs: ["onClick"] }, { type: ElementConfigEditor, selector: "element-config-editor", inputs: ["formKey", "elementConfig"], outputs: ["updateElement"] }], directives: [{ type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4__namespace.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i4__namespace.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }] });
2201
+ /** @nocollapse */ KwikIDFormsBuilderComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormsBuilderComponent, selector: "kwikid-forms-builder", ngImport: i0__namespace, template: "<div class=\"container\">\n <div class=\"wrapper\">\n <div class=\"builder-header\">\n <div class=\"builder-title\">KwikID Form Builder</div>\n <form\n [formGroup]=\"builderFormGroup\"\n class=\"builder-form\"\n >\n <kwikui-input\n [label]=\"'Form Key'\"\n [id]=\"'form_key'\"\n [type]=\"'text'\"\n [formControlName]=\"'formKey'\"\n [formControl]=\"builderFormGroup.controls['formKey']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter a Form Key'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'upper'\"\n size=\"m\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input>\n <kwikui-input\n [label]=\"'Form Title'\"\n [id]=\"'form_title'\"\n [type]=\"'text'\"\n [formControlName]=\"'formTitle'\"\n [formControl]=\"builderFormGroup.controls['formTitle']\"\n [disabled]=\"false\"\n [placeholder]=\"'Please enter a Form Title'\"\n [focus]=\"false\"\n [invalid]=\"false\"\n [case]=\"'default'\"\n size=\"m\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-input>\n <kwikui-button\n [disabled]=\"!builderFormGroup.valid\"\n id=\"save_form_btn\"\n label=\"Save Form\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"\"\n type=\"button\"\n appearance=\"primary\"\n icon=\"\"\n iconRight=\"\"\n size=\"m\"\n (onClick)=\"handleOnClickSaveForms($event)\"\n ></kwikui-button>\n </form>\n </div>\n <div class=\"builder-body\">\n <div class=\"form-elements-drag-wrapper\">\n <div\n class=\"form-elements-drag\"\n cdkDropList\n [cdkDropListData]=\"formElementsDragList\"\n cdkDropListSortingDisabled\n [cdkDropListConnectedTo]=\"[formElementsList]\"\n (cdkDropListExited)=\"exit($event, 'other')\"\n (cdkDropListEntered)=\"enter($event, 'other')\"\n >\n <ng-container\n *ngFor=\"let formElementDragItem of formElementsDragList\"\n >\n <ng-container *ngIf=\"formElementDragItem.isElement\">\n <div\n class=\"form-element-drag\"\n cdkDrag\n [cdkDragData]=\"formElementDragItem\"\n >\n &#8942;&#8942;&nbsp;&nbsp;{{ formElementDragItem.elementTitle }}\n <!-- <ng-container *ngComponentOutlet=\"formElementDragItem.component\"></ng-container> -->\n </div>\n <div\n class=\"form-element-drag\"\n *cdkDragPlaceholder\n >\n {{ formElementDragItem.elementTitle }}\n </div>\n </ng-container>\n <ng-container *ngIf=\"!formElementDragItem.isElement\">\n <div class=\"form-element-category\">\n {{ formElementDragItem.elementTitle }}\n </div>\n </ng-container>\n </ng-container>\n </div>\n </div>\n <div\n class=\"form-elements-drop-wrapper\"\n cdkDropList\n #formElementsList=\"cdkDropList\"\n [cdkDropListData]=\"formElementsDropList\"\n (cdkDropListDropped)=\"drop($event, '')\"\n [cdkDropListEnterPredicate]=\"isElementPredicate\"\n >\n <ng-container\n *ngFor=\"\n let formElementDropItem of formElementsDropList;\n let idx = index\n \"\n >\n <div\n class=\"form-drop-element\"\n cdkDrag\n >\n <div class=\"form-drop-element-grab-symbol\">&#8942;&#8942;</div>\n <div class=\"form-drop-element-main\">\n <div class=\"form-drop-element-header\">\n <div class=\"form-drop-element-title\">\n {{ formElementDropItem.elementTitle }}\n </div>\n <div class=\"form-drop-element-actions\">\n <kwikui-button-icon\n [disabled]=\"false\"\n [id]=\"'edit-element'\"\n [showLoader]=\"false\"\n [styles]=\"\"\n [class]=\"\"\n [type]=\"'button'\"\n [appearance]=\"'secondary'\"\n [icon]=\"'tuiIconEdit'\"\n [shape]=\"'rounded'\"\n [size]=\"'s'\"\n (onClick)=\"editElement(idx, formElementDropItem)\"\n ></kwikui-button-icon>\n <kwikui-button-icon\n [disabled]=\"false\"\n [id]=\"'remove-element'\"\n [showLoader]=\"false\"\n [styles]=\"\"\n [class]=\"\"\n [type]=\"'button'\"\n [appearance]=\"'accent'\"\n [icon]=\"'tuiIconCloseLarge'\"\n [shape]=\"'rounded'\"\n [size]=\"'s'\"\n (onClick)=\"removeElement(idx, formElementDropItem)\"\n ></kwikui-button-icon>\n <!-- <button\n (click)=\"editElement(idx, formElementDropItem)\"\n title=\"edit element properties\"\n >\n &#9998;\n </button>\n <button\n (click)=\"removeElement(idx, formElementDropItem)\"\n title=\"delete element\"\n >\n &#10006;\n </button> -->\n </div>\n </div>\n <div class=\"form-drop-element-body\"> </div>\n <div class=\"form-drop-element-footer\">\n <div class=\"form-drop-element-id\">\n {{ formElementDropItem.elementId }}\n </div>\n <div class=\"form-drop-element-category\">\n {{ formElementDropItem.elementCategory }}\n </div>\n <div class=\"form-drop-element-type\">\n {{ formElementDropItem.elementType }}\n </div>\n </div>\n <div\n class=\"example-custom-placeholder\"\n *cdkDragPlaceholder\n ></div>\n <!-- <ng-container *ngComponentOutlet=\"formElementDropItem.component\"> </ng-container> -->\n <!-- <ng-container *ngTemplateOutlet=\"formModal; context: formElementDropItem\"></ng-container> -->\n </div>\n </div>\n </ng-container>\n </div>\n <div class=\"element-property-editor-wrapper\">\n <element-config-editor\n [elementConfig]=\"elementEditorElementConfig\"\n (updateElement)=\"handleOnSaveUpdateElement($event)\"\n ></element-config-editor>\n </div>\n </div>\n <div class=\"builder-footer\"> &copy; Baiju Dodhia, KwikID </div>\n </div>\n <div\n class=\"modal\"\n *ngIf=\"finalJSONConfig\"\n >\n <div class=\"modal-box\">\n <div class=\"modal-content\">\n <div class=\"modal-heading\">\n <div class=\"modal-title\">{{ formTitle }}</div>\n <div class=\"modal-actions\">\n <div\n class=\"modal-code-download\"\n (click)=\"downloadJSON()\"\n >Download JSON</div\n >\n <div\n class=\"modal-code-copy\"\n (click)=\"copyToClipboard()\"\n >Copy to Clipboard</div\n >\n <div\n class=\"modal-close\"\n (click)=\"closeJSONPopup()\"\n >\n Close\n </div>\n </div>\n </div>\n <pre>\n <code>{{JSON.stringify(finalJSONConfig, undefined, 2)}}</code>\n </pre>\n </div>\n </div>\n </div>\n</div>\n", styles: ["kwikid-forms-builder fieldset{display:flex;flex-direction:column;justify-content:center;align-items:stretch;align-content:center;grid-gap:.5rem;gap:.5rem;padding:.5rem 1rem 1rem;box-shadow:0 0 10px -6px #000;border:0px solid gray;border-radius:1rem}kwikid-forms-builder table,kwikid-forms-builder tr,kwikid-forms-builder td{border:1px solid black;padding:.5rem 1rem}kwikui-table table{width:100%;box-shadow:0 0 10px -6px #000;border:0px solid gray;padding:0}\n", ":host{all:unset;position:relative;width:100%;height:100%}.container{width:100%;height:100%;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center}.container .wrapper{width:100%;height:100%;display:flex;flex-direction:column;align-content:center;justify-content:space-between;align-items:stretch}.container .wrapper .builder-header{display:flex;flex-direction:row;align-content:center;justify-content:space-between;align-items:center;grid-column-gap:1rem;column-gap:1rem;padding:1rem;max-height:max-content;border:1px solid lightgray;box-shadow:0 2px 10px -6px #000}.container .wrapper .builder-header .builder-title{font-weight:bold;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;font-size:1rem}.container .wrapper .builder-header .builder-form{display:flex;align-content:center;justify-content:flex-end;flex:1;flex-direction:row;align-items:center;grid-gap:1rem;gap:1rem;width:100%}.container .wrapper .builder-header .builder-form kwikui-input{width:16rem}.container .wrapper .builder-body{display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:stretch;grid-gap:1rem;gap:1rem;flex:1;padding:1rem;overflow:auto}.container .wrapper .builder-body>*{width:100%;border:1px solid lightgray;overflow:auto;box-shadow:0 2px 10px -6px #000}.container .wrapper .builder-body .form-elements-drag-wrapper{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-gap:1rem;gap:1rem;padding:1rem;min-width:16rem;max-width:16rem}.container .wrapper .builder-body .form-elements-drag-wrapper .form-elements-drag{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-gap:1rem;gap:1rem;border-bottom:none}.container .wrapper .builder-body .form-elements-drag-wrapper .form-elements-drag .form-element-drag{display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;grid-gap:1rem;gap:1rem;border-radius:.5rem;padding:1rem;cursor:grab;box-shadow:0 2px 10px -6px #000;text-transform:capitalize}.container .wrapper .builder-body .form-elements-drag-wrapper .form-elements-drag .form-element-category{display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;grid-gap:1rem;gap:1rem;border-left:.25rem solid var(--tui-primary);padding:1rem;background:var(--tui-secondary)}.container .wrapper .builder-body .form-elements-drop-wrapper{padding:1rem;display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;grid-gap:1rem;gap:1rem;min-width:20rem;max-width:28rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder{display:flex;justify-content:flex-start;justify-items:start;align-items:center;padding:1rem;border-radius:1rem;box-shadow:0 2px 10px -6px #000;cursor:grab;flex-direction:row;position:relative;grid-gap:1rem;gap:1rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main{flex:1;display:flex;justify-content:space-between;justify-items:start;align-items:stretch;flex-direction:column;width:100%;grid-gap:.5rem;gap:.5rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header{display:flex;flex-direction:row;align-content:center;justify-content:space-between;align-items:center;grid-column-gap:1rem;column-gap:1rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header .form-drop-element-actions,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header .form-drop-element-actions{display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;grid-gap:1rem;gap:1rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header .form-drop-element-actions button,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header .form-drop-element-actions button{width:1.6rem;height:1.6rem;transform:rotate(90deg)!important}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header .form-drop-element-actions button:first-child,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header .form-drop-element-actions button:first-child{background-color:#dc143c!important;color:#fff!important}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-header .form-drop-element-actions button:last-child,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-header .form-drop-element-actions button:last-child{background-color:gray!important;color:#fff!important}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-body,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-body{border-top:1px dashed lightgray;border-bottom:1px dashed lightgray}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-footer,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-footer{display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;grid-gap:.5rem;gap:.5rem}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-footer .form-drop-element-id,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-footer .form-drop-element-id{background:var(--tui-secondary);padding:0 .3rem;border-radius:1rem;color:var(--tui-primary)}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-footer .form-drop-element-category,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-footer .form-drop-element-category{background:var(--tui-primary);padding:0 .3rem;border-radius:1rem;color:#fff}.container .wrapper .builder-body .form-elements-drop-wrapper .form-drop-element .form-drop-element-main .form-drop-element-footer .form-drop-element-type,.container .wrapper .builder-body .form-elements-drop-wrapper .cdk-drag-placeholder .form-drop-element-main .form-drop-element-footer .form-drop-element-type{background:var(--tui-positive);padding:0 .3rem;border-radius:1rem;color:#fff}.container .wrapper .builder-body .element-property-editor-wrapper{display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch;padding:1rem;min-width:20rem;grid-gap:1rem;gap:1rem}.container .wrapper .builder-footer{display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;grid-column-gap:1rem;column-gap:1rem;padding:1rem;max-height:30px;border:1px solid lightgray;box-shadow:0 -2px 10px -6px #000;font-weight:bold}.cdk-drag-preview{width:-moz-fit-content;width:fit-content;height:auto;box-sizing:border-box;background-color:transparent;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f;cursor:grabbing}.cdk-drag-placeholder{opacity:1}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-custom-placeholder{background:#ccc;border:dotted 3px #999;min-height:60px;transition:transform .25s cubic-bezier(0,0,.2,1)}.modal{position:absolute;background-color:#0000004d;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.modal-box{width:75%;height:75%;margin:auto;background-color:#fff;border:1px solid lightgray;box-shadow:0 2px 10px -6px #000}.modal-content{display:flex;flex-direction:column;align-content:center;justify-content:center;align-items:center;width:100%;height:100%}.modal-heading{padding:1rem;width:100%;display:flex;flex-direction:row;justify-content:space-between;border:1px solid lightgray;box-shadow:0 2px 10px -6px #000}.modal-title{font-weight:bold;font-size:1rem}.modal-actions{display:flex;flex-direction:row;grid-gap:1rem;gap:1rem;cursor:pointer}pre{float:left;justify-content:center;width:100%;height:100%;box-sizing:border-box;overflow:auto}::-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: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIButtonIconComponent, selector: "kwikui-button-icon", inputs: ["disabled", "id", "showLoader", "styles", "class", "type", "appearance", "icon", "shape", "size"], outputs: ["onClick"] }, { type: ElementConfigEditor, selector: "element-config-editor", inputs: ["formKey", "elementConfig"], outputs: ["updateElement"] }], directives: [{ type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i4__namespace.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "id", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListAutoScrollDisabled", "cdkDropListOrientation", "cdkDropListLockAxis", "cdkDropListData", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragDisabled", "cdkDragStartDelay", "cdkDragLockAxis", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragBoundary", "cdkDragRootElement", "cdkDragPreviewContainer", "cdkDragData", "cdkDragFreeDragPosition"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { type: i4__namespace.CdkDragPlaceholder, selector: "ng-template[cdkDragPlaceholder]", inputs: ["data"] }] });
2201
2202
  __decorate([
2202
2203
  kwikidToolkit.logMethod
2203
2204
  ], KwikIDFormsBuilderComponent.prototype, "handleGetKeyValue", null);
@@ -2475,12 +2476,17 @@
2475
2476
  return formConfig;
2476
2477
  };
2477
2478
  Converter.prototype.updateFormConfigProperties = function (formConfig) {
2478
- var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
2479
+ var _a;
2479
2480
  var formViewProperties = {
2480
2481
  header: {
2482
+ backButton: {
2483
+ mode: "TABBED",
2484
+ bypassConfirmation: false,
2485
+ hidden: true
2486
+ },
2481
2487
  title: {
2482
2488
  hidden: false,
2483
- label: formConfig.title
2489
+ label: (_a = formConfig === null || formConfig === void 0 ? void 0 : formConfig.title) !== null && _a !== void 0 ? _a : "Form"
2484
2490
  },
2485
2491
  steps: {
2486
2492
  hidden: false
@@ -2488,6 +2494,7 @@
2488
2494
  },
2489
2495
  footer: {
2490
2496
  viewFormsButton: {
2497
+ bypassConfirmation: false,
2491
2498
  hidden: false,
2492
2499
  label: "View Forms"
2493
2500
  },
@@ -2498,34 +2505,7 @@
2498
2505
  }
2499
2506
  };
2500
2507
  if (kwikidToolkit.checkObjectKeyExists(formConfig, "properties")) {
2501
- var headerTitleHidden = (_c = (_b = (_a = formConfig.properties.header) === null || _a === void 0 ? void 0 : _a.title) === null || _b === void 0 ? void 0 : _b.hidden) !== null && _c !== void 0 ? _c : formViewProperties.header.title.hidden;
2502
- var headerTitleLabel = (_f = (_e = (_d = formConfig.properties.header) === null || _d === void 0 ? void 0 : _d.title) === null || _e === void 0 ? void 0 : _e.label) !== null && _f !== void 0 ? _f : formConfig.title;
2503
- var headerStepsHidden = (_j = (_h = (_g = formConfig.properties.header) === null || _g === void 0 ? void 0 : _g.steps) === null || _h === void 0 ? void 0 : _h.hidden) !== null && _j !== void 0 ? _j : formViewProperties.header.steps.hidden;
2504
- var viewFormsButtonHidden = (_m = (_l = (_k = formConfig.properties.footer) === null || _k === void 0 ? void 0 : _k.viewFormsButton) === null || _l === void 0 ? void 0 : _l.hidden) !== null && _m !== void 0 ? _m : formViewProperties.footer.viewFormsButton.hidden;
2505
- var viewFormsButtonLabel = (_q = (_p = (_o = formConfig.properties.footer) === null || _o === void 0 ? void 0 : _o.viewFormsButton) === null || _p === void 0 ? void 0 : _p.label) !== null && _q !== void 0 ? _q : formViewProperties.footer.viewFormsButton.label;
2506
- var saveButtonHidden = (_t = (_s = (_r = formConfig.properties.footer) === null || _r === void 0 ? void 0 : _r.saveButton) === null || _s === void 0 ? void 0 : _s.hidden) !== null && _t !== void 0 ? _t : formViewProperties.footer.saveButton.hidden;
2507
- var saveButtonLabel = (_w = (_v = (_u = formConfig.properties.footer) === null || _u === void 0 ? void 0 : _u.saveButton) === null || _v === void 0 ? void 0 : _v.label) !== null && _w !== void 0 ? _w : formViewProperties.footer.saveButton.label;
2508
- formConfig.properties = {
2509
- header: {
2510
- title: {
2511
- hidden: headerTitleHidden,
2512
- label: headerTitleLabel
2513
- },
2514
- steps: {
2515
- hidden: headerStepsHidden
2516
- }
2517
- },
2518
- footer: {
2519
- viewFormsButton: {
2520
- hidden: viewFormsButtonHidden,
2521
- label: viewFormsButtonLabel
2522
- },
2523
- saveButton: {
2524
- hidden: saveButtonHidden,
2525
- label: saveButtonLabel
2526
- }
2527
- }
2528
- };
2508
+ formConfig.properties = kwikidToolkit.mergeObjects(formViewProperties, formConfig.properties);
2529
2509
  }
2530
2510
  else {
2531
2511
  formConfig.properties = formViewProperties;
@@ -2533,7 +2513,7 @@
2533
2513
  return formConfig;
2534
2514
  };
2535
2515
  Converter.prototype.convertFormConfig = function (formConfig) {
2536
- var e_1, _x;
2516
+ var e_1, _f;
2537
2517
  var _this = this;
2538
2518
  var updateOnFieldType = function (field) {
2539
2519
  var formatFieldTypeHtml = function (field) {
@@ -3167,7 +3147,7 @@
3167
3147
  catch (e_1_1) { e_1 = { error: e_1_1 }; }
3168
3148
  finally {
3169
3149
  try {
3170
- if (fields_1_1 && !fields_1_1.done && (_x = fields_1.return)) _x.call(fields_1);
3150
+ if (fields_1_1 && !fields_1_1.done && (_f = fields_1.return)) _f.call(fields_1);
3171
3151
  }
3172
3152
  finally { if (e_1) throw e_1.error; }
3173
3153
  }
@@ -3215,7 +3195,20 @@
3215
3195
  EActionKey["FIELD_GROUP_DISABLE"] = "FIELD_GROUP_DISABLE";
3216
3196
  EActionKey["SET_DROPDOWN_OPTIONS"] = "SET_DROPDOWN_OPTIONS";
3217
3197
  EActionKey["API_CALL"] = "API_CALL";
3218
- EActionKey["API_CALL_END"] = "API_CALL_END";
3198
+ EActionKey["API_CALL_MULTIPLE"] = "API_CALL_MULTIPLE";
3199
+ EActionKey["API_CALL_MULTIPLE_END"] = "API_CALL_MULTIPLE_END";
3200
+ EActionKey["TASK_API_CALL"] = "TASK_API_CALL";
3201
+ EActionKey["TASK_API_CALL_MULTIPLE"] = "TASK_API_CALL_MULTIPLE";
3202
+ EActionKey["TASK_API_CALL_MULTIPLE_END"] = "TASK_API_CALL_MULTIPLE_END";
3203
+ EActionKey["PREVIEW_DIALOG_SHOW"] = "PREVIEW_DIALOG_SHOW";
3204
+ EActionKey["POPUP_FORM_SHOW"] = "POPUP_FORM_SHOW";
3205
+ EActionKey["MOVE_AHEAD"] = "MOVE_AHEAD";
3206
+ EActionKey["NOTIFICATION_ERROR_SHOW"] = "NOTIFICATION_ERROR_SHOW";
3207
+ EActionKey["NOTIFICATION_ERROR_HIDE"] = "NOTIFICATION_ERROR_HIDE";
3208
+ EActionKey["DIALOG_SHOW"] = "DIALOG_SHOW";
3209
+ EActionKey["DIALOG_HIDE"] = "DIALOG_HIDE";
3210
+ EActionKey["RESUME_TASK_EXECUTION"] = "RESUME_TASK_EXECUTION";
3211
+ EActionKey["STOP_TASK_EXECUTION"] = "STOP_TASK_EXECUTION";
3219
3212
  })(EActionKey || (EActionKey = {}));
3220
3213
 
3221
3214
  var EApiStatusType;
@@ -3238,6 +3231,11 @@
3238
3231
  EMessageType["SUCCESS"] = "success";
3239
3232
  EMessageType["WARNING"] = "warning";
3240
3233
  })(EMessageType || (EMessageType = {}));
3234
+ var EFormViewGoBackMode;
3235
+ (function (EFormViewGoBackMode) {
3236
+ EFormViewGoBackMode["DIRECT"] = "DIRECT";
3237
+ EFormViewGoBackMode["TABBED"] = "TABBED";
3238
+ })(EFormViewGoBackMode || (EFormViewGoBackMode = {}));
3241
3239
 
3242
3240
  var Defaults = /** @class */ (function () {
3243
3241
  function Defaults(field, formFields, allFormsData, formData, previousFormData, takeAction) {
@@ -3777,9 +3775,13 @@
3777
3775
  finally { if (e_4) throw e_4.error; }
3778
3776
  return [7 /*endfinally*/];
3779
3777
  case 8: return [2 /*return*/, this._object.API_CONFIG];
3780
- case 9: return [2 /*return*/, this._object.API_CONFIG];
3778
+ case 9:
3779
+ this._object = kwikidToolkit.setValueToObjectPath(this._object, "API_CONFIG.request.validation.body.is_valid", true);
3780
+ return [2 /*return*/, this._object.API_CONFIG];
3781
3781
  case 10: return [3 /*break*/, 12];
3782
- case 11: return [2 /*return*/, this._object.API_CONFIG];
3782
+ case 11:
3783
+ this._object = kwikidToolkit.setValueToObjectPath(this._object, "API_CONFIG.request.validation.body.is_valid", true);
3784
+ return [2 /*return*/, this._object.API_CONFIG];
3783
3785
  case 12: return [2 /*return*/];
3784
3786
  }
3785
3787
  });
@@ -3942,9 +3944,13 @@
3942
3944
  finally { if (e_8) throw e_8.error; }
3943
3945
  return [7 /*endfinally*/];
3944
3946
  case 8: return [2 /*return*/, this._object.API_CONFIG];
3945
- case 9: return [2 /*return*/, this._object.API_CONFIG];
3947
+ case 9:
3948
+ this._object = kwikidToolkit.setValueToObjectPath(this._object, "API_CONFIG.request.validation.headers.is_valid", true);
3949
+ return [2 /*return*/, this._object.API_CONFIG];
3946
3950
  case 10: return [3 /*break*/, 12];
3947
- case 11: return [2 /*return*/, this._object.API_CONFIG];
3951
+ case 11:
3952
+ this._object = kwikidToolkit.setValueToObjectPath(this._object, "API_CONFIG.request.validation.headers.is_valid", true);
3953
+ return [2 /*return*/, this._object.API_CONFIG];
3948
3954
  case 12: return [2 /*return*/];
3949
3955
  }
3950
3956
  });
@@ -4068,6 +4074,63 @@
4068
4074
  kwikidToolkit.logMethod
4069
4075
  ], Apis.prototype, "callNextApi", null);
4070
4076
 
4077
+ var Tasks = /** @class */ (function () {
4078
+ function Tasks(task, object, takeAction) {
4079
+ this._task = task;
4080
+ this._object = object;
4081
+ this._takeAction = takeAction;
4082
+ }
4083
+ Tasks.prototype.execute = function () {
4084
+ return __awaiter(this, void 0, void 0, function () {
4085
+ var triggers, rules, actions, rulesMapping, actions_1, actions_1_1, action, conditionEvaluation, actions_2, e_1_1;
4086
+ var e_1, _a;
4087
+ return __generator(this, function (_b) {
4088
+ switch (_b.label) {
4089
+ case 0:
4090
+ triggers = this._task.triggers;
4091
+ rules = this._task.rules;
4092
+ actions = this._task.actions;
4093
+ rulesMapping = new kwikidToolkit.Rule(rules, this._object).mapping();
4094
+ _b.label = 1;
4095
+ case 1:
4096
+ _b.trys.push([1, 6, 7, 8]);
4097
+ actions_1 = __values(actions), actions_1_1 = actions_1.next();
4098
+ _b.label = 2;
4099
+ case 2:
4100
+ if (!!actions_1_1.done) return [3 /*break*/, 5];
4101
+ action = actions_1_1.value;
4102
+ conditionEvaluation = new kwikidToolkit.Condition(action.condition, rulesMapping).evaluate();
4103
+ if (!conditionEvaluation) return [3 /*break*/, 4];
4104
+ actions_2 = new kwikidToolkit.Action(action, rulesMapping, this._object, this._takeAction);
4105
+ return [4 /*yield*/, actions_2.execute()];
4106
+ case 3:
4107
+ _b.sent();
4108
+ _b.label = 4;
4109
+ case 4:
4110
+ actions_1_1 = actions_1.next();
4111
+ return [3 /*break*/, 2];
4112
+ case 5: return [3 /*break*/, 8];
4113
+ case 6:
4114
+ e_1_1 = _b.sent();
4115
+ e_1 = { error: e_1_1 };
4116
+ return [3 /*break*/, 8];
4117
+ case 7:
4118
+ try {
4119
+ if (actions_1_1 && !actions_1_1.done && (_a = actions_1.return)) _a.call(actions_1);
4120
+ }
4121
+ finally { if (e_1) throw e_1.error; }
4122
+ return [7 /*endfinally*/];
4123
+ case 8: return [2 /*return*/];
4124
+ }
4125
+ });
4126
+ });
4127
+ };
4128
+ return Tasks;
4129
+ }());
4130
+ __decorate([
4131
+ kwikidToolkit.logMethod
4132
+ ], Tasks.prototype, "execute", null);
4133
+
4071
4134
  /**
4072
4135
  * Generated class for the SafeHtmlPipe pipe.
4073
4136
  *
@@ -4091,19 +4154,65 @@
4091
4154
  }]
4092
4155
  }], ctorParameters: function () { return [{ type: i1__namespace$1.DomSanitizer }]; } });
4093
4156
 
4157
+ /**
4158
+ * Generated class for the SafeUrlPipe pipe.
4159
+ *
4160
+ * See https://angular.io/api/core/Pipe for more info on Angular Pipes.
4161
+ */
4162
+ var SafeUrlPipe = /** @class */ (function () {
4163
+ function SafeUrlPipe(sanitizer) {
4164
+ this.sanitizer = sanitizer;
4165
+ }
4166
+ SafeUrlPipe.prototype.transform = function (url) {
4167
+ return this.sanitizer.bypassSecurityTrustResourceUrl(url);
4168
+ };
4169
+ return SafeUrlPipe;
4170
+ }());
4171
+ /** @nocollapse */ SafeUrlPipe.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: SafeUrlPipe, deps: [{ token: i1__namespace$1.DomSanitizer }], target: i0__namespace.ɵɵFactoryTarget.Pipe });
4172
+ /** @nocollapse */ SafeUrlPipe.ɵpipe = i0__namespace.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: SafeUrlPipe, name: "safeUrl" });
4173
+ i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: SafeUrlPipe, decorators: [{
4174
+ type: i0.Pipe,
4175
+ args: [{
4176
+ name: "safeUrl"
4177
+ }]
4178
+ }], ctorParameters: function () { return [{ type: i1__namespace$1.DomSanitizer }]; } });
4179
+
4094
4180
  var KwikIDFormViewComponent = /** @class */ (function () {
4095
- function KwikIDFormViewComponent(push, alert, formViewService) {
4181
+ function KwikIDFormViewComponent(cd, formViewService, push, alert, previewDialogService, dialogs) {
4182
+ this.cd = cd;
4183
+ this.formViewService = formViewService;
4096
4184
  this.push = push;
4097
4185
  this.alert = alert;
4098
- this.formViewService = formViewService;
4186
+ this.previewDialogService = previewDialogService;
4187
+ this.dialogs = dialogs;
4099
4188
  this.isMobileView = false;
4189
+ this.popupFormCallback = undefined;
4190
+ this.onClickGoBack = new i0.EventEmitter();
4100
4191
  this.onClickViewForms = new i0.EventEmitter();
4101
4192
  this.onClickSaveForm = new i0.EventEmitter();
4102
4193
  this.onClickApiCall = new i0.EventEmitter();
4194
+ this.onActionShowPopupForm = new i0.EventEmitter();
4103
4195
  this.fieldGroups = {};
4104
4196
  this.formFields = [];
4105
4197
  this.previousFormData = {};
4198
+ this.previewProperties = {
4199
+ html: {
4200
+ before: "",
4201
+ after: ""
4202
+ },
4203
+ iframe: {
4204
+ src: "",
4205
+ title: ""
4206
+ },
4207
+ popupFormKey: "",
4208
+ title: "",
4209
+ unavailable: false
4210
+ };
4106
4211
  this.loading = true;
4212
+ this.backButton = {
4213
+ disabled: false,
4214
+ showLoader: false
4215
+ };
4107
4216
  this.viewFormsButton = {
4108
4217
  disabled: false,
4109
4218
  showLoader: false
@@ -4112,8 +4221,14 @@
4112
4221
  disabled: false,
4113
4222
  showLoader: false
4114
4223
  };
4224
+ this.stopTaskExecution = false;
4225
+ this.waitingForChanges = false;
4226
+ this.popupFormConfig = undefined;
4227
+ this.popupFormData = undefined;
4228
+ this.tasksData = undefined;
4115
4229
  this.formGroup = new i2.FormGroup({});
4116
4230
  this.showErrorNotification = false;
4231
+ this.dialogRef = undefined;
4117
4232
  }
4118
4233
  KwikIDFormViewComponent.prototype.ngOnInit = function () {
4119
4234
  var _this = this;
@@ -4131,6 +4246,7 @@
4131
4246
  };
4132
4247
  KwikIDFormViewComponent.prototype.ngAfterViewInit = function () { };
4133
4248
  KwikIDFormViewComponent.prototype.ngOnChanges = function (changes) {
4249
+ var _h;
4134
4250
  var _this = this;
4135
4251
  var verifyChange = function (key) {
4136
4252
  return kwikidToolkit.checkObjectKeyExists(changes, key) && !changes[key].firstChange;
@@ -4138,6 +4254,17 @@
4138
4254
  if (verifyChange("formData")) {
4139
4255
  this.formData = Object.assign(Object.assign({}, this.formData), changes.formData.currentValue);
4140
4256
  }
4257
+ if (verifyChange("popupFormCallback")) {
4258
+ if (kwikidToolkit.isNotEmptyValue(changes.popupFormCallback.currentValue)) {
4259
+ var popupFormData = changes.popupFormCallback.currentValue.popupFormData;
4260
+ var popupFormConfig = changes.popupFormCallback.currentValue.popupFormConfig;
4261
+ this.popupFormData = kwikidToolkit.mergeObjects(this.popupFormData, (_h = {},
4262
+ _h[popupFormConfig.key] = popupFormData,
4263
+ _h));
4264
+ this.formData = kwikidToolkit.mergeObjects(this.formData, this.popupFormData);
4265
+ }
4266
+ this.waitingForChanges = false;
4267
+ }
4141
4268
  if (verifyChange("isMobileView")) {
4142
4269
  this.isMobileView = changes.isMobileView.currentValue;
4143
4270
  }
@@ -4160,26 +4287,91 @@
4160
4287
  };
4161
4288
  KwikIDFormViewComponent.prototype.initFormConfig = function (formConfig) {
4162
4289
  return __awaiter(this, void 0, void 0, function () {
4163
- var _h, _loop_1, this_1, _j, _k, field, _l, _m, field, validations, e_1_1;
4164
- var e_2, _o, e_1, _p;
4290
+ var _h, _j, preTask, task, e_1_1, _k, _loop_1, this_1, _l, _m, field, _o, _p, field, validations, e_2_1;
4291
+ var e_1, _q, e_3, _r, e_2, _s;
4165
4292
  var _this = this;
4166
- return __generator(this, function (_q) {
4167
- switch (_q.label) {
4293
+ return __generator(this, function (_t) {
4294
+ switch (_t.label) {
4168
4295
  case 0:
4169
4296
  formConfig = new Converter().convertFormConfig(formConfig);
4170
4297
  formConfig = new Converter().updateFormConfigProperties(formConfig);
4171
4298
  this.setFormFieldsFromFormConfig(formConfig);
4172
4299
  this.setFormFieldGroupsFromFormConfig(formConfig);
4173
4300
  this.setFormDataFromAllFormsData();
4174
- _h = this;
4175
- return [4 /*yield*/, this.formViewService.createFormGroup(this.formFields, this.formData, this.previousFormData, this.allFormsData, this.takeAction.bind(this))];
4301
+ if (!(kwikidToolkit.checkObjectKeyExists(this.formConfig, "tasks") &&
4302
+ kwikidToolkit.checkObjectKeyExists(this.formConfig.tasks, "pre"))) return [3 /*break*/, 10];
4303
+ _t.label = 1;
4176
4304
  case 1:
4177
- _h.formGroup = _q.sent();
4305
+ _t.trys.push([1, 7, 8, 9]);
4306
+ _h = __values(this.formConfig.tasks.pre), _j = _h.next();
4307
+ _t.label = 2;
4308
+ case 2:
4309
+ if (!!_j.done) return [3 /*break*/, 6];
4310
+ preTask = _j.value;
4311
+ task = new Tasks(preTask, {
4312
+ FORM_CONFIG: this.formConfig,
4313
+ FORM_FIELDS: this.formFields,
4314
+ FORM_DATA: this.formData,
4315
+ PREVIOUS_FORM_DATA: this.previousFormData,
4316
+ ALL_FORMS_DATA: this.allFormsData
4317
+ }, this.takeAction.bind(this));
4318
+ // if (preTask.wait) {
4319
+ this.waitingForChanges = true;
4320
+ // } else {
4321
+ // this.waitingForChanges = false;
4322
+ // }
4323
+ return [4 /*yield*/, task.execute()];
4324
+ case 3:
4325
+ // } else {
4326
+ // this.waitingForChanges = false;
4327
+ // }
4328
+ _t.sent();
4329
+ // Wait for ngOnChanges to be called before continuing to the next task
4330
+ return [4 /*yield*/, new Promise(function (resolve) {
4331
+ var intervalId = setInterval(function () {
4332
+ if (!_this.waitingForChanges) {
4333
+ clearInterval(intervalId);
4334
+ resolve();
4335
+ }
4336
+ }, 10);
4337
+ })];
4338
+ case 4:
4339
+ // Wait for ngOnChanges to be called before continuing to the next task
4340
+ _t.sent();
4341
+ if (this.stopTaskExecution) {
4342
+ return [3 /*break*/, 6];
4343
+ }
4344
+ _t.label = 5;
4345
+ case 5:
4346
+ _j = _h.next();
4347
+ return [3 /*break*/, 2];
4348
+ case 6: return [3 /*break*/, 9];
4349
+ case 7:
4350
+ e_1_1 = _t.sent();
4351
+ e_1 = { error: e_1_1 };
4352
+ return [3 /*break*/, 9];
4353
+ case 8:
4354
+ try {
4355
+ if (_j && !_j.done && (_q = _h.return)) _q.call(_h);
4356
+ }
4357
+ finally { if (e_1) throw e_1.error; }
4358
+ return [7 /*endfinally*/];
4359
+ case 9:
4360
+ this.formData = kwikidToolkit.mergeObjects(this.formData, this.popupFormData);
4361
+ _t.label = 10;
4362
+ case 10:
4363
+ if (this.stopTaskExecution) {
4364
+ return [2 /*return*/];
4365
+ }
4366
+ _k = this;
4367
+ return [4 /*yield*/, this.formViewService.createFormGroup(this.formFields, this.formData, this.previousFormData, this.allFormsData, this.takeAction.bind(this))];
4368
+ case 11:
4369
+ _k.formGroup = _t.sent();
4178
4370
  _loop_1 = function (field) {
4179
- var _r, _s;
4371
+ var _u, _v;
4180
4372
  if (field.isFormElement) {
4181
- this_1.previousFormData = Object.assign(Object.assign({}, this_1.previousFormData), (_r = {}, _r[field.key] = convertFormFieldValueToStandardFormat(field, this_1.formGroup.controls[field.key].value), _r));
4182
- this_1.formData = Object.assign(Object.assign({}, this_1.formData), (_s = {}, _s[field.key] = convertFormFieldValueToStandardFormat(field, this_1.formGroup.controls[field.key].value), _s));
4373
+ this_1.previousFormData = Object.assign(Object.assign({}, this_1.previousFormData), (_u = {}, _u[field.key] = convertFormFieldValueToStandardFormat(field, this_1.formGroup.controls[field.key].value), _u));
4374
+ this_1.formData = Object.assign(Object.assign({}, this_1.formData), (_v = {}, _v[field.key] = convertFormFieldValueToStandardFormat(field, this_1.formGroup.controls[field.key].value), _v));
4183
4375
  this_1.formGroup.controls[field.key].valueChanges
4184
4376
  .pipe(operators.pairwise())
4185
4377
  .subscribe(function (_h) {
@@ -4192,29 +4384,29 @@
4192
4384
  };
4193
4385
  this_1 = this;
4194
4386
  try {
4195
- for (_j = __values(this.formFields), _k = _j.next(); !_k.done; _k = _j.next()) {
4196
- field = _k.value;
4387
+ for (_l = __values(this.formFields), _m = _l.next(); !_m.done; _m = _l.next()) {
4388
+ field = _m.value;
4197
4389
  _loop_1(field);
4198
4390
  }
4199
4391
  }
4200
- catch (e_2_1) { e_2 = { error: e_2_1 }; }
4392
+ catch (e_3_1) { e_3 = { error: e_3_1 }; }
4201
4393
  finally {
4202
4394
  try {
4203
- if (_k && !_k.done && (_o = _j.return)) _o.call(_j);
4395
+ if (_m && !_m.done && (_r = _l.return)) _r.call(_l);
4204
4396
  }
4205
- finally { if (e_2) throw e_2.error; }
4397
+ finally { if (e_3) throw e_3.error; }
4206
4398
  }
4207
- _q.label = 2;
4208
- case 2:
4209
- _q.trys.push([2, 8, 9, 10]);
4210
- _l = __values(this.formFields), _m = _l.next();
4211
- _q.label = 3;
4212
- case 3:
4213
- if (!!_m.done) return [3 /*break*/, 7];
4214
- field = _m.value;
4215
- if (!field.isFormElement) return [3 /*break*/, 6];
4216
- if (!kwikidToolkit.checkObjectKeyExists(field, "validation")) return [3 /*break*/, 5];
4217
- if (!field.validation.triggers.includes("ON_INIT")) return [3 /*break*/, 5];
4399
+ _t.label = 12;
4400
+ case 12:
4401
+ _t.trys.push([12, 18, 19, 20]);
4402
+ _o = __values(this.formFields), _p = _o.next();
4403
+ _t.label = 13;
4404
+ case 13:
4405
+ if (!!_p.done) return [3 /*break*/, 17];
4406
+ field = _p.value;
4407
+ if (!field.isFormElement) return [3 /*break*/, 16];
4408
+ if (!kwikidToolkit.checkObjectKeyExists(field, "validation")) return [3 /*break*/, 15];
4409
+ if (!field.validation.triggers.includes("ON_INIT")) return [3 /*break*/, 15];
4218
4410
  validations = new kwikidToolkit.Validation({
4219
4411
  FIELD_CONFIG: field,
4220
4412
  FORM_FIELDS: this.formFields,
@@ -4223,32 +4415,32 @@
4223
4415
  ALL_FORMS_DATA: this.allFormsData
4224
4416
  }, this.takeAction.bind(this));
4225
4417
  return [4 /*yield*/, validations.validate(field.validation)];
4226
- case 4:
4227
- _q.sent();
4228
- _q.label = 5;
4229
- case 5:
4418
+ case 14:
4419
+ _t.sent();
4420
+ _t.label = 15;
4421
+ case 15:
4230
4422
  if (kwikidToolkit.checkObjectKeyExists(field, "connectedElements")) {
4231
4423
  this.handleConnectedElements({
4232
4424
  key: field.key,
4233
4425
  value: this.formGroup.controls[field.key].value
4234
4426
  }, "ON_INIT");
4235
4427
  }
4236
- _q.label = 6;
4237
- case 6:
4238
- _m = _l.next();
4239
- return [3 /*break*/, 3];
4240
- case 7: return [3 /*break*/, 10];
4241
- case 8:
4242
- e_1_1 = _q.sent();
4243
- e_1 = { error: e_1_1 };
4244
- return [3 /*break*/, 10];
4245
- case 9:
4428
+ _t.label = 16;
4429
+ case 16:
4430
+ _p = _o.next();
4431
+ return [3 /*break*/, 13];
4432
+ case 17: return [3 /*break*/, 20];
4433
+ case 18:
4434
+ e_2_1 = _t.sent();
4435
+ e_2 = { error: e_2_1 };
4436
+ return [3 /*break*/, 20];
4437
+ case 19:
4246
4438
  try {
4247
- if (_m && !_m.done && (_p = _l.return)) _p.call(_l);
4439
+ if (_p && !_p.done && (_s = _o.return)) _s.call(_o);
4248
4440
  }
4249
- finally { if (e_1) throw e_1.error; }
4441
+ finally { if (e_2) throw e_2.error; }
4250
4442
  return [7 /*endfinally*/];
4251
- case 10: return [2 /*return*/];
4443
+ case 20: return [2 /*return*/];
4252
4444
  }
4253
4445
  });
4254
4446
  });
@@ -4275,8 +4467,8 @@
4275
4467
  };
4276
4468
  KwikIDFormViewComponent.prototype.handleConnectedElementFieldGroupActions = function (childFieldGroupConfig, parentField) {
4277
4469
  return __awaiter(this, void 0, void 0, function () {
4278
- var rulesMapping, _h, _j, action, conditionSuccess, actions, e_3_1;
4279
- var e_3, _k;
4470
+ var rulesMapping, _h, _j, action, conditionSuccess, actions, e_4_1;
4471
+ var e_4, _k;
4280
4472
  return __generator(this, function (_l) {
4281
4473
  switch (_l.label) {
4282
4474
  case 0:
@@ -4313,14 +4505,14 @@
4313
4505
  return [3 /*break*/, 2];
4314
4506
  case 5: return [3 /*break*/, 8];
4315
4507
  case 6:
4316
- e_3_1 = _l.sent();
4317
- e_3 = { error: e_3_1 };
4508
+ e_4_1 = _l.sent();
4509
+ e_4 = { error: e_4_1 };
4318
4510
  return [3 /*break*/, 8];
4319
4511
  case 7:
4320
4512
  try {
4321
4513
  if (_j && !_j.done && (_k = _h.return)) _k.call(_h);
4322
4514
  }
4323
- finally { if (e_3) throw e_3.error; }
4515
+ finally { if (e_4) throw e_4.error; }
4324
4516
  return [7 /*endfinally*/];
4325
4517
  case 8: return [2 /*return*/];
4326
4518
  }
@@ -4345,8 +4537,8 @@
4345
4537
  };
4346
4538
  KwikIDFormViewComponent.prototype.handleConnectedElementFieldActions = function (connectedFieldConfig, connectedField) {
4347
4539
  return __awaiter(this, void 0, void 0, function () {
4348
- var rulesMapping, _h, _j, action, conditionSuccess, actions, e_4_1;
4349
- var e_4, _k;
4540
+ var rulesMapping, _h, _j, action, conditionSuccess, actions, e_5_1;
4541
+ var e_5, _k;
4350
4542
  return __generator(this, function (_l) {
4351
4543
  switch (_l.label) {
4352
4544
  case 0:
@@ -4383,14 +4575,14 @@
4383
4575
  return [3 /*break*/, 2];
4384
4576
  case 5: return [3 /*break*/, 8];
4385
4577
  case 6:
4386
- e_4_1 = _l.sent();
4387
- e_4 = { error: e_4_1 };
4578
+ e_5_1 = _l.sent();
4579
+ e_5 = { error: e_5_1 };
4388
4580
  return [3 /*break*/, 8];
4389
4581
  case 7:
4390
4582
  try {
4391
4583
  if (_j && !_j.done && (_k = _h.return)) _k.call(_h);
4392
4584
  }
4393
- finally { if (e_4) throw e_4.error; }
4585
+ finally { if (e_5) throw e_5.error; }
4394
4586
  return [7 /*endfinally*/];
4395
4587
  case 8: return [2 /*return*/, connectedField];
4396
4588
  }
@@ -4423,8 +4615,8 @@
4423
4615
  };
4424
4616
  KwikIDFormViewComponent.prototype.handleConnectedElements = function (e, eventType) {
4425
4617
  return __awaiter(this, void 0, void 0, function () {
4426
- var currentField, connectedFieldGroups, connectedFieldGroups_1, connectedFieldGroups_1_1, connectedFieldGroupConfig, e_5_1, connectedFields, connectedFields_1, connectedFields_1_1, connectedFieldConfig, e_6_1;
4427
- var e_5, _h, e_6, _j;
4618
+ var currentField, connectedFieldGroups, connectedFieldGroups_1, connectedFieldGroups_1_1, connectedFieldGroupConfig, e_6_1, connectedFields, connectedFields_1, connectedFields_1_1, connectedFieldConfig, e_7_1;
4619
+ var e_6, _h, e_7, _j;
4428
4620
  return __generator(this, function (_k) {
4429
4621
  switch (_k.label) {
4430
4622
  case 0:
@@ -4450,14 +4642,14 @@
4450
4642
  return [3 /*break*/, 2];
4451
4643
  case 5: return [3 /*break*/, 8];
4452
4644
  case 6:
4453
- e_5_1 = _k.sent();
4454
- e_5 = { error: e_5_1 };
4645
+ e_6_1 = _k.sent();
4646
+ e_6 = { error: e_6_1 };
4455
4647
  return [3 /*break*/, 8];
4456
4648
  case 7:
4457
4649
  try {
4458
4650
  if (connectedFieldGroups_1_1 && !connectedFieldGroups_1_1.done && (_h = connectedFieldGroups_1.return)) _h.call(connectedFieldGroups_1);
4459
4651
  }
4460
- finally { if (e_5) throw e_5.error; }
4652
+ finally { if (e_6) throw e_6.error; }
4461
4653
  return [7 /*endfinally*/];
4462
4654
  case 8:
4463
4655
  if (!kwikidToolkit.checkObjectKeyExists(currentField.connectedElements, "connectedFields")) return [3 /*break*/, 16];
@@ -4479,14 +4671,14 @@
4479
4671
  return [3 /*break*/, 10];
4480
4672
  case 13: return [3 /*break*/, 16];
4481
4673
  case 14:
4482
- e_6_1 = _k.sent();
4483
- e_6 = { error: e_6_1 };
4674
+ e_7_1 = _k.sent();
4675
+ e_7 = { error: e_7_1 };
4484
4676
  return [3 /*break*/, 16];
4485
4677
  case 15:
4486
4678
  try {
4487
4679
  if (connectedFields_1_1 && !connectedFields_1_1.done && (_j = connectedFields_1.return)) _j.call(connectedFields_1);
4488
4680
  }
4489
- finally { if (e_6) throw e_6.error; }
4681
+ finally { if (e_7) throw e_7.error; }
4490
4682
  return [7 /*endfinally*/];
4491
4683
  case 16: return [3 /*break*/, 18];
4492
4684
  case 17: throw new Error("Field for the given key ['" + e.key + "'] is not found with eventType: '" + eventType + "'.");
@@ -4540,8 +4732,8 @@
4540
4732
  var _this = this;
4541
4733
  return __generator(this, function (_h) {
4542
4734
  resetFormFields = function () { return __awaiter(_this, void 0, void 0, function () {
4543
- var _h, _j, f, _k, _l, action, resetField, actions, e_7_1, e_8_1;
4544
- var e_8, _m, e_7, _o;
4735
+ var _h, _j, f, _k, _l, action, resetField, actions, e_8_1, e_9_1;
4736
+ var e_9, _m, e_8, _o;
4545
4737
  return __generator(this, function (_p) {
4546
4738
  switch (_p.label) {
4547
4739
  case 0:
@@ -4554,7 +4746,7 @@
4554
4746
  _p.label = 2;
4555
4747
  case 2:
4556
4748
  _p.trys.push([2, 7, 8, 9]);
4557
- _k = (e_7 = void 0, __values(f.actions)), _l = _k.next();
4749
+ _k = (e_8 = void 0, __values(f.actions)), _l = _k.next();
4558
4750
  _p.label = 3;
4559
4751
  case 3:
4560
4752
  if (!!_l.done) return [3 /*break*/, 6];
@@ -4576,28 +4768,28 @@
4576
4768
  return [3 /*break*/, 3];
4577
4769
  case 6: return [3 /*break*/, 9];
4578
4770
  case 7:
4579
- e_7_1 = _p.sent();
4580
- e_7 = { error: e_7_1 };
4771
+ e_8_1 = _p.sent();
4772
+ e_8 = { error: e_8_1 };
4581
4773
  return [3 /*break*/, 9];
4582
4774
  case 8:
4583
4775
  try {
4584
4776
  if (_l && !_l.done && (_o = _k.return)) _o.call(_k);
4585
4777
  }
4586
- finally { if (e_7) throw e_7.error; }
4778
+ finally { if (e_8) throw e_8.error; }
4587
4779
  return [7 /*endfinally*/];
4588
4780
  case 9:
4589
4781
  _j = _h.next();
4590
4782
  return [3 /*break*/, 1];
4591
4783
  case 10: return [3 /*break*/, 13];
4592
4784
  case 11:
4593
- e_8_1 = _p.sent();
4594
- e_8 = { error: e_8_1 };
4785
+ e_9_1 = _p.sent();
4786
+ e_9 = { error: e_9_1 };
4595
4787
  return [3 /*break*/, 13];
4596
4788
  case 12:
4597
4789
  try {
4598
4790
  if (_j && !_j.done && (_m = _h.return)) _m.call(_h);
4599
4791
  }
4600
- finally { if (e_8) throw e_8.error; }
4792
+ finally { if (e_9) throw e_9.error; }
4601
4793
  return [7 /*endfinally*/];
4602
4794
  case 13: return [2 /*return*/];
4603
4795
  }
@@ -4617,15 +4809,30 @@
4617
4809
  });
4618
4810
  });
4619
4811
  };
4620
- KwikIDFormViewComponent.prototype.handleApiCall = function (field, api) {
4621
- var _a, _b, _c, _d, _e, _f, _g;
4812
+ KwikIDFormViewComponent.prototype.handleFieldApiCall = function (field, api) {
4622
4813
  return __awaiter(this, void 0, void 0, function () {
4623
- var apis, apiCallResponse, url, method, headers, body, response, apis_1;
4814
+ var apis;
4624
4815
  var _h, _j;
4625
- var _this = this;
4626
4816
  return __generator(this, function (_k) {
4627
4817
  switch (_k.label) {
4628
- case 0:
4818
+ case 0: return [4 /*yield*/, this.handleApiCall(api, {
4819
+ FIELD_CONFIG: field,
4820
+ API_CONFIG: api,
4821
+ FORM_FIELDS: this.formFields,
4822
+ FORM_DATA: this.formData,
4823
+ PREVIOUS_FORM_DATA: this.previousFormData,
4824
+ ALL_FORMS_DATA: this.allFormsData
4825
+ })];
4826
+ case 1:
4827
+ api = _k.sent();
4828
+ if (!(api.request.body.validation.is_valid &&
4829
+ api.request.headers.validation.is_valid)) return [3 /*break*/, 3];
4830
+ if (kwikidToolkit.checkObjectKeyExists(field.api, "request")) {
4831
+ this.formData = Object.assign(Object.assign({}, this.formData), (_h = {}, _h[field.key] = api.response.value, _h));
4832
+ this.formGroup.patchValue((_j = {},
4833
+ _j[field.key] = api.response.value,
4834
+ _j), { emitEvent: false });
4835
+ }
4629
4836
  apis = new Apis({
4630
4837
  FIELD_CONFIG: field,
4631
4838
  API_CONFIG: api,
@@ -4634,23 +4841,81 @@
4634
4841
  PREVIOUS_FORM_DATA: this.previousFormData,
4635
4842
  ALL_FORMS_DATA: this.allFormsData
4636
4843
  }, this.takeAction.bind(this));
4844
+ return [4 /*yield*/, apis.validateResponse()];
4845
+ case 2:
4846
+ api = _k.sent();
4847
+ return [3 /*break*/, 4];
4848
+ case 3:
4849
+ setTimeout(function () {
4850
+ field["api"]["status"]["value"] = EApiStatusType.FAILED;
4851
+ field["showLoader"] = false;
4852
+ }, 500);
4853
+ _k.label = 4;
4854
+ case 4: return [2 /*return*/, { field: field, api: api }];
4855
+ }
4856
+ });
4857
+ });
4858
+ };
4859
+ KwikIDFormViewComponent.prototype.handleTaskApiCall = function (api) {
4860
+ return __awaiter(this, void 0, void 0, function () {
4861
+ var apis;
4862
+ return __generator(this, function (_h) {
4863
+ switch (_h.label) {
4864
+ case 0: return [4 /*yield*/, this.handleApiCall(api, {
4865
+ FORM_CONFIG: this.formConfig,
4866
+ API_CONFIG: api,
4867
+ FORM_FIELDS: this.formFields,
4868
+ FORM_DATA: this.formData,
4869
+ PREVIOUS_FORM_DATA: this.previousFormData,
4870
+ ALL_FORMS_DATA: this.allFormsData
4871
+ })];
4872
+ case 1:
4873
+ api = _h.sent();
4874
+ apis = new Apis({
4875
+ FORM_CONFIG: this.formConfig,
4876
+ API_CONFIG: api,
4877
+ FORM_FIELDS: this.formFields,
4878
+ FORM_DATA: this.formData,
4879
+ PREVIOUS_FORM_DATA: this.previousFormData,
4880
+ ALL_FORMS_DATA: this.allFormsData
4881
+ }, this.takeAction.bind(this));
4882
+ if (!(api.request.body.validation.is_valid &&
4883
+ api.request.headers.validation.is_valid)) return [3 /*break*/, 3];
4884
+ return [4 /*yield*/, apis.validateResponse()];
4885
+ case 2:
4886
+ api = _h.sent();
4887
+ _h.label = 3;
4888
+ case 3: return [2 /*return*/, { api: api }];
4889
+ }
4890
+ });
4891
+ });
4892
+ };
4893
+ KwikIDFormViewComponent.prototype.handleApiCall = function (api, object) {
4894
+ var _a, _b, _c, _d, _e, _f, _g;
4895
+ return __awaiter(this, void 0, void 0, function () {
4896
+ var apis, apiCallResponse, url, method, headers, body, response;
4897
+ return __generator(this, function (_h) {
4898
+ switch (_h.label) {
4899
+ case 0:
4900
+ apis = new Apis(object, this.takeAction.bind(this));
4637
4901
  return [4 /*yield*/, apis.setUrl()];
4638
4902
  case 1:
4639
- api = _k.sent();
4903
+ api = _h.sent();
4640
4904
  return [4 /*yield*/, apis.setRequestHeaders()];
4641
4905
  case 2:
4642
- api = _k.sent();
4906
+ api = _h.sent();
4643
4907
  return [4 /*yield*/, apis.validateRequestHeaders()];
4644
4908
  case 3:
4645
- api = _k.sent();
4909
+ api = _h.sent();
4646
4910
  return [4 /*yield*/, apis.setRequestBody()];
4647
4911
  case 4:
4648
- api = _k.sent();
4912
+ api = _h.sent();
4649
4913
  return [4 /*yield*/, apis.validateRequestBody()];
4650
4914
  case 5:
4651
- api = _k.sent();
4915
+ api = _h.sent();
4652
4916
  apiCallResponse = undefined;
4653
- if (!api.request.body.validation.is_valid) return [3 /*break*/, 10];
4917
+ if (!(api.request.body.validation.is_valid &&
4918
+ api.request.headers.validation.is_valid)) return [3 /*break*/, 10];
4654
4919
  if (!(api.request.url.hasOwnProperty("type") &&
4655
4920
  api.request.url.type === EApiRequestUrlType.MOCK)) return [3 /*break*/, 6];
4656
4921
  apiCallResponse = api.request.url.props.mockedData;
@@ -4666,55 +4931,31 @@
4666
4931
  body: JSON.stringify(body)
4667
4932
  })];
4668
4933
  case 7:
4669
- response = _k.sent();
4934
+ response = _h.sent();
4670
4935
  return [4 /*yield*/, response.json()];
4671
4936
  case 8:
4672
- apiCallResponse = _k.sent();
4673
- _k.label = 9;
4937
+ apiCallResponse = _h.sent();
4938
+ _h.label = 9;
4674
4939
  case 9:
4675
- /**
4676
- * This runs when API is in old format or new.
4677
- * If Old Format then it directly patches api response to field data
4678
- */
4679
- if (kwikidToolkit.checkObjectKeyExists(field.api, "request")) {
4680
- this.formData = Object.assign(Object.assign({}, this.formData), (_h = {}, _h[field.key] = apiCallResponse, _h));
4681
- this.formGroup.patchValue((_j = {},
4682
- _j[field.key] = apiCallResponse,
4683
- _j), { emitEvent: false });
4684
- }
4685
- console.log(api.response);
4686
- console.log(apiCallResponse);
4687
- api.response = kwikidToolkit.setMissingKeyValue(api.response, "value", apiCallResponse);
4688
- apis_1 = new Apis({
4689
- FIELD_CONFIG: field,
4690
- API_CONFIG: api,
4691
- FORM_FIELDS: this.formFields,
4692
- FORM_DATA: this.formData,
4693
- PREVIOUS_FORM_DATA: this.previousFormData,
4694
- ALL_FORMS_DATA: this.allFormsData
4695
- }, this.takeAction.bind(this));
4696
- (function () { return __awaiter(_this, void 0, void 0, function () {
4697
- return __generator(this, function (_h) {
4698
- switch (_h.label) {
4699
- case 0: return [4 /*yield*/, apis_1.validateResponse()];
4700
- case 1:
4701
- api = _h.sent();
4702
- return [2 /*return*/];
4703
- }
4704
- });
4705
- }); })();
4706
- return [3 /*break*/, 11];
4707
- case 10:
4708
- setTimeout(function () {
4709
- field["api"]["status"]["value"] = EApiStatusType.FAILED;
4710
- field["showLoader"] = false;
4711
- }, 500);
4712
- _k.label = 11;
4713
- case 11: return [2 /*return*/, { field: field, api: api }];
4940
+ api.response = kwikidToolkit.setValueToObjectPath(api.response, "value", apiCallResponse);
4941
+ _h.label = 10;
4942
+ case 10: return [2 /*return*/, api];
4714
4943
  }
4715
4944
  });
4716
4945
  });
4717
4946
  };
4947
+ KwikIDFormViewComponent.prototype.showApiLoader = function () {
4948
+ this.viewFormsButton["disabled"] = true;
4949
+ this.viewFormsButton["showLoader"] = true;
4950
+ this.saveFormButton["disabled"] = true;
4951
+ this.saveFormButton["showLoader"] = true;
4952
+ };
4953
+ KwikIDFormViewComponent.prototype.hideApiLoader = function () {
4954
+ this.viewFormsButton["disabled"] = false;
4955
+ this.viewFormsButton["showLoader"] = false;
4956
+ this.saveFormButton["disabled"] = false;
4957
+ this.saveFormButton["showLoader"] = false;
4958
+ };
4718
4959
  KwikIDFormViewComponent.prototype.handleOnClickApiCall = function (e) {
4719
4960
  return __awaiter(this, void 0, void 0, function () {
4720
4961
  var field, apis;
@@ -4726,12 +4967,9 @@
4726
4967
  // set button status to loading
4727
4968
  field["api"]["status"]["value"] = EApiStatusType.LOADING;
4728
4969
  field["showLoader"] = true;
4729
- this.viewFormsButton["disabled"] = true;
4730
- this.viewFormsButton["showLoader"] = true;
4731
- this.saveFormButton["disabled"] = true;
4732
- this.saveFormButton["showLoader"] = true;
4970
+ this.showApiLoader();
4733
4971
  if (!kwikidToolkit.checkObjectKeyExists(field.api, "request")) return [3 /*break*/, 2];
4734
- return [4 /*yield*/, this.handleApiCall(field, field.api)];
4972
+ return [4 /*yield*/, this.handleFieldApiCall(field, field.api)];
4735
4973
  case 1:
4736
4974
  _h.sent();
4737
4975
  return [3 /*break*/, 4];
@@ -4749,10 +4987,7 @@
4749
4987
  _h.sent();
4750
4988
  _h.label = 4;
4751
4989
  case 4:
4752
- this.viewFormsButton["disabled"] = false;
4753
- this.viewFormsButton["showLoader"] = false;
4754
- this.saveFormButton["disabled"] = false;
4755
- this.saveFormButton["showLoader"] = false;
4990
+ this.hideApiLoader();
4756
4991
  _h.label = 5;
4757
4992
  case 5: return [2 /*return*/];
4758
4993
  }
@@ -4768,13 +5003,29 @@
4768
5003
  KwikIDFormViewComponent.prototype.getUniqueIdentifier = function (index, item) {
4769
5004
  return item.key;
4770
5005
  };
5006
+ KwikIDFormViewComponent.prototype.handleOnClickGoBack = function (e, mode) {
5007
+ if (this.formConfig.status === EFormsListStatus.COMPLETED) {
5008
+ this.onClickGoBack.emit({
5009
+ clicked: true,
5010
+ mode: mode
5011
+ });
5012
+ }
5013
+ else if (this.formConfig.properties.header.backButton.bypassConfirmation ||
5014
+ window.confirm("Your data will be lost if you leave this page! Continue?")) {
5015
+ this.onClickGoBack.emit({
5016
+ clicked: true,
5017
+ mode: mode
5018
+ });
5019
+ }
5020
+ };
4771
5021
  KwikIDFormViewComponent.prototype.handleOnClickViewForms = function (e) {
4772
5022
  if (this.formConfig.status === EFormsListStatus.COMPLETED) {
4773
5023
  this.onClickViewForms.emit({
4774
5024
  clicked: true
4775
5025
  });
4776
5026
  }
4777
- else if (window.confirm("Your data will be lost if you leave this page! Continue?")) {
5027
+ else if (this.formConfig.properties.footer.viewFormsButton.bypassConfirmation ||
5028
+ window.confirm("Your data will be lost if you leave this page! Continue?")) {
4778
5029
  this.onClickViewForms.emit({
4779
5030
  clicked: true
4780
5031
  });
@@ -4782,11 +5033,11 @@
4782
5033
  };
4783
5034
  KwikIDFormViewComponent.prototype.handleOnClickSaveForm = function (e) {
4784
5035
  return __awaiter(this, void 0, void 0, function () {
4785
- var formData, _h, _j, field, controls, firstFieldWithError, controls_1, controls_1_1, control, _k, _l, field, validations, e_9_1;
4786
- var e_10, _m, e_11, _o, e_9, _p;
5036
+ var formData, _h, _j, field, controls, firstFieldWithError, controls_1, controls_1_1, control, _k, _l, field, validations, e_10_1, _m, _o, postTask, task, e_11_1;
5037
+ var e_12, _p, e_13, _q, e_10, _r, e_11, _s;
4787
5038
  var _this = this;
4788
- return __generator(this, function (_q) {
4789
- switch (_q.label) {
5039
+ return __generator(this, function (_t) {
5040
+ switch (_t.label) {
4790
5041
  case 0:
4791
5042
  formData = this.formGroup.getRawValue();
4792
5043
  try {
@@ -4802,12 +5053,12 @@
4802
5053
  }
4803
5054
  }
4804
5055
  }
4805
- catch (e_10_1) { e_10 = { error: e_10_1 }; }
5056
+ catch (e_12_1) { e_12 = { error: e_12_1 }; }
4806
5057
  finally {
4807
5058
  try {
4808
- if (_j && !_j.done && (_m = _h.return)) _m.call(_h);
5059
+ if (_j && !_j.done && (_p = _h.return)) _p.call(_h);
4809
5060
  }
4810
- finally { if (e_10) throw e_10.error; }
5061
+ finally { if (e_12) throw e_12.error; }
4811
5062
  }
4812
5063
  if (this.formGroup.invalid) {
4813
5064
  controls = new FormValidation().getFormFieldsInvalidControls(this.formGroup);
@@ -4821,12 +5072,12 @@
4821
5072
  this.formFields = showFormFieldError(this.formFields, this.formGroup.controls[control.key].errors, control.key, control.invalid);
4822
5073
  }
4823
5074
  }
4824
- catch (e_11_1) { e_11 = { error: e_11_1 }; }
5075
+ catch (e_13_1) { e_13 = { error: e_13_1 }; }
4825
5076
  finally {
4826
5077
  try {
4827
- if (controls_1_1 && !controls_1_1.done && (_o = controls_1.return)) _o.call(controls_1);
5078
+ if (controls_1_1 && !controls_1_1.done && (_q = controls_1.return)) _q.call(controls_1);
4828
5079
  }
4829
- finally { if (e_11) throw e_11.error; }
5080
+ finally { if (e_13) throw e_13.error; }
4830
5081
  }
4831
5082
  this.toggleErrorNotification(true);
4832
5083
  setTimeout(function () {
@@ -4834,11 +5085,11 @@
4834
5085
  }, 3000);
4835
5086
  return [2 /*return*/];
4836
5087
  }
4837
- _q.label = 1;
5088
+ _t.label = 1;
4838
5089
  case 1:
4839
- _q.trys.push([1, 6, 7, 8]);
5090
+ _t.trys.push([1, 6, 7, 8]);
4840
5091
  _k = __values(this.formFields), _l = _k.next();
4841
- _q.label = 2;
5092
+ _t.label = 2;
4842
5093
  case 2:
4843
5094
  if (!!_l.done) return [3 /*break*/, 5];
4844
5095
  field = _l.value;
@@ -4854,7 +5105,7 @@
4854
5105
  }, this.takeAction.bind(this));
4855
5106
  return [4 /*yield*/, validations.validate(field.validation)];
4856
5107
  case 3:
4857
- _q.sent();
5108
+ _t.sent();
4858
5109
  if (!field.validation.is_valid) {
4859
5110
  this.toggleErrorNotification(true);
4860
5111
  setTimeout(function () {
@@ -4862,20 +5113,20 @@
4862
5113
  }, 3000);
4863
5114
  return [2 /*return*/];
4864
5115
  }
4865
- _q.label = 4;
5116
+ _t.label = 4;
4866
5117
  case 4:
4867
5118
  _l = _k.next();
4868
5119
  return [3 /*break*/, 2];
4869
5120
  case 5: return [3 /*break*/, 8];
4870
5121
  case 6:
4871
- e_9_1 = _q.sent();
4872
- e_9 = { error: e_9_1 };
5122
+ e_10_1 = _t.sent();
5123
+ e_10 = { error: e_10_1 };
4873
5124
  return [3 /*break*/, 8];
4874
5125
  case 7:
4875
5126
  try {
4876
- if (_l && !_l.done && (_p = _k.return)) _p.call(_k);
5127
+ if (_l && !_l.done && (_r = _k.return)) _r.call(_k);
4877
5128
  }
4878
- finally { if (e_9) throw e_9.error; }
5129
+ finally { if (e_10) throw e_10.error; }
4879
5130
  return [7 /*endfinally*/];
4880
5131
  case 8:
4881
5132
  Object.keys(formData).map(function (key) {
@@ -4883,8 +5134,73 @@
4883
5134
  formData[key] = "";
4884
5135
  }
4885
5136
  });
4886
- this.onClickSaveForm.emit({ formConfig: this.formConfig, data: formData });
4887
- return [2 /*return*/];
5137
+ if (!(kwikidToolkit.checkObjectKeyExists(this.formConfig, "tasks") &&
5138
+ kwikidToolkit.checkObjectKeyExists(this.formConfig.tasks, "post"))) return [3 /*break*/, 18];
5139
+ _t.label = 9;
5140
+ case 9:
5141
+ _t.trys.push([9, 15, 16, 17]);
5142
+ _m = __values(this.formConfig.tasks.post), _o = _m.next();
5143
+ _t.label = 10;
5144
+ case 10:
5145
+ if (!!_o.done) return [3 /*break*/, 14];
5146
+ postTask = _o.value;
5147
+ task = new Tasks(postTask, {
5148
+ FORM_CONFIG: this.formConfig,
5149
+ FORM_FIELDS: this.formFields,
5150
+ FORM_DATA: this.formData,
5151
+ PREVIOUS_FORM_DATA: this.previousFormData,
5152
+ ALL_FORMS_DATA: this.allFormsData
5153
+ }, this.takeAction.bind(this));
5154
+ this.waitingForChanges = true;
5155
+ return [4 /*yield*/, task.execute()];
5156
+ case 11:
5157
+ _t.sent();
5158
+ // Wait for ngOnChanges to be called before continuing to the next task
5159
+ return [4 /*yield*/, new Promise(function (resolve) {
5160
+ var intervalId = setInterval(function () {
5161
+ if (!_this.waitingForChanges) {
5162
+ clearInterval(intervalId);
5163
+ resolve();
5164
+ }
5165
+ }, 10);
5166
+ })];
5167
+ case 12:
5168
+ // Wait for ngOnChanges to be called before continuing to the next task
5169
+ _t.sent();
5170
+ if (this.stopTaskExecution) {
5171
+ return [2 /*return*/];
5172
+ }
5173
+ _t.label = 13;
5174
+ case 13:
5175
+ _o = _m.next();
5176
+ return [3 /*break*/, 10];
5177
+ case 14: return [3 /*break*/, 17];
5178
+ case 15:
5179
+ e_11_1 = _t.sent();
5180
+ e_11 = { error: e_11_1 };
5181
+ return [3 /*break*/, 17];
5182
+ case 16:
5183
+ try {
5184
+ if (_o && !_o.done && (_s = _m.return)) _s.call(_m);
5185
+ }
5186
+ finally { if (e_11) throw e_11.error; }
5187
+ return [7 /*endfinally*/];
5188
+ case 17:
5189
+ if (this.stopTaskExecution) {
5190
+ return [2 /*return*/];
5191
+ }
5192
+ this.onClickSaveForm.emit({
5193
+ formConfig: this.formConfig,
5194
+ data: kwikidToolkit.mergeObjects(this.allFormsData[this.formConfig.key], formData, this.popupFormData, this.tasksData)
5195
+ });
5196
+ return [3 /*break*/, 19];
5197
+ case 18:
5198
+ this.onClickSaveForm.emit({
5199
+ formConfig: this.formConfig,
5200
+ data: kwikidToolkit.mergeObjects(this.allFormsData[this.formConfig.key], formData, this.popupFormData, this.tasksData)
5201
+ });
5202
+ _t.label = 19;
5203
+ case 19: return [2 /*return*/];
4888
5204
  }
4889
5205
  });
4890
5206
  });
@@ -4902,19 +5218,19 @@
4902
5218
  this.formGroup.updateValueAndValidity();
4903
5219
  };
4904
5220
  KwikIDFormViewComponent.prototype.fieldGroupHide = function (fieldGroup) {
4905
- var e_12, _h;
5221
+ var e_14, _h;
4906
5222
  try {
4907
5223
  for (var _j = __values(this.fieldGroups[fieldGroup]), _k = _j.next(); !_k.done; _k = _j.next()) {
4908
5224
  var fieldKey = _k.value;
4909
5225
  this.fieldHide(fieldKey);
4910
5226
  }
4911
5227
  }
4912
- catch (e_12_1) { e_12 = { error: e_12_1 }; }
5228
+ catch (e_14_1) { e_14 = { error: e_14_1 }; }
4913
5229
  finally {
4914
5230
  try {
4915
5231
  if (_k && !_k.done && (_h = _j.return)) _h.call(_j);
4916
5232
  }
4917
- finally { if (e_12) throw e_12.error; }
5233
+ finally { if (e_14) throw e_14.error; }
4918
5234
  }
4919
5235
  };
4920
5236
  KwikIDFormViewComponent.prototype.fieldShow = function (fieldKey) {
@@ -4926,19 +5242,19 @@
4926
5242
  this.formGroup.updateValueAndValidity();
4927
5243
  };
4928
5244
  KwikIDFormViewComponent.prototype.fieldGroupShow = function (fieldGroup) {
4929
- var e_13, _h;
5245
+ var e_15, _h;
4930
5246
  try {
4931
5247
  for (var _j = __values(this.fieldGroups[fieldGroup]), _k = _j.next(); !_k.done; _k = _j.next()) {
4932
5248
  var fieldKey = _k.value;
4933
5249
  this.fieldShow(fieldKey);
4934
5250
  }
4935
5251
  }
4936
- catch (e_13_1) { e_13 = { error: e_13_1 }; }
5252
+ catch (e_15_1) { e_15 = { error: e_15_1 }; }
4937
5253
  finally {
4938
5254
  try {
4939
5255
  if (_k && !_k.done && (_h = _j.return)) _h.call(_j);
4940
5256
  }
4941
- finally { if (e_13) throw e_13.error; }
5257
+ finally { if (e_15) throw e_15.error; }
4942
5258
  }
4943
5259
  };
4944
5260
  KwikIDFormViewComponent.prototype.fieldDisable = function (fieldKey) {
@@ -4957,19 +5273,19 @@
4957
5273
  }
4958
5274
  };
4959
5275
  KwikIDFormViewComponent.prototype.fieldGroupDisable = function (fieldGroup) {
4960
- var e_14, _h;
5276
+ var e_16, _h;
4961
5277
  try {
4962
5278
  for (var _j = __values(this.fieldGroups[fieldGroup]), _k = _j.next(); !_k.done; _k = _j.next()) {
4963
5279
  var fieldKey = _k.value;
4964
5280
  this.fieldDisable(fieldKey);
4965
5281
  }
4966
5282
  }
4967
- catch (e_14_1) { e_14 = { error: e_14_1 }; }
5283
+ catch (e_16_1) { e_16 = { error: e_16_1 }; }
4968
5284
  finally {
4969
5285
  try {
4970
5286
  if (_k && !_k.done && (_h = _j.return)) _h.call(_j);
4971
5287
  }
4972
- finally { if (e_14) throw e_14.error; }
5288
+ finally { if (e_16) throw e_16.error; }
4973
5289
  }
4974
5290
  };
4975
5291
  KwikIDFormViewComponent.prototype.fieldEnable = function (fieldKey) {
@@ -4988,19 +5304,19 @@
4988
5304
  }
4989
5305
  };
4990
5306
  KwikIDFormViewComponent.prototype.fieldGroupEnable = function (fieldGroup) {
4991
- var e_15, _h;
5307
+ var e_17, _h;
4992
5308
  try {
4993
5309
  for (var _j = __values(this.fieldGroups[fieldGroup]), _k = _j.next(); !_k.done; _k = _j.next()) {
4994
5310
  var fieldKey = _k.value;
4995
5311
  this.fieldEnable(fieldKey);
4996
5312
  }
4997
5313
  }
4998
- catch (e_15_1) { e_15 = { error: e_15_1 }; }
5314
+ catch (e_17_1) { e_17 = { error: e_17_1 }; }
4999
5315
  finally {
5000
5316
  try {
5001
5317
  if (_k && !_k.done && (_h = _j.return)) _h.call(_j);
5002
5318
  }
5003
- finally { if (e_15) throw e_15.error; }
5319
+ finally { if (e_17) throw e_17.error; }
5004
5320
  }
5005
5321
  };
5006
5322
  KwikIDFormViewComponent.prototype.fieldReset = function (fieldKey) {
@@ -5082,6 +5398,237 @@
5082
5398
  field = removeFormFieldMessage(field, message);
5083
5399
  this.formFields[fieldIndex] = field;
5084
5400
  };
5401
+ KwikIDFormViewComponent.prototype.setValue = function (action, object) {
5402
+ return __awaiter(this, void 0, void 0, function () {
5403
+ var source, sourceValue;
5404
+ return __generator(this, function (_h) {
5405
+ switch (_h.label) {
5406
+ case 0:
5407
+ source = new kwikidToolkit.Source(object);
5408
+ return [4 /*yield*/, source.getValueFromSource(action.props.value.source)];
5409
+ case 1:
5410
+ sourceValue = _h.sent();
5411
+ source.setValueToSource(action.props.value.destination, sourceValue);
5412
+ object.FIELD_CONFIG = source.object.FIELD_CONFIG;
5413
+ this.formData = source.object.FORM_DATA;
5414
+ this.patchFormGroup(this.formData);
5415
+ this.allFormsData = source.object.ALL_FORMS_DATA;
5416
+ this.previousFormData = source.object.PREVIOUS_FORM_DATA;
5417
+ return [2 /*return*/];
5418
+ }
5419
+ });
5420
+ });
5421
+ };
5422
+ KwikIDFormViewComponent.prototype.setFieldDefaultValue = function (action, object) {
5423
+ return __awaiter(this, void 0, void 0, function () {
5424
+ var source, sourceValue;
5425
+ return __generator(this, function (_h) {
5426
+ switch (_h.label) {
5427
+ case 0:
5428
+ source = new kwikidToolkit.Source(object);
5429
+ return [4 /*yield*/, source.getValueFromSource(action.props.value.source)];
5430
+ case 1:
5431
+ sourceValue = _h.sent();
5432
+ source.setValueToSource({
5433
+ key: kwikidToolkit.ESourceKey.OBJECT,
5434
+ props: {
5435
+ object: {
5436
+ key: "FIELD_CONFIG",
5437
+ path: "default.value.value"
5438
+ }
5439
+ }
5440
+ }, sourceValue);
5441
+ source.setValueToSource({
5442
+ key: kwikidToolkit.ESourceKey.OBJECT,
5443
+ props: {
5444
+ object: {
5445
+ key: "FORM_DATA",
5446
+ path: String(action.props.fieldKey)
5447
+ }
5448
+ }
5449
+ }, sourceValue);
5450
+ object.FIELD_CONFIG = source.object.FIELD_CONFIG;
5451
+ this.formData = source.object.FORM_DATA;
5452
+ this.patchFormGroup(this.formData);
5453
+ this.allFormsData = source.object.ALL_FORMS_DATA;
5454
+ this.previousFormData = source.object.PREVIOUS_FORM_DATA;
5455
+ return [2 /*return*/];
5456
+ }
5457
+ });
5458
+ });
5459
+ };
5460
+ KwikIDFormViewComponent.prototype.setDropdownOptions = function (action, object) {
5461
+ return __awaiter(this, void 0, void 0, function () {
5462
+ var source, sourceValue, appendToPath, appendToPathStr, optionsPath;
5463
+ return __generator(this, function (_h) {
5464
+ switch (_h.label) {
5465
+ case 0:
5466
+ source = new kwikidToolkit.Source(object);
5467
+ return [4 /*yield*/, source.getValueFromSource(action.props.value.source)];
5468
+ case 1:
5469
+ sourceValue = _h.sent();
5470
+ if (!kwikidToolkit.checkObjectKeyExists(action.props, "options")) return [3 /*break*/, 4];
5471
+ if (!kwikidToolkit.checkObjectKeyExists(action.props.options, "appendToPath")) return [3 /*break*/, 3];
5472
+ return [4 /*yield*/, source.getValueFromSource(action.props.options.appendToPath.source)];
5473
+ case 2:
5474
+ appendToPath = _h.sent();
5475
+ if (kwikidToolkit.isNotEmptyValue(appendToPath)) {
5476
+ appendToPathStr = kwikidToolkit.replaceString(appendToPath.match("" + action.props.options.appendToPath.filterSourceValue)[0], "[^a-zA-Z0-9_]", "_");
5477
+ optionsPath = "" + action.props.options.path + appendToPathStr;
5478
+ sourceValue = kwikidToolkit.getObjectValueFromPath(sourceValue, optionsPath);
5479
+ }
5480
+ return [3 /*break*/, 4];
5481
+ case 3:
5482
+ sourceValue = kwikidToolkit.getObjectValueFromPath(sourceValue, action.props.options.path);
5483
+ _h.label = 4;
5484
+ case 4:
5485
+ source.setValueToSource(action.props.value.destination, sourceValue);
5486
+ object.FIELD_CONFIG = source.object.FIELD_CONFIG;
5487
+ this.formData = source.object.FORM_DATA;
5488
+ this.allFormsData = source.object.ALL_FORMS_DATA;
5489
+ this.previousFormData = source.object.PREVIOUS_FORM_DATA;
5490
+ return [2 /*return*/];
5491
+ }
5492
+ });
5493
+ });
5494
+ };
5495
+ KwikIDFormViewComponent.prototype.fieldMultipleApiCalls = function (action, object) {
5496
+ return __awaiter(this, void 0, void 0, function () {
5497
+ var entrypointApiKey, field, endpoints, nextApiIndex, apiConfig, response;
5498
+ return __generator(this, function (_h) {
5499
+ switch (_h.label) {
5500
+ case 0:
5501
+ entrypointApiKey = action.props.apiKey;
5502
+ field = getFormFieldByKey(this.formFields, action.props.fieldKey);
5503
+ endpoints = field.api.endpoints;
5504
+ nextApiIndex = endpoints.findIndex(function (api) { return api.apiKey == entrypointApiKey; });
5505
+ apiConfig = endpoints[nextApiIndex];
5506
+ return [4 /*yield*/, this.handleFieldApiCall(field, apiConfig)];
5507
+ case 1:
5508
+ response = _h.sent();
5509
+ field = response.field;
5510
+ field.api.endpoints[nextApiIndex] = response.api;
5511
+ return [2 /*return*/];
5512
+ }
5513
+ });
5514
+ });
5515
+ };
5516
+ KwikIDFormViewComponent.prototype.fieldMultipleApiCallsEnd = function (action, object) {
5517
+ return __awaiter(this, void 0, void 0, function () {
5518
+ var field, multipleApiCallResponses;
5519
+ var _h;
5520
+ return __generator(this, function (_j) {
5521
+ field = getFormFieldByKey(this.formFields, action.props.fieldKey);
5522
+ multipleApiCallResponses = {};
5523
+ field.api.endpoints.map(function (api) {
5524
+ if (kwikidToolkit.checkObjectKeyExists(api.response, "value"))
5525
+ multipleApiCallResponses = kwikidToolkit.setValueToObjectPath(multipleApiCallResponses, "" + api.apiKey, api.response.value);
5526
+ });
5527
+ this.formData = Object.assign(Object.assign({}, this.formData), (_h = {}, _h[field.key] = multipleApiCallResponses, _h));
5528
+ this.patchFormGroup(this.formData);
5529
+ return [2 /*return*/];
5530
+ });
5531
+ });
5532
+ };
5533
+ KwikIDFormViewComponent.prototype.taskApiCall = function (action, object) {
5534
+ return __awaiter(this, void 0, void 0, function () {
5535
+ var apiConfig, response;
5536
+ var _h;
5537
+ return __generator(this, function (_j) {
5538
+ switch (_j.label) {
5539
+ case 0:
5540
+ this.showApiLoader();
5541
+ apiConfig = this.formConfig.apis[action.props.formApiKey];
5542
+ return [4 /*yield*/, this.handleTaskApiCall(apiConfig)];
5543
+ case 1:
5544
+ response = _j.sent();
5545
+ apiConfig = response.api;
5546
+ this.formConfig = kwikidToolkit.setValueToObjectPath(this.formConfig, "apis." + action.props.formApiKey, apiConfig);
5547
+ this.tasksData = kwikidToolkit.mergeObjects(this.tasksData, (_h = {},
5548
+ _h[action.props.formApiKey] = apiConfig.response.value,
5549
+ _h));
5550
+ this.waitingForChanges = false;
5551
+ this.hideApiLoader();
5552
+ return [2 /*return*/];
5553
+ }
5554
+ });
5555
+ });
5556
+ };
5557
+ KwikIDFormViewComponent.prototype.taskMultipleApiCalls = function (action, object) {
5558
+ return __awaiter(this, void 0, void 0, function () {
5559
+ var multipleApiConfig, entrypointApiKey_1, endpoints, nextApiIndex, apiConfig, response, apis;
5560
+ return __generator(this, function (_h) {
5561
+ switch (_h.label) {
5562
+ case 0:
5563
+ this.showApiLoader();
5564
+ multipleApiConfig = this.formConfig.apis[action.props.formApiKey];
5565
+ if (!kwikidToolkit.checkObjectKeyExists(action.props, "apiKey")) return [3 /*break*/, 2];
5566
+ entrypointApiKey_1 = action.props.apiKey;
5567
+ endpoints = multipleApiConfig.endpoints;
5568
+ nextApiIndex = endpoints.findIndex(function (api) { return api.apiKey == entrypointApiKey_1; });
5569
+ apiConfig = endpoints[nextApiIndex];
5570
+ return [4 /*yield*/, this.handleTaskApiCall(apiConfig)];
5571
+ case 1:
5572
+ response = _h.sent();
5573
+ multipleApiConfig.endpoints[nextApiIndex] = response.api;
5574
+ this.formConfig = kwikidToolkit.setValueToObjectPath(this.formConfig, "apis." + action.props.formApiKey, multipleApiConfig);
5575
+ this.hideApiLoader();
5576
+ return [3 /*break*/, 4];
5577
+ case 2:
5578
+ apis = new Apis({
5579
+ FORM_CONFIG: this.formConfig,
5580
+ API_CONFIG: multipleApiConfig,
5581
+ FORM_FIELDS: this.formFields,
5582
+ FORM_DATA: this.formData,
5583
+ PREVIOUS_FORM_DATA: this.previousFormData,
5584
+ ALL_FORMS_DATA: this.allFormsData
5585
+ }, this.takeAction.bind(this));
5586
+ return [4 /*yield*/, apis.callNextApi(multipleApiConfig.entrypoint)];
5587
+ case 3:
5588
+ _h.sent();
5589
+ _h.label = 4;
5590
+ case 4: return [2 /*return*/];
5591
+ }
5592
+ });
5593
+ });
5594
+ };
5595
+ KwikIDFormViewComponent.prototype.taskMultipleApiCallsEnd = function (action, object) {
5596
+ return __awaiter(this, void 0, void 0, function () {
5597
+ var multipleApiConfig, multipleApiCallResponses;
5598
+ var _h;
5599
+ return __generator(this, function (_j) {
5600
+ multipleApiConfig = this.formConfig.apis[action.props.formApiKey];
5601
+ multipleApiCallResponses = {};
5602
+ multipleApiConfig.endpoints.map(function (api) {
5603
+ if (kwikidToolkit.checkObjectKeyExists(api.response, "value"))
5604
+ multipleApiCallResponses = kwikidToolkit.setValueToObjectPath(multipleApiCallResponses, "" + api.apiKey, api.response.value);
5605
+ });
5606
+ this.tasksData = Object.assign(Object.assign({}, this.tasksData), (_h = {}, _h[action.props.formApiKey] = multipleApiCallResponses, _h));
5607
+ this.waitingForChanges = false;
5608
+ this.hideApiLoader();
5609
+ return [2 /*return*/];
5610
+ });
5611
+ });
5612
+ };
5613
+ KwikIDFormViewComponent.prototype.dialogShow = function (options) {
5614
+ var _a;
5615
+ this.dialogRef = this.dialogs
5616
+ .open(options === null || options === void 0 ? void 0 : options.html, {
5617
+ closeable: true,
5618
+ dismissible: true,
5619
+ label: options === null || options === void 0 ? void 0 : options.label,
5620
+ size: (_a = options === null || options === void 0 ? void 0 : options.size) !== null && _a !== void 0 ? _a : "s",
5621
+ data: { button: options === null || options === void 0 ? void 0 : options.button }
5622
+ })
5623
+ .subscribe({
5624
+ complete: function () { }
5625
+ });
5626
+ };
5627
+ KwikIDFormViewComponent.prototype.dialogHide = function () {
5628
+ if (this.dialogRef) {
5629
+ this.dialogRef.complete();
5630
+ }
5631
+ };
5085
5632
  KwikIDFormViewComponent.prototype.patchFieldControlValue = function (key, value) {
5086
5633
  var _h;
5087
5634
  this.formGroup.patchValue((_h = {},
@@ -5113,6 +5660,25 @@
5113
5660
  KwikIDFormViewComponent.prototype.getFormGroupRawValues = function () {
5114
5661
  return this.formGroup.getRawValue();
5115
5662
  };
5663
+ KwikIDFormViewComponent.prototype.showPreview = function (previewProperties) {
5664
+ this.previewProperties = kwikidToolkit.mergeObjects(this.previewProperties, previewProperties);
5665
+ if (kwikidToolkit.isEmptyValue(this.previewProperties.iframe.src) &&
5666
+ kwikidToolkit.isEmptyValue(this.previewProperties.html.before) &&
5667
+ kwikidToolkit.isEmptyValue(this.previewProperties.html.after)) {
5668
+ this.previewProperties.unavailable = true;
5669
+ }
5670
+ else {
5671
+ this.previewProperties.unavailable = false;
5672
+ }
5673
+ this.previewDialogService.open(this.preview || "").subscribe();
5674
+ };
5675
+ KwikIDFormViewComponent.prototype.showPopupForm = function (popupFormKey) {
5676
+ var popupFormConfig = this.formConfig.popupForms[popupFormKey];
5677
+ this.onActionShowPopupForm.emit({
5678
+ activeFormData: kwikidToolkit.mergeObjects(this.formData, this.tasksData),
5679
+ popupFormConfig: popupFormConfig
5680
+ });
5681
+ };
5116
5682
  KwikIDFormViewComponent.prototype.takeActionOnFieldGroup = function (action, object) {
5117
5683
  return __awaiter(this, void 0, void 0, function () {
5118
5684
  return __generator(this, function (_h) {
@@ -5137,11 +5703,11 @@
5137
5703
  });
5138
5704
  };
5139
5705
  KwikIDFormViewComponent.prototype.takeAction = function (action, object) {
5706
+ var _a, _b, _c, _d;
5140
5707
  return __awaiter(this, void 0, void 0, function () {
5141
- var _h, fieldErrorShow_Source, fieldErrorShowSourceValue, setValue_Source, sourceValue, setDefaultValue_Source, sourceDefaultValue, destinationDefaultValue_FieldConfig_Config, destinationDefaultValue_FormData_Config__Props__Object__Path, destinationDefaultValue_FormData_Config, setDropdownValue_Sources, dropdownValue, appendToPath, appendToPathStr, optionsPath, entrypointKey_1, apiField, endpoints, nextApiIndex, response, field, apiCallResponses_1;
5142
- var _j;
5143
- return __generator(this, function (_k) {
5144
- switch (_k.label) {
5708
+ var _h, fieldErrorShow_Source, fieldErrorShowSourceValue;
5709
+ return __generator(this, function (_j) {
5710
+ switch (_j.label) {
5145
5711
  case 0:
5146
5712
  _h = action.key;
5147
5713
  switch (_h) {
@@ -5157,33 +5723,45 @@
5157
5723
  case EActionKey.SET_VALUE: return [3 /*break*/, 12];
5158
5724
  case EActionKey.SET_FIELD_DEFAULT_VALUE: return [3 /*break*/, 14];
5159
5725
  case EActionKey.SET_DROPDOWN_OPTIONS: return [3 /*break*/, 16];
5160
- case EActionKey.HANDLE_CONNECTED_ELEMENTS: return [3 /*break*/, 21];
5161
- case EActionKey.CUSTOM: return [3 /*break*/, 22];
5162
- case EActionKey.API_CALL: return [3 /*break*/, 23];
5163
- case EActionKey.API_CALL_END: return [3 /*break*/, 25];
5726
+ case EActionKey.HANDLE_CONNECTED_ELEMENTS: return [3 /*break*/, 18];
5727
+ case EActionKey.API_CALL: return [3 /*break*/, 19];
5728
+ case EActionKey.API_CALL_MULTIPLE: return [3 /*break*/, 20];
5729
+ case EActionKey.API_CALL_MULTIPLE_END: return [3 /*break*/, 22];
5730
+ case EActionKey.TASK_API_CALL: return [3 /*break*/, 24];
5731
+ case EActionKey.TASK_API_CALL_MULTIPLE: return [3 /*break*/, 26];
5732
+ case EActionKey.TASK_API_CALL_MULTIPLE_END: return [3 /*break*/, 28];
5733
+ case EActionKey.PREVIEW_DIALOG_SHOW: return [3 /*break*/, 30];
5734
+ case EActionKey.POPUP_FORM_SHOW: return [3 /*break*/, 31];
5735
+ case EActionKey.MOVE_AHEAD: return [3 /*break*/, 32];
5736
+ case EActionKey.NOTIFICATION_ERROR_SHOW: return [3 /*break*/, 33];
5737
+ case EActionKey.NOTIFICATION_ERROR_HIDE: return [3 /*break*/, 34];
5738
+ case EActionKey.RESUME_TASK_EXECUTION: return [3 /*break*/, 35];
5739
+ case EActionKey.STOP_TASK_EXECUTION: return [3 /*break*/, 36];
5740
+ case EActionKey.DIALOG_SHOW: return [3 /*break*/, 37];
5741
+ case EActionKey.DIALOG_HIDE: return [3 /*break*/, 38];
5164
5742
  }
5165
- return [3 /*break*/, 26];
5743
+ return [3 /*break*/, 39];
5166
5744
  case 1:
5167
5745
  this.fieldHide(action.props.fieldKey);
5168
- return [3 /*break*/, 27];
5746
+ return [3 /*break*/, 40];
5169
5747
  case 2:
5170
5748
  this.fieldShow(action.props.fieldKey);
5171
- return [3 /*break*/, 27];
5749
+ return [3 /*break*/, 40];
5172
5750
  case 3:
5173
5751
  this.fieldDisable(action.props.fieldKey);
5174
- return [3 /*break*/, 27];
5752
+ return [3 /*break*/, 40];
5175
5753
  case 4:
5176
5754
  this.fieldEnable(action.props.fieldKey);
5177
- return [3 /*break*/, 27];
5755
+ return [3 /*break*/, 40];
5178
5756
  case 5:
5179
5757
  this.fieldReset(action.props.fieldKey);
5180
- return [3 /*break*/, 27];
5758
+ return [3 /*break*/, 40];
5181
5759
  case 6:
5182
5760
  if (!kwikidToolkit.checkObjectKeyExists(action.props.message, "source")) return [3 /*break*/, 8];
5183
5761
  fieldErrorShow_Source = new kwikidToolkit.Source(object);
5184
5762
  return [4 /*yield*/, fieldErrorShow_Source.getValueFromSource(action.props.message.source)];
5185
5763
  case 7:
5186
- fieldErrorShowSourceValue = _k.sent();
5764
+ fieldErrorShowSourceValue = _j.sent();
5187
5765
  if (typeof fieldErrorShowSourceValue == "string" ||
5188
5766
  typeof fieldErrorShowSourceValue == "number") {
5189
5767
  fieldErrorShowSourceValue = String(fieldErrorShowSourceValue);
@@ -5192,126 +5770,97 @@
5192
5770
  fieldErrorShowSourceValue = "";
5193
5771
  }
5194
5772
  action = kwikidToolkit.setValueToObjectPath(action, "props.message.message", fieldErrorShowSourceValue);
5195
- _k.label = 8;
5773
+ _j.label = 8;
5196
5774
  case 8:
5197
5775
  this.fieldErrorShow(action.props.fieldKey, action.props.message);
5198
- return [3 /*break*/, 27];
5776
+ return [3 /*break*/, 40];
5199
5777
  case 9:
5200
5778
  this.fieldErrorHide(action.props.fieldKey, action.props.message);
5201
- return [3 /*break*/, 27];
5779
+ return [3 /*break*/, 40];
5202
5780
  case 10:
5203
5781
  this.fieldMessageShow(action.props.fieldKey, action.props.message);
5204
- return [3 /*break*/, 27];
5782
+ return [3 /*break*/, 40];
5205
5783
  case 11:
5206
5784
  this.fieldMessageHide(action.props.fieldKey, action.props.message);
5207
- return [3 /*break*/, 27];
5208
- case 12:
5209
- setValue_Source = new kwikidToolkit.Source(object);
5210
- return [4 /*yield*/, setValue_Source.getValueFromSource(action.props.value.source)];
5785
+ return [3 /*break*/, 40];
5786
+ case 12: return [4 /*yield*/, this.setValue(action, object)];
5211
5787
  case 13:
5212
- sourceValue = _k.sent();
5213
- setValue_Source.setValueToSource(action.props.value.destination, sourceValue);
5214
- object.FIELD_CONFIG = setValue_Source.object.FIELD_CONFIG;
5215
- this.formData = setValue_Source.object.FORM_DATA;
5216
- this.patchFormGroup(this.formData);
5217
- this.allFormsData = setValue_Source.object.ALL_FORMS_DATA;
5218
- this.previousFormData = setValue_Source.object.PREVIOUS_FORM_DATA;
5219
- return [3 /*break*/, 27];
5220
- case 14:
5221
- setDefaultValue_Source = new kwikidToolkit.Source(object);
5222
- return [4 /*yield*/, setDefaultValue_Source.getValueFromSource(action.props.value.source)];
5788
+ _j.sent();
5789
+ return [3 /*break*/, 40];
5790
+ case 14: return [4 /*yield*/, this.setFieldDefaultValue(action, object)];
5223
5791
  case 15:
5224
- sourceDefaultValue = _k.sent();
5225
- destinationDefaultValue_FieldConfig_Config = {
5226
- key: kwikidToolkit.ESourceKey.OBJECT,
5227
- props: {
5228
- object: {
5229
- key: "FIELD_CONFIG",
5230
- path: "default.value.value"
5231
- }
5232
- }
5233
- };
5234
- setDefaultValue_Source.setValueToSource(destinationDefaultValue_FieldConfig_Config, sourceDefaultValue);
5235
- destinationDefaultValue_FormData_Config__Props__Object__Path = String("" + action.props.fieldKey);
5236
- destinationDefaultValue_FormData_Config = {
5237
- key: kwikidToolkit.ESourceKey.OBJECT,
5238
- props: {
5239
- object: {
5240
- key: "FORM_DATA",
5241
- path: String(action.props.fieldKey)
5242
- }
5243
- }
5244
- };
5245
- setDefaultValue_Source.setValueToSource(destinationDefaultValue_FormData_Config, sourceDefaultValue);
5246
- object.FIELD_CONFIG = setDefaultValue_Source.object.FIELD_CONFIG;
5247
- this.formData = setDefaultValue_Source.object.FORM_DATA;
5248
- this.patchFormGroup(this.formData);
5249
- this.allFormsData = setDefaultValue_Source.object.ALL_FORMS_DATA;
5250
- this.previousFormData =
5251
- setDefaultValue_Source.object.PREVIOUS_FORM_DATA;
5252
- return [3 /*break*/, 27];
5253
- case 16:
5254
- setDropdownValue_Sources = new kwikidToolkit.Source(object);
5255
- return [4 /*yield*/, setDropdownValue_Sources.getValueFromSource(action.props.value.source)];
5792
+ _j.sent();
5793
+ return [3 /*break*/, 40];
5794
+ case 16: return [4 /*yield*/, this.setDropdownOptions(action, object)];
5256
5795
  case 17:
5257
- dropdownValue = _k.sent();
5258
- if (!kwikidToolkit.checkObjectKeyExists(action.props, "options")) return [3 /*break*/, 20];
5259
- if (!kwikidToolkit.checkObjectKeyExists(action.props.options, "appendToPath")) return [3 /*break*/, 19];
5260
- return [4 /*yield*/, setDropdownValue_Sources.getValueFromSource(action.props.options.appendToPath.source)];
5796
+ _j.sent();
5797
+ return [3 /*break*/, 40];
5261
5798
  case 18:
5262
- appendToPath = _k.sent();
5263
- if (kwikidToolkit.isNotEmptyValue(appendToPath)) {
5264
- appendToPathStr = kwikidToolkit.replaceString(appendToPath.match("" + action.props.options.appendToPath.filterSourceValue)[0], "[^a-zA-Z0-9_]", "_");
5265
- optionsPath = "" + action.props.options.path + appendToPathStr;
5266
- dropdownValue = kwikidToolkit.getObjectValueFromPath(dropdownValue, optionsPath);
5267
- }
5268
- return [3 /*break*/, 20];
5269
- case 19:
5270
- dropdownValue = kwikidToolkit.getObjectValueFromPath(dropdownValue, action.props.options.path);
5271
- _k.label = 20;
5272
- case 20:
5273
- setDropdownValue_Sources.setValueToSource(action.props.value.destination, dropdownValue);
5274
- object.FIELD_CONFIG = setDropdownValue_Sources.object.FIELD_CONFIG;
5275
- this.formData = setDropdownValue_Sources.object.FORM_DATA;
5276
- this.allFormsData = setDropdownValue_Sources.object.ALL_FORMS_DATA;
5277
- this.previousFormData =
5278
- setDropdownValue_Sources.object.PREVIOUS_FORM_DATA;
5279
- return [3 /*break*/, 27];
5280
- case 21:
5281
5799
  this.handleConnectedElements({ key: action.props.fieldKey }, "ON_ACTION");
5282
- return [3 /*break*/, 27];
5283
- case 22: return [3 /*break*/, 27];
5800
+ return [3 /*break*/, 40];
5801
+ case 19: return [3 /*break*/, 40];
5802
+ case 20: return [4 /*yield*/, this.fieldMultipleApiCalls(action, object)];
5803
+ case 21:
5804
+ _j.sent();
5805
+ return [3 /*break*/, 40];
5806
+ case 22: return [4 /*yield*/, this.fieldMultipleApiCallsEnd(action, object)];
5284
5807
  case 23:
5285
- entrypointKey_1 = action.props.apiKey;
5286
- apiField = getFormFieldByKey(this.formFields, action.props.fieldKey);
5287
- endpoints = apiField.api.endpoints;
5288
- nextApiIndex = endpoints.findIndex(function (api) { return api.apiKey == entrypointKey_1; });
5289
- return [4 /*yield*/, this.handleApiCall(apiField, endpoints[nextApiIndex])];
5290
- case 24:
5291
- response = _k.sent();
5292
- apiField = response.field;
5293
- apiField.api.endpoints[nextApiIndex] = response.api;
5294
- return [3 /*break*/, 27];
5808
+ _j.sent();
5809
+ return [3 /*break*/, 40];
5810
+ case 24: return [4 /*yield*/, this.taskApiCall(action, object)];
5295
5811
  case 25:
5296
- field = getFormFieldByKey(this.formFields, action.props.fieldKey);
5297
- apiCallResponses_1 = {};
5298
- field.api.endpoints.map(function (api) {
5299
- if (kwikidToolkit.checkObjectKeyExists(api.response, "value"))
5300
- apiCallResponses_1 = kwikidToolkit.setMissingKeyValue(apiCallResponses_1, api.apiKey, api.response.value);
5812
+ _j.sent();
5813
+ return [3 /*break*/, 40];
5814
+ case 26: return [4 /*yield*/, this.taskMultipleApiCalls(action, object)];
5815
+ case 27:
5816
+ _j.sent();
5817
+ return [3 /*break*/, 40];
5818
+ case 28: return [4 /*yield*/, this.taskMultipleApiCallsEnd(action, object)];
5819
+ case 29:
5820
+ _j.sent();
5821
+ return [3 /*break*/, 40];
5822
+ case 30:
5823
+ this.showPreview(action.props);
5824
+ return [3 /*break*/, 40];
5825
+ case 31:
5826
+ this.showPopupForm(action.props.popupFormKey);
5827
+ return [3 /*break*/, 40];
5828
+ case 32:
5829
+ this.waitingForChanges = false;
5830
+ return [3 /*break*/, 40];
5831
+ case 33:
5832
+ this.toggleErrorNotification(true);
5833
+ return [3 /*break*/, 40];
5834
+ case 34:
5835
+ this.toggleErrorNotification(false);
5836
+ return [3 /*break*/, 40];
5837
+ case 35:
5838
+ this.stopTaskExecution = false;
5839
+ return [3 /*break*/, 40];
5840
+ case 36:
5841
+ this.stopTaskExecution = true;
5842
+ return [3 /*break*/, 40];
5843
+ case 37:
5844
+ this.dialogShow({
5845
+ html: (_a = action.props) === null || _a === void 0 ? void 0 : _a.html,
5846
+ label: (_b = action.props) === null || _b === void 0 ? void 0 : _b.label,
5847
+ size: (_c = action.props) === null || _c === void 0 ? void 0 : _c.size,
5848
+ button: (_d = action.props) === null || _d === void 0 ? void 0 : _d.button
5301
5849
  });
5302
- this.formData = Object.assign(Object.assign({}, this.formData), (_j = {}, _j[field.key] = apiCallResponses_1, _j));
5303
- this.patchFormGroup(this.formData);
5304
- return [3 /*break*/, 27];
5305
- case 26: return [3 /*break*/, 27];
5306
- case 27: return [2 /*return*/];
5850
+ return [3 /*break*/, 40];
5851
+ case 38:
5852
+ this.dialogHide();
5853
+ return [3 /*break*/, 40];
5854
+ case 39: return [3 /*break*/, 40];
5855
+ case 40: return [2 /*return*/];
5307
5856
  }
5308
5857
  });
5309
5858
  });
5310
5859
  };
5311
5860
  return KwikIDFormViewComponent;
5312
5861
  }());
5313
- /** @nocollapse */ KwikIDFormViewComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormViewComponent, deps: [{ token: i4$1.TuiPushService }, { token: i3.TuiAlertService }, { token: KwikIDFormViewService }], target: i0__namespace.ɵɵFactoryTarget.Component });
5314
- /** @nocollapse */ KwikIDFormViewComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormViewComponent, selector: "kwikid-form-view", inputs: { formConfig: "formConfig", formData: "formData", isMobileView: "isMobileView", allFormsData: "allFormsData" }, outputs: { onClickViewForms: "onClickViewForms", onClickSaveForm: "onClickSaveForm", onClickApiCall: "onClickApiCall" }, providers: [KwikIDFormViewService], usesOnChanges: true, ngImport: i0__namespace, 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 \"\n >\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 {{ formConfig.formsListLength }}</div\n >\n <hr\n *ngIf=\"\n !formConfig.properties.header.title.hidden &&\n !formConfig.properties.header.steps.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 | safeHtml\"></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-block\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 [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-checkbox-block>\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-radio-list\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-radio-list>\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=\"'dropdown-with-search'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-select-combobox\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-select-combobox>\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-call'\">\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 shape=\"null\"\n size=\"m\"\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 [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=\"'preview-image'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-preview-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-preview-image>\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 id=\"\"\n label=\"{{ formConfig.properties.footer.viewFormsButton.label }}\"\n [showLoader]=\"viewFormsButton.showLoader\"\n styles=\"\"\n class=\"\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"null\"\n size=\"m\"\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 id=\"\"\n label=\"{{ formConfig.properties.footer.saveButton.label }}\"\n [showLoader]=\"saveFormButton.showLoader\"\n styles=\"\"\n class=\"\"\n type=\"button\"\n appearance=\"primary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"null\"\n size=\"m\"\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 class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n</div>\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", styles: ["::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{border-radius:10px}::-webkit-scrollbar-thumb{background:lightgray;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:gray}.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:.5rem;row-gap:.5rem;padding:1rem}#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:1em}.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}\n"], components: [{ type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIMessagesComponent, selector: "kwikui-messages", inputs: ["messages", "id"] }, { type: i1__namespace.KwikUITextareaComponent, selector: "kwikui-textarea", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "size", "placeholder", "properties", "validators"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUICheckboxBlockComponent, selector: "kwikui-checkbox-block", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "size", "contentAlign", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.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: i1__namespace.KwikUIInputDateComponent, selector: "kwikui-input-date", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "min", "minCalculatedFromToday", "max", "maxCalculatedFromToday", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIInputPhoneComponent, selector: "kwikui-input-phone", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "countryCode", "phoneMaskAfterCountryCode", "removeCountryCodeFromValue", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i3__namespace.TuiLabelComponent, selector: "label[tuiLabel]", inputs: ["tuiLabel", "context"] }, { type: i1__namespace.KwikUIRadioListComponent, selector: "kwikui-radio-list", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "size", "orientation", "items", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUISelectComboboxComponent, selector: "kwikui-select-combobox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.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: i1__namespace.KwikUIButtonApiCallComponent, selector: "kwikui-button-api-call", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "shape", "size", "apiStatus"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputOtpComponent, selector: "kwikui-input-otp", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "placeholder", "mask", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIInputAadhaarComponent, selector: "kwikui-input-aadhaar", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "placeholder", "mask", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIPreviewImageComponent, selector: "kwikui-preview-image", inputs: ["id", "imageSrc", "altText", "imageType", "styles", "class", "loadingType", "html"], outputs: ["onClick"] }, { type: i4__namespace$1.TuiPushComponent, selector: "tui-push", inputs: ["heading", "type", "timestamp"], outputs: ["close"] }, { type: i3__namespace.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i4__namespace$1.TuiPushDirective, selector: "tui-push" }], pipes: { "safeHtml": SafeHtmlPipe$1 } });
5862
+ /** @nocollapse */ KwikIDFormViewComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormViewComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: KwikIDFormViewService }, { token: i4$1.TuiPushService }, { token: i3$1.TuiAlertService }, { token: i5.TuiPreviewDialogService }, { token: i3$1.TuiDialogService }], target: i0__namespace.ɵɵFactoryTarget.Component });
5863
+ /** @nocollapse */ KwikIDFormViewComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormViewComponent, selector: "kwikid-form-view", inputs: { formConfig: "formConfig", formData: "formData", isMobileView: "isMobileView", allFormsData: "allFormsData", popupFormCallback: "popupFormCallback" }, outputs: { onClickGoBack: "onClickGoBack", onClickViewForms: "onClickViewForms", onClickSaveForm: "onClickSaveForm", onClickApiCall: "onClickApiCall", onActionShowPopupForm: "onActionShowPopupForm" }, providers: [KwikIDFormViewService], viewQueries: [{ propertyName: "preview", first: true, predicate: ["preview"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, 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-icon\n *ngIf=\"\n !formConfig.properties?.header.backButton.hidden && isMobileView\n \"\n [disabled]=\"backButton.disabled\"\n id=\"\"\n [showLoader]=\"backButton.showLoader\"\n styles=\"\"\n class=\"\"\n type=\"submit\"\n appearance=\"mono\"\n icon=\"tuiIconArrowLeft\"\n shape=\"rounded\"\n size=\"m\"\n (onClick)=\"\n handleOnClickGoBack(\n $event,\n formConfig.properties?.header.backButton.mode\n )\n \"\n ></kwikui-button-icon>\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 | safeHtml\"></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-block\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 [validators]=\"field?.validators\"\n (getKeyValue)=\"handleGetKeyValue($event)\"\n ></kwikui-checkbox-block>\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-radio-list\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-radio-list>\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=\"'dropdown-with-search'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-select-combobox\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-select-combobox>\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-call'\">\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 shape=\"null\"\n size=\"m\"\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 [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=\"'preview-image'\">\n <div\n [hidden]=\"field?.hidden\"\n id=\"field_{{ field.key }}\"\n >\n <kwikui-preview-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-preview-image>\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 id=\"\"\n label=\"{{ formConfig.properties.footer.viewFormsButton.label }}\"\n [showLoader]=\"viewFormsButton.showLoader\"\n styles=\"\"\n class=\"\"\n type=\"button\"\n appearance=\"secondary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"null\"\n size=\"m\"\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 id=\"\"\n label=\"{{ formConfig.properties.footer.saveButton.label }}\"\n [showLoader]=\"saveFormButton.showLoader\"\n styles=\"\"\n class=\"\"\n type=\"button\"\n appearance=\"primary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"null\"\n size=\"m\"\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 class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n <div\n class=\"large-wrapper\"\n [class.tui-skeleton]=\"loading\"\n [class.tui-skeleton_rounded]=\"loading\"\n >\n </div>\n</div>\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 [innerHtml]=\"previewProperties.html.before | safeHtml\"\n ></div>\n\n <iframe\n *ngIf=\"previewProperties.iframe.src !== ''\"\n [src]=\"previewProperties.iframe.src | safeUrl\"\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 ></iframe>\n\n <div\n *ngIf=\"previewProperties?.html?.after !== ''\"\n [innerHtml]=\"previewProperties.html.after | safeHtml\"\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", styles: ["::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{border-radius:10px}::-webkit-scrollbar-thumb{background:lightgray;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:gray}.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:.5rem;row-gap:.5rem;padding:1rem}#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:1em}.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!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}\n"], components: [{ type: i1__namespace.KwikUIButtonIconComponent, selector: "kwikui-button-icon", inputs: ["disabled", "id", "showLoader", "styles", "class", "type", "appearance", "icon", "shape", "size"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputComponent, selector: "kwikui-input", inputs: ["label", "id", "type", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "validators", "case", "size", "icon", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIMessagesComponent, selector: "kwikui-messages", inputs: ["messages", "id"] }, { type: i1__namespace.KwikUITextareaComponent, selector: "kwikui-textarea", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "size", "placeholder", "properties", "validators"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUICheckboxBlockComponent, selector: "kwikui-checkbox-block", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "size", "contentAlign", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.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: i1__namespace.KwikUIInputDateComponent, selector: "kwikui-input-date", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "min", "minCalculatedFromToday", "max", "maxCalculatedFromToday", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIInputPhoneComponent, selector: "kwikui-input-phone", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "countryCode", "phoneMaskAfterCountryCode", "removeCountryCodeFromValue", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i3__namespace$1.TuiLabelComponent, selector: "label[tuiLabel]", inputs: ["tuiLabel", "context"] }, { type: i1__namespace.KwikUIRadioListComponent, selector: "kwikui-radio-list", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "size", "orientation", "items", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUISelectComboboxComponent, selector: "kwikui-select-combobox", inputs: ["label", "id", "formControlName", "formControl", "placeholder", "focus", "invalid", "disabled", "options", "size", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.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: i1__namespace.KwikUIButtonApiCallComponent, selector: "kwikui-button-api-call", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "shape", "size", "apiStatus"], outputs: ["onClick"] }, { type: i1__namespace.KwikUIInputOtpComponent, selector: "kwikui-input-otp", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "placeholder", "mask", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIInputAadhaarComponent, selector: "kwikui-input-aadhaar", inputs: ["label", "id", "formControlName", "formControl", "focus", "invalid", "disabled", "placeholder", "mask", "validators", "properties"], outputs: ["getKeyValue"] }, { type: i1__namespace.KwikUIPreviewImageComponent, selector: "kwikui-preview-image", inputs: ["id", "imageSrc", "altText", "imageType", "styles", "class", "loadingType", "html"], outputs: ["onClick"] }, { type: i4__namespace$1.TuiPushComponent, selector: "tui-push", inputs: ["heading", "type", "timestamp"], outputs: ["close"] }, { type: i3__namespace$1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i5__namespace.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { type: i5__namespace.TuiPreviewTitleComponent, selector: "tui-preview-title" }, { type: i3__namespace$1.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2__namespace.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2__namespace.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i2__namespace.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2__namespace.FormControlDirective, selector: "[formControl]", inputs: ["disabled", "formControl", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i2__namespace.FormControlName, selector: "[formControlName]", inputs: ["disabled", "formControlName", "ngModel"], outputs: ["ngModelChange"] }, { type: i4__namespace$1.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i4__namespace$1.TuiPushDirective, selector: "tui-push" }, { type: i5__namespace.TuiPreviewActionDirective, selector: "[tuiPreviewAction]" }], pipes: { "safeHtml": SafeHtmlPipe$1, "safeUrl": SafeUrlPipe } });
5315
5864
  __decorate([
5316
5865
  kwikidToolkit.logMethod
5317
5866
  ], KwikIDFormViewComponent.prototype, "ngOnInit", null);
@@ -5354,12 +5903,21 @@
5354
5903
  __decorate([
5355
5904
  kwikidToolkit.logMethod
5356
5905
  ], KwikIDFormViewComponent.prototype, "handleOnClickResetFormFields", null);
5906
+ __decorate([
5907
+ kwikidToolkit.logMethod
5908
+ ], KwikIDFormViewComponent.prototype, "handleFieldApiCall", null);
5909
+ __decorate([
5910
+ kwikidToolkit.logMethod
5911
+ ], KwikIDFormViewComponent.prototype, "handleTaskApiCall", null);
5357
5912
  __decorate([
5358
5913
  kwikidToolkit.logMethod
5359
5914
  ], KwikIDFormViewComponent.prototype, "handleApiCall", null);
5360
5915
  __decorate([
5361
5916
  kwikidToolkit.logMethod
5362
5917
  ], KwikIDFormViewComponent.prototype, "handleOnClickApiCall", null);
5918
+ __decorate([
5919
+ kwikidToolkit.logMethod
5920
+ ], KwikIDFormViewComponent.prototype, "handleOnClickGoBack", null);
5363
5921
  __decorate([
5364
5922
  kwikidToolkit.logMethod
5365
5923
  ], KwikIDFormViewComponent.prototype, "handleOnClickViewForms", null);
@@ -5408,6 +5966,36 @@
5408
5966
  __decorate([
5409
5967
  kwikidToolkit.logMethod
5410
5968
  ], KwikIDFormViewComponent.prototype, "fieldMessageHide", null);
5969
+ __decorate([
5970
+ kwikidToolkit.logMethod
5971
+ ], KwikIDFormViewComponent.prototype, "setValue", null);
5972
+ __decorate([
5973
+ kwikidToolkit.logMethod
5974
+ ], KwikIDFormViewComponent.prototype, "setFieldDefaultValue", null);
5975
+ __decorate([
5976
+ kwikidToolkit.logMethod
5977
+ ], KwikIDFormViewComponent.prototype, "setDropdownOptions", null);
5978
+ __decorate([
5979
+ kwikidToolkit.logMethod
5980
+ ], KwikIDFormViewComponent.prototype, "fieldMultipleApiCalls", null);
5981
+ __decorate([
5982
+ kwikidToolkit.logMethod
5983
+ ], KwikIDFormViewComponent.prototype, "fieldMultipleApiCallsEnd", null);
5984
+ __decorate([
5985
+ kwikidToolkit.logMethod
5986
+ ], KwikIDFormViewComponent.prototype, "taskApiCall", null);
5987
+ __decorate([
5988
+ kwikidToolkit.logMethod
5989
+ ], KwikIDFormViewComponent.prototype, "taskMultipleApiCalls", null);
5990
+ __decorate([
5991
+ kwikidToolkit.logMethod
5992
+ ], KwikIDFormViewComponent.prototype, "taskMultipleApiCallsEnd", null);
5993
+ __decorate([
5994
+ kwikidToolkit.logMethod
5995
+ ], KwikIDFormViewComponent.prototype, "dialogShow", null);
5996
+ __decorate([
5997
+ kwikidToolkit.logMethod
5998
+ ], KwikIDFormViewComponent.prototype, "dialogHide", null);
5411
5999
  __decorate([
5412
6000
  kwikidToolkit.logMethod
5413
6001
  ], KwikIDFormViewComponent.prototype, "patchFieldControlValue", null);
@@ -5423,6 +6011,12 @@
5423
6011
  __decorate([
5424
6012
  kwikidToolkit.logMethod
5425
6013
  ], KwikIDFormViewComponent.prototype, "getFormGroupRawValues", null);
6014
+ __decorate([
6015
+ kwikidToolkit.logMethod
6016
+ ], KwikIDFormViewComponent.prototype, "showPreview", null);
6017
+ __decorate([
6018
+ kwikidToolkit.logMethod
6019
+ ], KwikIDFormViewComponent.prototype, "showPopupForm", null);
5426
6020
  __decorate([
5427
6021
  kwikidToolkit.logMethod
5428
6022
  ], KwikIDFormViewComponent.prototype, "takeActionOnFieldGroup", null);
@@ -5438,14 +6032,23 @@
5438
6032
  providers: [KwikIDFormViewService]
5439
6033
  }]
5440
6034
  }], ctorParameters: function () {
5441
- return [{ type: i4__namespace$1.TuiPushService, decorators: [{
6035
+ return [{ type: i0__namespace.ChangeDetectorRef }, { type: KwikIDFormViewService }, { type: i4__namespace$1.TuiPushService, decorators: [{
5442
6036
  type: i0.Inject,
5443
6037
  args: [i4$1.TuiPushService]
5444
- }] }, { type: i3__namespace.TuiAlertService, decorators: [{
6038
+ }] }, { type: i3__namespace$1.TuiAlertService, decorators: [{
5445
6039
  type: i0.Inject,
5446
- args: [i3.TuiAlertService]
5447
- }] }, { type: KwikIDFormViewService }];
5448
- }, propDecorators: { formConfig: [{
6040
+ args: [i3$1.TuiAlertService]
6041
+ }] }, { type: i5__namespace.TuiPreviewDialogService, decorators: [{
6042
+ type: i0.Inject,
6043
+ args: [i5.TuiPreviewDialogService]
6044
+ }] }, { type: i3__namespace$1.TuiDialogService, decorators: [{
6045
+ type: i0.Inject,
6046
+ args: [i3$1.TuiDialogService]
6047
+ }] }];
6048
+ }, propDecorators: { preview: [{
6049
+ type: i0.ViewChild,
6050
+ args: ["preview"]
6051
+ }], formConfig: [{
5449
6052
  type: i0.Input
5450
6053
  }], formData: [{
5451
6054
  type: i0.Input
@@ -5453,13 +6056,19 @@
5453
6056
  type: i0.Input
5454
6057
  }], allFormsData: [{
5455
6058
  type: i0.Input
6059
+ }], popupFormCallback: [{
6060
+ type: i0.Input
6061
+ }], onClickGoBack: [{
6062
+ type: i0.Output
5456
6063
  }], onClickViewForms: [{
5457
6064
  type: i0.Output
5458
6065
  }], onClickSaveForm: [{
5459
6066
  type: i0.Output
5460
6067
  }], onClickApiCall: [{
5461
6068
  type: i0.Output
5462
- }], ngOnInit: [], ngAfterViewInit: [], ngOnChanges: [], initFormConfig: [], setFormFieldsFromFormConfig: [], setFormFieldGroupsFromFormConfig: [], setFormDataFromAllFormsData: [], handleConnectedElementFieldGroupActions: [], handleConnectedElementFieldGroup: [], handleConnectedElementFieldActions: [], handleConnectedElementFields: [], handleConnectedElements: [], handleGetKeyValue: [], handleOnClickResetFormFields: [], handleApiCall: [], handleOnClickApiCall: [], handleOnClickViewForms: [], handleOnClickSaveForm: [], toggleErrorNotification: [], fieldHide: [], fieldGroupHide: [], fieldShow: [], fieldGroupShow: [], fieldDisable: [], fieldGroupDisable: [], fieldEnable: [], fieldGroupEnable: [], fieldReset: [], fieldErrorShow: [], fieldErrorHide: [], fieldMessageShow: [], fieldMessageHide: [], patchFieldControlValue: [], patchFormGroup: [], isFieldValid: [], isFieldEnabled: [], getFormGroupRawValues: [], takeActionOnFieldGroup: [], takeAction: [] } });
6069
+ }], onActionShowPopupForm: [{
6070
+ type: i0.Output
6071
+ }], ngOnInit: [], ngAfterViewInit: [], ngOnChanges: [], initFormConfig: [], setFormFieldsFromFormConfig: [], setFormFieldGroupsFromFormConfig: [], setFormDataFromAllFormsData: [], handleConnectedElementFieldGroupActions: [], handleConnectedElementFieldGroup: [], handleConnectedElementFieldActions: [], handleConnectedElementFields: [], handleConnectedElements: [], handleGetKeyValue: [], handleOnClickResetFormFields: [], handleFieldApiCall: [], handleTaskApiCall: [], handleApiCall: [], handleOnClickApiCall: [], handleOnClickGoBack: [], handleOnClickViewForms: [], handleOnClickSaveForm: [], toggleErrorNotification: [], fieldHide: [], fieldGroupHide: [], fieldShow: [], fieldGroupShow: [], fieldDisable: [], fieldGroupDisable: [], fieldEnable: [], fieldGroupEnable: [], fieldReset: [], fieldErrorShow: [], fieldErrorHide: [], fieldMessageShow: [], fieldMessageHide: [], setValue: [], setFieldDefaultValue: [], setDropdownOptions: [], fieldMultipleApiCalls: [], fieldMultipleApiCallsEnd: [], taskApiCall: [], taskMultipleApiCalls: [], taskMultipleApiCallsEnd: [], dialogShow: [], dialogHide: [], patchFieldControlValue: [], patchFormGroup: [], isFieldValid: [], isFieldEnabled: [], getFormGroupRawValues: [], showPreview: [], showPopupForm: [], takeActionOnFieldGroup: [], takeAction: [] } });
5463
6072
 
5464
6073
  /**
5465
6074
  * Generated class for the SafeHtmlPipe pipe.
@@ -5628,12 +6237,18 @@
5628
6237
  }
5629
6238
  };
5630
6239
  KwikIDFormsListComponent.prototype.handleOnSubmitForms = function (e) {
6240
+ /**
6241
+ * POST ACTIONS
6242
+ * 1. API Calls.
6243
+ * 2. Preview of all filled data.
6244
+ * 3. URL Redirection or new opening of URL in external tab.
6245
+ */
5631
6246
  this.onClickSubmitForms.emit(e);
5632
6247
  };
5633
6248
  return KwikIDFormsListComponent;
5634
6249
  }());
5635
6250
  /** @nocollapse */ KwikIDFormsListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsListComponent, deps: [], target: i0__namespace.ɵɵFactoryTarget.Component });
5636
- /** @nocollapse */ KwikIDFormsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormsListComponent, selector: "kwikid-forms-list", inputs: { showFormFields: "showFormFields", userConfig: "userConfig", stepConfig: "stepConfig", activeFormConfig: "activeFormConfig", formsList: "formsList", formsListCompleted: "formsListCompleted", isMobileView: "isMobileView" }, outputs: { onClickSetActiveForm: "onClickSetActiveForm", onClickHideFormsList: "onClickHideFormsList", onClickSubmitForms: "onClickSubmitForms" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div\n id=\"sidebar-container\"\n *ngIf=\"!loading\"\n>\n <div id=\"sidebar\">\n <div ngClass=\"kwikid-form-header\">\n <div id=\"uf-header\">\n <div id=\"uf-header-logo-container\">\n <img\n id=\"uf-header-logo\"\n src=\"{{ this.userConfig.theme.clientLogo }}\"\n [ngClass]=\"'large-icon'\"\n />\n </div>\n </div>\n <hr />\n </div>\n <div id=\"uf-progress\">\n <div id=\"uf-progress-steps\">\n {{ this.formsListCompleted.length }} / {{ this.formsListLength }} Steps\n Completed\n </div>\n <kwikui-progress-segmented\n [max]=\"this.formsListLength\"\n size=\"m\"\n [value]=\"this.formsListCompleted.length\"\n ></kwikui-progress-segmented>\n </div>\n <div id=\"uf-sections-container\">\n <ng-container *ngFor=\"let form of formsList; let i = index\">\n <ng-container [ngSwitch]=\"form.type\">\n <!-- HTML Content -->\n <ng-container *ngSwitchCase=\"'html'\">\n <div [innerHtml]=\"form.props.htmlContent | safeHtml\"></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'form'\">\n <div\n [class]=\"'uf-section-item'\"\n [class.completed]=\"form.status === 'completed' && !form.disabled\"\n [class.edit]=\"form.status === 'editable' && !form.disabled\"\n [class.locked]=\"form.status === 'locked' && form.disabled\"\n [class.active]=\"\n activeFormConfig !== undefined &&\n form.key === activeFormConfig.key\n \"\n (click)=\"\n form.status === 'locked' && form.disabled\n ? undefined\n : handleOnClickSetActiveForm(form.key)\n \"\n >\n <div class=\"uf-form-section-card-title\">\n {{ form.props.title }}&nbsp;<span *ngIf=\"form?.required\"\n >*</span\n >\n </div>\n <div class=\"uf-form-section-card-status\">\n <div\n *ngIf=\"form.status === 'completed' && !form.disabled\"\n class=\"uf-form-section-card-status-img completed\"\n >\n <tui-svg src=\"tuiIconCheckLarge\"></tui-svg>\n </div>\n <div\n *ngIf=\"form.status !== 'completed' && !form.disabled\"\n class=\"uf-form-section-card-status-img edit\"\n >\n <tui-svg src=\"tuiIconEdit\"></tui-svg>\n </div>\n <div\n *ngIf=\"form.status !== 'completed' && form.disabled\"\n class=\"uf-form-section-card-status-img locked\"\n >\n <tui-svg src=\"tuiIconLock\"></tui-svg>\n </div>\n </div>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </div>\n <div id=\"submit-sidebar-btn-container\">\n <kwikui-button\n *ngIf=\"\n !stepConfig.props.formListProperties.footer.submitFormButton.hidden\n \"\n [disabled]=\"false\"\n id=\"\"\n label=\"{{\n stepConfig.props.formListProperties.footer.submitFormButton.label\n }}\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"\"\n type=\"button\"\n appearance=\"primary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"null\"\n size=\"m\"\n styles=\"width: 100%\"\n (onClick)=\"handleOnSubmitForms($event)\"\n ></kwikui-button>\n </div>\n </div>\n</div>\n", styles: ["::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{border-radius:10px}::-webkit-scrollbar-thumb{background:lightgray;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:gray}#sidebar-container{width:100%;height:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:center}#sidebar{width:100%;height:100%;display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch}.uf-section-item{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-between;align-content:center;padding:1rem;grid-gap:1rem;gap:1rem;cursor:pointer;box-shadow:0 1px 3px -1px var(--tui-base-05);border-radius:.5rem;background-color:var(--tui-base-02);position:relative}.uf-section-item:hover{box-shadow:0 1px 3px -1px var(--tui-base-08)}#submit-sidebar-btn-container{width:100%;bottom:0px;z-index:1;padding:1rem;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;grid-gap:1rem;gap:1rem}#submit-sidebar-btn-container *{flex-grow:1}#uf-sections-container{display:flex;flex-direction:column;height:100%;grid-row-gap:20px;row-gap:20px;padding:1rem;overflow-y:auto}.uf-form-section-card{display:flex;flex-direction:row;align-content:center;justify-content:space-between;align-items:center;grid-column-gap:10px;column-gap:10px;border:none;border-radius:8px;background-color:#e9e9e9;height:-moz-fit-content;height:fit-content;min-height:60px;padding:10px 15px;width:100%;max-width:350px;margin:0 auto}.uf-section-item.locked{-webkit-user-select:none;user-select:none;cursor:not-allowed}.uf-form-section-card .uf-form-section-card-title{font-size:1.2em;text-align:left;line-height:1.25em}.uf-form-section-card .uf-form-section-card-status{width:30px;height:30px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center}.uf-form-section-card .uf-form-section-card-status .uf-form-section-card-status-img{width:30px;height:30px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;border-radius:100%;color:#fff;font-weight:bold}.uf-form-section-card-status-img.completed{background-color:var(--tui-success-fill);padding:.25rem;border-radius:50%;color:#fff}.uf-form-section-card-status-img.edit{background-color:var(--tui-error-fill);padding:.25rem;border-radius:50%;color:#fff}.uf-form-section-card-status-img.locked{background-color:var(--tui-neutral-fill);padding:.25rem;border-radius:50%;color:#fff}#uf-progress{display:flex;padding:1rem;flex-direction:column;align-content:center;justify-content:center;align-items:stretch;grid-gap:.5rem;gap:.5rem}#uf-progress-steps{font-size:1em;text-align:right;color:#3d3d3d}.uf-form-section-card-title{font-size:1em;font-weight:bold;color:#000}@media screen and (max-width: 600px){#sidebar-container{max-width:unset}}.kwikid-form-header{height:70px;z-index:6}.kwikid-form-header hr{width:calc(100% - 1rem);margin-left:auto;margin-right:auto}#uf-header{display:flex;flex-direction:row;align-content:center;align-items:center;justify-content:flex-start;grid-column-gap:10px;column-gap:10px;padding:10px 20px;width:100%;max-width:calc(400px + 50vw + 2rem);margin:0 auto;height:70px;z-index:1}#uf-header #uf-header-goback-container{display:none}#uf-header #uf-header-goback-container:hover{border-radius:50%;background-color:#d3d3d3}#uf-header #uf-header-goback-container #uf-header-goback{width:100%;height:auto}#uf-header #uf-header-logo-container{display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center}#uf-header #uf-header-logo-container #uf-header-logo.small-icon{width:100%;height:50px}#uf-header #uf-header-logo-container #uf-header-logo.large-icon{width:100%;height:50px}#uf-header #uf-header-title-container{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;grid-row-gap:4px;row-gap:4px}#uf-header #uf-header-title-container #uf-header-title{font-size:1.4em;color:#121212}#uf-header #uf-header-title-container #uf-header-subtitle{font-size:1.2em;color:#121212}\n"], components: [{ type: i1__namespace.KwikUIProgressSegmentedComponent, selector: "kwikui-progress-segmented", inputs: ["id", "value", "max", "size", "colors"] }, { type: i3__namespace.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }], directives: [{ type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i5__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], pipes: { "safeHtml": SafeHtmlPipe } });
6251
+ /** @nocollapse */ KwikIDFormsListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormsListComponent, selector: "kwikid-forms-list", inputs: { showFormFields: "showFormFields", userConfig: "userConfig", stepConfig: "stepConfig", activeFormConfig: "activeFormConfig", formsList: "formsList", formsListCompleted: "formsListCompleted", isMobileView: "isMobileView" }, outputs: { onClickSetActiveForm: "onClickSetActiveForm", onClickHideFormsList: "onClickHideFormsList", onClickSubmitForms: "onClickSubmitForms" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div\n id=\"sidebar-container\"\n *ngIf=\"!loading\"\n>\n <div id=\"sidebar\">\n <div ngClass=\"kwikid-form-header\">\n <div id=\"uf-header\">\n <div id=\"uf-header-logo-container\">\n <img\n id=\"uf-header-logo\"\n src=\"{{ this.userConfig.theme.clientLogo }}\"\n [ngClass]=\"'large-icon'\"\n />\n </div>\n </div>\n <hr />\n </div>\n <div id=\"uf-progress\">\n <div id=\"uf-progress-steps\">\n {{ this.formsListCompleted.length }} / {{ this.formsListLength }} Steps\n Completed\n </div>\n <kwikui-progress-segmented\n [max]=\"this.formsListLength\"\n size=\"m\"\n [value]=\"this.formsListCompleted.length\"\n ></kwikui-progress-segmented>\n </div>\n <div id=\"uf-sections-container\">\n <ng-container *ngFor=\"let form of formsList; let i = index\">\n <ng-container [ngSwitch]=\"form.type\">\n <!-- HTML Content -->\n <ng-container *ngSwitchCase=\"'html'\">\n <div [innerHtml]=\"form.props.htmlContent | safeHtml\"></div>\n </ng-container>\n <ng-container *ngSwitchCase=\"'form'\">\n <div\n [class]=\"'uf-section-item'\"\n [class.completed]=\"form.status === 'completed' && !form.disabled\"\n [class.edit]=\"form.status === 'editable' && !form.disabled\"\n [class.locked]=\"form.status === 'locked' && form.disabled\"\n [class.active]=\"\n activeFormConfig !== undefined &&\n form.key === activeFormConfig.key\n \"\n (click)=\"\n form.status === 'locked' && form.disabled\n ? undefined\n : handleOnClickSetActiveForm(form.key)\n \"\n >\n <div class=\"uf-form-section-card-title\">\n {{ form.props.title }}&nbsp;<span *ngIf=\"form?.required\"\n >*</span\n >\n </div>\n <div class=\"uf-form-section-card-status\">\n <div\n *ngIf=\"form.status === 'completed' && !form.disabled\"\n class=\"uf-form-section-card-status-img completed\"\n >\n <tui-svg src=\"tuiIconCheckLarge\"></tui-svg>\n </div>\n <div\n *ngIf=\"form.status !== 'completed' && !form.disabled\"\n class=\"uf-form-section-card-status-img edit\"\n >\n <tui-svg src=\"tuiIconEdit\"></tui-svg>\n </div>\n <div\n *ngIf=\"form.status !== 'completed' && form.disabled\"\n class=\"uf-form-section-card-status-img locked\"\n >\n <tui-svg src=\"tuiIconLock\"></tui-svg>\n </div>\n </div>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </div>\n <div id=\"submit-sidebar-btn-container\">\n <kwikui-button\n *ngIf=\"\n !stepConfig.props.formListProperties.footer.submitFormButton.hidden\n \"\n [disabled]=\"false\"\n id=\"\"\n label=\"{{\n stepConfig.props.formListProperties.footer.submitFormButton.label\n }}\"\n [showLoader]=\"false\"\n styles=\"\"\n class=\"\"\n type=\"button\"\n appearance=\"primary\"\n icon=\"\"\n iconRight=\"\"\n [shape]=\"null\"\n size=\"m\"\n styles=\"width: 100%\"\n (onClick)=\"handleOnSubmitForms($event)\"\n ></kwikui-button>\n </div>\n </div>\n</div>\n", styles: ["::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{border-radius:10px}::-webkit-scrollbar-thumb{background:lightgray;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:gray}#sidebar-container{width:100%;height:100%;margin:0 auto;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-content:center}#sidebar{width:100%;height:100%;display:flex;flex-direction:column;align-content:center;justify-content:flex-start;align-items:stretch}.uf-section-item{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-between;align-content:center;padding:1rem;grid-gap:1rem;gap:1rem;cursor:pointer;box-shadow:0 1px 3px -1px var(--tui-base-05);border-radius:.5rem;background-color:var(--tui-base-02);position:relative}.uf-section-item:hover{box-shadow:0 1px 3px -1px var(--tui-base-08)}#submit-sidebar-btn-container{width:100%;bottom:0px;z-index:1;padding:1rem;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;grid-gap:1rem;gap:1rem}#submit-sidebar-btn-container *{flex-grow:1}#uf-sections-container{display:flex;flex-direction:column;height:100%;grid-row-gap:20px;row-gap:20px;padding:1rem;overflow-y:auto}.uf-form-section-card{display:flex;flex-direction:row;align-content:center;justify-content:space-between;align-items:center;grid-column-gap:10px;column-gap:10px;border:none;border-radius:8px;background-color:#e9e9e9;height:-moz-fit-content;height:fit-content;min-height:60px;padding:10px 15px;width:100%;max-width:350px;margin:0 auto}.uf-section-item.locked{-webkit-user-select:none;user-select:none;cursor:not-allowed}.uf-form-section-card .uf-form-section-card-title{font-size:1.2em;text-align:left;line-height:1.25em}.uf-form-section-card .uf-form-section-card-status{width:30px;height:30px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center}.uf-form-section-card .uf-form-section-card-status .uf-form-section-card-status-img{width:30px;height:30px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;border-radius:100%;color:#fff;font-weight:bold}.uf-form-section-card-status-img.completed{background-color:var(--tui-success-fill);padding:.25rem;border-radius:50%;color:#fff}.uf-form-section-card-status-img.edit{background-color:var(--tui-error-fill);padding:.25rem;border-radius:50%;color:#fff}.uf-form-section-card-status-img.locked{background-color:var(--tui-neutral-fill);padding:.25rem;border-radius:50%;color:#fff}#uf-progress{display:flex;padding:1rem;flex-direction:column;align-content:center;justify-content:center;align-items:stretch;grid-gap:.5rem;gap:.5rem}#uf-progress-steps{font-size:1em;text-align:right;color:#3d3d3d}.uf-form-section-card-title{font-size:1em;font-weight:bold;color:#000}@media screen and (max-width: 600px){#sidebar-container{max-width:unset}}.kwikid-form-header{height:70px;z-index:6}.kwikid-form-header hr{width:calc(100% - 1rem);margin-left:auto;margin-right:auto}#uf-header{display:flex;flex-direction:row;align-content:center;align-items:center;justify-content:flex-start;grid-column-gap:10px;column-gap:10px;padding:10px 20px;width:100%;max-width:calc(400px + 50vw + 2rem);margin:0 auto;height:70px;z-index:1}#uf-header #uf-header-goback-container{display:none}#uf-header #uf-header-goback-container:hover{border-radius:50%;background-color:#d3d3d3}#uf-header #uf-header-goback-container #uf-header-goback{width:100%;height:auto}#uf-header #uf-header-logo-container{display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center}#uf-header #uf-header-logo-container #uf-header-logo.small-icon{width:100%;height:50px}#uf-header #uf-header-logo-container #uf-header-logo.large-icon{width:100%;height:50px}#uf-header #uf-header-title-container{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;grid-row-gap:4px;row-gap:4px}#uf-header #uf-header-title-container #uf-header-title{font-size:1.4em;color:#121212}#uf-header #uf-header-title-container #uf-header-subtitle{font-size:1.2em;color:#121212}\n"], components: [{ type: i1__namespace.KwikUIProgressSegmentedComponent, selector: "kwikui-progress-segmented", inputs: ["id", "value", "max", "size", "colors"] }, { type: i3__namespace$1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i1__namespace.KwikUIButtonComponent, selector: "kwikui-button", inputs: ["disabled", "id", "label", "showLoader", "styles", "class", "type", "appearance", "icon", "iconRight", "shape", "size"], outputs: ["onClick"] }], directives: [{ type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3__namespace.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3__namespace.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }], pipes: { "safeHtml": SafeHtmlPipe } });
5637
6252
  __decorate([
5638
6253
  kwikidToolkit.logMethod
5639
6254
  ], KwikIDFormsListComponent.prototype, "ngOnChanges", null);
@@ -5703,10 +6318,12 @@
5703
6318
  };
5704
6319
 
5705
6320
  var KwikIDFormsRendererComponent = /** @class */ (function () {
5706
- function KwikIDFormsRendererComponent(hostElement, cdr) {
6321
+ function KwikIDFormsRendererComponent(hostElement, cdr, previewDialogService) {
5707
6322
  this.hostElement = hostElement;
5708
6323
  this.cdr = cdr;
6324
+ this.previewDialogService = previewDialogService;
5709
6325
  this.formsData = {};
6326
+ this.activeFormData = {};
5710
6327
  this.apiCallResponse = {};
5711
6328
  this.onClickSubmit = new i0.EventEmitter();
5712
6329
  this.getFormData = new i0.EventEmitter();
@@ -5714,9 +6331,26 @@
5714
6331
  this.loading = false;
5715
6332
  this.loader = false;
5716
6333
  this.showErrorNotification = false;
6334
+ this.activePopupFormData = {};
6335
+ this.popupFormCallback = undefined;
5717
6336
  this.allFormsData = {};
6337
+ this.allFormsSubmitted = false;
5718
6338
  this.formsList = [];
5719
6339
  this.isMobileView = false;
6340
+ this.previewProperties = {
6341
+ html: {
6342
+ before: "",
6343
+ after: ""
6344
+ },
6345
+ iframe: {
6346
+ src: "",
6347
+ title: ""
6348
+ },
6349
+ popupFormKey: "",
6350
+ title: "",
6351
+ unavailable: false
6352
+ };
6353
+ this.popupFormConfig = undefined;
5720
6354
  // display forms and list conditionally
5721
6355
  this.showForm = false;
5722
6356
  this.showFormFields = true;
@@ -6125,6 +6759,28 @@
6125
6759
  });
6126
6760
  });
6127
6761
  };
6762
+ KwikIDFormsRendererComponent.prototype.showPreview = function (previewProperties) {
6763
+ this.previewProperties = kwikidToolkit.mergeObjects(this.previewProperties, previewProperties);
6764
+ if (kwikidToolkit.isEmptyValue(this.previewProperties.iframe.src) &&
6765
+ kwikidToolkit.isEmptyValue(this.previewProperties.html.before) &&
6766
+ kwikidToolkit.isEmptyValue(this.previewProperties.html.after) &&
6767
+ kwikidToolkit.isEmptyValue(this.previewProperties.popupFormKey)) {
6768
+ this.previewProperties.unavailable = true;
6769
+ }
6770
+ else {
6771
+ if (kwikidToolkit.isNotEmptyValue(this.previewProperties.popupFormKey)) {
6772
+ if (kwikidToolkit.checkObjectKeyExists(this.activeFormConfig, "popupForms")) {
6773
+ this.popupFormConfig =
6774
+ this.activeFormConfig.popupForms[this.previewProperties.popupFormKey];
6775
+ }
6776
+ else {
6777
+ this.popupFormConfig = undefined;
6778
+ }
6779
+ }
6780
+ this.previewProperties.unavailable = false;
6781
+ }
6782
+ this.previewDialogService.open(this.preview || "").subscribe();
6783
+ };
6128
6784
  KwikIDFormsRendererComponent.prototype.formHide = function (formKey) {
6129
6785
  var form = getFormConfigByKey(this.formsList, formKey);
6130
6786
  form = kwikidToolkit.setValueToObjectPath(form, "hidden", true);
@@ -6270,16 +6926,52 @@
6270
6926
  this.loader = true;
6271
6927
  this.onClickApiCall.emit(e);
6272
6928
  };
6929
+ KwikIDFormsRendererComponent.prototype.handleOnActionShowPopupForm = function (e) {
6930
+ var _d;
6931
+ var _this = this;
6932
+ if (kwikidToolkit.checkObjectKeyExists(e, "activeFormData") &&
6933
+ kwikidToolkit.checkObjectKeyExists(e, "popupFormConfig")) {
6934
+ var popupFormData = (_d = {}, _d[this.activeFormConfig.key] = e.activeFormData, _d);
6935
+ this.activePopupFormData = kwikidToolkit.mergeObjects(this.allFormsData, popupFormData);
6936
+ this.popupFormConfig = e.popupFormConfig;
6937
+ this.previewDialogRef = this.previewDialogService
6938
+ .open(this.preview || "")
6939
+ .subscribe({
6940
+ next: function (data) {
6941
+ _this.popupFormCallback = {
6942
+ popupFormData: data["data"],
6943
+ popupFormConfig: data["formConfig"],
6944
+ activeFormConfig: _this.activeFormConfig
6945
+ };
6946
+ _this.activePopupFormData = {};
6947
+ _this.popupFormConfig = undefined;
6948
+ _this.previewDialogRef.complete();
6949
+ },
6950
+ complete: function () {
6951
+ console.info("Dialog closed");
6952
+ }
6953
+ });
6954
+ }
6955
+ };
6273
6956
  /**
6274
6957
  * FormView - Listens to event of getting the Active Form's Data when the Form is Saved and emits (read as passes) the same event to the library consumer.
6275
6958
  * @param e any
6276
6959
  */
6277
- KwikIDFormsRendererComponent.prototype.handleOnClickSaveForm = function (e) {
6960
+ KwikIDFormsRendererComponent.prototype.handleOnClickSaveForm = function (e, eventType) {
6278
6961
  var _d;
6279
- this.loader = true;
6280
- this.getFormData.emit((_d = {},
6281
- _d[this.activeFormConfig.key] = e["data"],
6282
- _d));
6962
+ switch (eventType) {
6963
+ case "FORM":
6964
+ this.loader = true;
6965
+ this.getFormData.emit((_d = {},
6966
+ _d[this.activeFormConfig.key] = e["data"],
6967
+ _d));
6968
+ break;
6969
+ case "POPUP_FORM":
6970
+ this.previewDialogRef.next(e);
6971
+ break;
6972
+ default:
6973
+ break;
6974
+ }
6283
6975
  };
6284
6976
  /**
6285
6977
  * FormView - Listens to event of showing the Forms List in Mobile View.
@@ -6290,6 +6982,71 @@
6290
6982
  this.showForm = false;
6291
6983
  this.showFormFields = false;
6292
6984
  };
6985
+ /**
6986
+ * Handles the event of going back to the previous form directly or by tabbing, without showing the form list in mobile view.
6987
+ *
6988
+ * Prerequisite: The current form can never be locked; it should either be in an editable or completed state.
6989
+ *
6990
+ * Logic:
6991
+ * 1. For DIRECT mode, find the config of the previous form starting from the first form, such that the previous form is editable and its sequence number is one less than the current active form's sequence number.
6992
+ * If no previous form is found or all forms have been completed, show the form list.
6993
+ * 2. For TABBED mode, find the config of the previous form in the list, such that the previous form's sequence number is less than the current active form's sequence number and the form is editable.
6994
+ * If no previous form is found, show the form list.
6995
+ *
6996
+ * @param {Object} e - The event object containing the mode to go back in.
6997
+ * @param {string} e.mode - The mode of going back: DIRECT or TABBED.
6998
+ * @returns {void}
6999
+ */
7000
+ KwikIDFormsRendererComponent.prototype.handleOnClickGoBack = function (e) {
7001
+ var _this = this;
7002
+ switch (e.mode) {
7003
+ case EFormViewGoBackMode.DIRECT:
7004
+ if (this.activeFormConfig.sequenceNo === 1) {
7005
+ this.showFormSections = true;
7006
+ this.showForm = false;
7007
+ this.showFormFields = false;
7008
+ return;
7009
+ }
7010
+ else {
7011
+ if (this.checkIfFormsStatusCompleted(this.formsList, this.formsListCompleted)) {
7012
+ this.showFormSections = true;
7013
+ this.showForm = false;
7014
+ this.showFormFields = false;
7015
+ return;
7016
+ }
7017
+ else {
7018
+ var previousFormConfigDirect = this.formsList.find(function (form) {
7019
+ if (form.sequenceNo === _this.activeFormConfig.sequenceNo - 1 &&
7020
+ form.status !== EFormsListStatus.LOCKED) {
7021
+ return form;
7022
+ }
7023
+ });
7024
+ if (previousFormConfigDirect) {
7025
+ this.handleOnClickSetActiveForm(previousFormConfigDirect.key);
7026
+ }
7027
+ }
7028
+ }
7029
+ break;
7030
+ case EFormViewGoBackMode.TABBED:
7031
+ var previousFormConfig = this.formsList.find(function (form) {
7032
+ if (form.sequenceNo < _this.activeFormConfig.sequenceNo &&
7033
+ form.status === EFormsListStatus.EDITABLE) {
7034
+ return form;
7035
+ }
7036
+ });
7037
+ if (previousFormConfig) {
7038
+ this.handleOnClickSetActiveForm(previousFormConfig.key);
7039
+ }
7040
+ else {
7041
+ this.showFormSections = true;
7042
+ this.showForm = false;
7043
+ this.showFormFields = false;
7044
+ }
7045
+ break;
7046
+ default:
7047
+ break;
7048
+ }
7049
+ };
6293
7050
  /**
6294
7051
  * FormList - Listens to event of submitting all the forms and moving out of the library and also handles the validation of all the forms.
6295
7052
  * @param e any
@@ -6353,8 +7110,8 @@
6353
7110
  };
6354
7111
  return KwikIDFormsRendererComponent;
6355
7112
  }());
6356
- /** @nocollapse */ KwikIDFormsRendererComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsRendererComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
6357
- /** @nocollapse */ KwikIDFormsRendererComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikIDFormsRendererComponent, selector: "kwikid-forms-renderer", inputs: { stepConfig: "stepConfig", userConfig: "userConfig", formsData: "formsData", apiCallResponse: "apiCallResponse" }, outputs: { onClickSubmit: "onClickSubmit", getFormData: "getFormData", onClickApiCall: "onClickApiCall" }, host: { listeners: { "window:resize": "windowResizeWatcher($event)" } }, usesOnChanges: true, ngImport: i0__namespace, 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 [formConfig]=\"this.activeFormConfig\"\n [allFormsData]=\"this.allFormsData\"\n [isMobileView]=\"this.isMobileView\"\n (onClickViewForms)=\"this.handleOnClickViewForms($event)\"\n (onClickSaveForm)=\"this.handleOnClickSaveForm($event)\"\n ></kwikid-form-view>\n </div>\n </div>\n</div>\n<div\n ngClass=\"kwikid-forms-renderer-loader\"\n *ngIf=\"loader\"\n>\n <span class=\"loader\"></span>\n</div>\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", 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}}.kwikid-forms-renderer-loader{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.75);display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;z-index:100}.kwikid-forms-renderer-loader .loader{width:48px;height:48px;border-radius:50%;display:inline-block;position:relative;border:3px solid;border-color:#fff #fff transparent;box-sizing:border-box;animation:rotation 1s linear infinite}.kwikid-forms-renderer-loader .loader:after{content:\"\";box-sizing:border-box;position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;border:3px solid;border-color:transparent var(--tui-primary) var(--tui-primary);width:24px;height:24px;border-radius:50%;animation:rotationBack .5s linear infinite;transform-origin:center center}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotationBack{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.kwikid-forms-renderer-loader .t-loader{display:none!important}#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}\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"], outputs: ["onClickViewForms", "onClickSaveForm", "onClickApiCall"] }, { type: i4__namespace$1.TuiPushComponent, selector: "tui-push", inputs: ["heading", "type", "timestamp"], outputs: ["close"] }, { type: i3__namespace.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }], directives: [{ type: i5__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i4__namespace$1.TuiPushDirective, selector: "tui-push" }], animations: [
7113
+ /** @nocollapse */ KwikIDFormsRendererComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsRendererComponent, deps: [{ token: i0__namespace.ElementRef }, { token: i0__namespace.ChangeDetectorRef }, { token: i5.TuiPreviewDialogService }], target: i0__namespace.ɵɵFactoryTarget.Component });
7114
+ /** @nocollapse */ KwikIDFormsRendererComponent.ɵcmp = i0__namespace.ɵɵ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__namespace, 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 [formConfig]=\"this.activeFormConfig\"\n [allFormsData]=\"this.allFormsData\"\n [isMobileView]=\"this.isMobileView\"\n [popupFormCallback]=\"this.popupFormCallback\"\n (onActionShowPopupForm)=\"this.handleOnActionShowPopupForm($event)\"\n (onClickGoBack)=\"this.handleOnClickGoBack($event)\"\n (onClickViewForms)=\"this.handleOnClickViewForms($event)\"\n (onClickSaveForm)=\"this.handleOnClickSaveForm($event, 'FORM')\"\n ></kwikid-form-view>\n </div>\n </div>\n</div>\n<div\n ngClass=\"kwikid-forms-renderer-loader\"\n *ngIf=\"loader\"\n>\n <span class=\"loader\"></span>\n</div>\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 [isMobileView]=\"this.isMobileView\"\n (onClickSaveForm)=\"this.handleOnClickSaveForm($event, 'POPUP_FORM')\"\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", 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}}.kwikid-forms-renderer-loader{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.75);display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;z-index:100}.kwikid-forms-renderer-loader .loader{width:48px;height:48px;border-radius:50%;display:inline-block;position:relative;border:3px solid;border-color:#fff #fff transparent;box-sizing:border-box;animation:rotation 1s linear infinite}.kwikid-forms-renderer-loader .loader:after{content:\"\";box-sizing:border-box;position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;border:3px solid;border-color:transparent var(--tui-primary) var(--tui-primary);width:24px;height:24px;border-radius:50%;animation:rotationBack .5s linear infinite;transform-origin:center center}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotationBack{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.kwikid-forms-renderer-loader .t-loader{display:none!important}#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{width:100%;height:100vh;border-radius:1rem;background:var(--tui-base-01);padding:1rem}\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", "popupFormCallback"], outputs: ["onClickGoBack", "onClickViewForms", "onClickSaveForm", "onClickApiCall", "onActionShowPopupForm"] }, { type: i4__namespace$1.TuiPushComponent, selector: "tui-push", inputs: ["heading", "type", "timestamp"], outputs: ["close"] }, { type: i3__namespace$1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i5__namespace.TuiPreviewComponent, selector: "tui-preview", inputs: ["zoomable", "rotatable"] }, { type: i5__namespace.TuiPreviewTitleComponent, selector: "tui-preview-title" }, { type: i3__namespace$1.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i3__namespace.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4__namespace$1.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i4__namespace$1.TuiPushDirective, selector: "tui-push" }, { type: i5__namespace.TuiPreviewActionDirective, selector: "[tuiPreviewAction]" }], animations: [
6358
7115
  animations.trigger("panelInOut", [
6359
7116
  animations.transition(":enter", [
6360
7117
  animations.style({ transform: "translateY(100%)" }),
@@ -6392,6 +7149,9 @@
6392
7149
  __decorate([
6393
7150
  kwikidToolkit.logMethod
6394
7151
  ], KwikIDFormsRendererComponent.prototype, "updateFormsList", null);
7152
+ __decorate([
7153
+ kwikidToolkit.logMethod
7154
+ ], KwikIDFormsRendererComponent.prototype, "showPreview", null);
6395
7155
  __decorate([
6396
7156
  kwikidToolkit.logMethod
6397
7157
  ], KwikIDFormsRendererComponent.prototype, "formHide", null);
@@ -6404,6 +7164,15 @@
6404
7164
  __decorate([
6405
7165
  kwikidToolkit.logMethod
6406
7166
  ], KwikIDFormsRendererComponent.prototype, "handleOnClickSetActiveForm", null);
7167
+ __decorate([
7168
+ kwikidToolkit.logMethod
7169
+ ], KwikIDFormsRendererComponent.prototype, "handleOnActionShowPopupForm", null);
7170
+ __decorate([
7171
+ kwikidToolkit.logMethod
7172
+ ], KwikIDFormsRendererComponent.prototype, "handleOnClickSaveForm", null);
7173
+ __decorate([
7174
+ kwikidToolkit.logMethod
7175
+ ], KwikIDFormsRendererComponent.prototype, "handleOnClickGoBack", null);
6407
7176
  __decorate([
6408
7177
  kwikidToolkit.logMethod
6409
7178
  ], KwikIDFormsRendererComponent.prototype, "handleOnClickSubmitForms", null);
@@ -6425,15 +7194,25 @@
6425
7194
  ])
6426
7195
  ]
6427
7196
  }]
6428
- }], ctorParameters: function () { return [{ type: i0__namespace.ElementRef }, { type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { windowResizeWatcher: [{
7197
+ }], ctorParameters: function () {
7198
+ return [{ type: i0__namespace.ElementRef }, { type: i0__namespace.ChangeDetectorRef }, { type: i5__namespace.TuiPreviewDialogService, decorators: [{
7199
+ type: i0.Inject,
7200
+ args: [i5.TuiPreviewDialogService]
7201
+ }] }];
7202
+ }, propDecorators: { windowResizeWatcher: [{
6429
7203
  type: i0.HostListener,
6430
7204
  args: ["window:resize", ["$event"]]
7205
+ }], preview: [{
7206
+ type: i0.ViewChild,
7207
+ args: ["preview"]
6431
7208
  }], stepConfig: [{
6432
7209
  type: i0.Input
6433
7210
  }], userConfig: [{
6434
7211
  type: i0.Input
6435
7212
  }], formsData: [{
6436
7213
  type: i0.Input
7214
+ }], activeFormData: [{
7215
+ type: i0.Input
6437
7216
  }], apiCallResponse: [{
6438
7217
  type: i0.Input
6439
7218
  }], onClickSubmit: [{
@@ -6442,7 +7221,7 @@
6442
7221
  type: i0.Output
6443
7222
  }], onClickApiCall: [{
6444
7223
  type: i0.Output
6445
- }], convertFormListConfig: [], assignSequenceNoToForm: [], findCompletedFormsList: [], markFormInFormsListAsCompleted: [], markFormInFormsListAsDisabled: [], filterAllFormsData: [], checkIfFormsStatusCompleted: [], findActiveFormConfig: [], updateFormsList: [], formHide: [], formShow: [], findFormsListLength: [], handleOnClickSetActiveForm: [], handleOnClickSubmitForms: [] } });
7224
+ }], convertFormListConfig: [], assignSequenceNoToForm: [], findCompletedFormsList: [], markFormInFormsListAsCompleted: [], markFormInFormsListAsDisabled: [], filterAllFormsData: [], checkIfFormsStatusCompleted: [], findActiveFormConfig: [], updateFormsList: [], showPreview: [], formHide: [], formShow: [], findFormsListLength: [], handleOnClickSetActiveForm: [], handleOnActionShowPopupForm: [], handleOnClickSaveForm: [], handleOnClickGoBack: [], handleOnClickSubmitForms: [] } });
6446
7225
 
6447
7226
  var BasicDateConfigEditor = /** @class */ (function () {
6448
7227
  function BasicDateConfigEditor() {
@@ -6534,7 +7313,7 @@
6534
7313
  DocumentPanNumberConfigEditor,
6535
7314
  OtherElementConfigEditor,
6536
7315
  OtherHTMLConfigEditor,
6537
- OtherTitleConfigEditor], imports: [i5.CommonModule,
7316
+ OtherTitleConfigEditor], imports: [i3.CommonModule,
6538
7317
  i2.FormsModule,
6539
7318
  i2.ReactiveFormsModule,
6540
7319
  i4.DragDropModule,
@@ -6546,7 +7325,7 @@
6546
7325
  i1.KwikUITableModule,
6547
7326
  i1.KwikUITextareaModule], exports: [KwikIDFormsBuilderComponent] });
6548
7327
  /** @nocollapse */ KwikIDFormBuilderModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormBuilderModule, providers: [], imports: [[
6549
- i5.CommonModule,
7328
+ i3.CommonModule,
6550
7329
  i2.FormsModule,
6551
7330
  i2.ReactiveFormsModule,
6552
7331
  i4.DragDropModule,
@@ -6581,7 +7360,7 @@
6581
7360
  OtherTitleConfigEditor
6582
7361
  ],
6583
7362
  imports: [
6584
- i5.CommonModule,
7363
+ i3.CommonModule,
6585
7364
  i2.FormsModule,
6586
7365
  i2.ReactiveFormsModule,
6587
7366
  i4.DragDropModule,
@@ -6604,33 +7383,45 @@
6604
7383
  return KwikIDFormViewModule;
6605
7384
  }());
6606
7385
  /** @nocollapse */ KwikIDFormViewModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormViewModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
6607
- /** @nocollapse */ KwikIDFormViewModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormViewModule, declarations: [KwikIDFormViewComponent, SafeHtmlPipe$1], imports: [i5.CommonModule,
7386
+ /** @nocollapse */ KwikIDFormViewModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormViewModule, declarations: [KwikIDFormViewComponent, SafeHtmlPipe$1, SafeUrlPipe], imports: [i3.CommonModule,
6608
7387
  i2.FormsModule,
6609
7388
  i2.ReactiveFormsModule,
6610
- i3.TuiLabelModule,
7389
+ i3$1.TuiLabelModule,
6611
7390
  i4$1.TuiPushModule,
6612
- i3.TuiSvgModule,
7391
+ i3$1.TuiSvgModule,
7392
+ i5.TuiPreviewModule,
7393
+ i3$1.TuiButtonModule,
7394
+ i5.TuiPreviewActionModule,
7395
+ i3$1.TuiDialogModule,
6613
7396
  i1.KwikUIModule], exports: [KwikIDFormViewComponent] });
6614
7397
  /** @nocollapse */ KwikIDFormViewModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormViewModule, imports: [[
6615
- i5.CommonModule,
7398
+ i3.CommonModule,
6616
7399
  i2.FormsModule,
6617
7400
  i2.ReactiveFormsModule,
6618
- i3.TuiLabelModule,
7401
+ i3$1.TuiLabelModule,
6619
7402
  i4$1.TuiPushModule,
6620
- i3.TuiSvgModule,
7403
+ i3$1.TuiSvgModule,
7404
+ i5.TuiPreviewModule,
7405
+ i3$1.TuiButtonModule,
7406
+ i5.TuiPreviewActionModule,
7407
+ i3$1.TuiDialogModule,
6621
7408
  i1.KwikUIModule
6622
7409
  ]] });
6623
7410
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormViewModule, decorators: [{
6624
7411
  type: i0.NgModule,
6625
7412
  args: [{
6626
- declarations: [KwikIDFormViewComponent, SafeHtmlPipe$1],
7413
+ declarations: [KwikIDFormViewComponent, SafeHtmlPipe$1, SafeUrlPipe],
6627
7414
  imports: [
6628
- i5.CommonModule,
7415
+ i3.CommonModule,
6629
7416
  i2.FormsModule,
6630
7417
  i2.ReactiveFormsModule,
6631
- i3.TuiLabelModule,
7418
+ i3$1.TuiLabelModule,
6632
7419
  i4$1.TuiPushModule,
6633
- i3.TuiSvgModule,
7420
+ i3$1.TuiSvgModule,
7421
+ i5.TuiPreviewModule,
7422
+ i3$1.TuiButtonModule,
7423
+ i5.TuiPreviewActionModule,
7424
+ i3$1.TuiDialogModule,
6634
7425
  i1.KwikUIModule
6635
7426
  ],
6636
7427
  exports: [KwikIDFormViewComponent]
@@ -6643,28 +7434,28 @@
6643
7434
  return KwikIDFormsListModule;
6644
7435
  }());
6645
7436
  /** @nocollapse */ KwikIDFormsListModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsListModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
6646
- /** @nocollapse */ KwikIDFormsListModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsListModule, declarations: [KwikIDFormsListComponent, SafeHtmlPipe], imports: [i5.CommonModule,
7437
+ /** @nocollapse */ KwikIDFormsListModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsListModule, declarations: [KwikIDFormsListComponent, SafeHtmlPipe], imports: [i3.CommonModule,
6647
7438
  i2.FormsModule,
6648
7439
  i2.ReactiveFormsModule,
6649
7440
  i1.KwikUIModule,
6650
- i3.TuiSvgModule], exports: [KwikIDFormsListComponent] });
7441
+ i3$1.TuiSvgModule], exports: [KwikIDFormsListComponent] });
6651
7442
  /** @nocollapse */ KwikIDFormsListModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsListModule, imports: [[
6652
- i5.CommonModule,
7443
+ i3.CommonModule,
6653
7444
  i2.FormsModule,
6654
7445
  i2.ReactiveFormsModule,
6655
7446
  i1.KwikUIModule,
6656
- i3.TuiSvgModule
7447
+ i3$1.TuiSvgModule
6657
7448
  ]] });
6658
7449
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsListModule, decorators: [{
6659
7450
  type: i0.NgModule,
6660
7451
  args: [{
6661
7452
  declarations: [KwikIDFormsListComponent, SafeHtmlPipe],
6662
7453
  imports: [
6663
- i5.CommonModule,
7454
+ i3.CommonModule,
6664
7455
  i2.FormsModule,
6665
7456
  i2.ReactiveFormsModule,
6666
7457
  i1.KwikUIModule,
6667
- i3.TuiSvgModule
7458
+ i3$1.TuiSvgModule
6668
7459
  ],
6669
7460
  exports: [KwikIDFormsListComponent]
6670
7461
  }]
@@ -6676,37 +7467,49 @@
6676
7467
  return KwikIDFormRendererModule;
6677
7468
  }());
6678
7469
  /** @nocollapse */ KwikIDFormRendererModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormRendererModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
6679
- /** @nocollapse */ KwikIDFormRendererModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormRendererModule, declarations: [KwikIDFormsRendererComponent], imports: [i5.CommonModule,
7470
+ /** @nocollapse */ KwikIDFormRendererModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormRendererModule, declarations: [KwikIDFormsRendererComponent], imports: [i3.CommonModule,
6680
7471
  http.HttpClientModule,
6681
7472
  KwikIDFormViewModule,
6682
7473
  KwikIDFormsListModule,
6683
7474
  i1.KwikUIModule,
6684
- i3.TuiLoaderModule,
7475
+ i3$1.TuiLoaderModule,
6685
7476
  i4$1.TuiPushModule,
6686
- i3.TuiSvgModule], exports: [KwikIDFormsRendererComponent] });
7477
+ i5.TuiPreviewActionModule,
7478
+ i5.TuiPreviewModule,
7479
+ i3$1.TuiButtonModule,
7480
+ i5.TuiPreviewActionModule,
7481
+ i3$1.TuiSvgModule], exports: [KwikIDFormsRendererComponent] });
6687
7482
  /** @nocollapse */ KwikIDFormRendererModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormRendererModule, providers: [], imports: [[
6688
- i5.CommonModule,
7483
+ i3.CommonModule,
6689
7484
  http.HttpClientModule,
6690
7485
  KwikIDFormViewModule,
6691
7486
  KwikIDFormsListModule,
6692
7487
  i1.KwikUIModule,
6693
- i3.TuiLoaderModule,
7488
+ i3$1.TuiLoaderModule,
6694
7489
  i4$1.TuiPushModule,
6695
- i3.TuiSvgModule
7490
+ i5.TuiPreviewActionModule,
7491
+ i5.TuiPreviewModule,
7492
+ i3$1.TuiButtonModule,
7493
+ i5.TuiPreviewActionModule,
7494
+ i3$1.TuiSvgModule
6696
7495
  ]] });
6697
7496
  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormRendererModule, decorators: [{
6698
7497
  type: i0.NgModule,
6699
7498
  args: [{
6700
7499
  declarations: [KwikIDFormsRendererComponent],
6701
7500
  imports: [
6702
- i5.CommonModule,
7501
+ i3.CommonModule,
6703
7502
  http.HttpClientModule,
6704
7503
  KwikIDFormViewModule,
6705
7504
  KwikIDFormsListModule,
6706
7505
  i1.KwikUIModule,
6707
- i3.TuiLoaderModule,
7506
+ i3$1.TuiLoaderModule,
6708
7507
  i4$1.TuiPushModule,
6709
- i3.TuiSvgModule
7508
+ i5.TuiPreviewActionModule,
7509
+ i5.TuiPreviewModule,
7510
+ i3$1.TuiButtonModule,
7511
+ i5.TuiPreviewActionModule,
7512
+ i3$1.TuiSvgModule
6710
7513
  ],
6711
7514
  providers: [],
6712
7515
  exports: [KwikIDFormsRendererComponent]
@@ -6719,13 +7522,13 @@
6719
7522
  return KwikIDFormsModule;
6720
7523
  }());
6721
7524
  /** @nocollapse */ KwikIDFormsModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
6722
- /** @nocollapse */ KwikIDFormsModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsModule, imports: [i5.CommonModule,
7525
+ /** @nocollapse */ KwikIDFormsModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsModule, imports: [i3.CommonModule,
6723
7526
  i2.FormsModule,
6724
7527
  i2.ReactiveFormsModule,
6725
7528
  KwikIDFormBuilderModule,
6726
7529
  KwikIDFormRendererModule], exports: [KwikIDFormBuilderModule, KwikIDFormRendererModule] });
6727
7530
  /** @nocollapse */ KwikIDFormsModule.ɵinj = i0__namespace.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: KwikIDFormsModule, imports: [[
6728
- i5.CommonModule,
7531
+ i3.CommonModule,
6729
7532
  i2.FormsModule,
6730
7533
  i2.ReactiveFormsModule,
6731
7534
  KwikIDFormBuilderModule,
@@ -6736,7 +7539,7 @@
6736
7539
  args: [{
6737
7540
  declarations: [],
6738
7541
  imports: [
6739
- i5.CommonModule,
7542
+ i3.CommonModule,
6740
7543
  i2.FormsModule,
6741
7544
  i2.ReactiveFormsModule,
6742
7545
  KwikIDFormBuilderModule,