kwikid-forms 0.2.5 → 0.2.6
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.
- package/bundles/kwikid-forms.umd.js +51 -20
- package/bundles/kwikid-forms.umd.js.map +1 -1
- package/esm2015/lib/builder/element-config-editor/editors/basic-element-config.editor.component.js +3 -4
- package/esm2015/lib/renderer/config-converter.helper.js +9 -9
- package/esm2015/lib/renderer/forms-list/forms-list.component.js +39 -5
- package/esm2015/lib/renderer/renderer.component.js +2 -2
- package/fesm2015/kwikid-forms.js +48 -15
- package/fesm2015/kwikid-forms.js.map +1 -1
- package/lib/renderer/forms-list/forms-list.component.d.ts +4 -1
- package/package.json +2 -2
|
@@ -1,10 +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('
|
|
3
|
-
typeof define === 'function' && define.amd ? define('kwikid-forms', ['exports', '@angular/cdk/drag-drop', '@angular/core', '@angular/forms', 'kwikid-toolkit', 'kwikui', '
|
|
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.
|
|
5
|
-
})(this, (function (exports, i4, i0, i1, kwikidToolkit, i2,
|
|
6
|
-
|
|
7
|
-
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
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('@taiga-ui/core'), require('@taiga-ui/kit'), require('rxjs/operators'), require('@taiga-ui/cdk'), require('@angular/platform-browser'), require('@angular/animations'), require('lodash/cloneDeep'), 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', '@taiga-ui/core', '@taiga-ui/kit', 'rxjs/operators', '@taiga-ui/cdk', '@angular/platform-browser', '@angular/animations', 'lodash/cloneDeep', '@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["@taiga-ui/core"], global["@taiga-ui/kit"], global.rxjs.operators, global["@taiga-ui/cdk"], global.ng.platformBrowser, global.ng.animations, global.cloneDeep, global.ng.common.http));
|
|
5
|
+
})(this, (function (exports, i4, i0, i1, kwikidToolkit, i2, i3, i3$1, i4$1, operators, cdk, i1$1, animations, cloneDeep, http) { 'use strict';
|
|
8
6
|
|
|
9
7
|
function _interopNamespace(e) {
|
|
10
8
|
if (e && e.__esModule) return e;
|
|
@@ -28,7 +26,6 @@
|
|
|
28
26
|
var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
|
|
29
27
|
var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
|
|
30
28
|
var i2__namespace = /*#__PURE__*/_interopNamespace(i2);
|
|
31
|
-
var ___default = /*#__PURE__*/_interopDefaultLegacy(_);
|
|
32
29
|
var i3__namespace = /*#__PURE__*/_interopNamespace(i3);
|
|
33
30
|
var i3__namespace$1 = /*#__PURE__*/_interopNamespace(i3$1);
|
|
34
31
|
var i4__namespace$1 = /*#__PURE__*/_interopNamespace(i4$1);
|
|
@@ -791,7 +788,7 @@
|
|
|
791
788
|
basicElementCommonConfig.key = basicElementCommonConfig.key.replace(/\s/g, "_");
|
|
792
789
|
// Get Basic Element Config
|
|
793
790
|
var basicElementConfig = event.basicElementConfig;
|
|
794
|
-
this.elementConfig =
|
|
791
|
+
this.elementConfig = kwikidToolkit.mergeObjects(this.elementConfig, basicElementCommonConfig, basicElementConfig);
|
|
795
792
|
this.updateElement.emit({ elementConfig: this.elementConfig });
|
|
796
793
|
};
|
|
797
794
|
BasicElementConfigEditor.prototype.handleOnSave = function () {
|
|
@@ -1435,7 +1432,7 @@
|
|
|
1435
1432
|
};
|
|
1436
1433
|
Converter.prototype.updateFormConfigProperties = function (formConfig) {
|
|
1437
1434
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w;
|
|
1438
|
-
var
|
|
1435
|
+
var formViewProperties = {
|
|
1439
1436
|
header: {
|
|
1440
1437
|
title: {
|
|
1441
1438
|
hidden: false,
|
|
@@ -1457,13 +1454,13 @@
|
|
|
1457
1454
|
}
|
|
1458
1455
|
};
|
|
1459
1456
|
if (kwikidToolkit.checkObjectKeyExists(formConfig, "properties")) {
|
|
1460
|
-
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 :
|
|
1457
|
+
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;
|
|
1461
1458
|
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;
|
|
1462
|
-
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 :
|
|
1463
|
-
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 :
|
|
1464
|
-
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 :
|
|
1465
|
-
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 :
|
|
1466
|
-
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 :
|
|
1459
|
+
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;
|
|
1460
|
+
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;
|
|
1461
|
+
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;
|
|
1462
|
+
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;
|
|
1463
|
+
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;
|
|
1467
1464
|
formConfig.properties = {
|
|
1468
1465
|
header: {
|
|
1469
1466
|
title: {
|
|
@@ -1487,7 +1484,7 @@
|
|
|
1487
1484
|
};
|
|
1488
1485
|
}
|
|
1489
1486
|
else {
|
|
1490
|
-
formConfig.properties =
|
|
1487
|
+
formConfig.properties = formViewProperties;
|
|
1491
1488
|
}
|
|
1492
1489
|
return formConfig;
|
|
1493
1490
|
};
|
|
@@ -4169,6 +4166,7 @@
|
|
|
4169
4166
|
function KwikIDFormsListComponent() {
|
|
4170
4167
|
this.showFormFields = {};
|
|
4171
4168
|
this.userConfig = {};
|
|
4169
|
+
this.stepConfig = {};
|
|
4172
4170
|
this.activeFormConfig = {};
|
|
4173
4171
|
this.formsList = [];
|
|
4174
4172
|
this.formsListCompleted = [];
|
|
@@ -4179,24 +4177,32 @@
|
|
|
4179
4177
|
this.selectedForm = "";
|
|
4180
4178
|
this.formsListLength = 0;
|
|
4181
4179
|
this.isAllFormsCompleted = true;
|
|
4180
|
+
this.loading = false;
|
|
4182
4181
|
}
|
|
4183
4182
|
KwikIDFormsListComponent.prototype.setSelectedForm = function (selected_form) {
|
|
4184
4183
|
this.selectedForm = selected_form;
|
|
4185
4184
|
};
|
|
4186
4185
|
KwikIDFormsListComponent.prototype.ngOnInit = function () {
|
|
4187
4186
|
var _a, _b;
|
|
4187
|
+
this.loading = true;
|
|
4188
4188
|
this.setSelectedForm((_b = (_a = this.activeFormConfig) === null || _a === void 0 ? void 0 : _a.key) !== null && _b !== void 0 ? _b : "");
|
|
4189
|
+
this.stepConfig = this.formatStepConfig(this.stepConfig);
|
|
4189
4190
|
this.formsList = this.filterHiddenForms(this.formsList);
|
|
4190
4191
|
this.formsListLength = this.findFormsListLength(this.formsList);
|
|
4191
4192
|
this.isAllFormsCompleted = this.checkIsAllFormsCompleted(this.formsList);
|
|
4193
|
+
this.loading = false;
|
|
4192
4194
|
};
|
|
4193
4195
|
KwikIDFormsListComponent.prototype.ngOnChanges = function (changes) {
|
|
4196
|
+
var _a, _b;
|
|
4194
4197
|
var verifyChange = function (key) {
|
|
4195
4198
|
return kwikidToolkit.checkObjectKeyExists(changes, key) && !changes[key].firstChange;
|
|
4196
4199
|
};
|
|
4197
4200
|
if (verifyChange("showFormFields")) {
|
|
4198
4201
|
this.showFormFields = changes.showFormFields.currentValue;
|
|
4199
4202
|
}
|
|
4203
|
+
if (verifyChange("stepConfig")) {
|
|
4204
|
+
this.stepConfig = changes.stepConfig.currentValue;
|
|
4205
|
+
}
|
|
4200
4206
|
if (verifyChange("formsList")) {
|
|
4201
4207
|
this.formsList = this.filterHiddenForms(this.formsList);
|
|
4202
4208
|
this.formsListLength = this.findFormsListLength(this.formsList);
|
|
@@ -4210,9 +4216,29 @@
|
|
|
4210
4216
|
}
|
|
4211
4217
|
if (verifyChange("activeFormConfig")) {
|
|
4212
4218
|
this.activeFormConfig = changes.activeFormConfig.currentValue;
|
|
4213
|
-
this.setSelectedForm(this.activeFormConfig.key);
|
|
4219
|
+
this.setSelectedForm((_b = (_a = this.activeFormConfig) === null || _a === void 0 ? void 0 : _a.key) !== null && _b !== void 0 ? _b : "");
|
|
4214
4220
|
}
|
|
4215
4221
|
};
|
|
4222
|
+
KwikIDFormsListComponent.prototype.formatStepConfig = function (stepConfig) {
|
|
4223
|
+
var stepConfigProperties = {
|
|
4224
|
+
formListProperties: {
|
|
4225
|
+
footer: {
|
|
4226
|
+
submitFormButton: {
|
|
4227
|
+
hidden: false,
|
|
4228
|
+
label: "Submit"
|
|
4229
|
+
}
|
|
4230
|
+
}
|
|
4231
|
+
}
|
|
4232
|
+
};
|
|
4233
|
+
if (kwikidToolkit.checkObjectKeyExists(stepConfig, "props")) {
|
|
4234
|
+
stepConfigProperties = kwikidToolkit.mergeObjects(stepConfigProperties, stepConfig.props);
|
|
4235
|
+
stepConfig = kwikidToolkit.setValueToObjectPath(stepConfig, "props", stepConfigProperties);
|
|
4236
|
+
}
|
|
4237
|
+
else {
|
|
4238
|
+
stepConfig = kwikidToolkit.setValueToObjectPath(stepConfig, "props", stepConfigProperties);
|
|
4239
|
+
}
|
|
4240
|
+
return stepConfig;
|
|
4241
|
+
};
|
|
4216
4242
|
KwikIDFormsListComponent.prototype.filterHiddenForms = function (formsList) {
|
|
4217
4243
|
return formsList.filter(function (form) {
|
|
4218
4244
|
if (kwikidToolkit.checkObjectKeyExists(form, "hidden")) {
|
|
@@ -4281,10 +4307,13 @@
|
|
|
4281
4307
|
return KwikIDFormsListComponent;
|
|
4282
4308
|
}());
|
|
4283
4309
|
/** @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 });
|
|
4284
|
-
/** @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", activeFormConfig: "activeFormConfig", formsList: "formsList", formsListCompleted: "formsListCompleted", isMobileView: "isMobileView" }, outputs: { onClickSetActiveForm: "onClickSetActiveForm", onClickHideFormsList: "onClickHideFormsList", onClickSubmitForms: "onClickSubmitForms" }, usesOnChanges: true, ngImport: i0__namespace, template: "<div
|
|
4310
|
+
/** @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 }} <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: i2__namespace.KwikUIProgressSegmentedComponent, selector: "kwikui-progress-segmented", inputs: ["id", "value", "max", "size", "colors"] }, { type: i3__namespace$1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }, { type: i2__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 } });
|
|
4285
4311
|
__decorate([
|
|
4286
4312
|
kwikidToolkit.logMethod
|
|
4287
4313
|
], KwikIDFormsListComponent.prototype, "ngOnChanges", null);
|
|
4314
|
+
__decorate([
|
|
4315
|
+
kwikidToolkit.logMethod
|
|
4316
|
+
], KwikIDFormsListComponent.prototype, "formatStepConfig", null);
|
|
4288
4317
|
__decorate([
|
|
4289
4318
|
kwikidToolkit.logMethod
|
|
4290
4319
|
], KwikIDFormsListComponent.prototype, "filterHiddenForms", null);
|
|
@@ -4311,6 +4340,8 @@
|
|
|
4311
4340
|
type: i0.Input
|
|
4312
4341
|
}], userConfig: [{
|
|
4313
4342
|
type: i0.Input
|
|
4343
|
+
}], stepConfig: [{
|
|
4344
|
+
type: i0.Input
|
|
4314
4345
|
}], activeFormConfig: [{
|
|
4315
4346
|
type: i0.Input
|
|
4316
4347
|
}], formsList: [{
|
|
@@ -4325,7 +4356,7 @@
|
|
|
4325
4356
|
type: i0.Output
|
|
4326
4357
|
}], onClickSubmitForms: [{
|
|
4327
4358
|
type: i0.Output
|
|
4328
|
-
}], ngOnChanges: [], filterHiddenForms: [], findFormsListLength: [], checkIsAllFormsCompleted: [], handleOnClickSetActiveForm: [], handleOnSubmitForms: [] } });
|
|
4359
|
+
}], ngOnChanges: [], formatStepConfig: [], filterHiddenForms: [], findFormsListLength: [], checkIsAllFormsCompleted: [], handleOnClickSetActiveForm: [], handleOnSubmitForms: [] } });
|
|
4329
4360
|
|
|
4330
4361
|
var ERendererActionKey;
|
|
4331
4362
|
(function (ERendererActionKey) {
|
|
@@ -4998,7 +5029,7 @@
|
|
|
4998
5029
|
return KwikIDFormsRendererComponent;
|
|
4999
5030
|
}());
|
|
5000
5031
|
/** @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 });
|
|
5001
|
-
/** @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 [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=\"tuiIconCancel\"\n style=\"color: #fff !important\"\n >\n </tui-svg>\n</tui-push>\n", styles: [":host{position:relative}.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", "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$1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }], 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" }], animations: [
|
|
5032
|
+
/** @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=\"tuiIconCancel\"\n style=\"color: #fff !important\"\n >\n </tui-svg>\n</tui-push>\n", styles: [":host{position:relative}.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$1.TuiSvgComponent, selector: "tui-svg", inputs: ["src"] }], 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" }], animations: [
|
|
5002
5033
|
animations.trigger("panelInOut", [
|
|
5003
5034
|
animations.transition(":enter", [
|
|
5004
5035
|
animations.style({ transform: "translateY(100%)" }),
|