kwikid-forms 0.1.4 → 0.1.5
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 +14 -3
- package/bundles/kwikid-forms.umd.js.map +1 -1
- package/esm2015/lib/renderer/renderer.component.js +16 -5
- package/fesm2015/kwikid-forms.js +14 -3
- package/fesm2015/kwikid-forms.js.map +1 -1
- package/lib/renderer/renderer.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -3872,7 +3872,17 @@
|
|
|
3872
3872
|
KwikIDFormsRendererComponent.prototype.ngOnInit = function () {
|
|
3873
3873
|
this.loader = true;
|
|
3874
3874
|
this.loading = true;
|
|
3875
|
-
this.
|
|
3875
|
+
var formStepKey = this.stepConfig.form.key;
|
|
3876
|
+
if (formStepKey !== undefined &&
|
|
3877
|
+
kwikidToolkit.checkObjectKeyExists(this.userConfig.userFormFields, formStepKey)) {
|
|
3878
|
+
this.rendererService.setFormsList(this.userConfig.userFormFields[formStepKey]);
|
|
3879
|
+
}
|
|
3880
|
+
else if (Array.isArray(this.userConfig.userFormFields)) {
|
|
3881
|
+
this.rendererService.setFormsList(this.userConfig.userFormFields);
|
|
3882
|
+
}
|
|
3883
|
+
else {
|
|
3884
|
+
throw new Error("userFormFields doesn't have a form defined with key: " + formStepKey);
|
|
3885
|
+
}
|
|
3876
3886
|
this.initializeForms();
|
|
3877
3887
|
this.loader = false;
|
|
3878
3888
|
};
|
|
@@ -3900,7 +3910,6 @@
|
|
|
3900
3910
|
case 0:
|
|
3901
3911
|
this.loader = true;
|
|
3902
3912
|
this.rendererService.setAllFormsData(this.formsData);
|
|
3903
|
-
console.log(JSON.parse(JSON.stringify(this.rendererService.formsList)));
|
|
3904
3913
|
this.rendererService.updateFormsList();
|
|
3905
3914
|
this.handleResize(this.rendererService.formsList);
|
|
3906
3915
|
if (!(this.rendererService.formsList.length !==
|
|
@@ -4070,7 +4079,7 @@
|
|
|
4070
4079
|
return KwikIDFormsRendererComponent;
|
|
4071
4080
|
}());
|
|
4072
4081
|
/** @nocollapse */ KwikIDFormsRendererComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.16", ngImport: i0__namespace, type: KwikIDFormsRendererComponent, deps: [{ token: KwikIDRendererService }, { token: i0__namespace.ElementRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
|
|
4073
|
-
/** @nocollapse */ KwikIDFormsRendererComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", type: KwikIDFormsRendererComponent, selector: "kwikid-forms-renderer", inputs: { userConfig: "userConfig", formsData: "formsData", apiCallResponse: "apiCallResponse" }, outputs: { onClickSubmit: "onClickSubmit", getFormData: "getFormData", onClickApiCall: "onClickApiCall" }, host: { listeners: { "window:resize": "windowResizeWatcher($event)" } }, providers: [KwikIDRendererService], usesOnChanges: true, ngImport: i0__namespace, template: "<div ngClass=\"kwikid-renderer\">\r\n <div\r\n ngClass=\"kwikid-layout-container\"\r\n *ngIf=\"!loading\"\r\n >\r\n <div\r\n ngClass=\"kwikid-sections-container\"\r\n *ngIf=\"showFormSections\"\r\n class=\"active\"\r\n [class.active]=\"showFormSections\"\r\n [class.mobile]=\"rendererService.isMobileView\"\r\n >\r\n <kwikid-forms-list\r\n [showFormFields]=\"this.showFormFields\"\r\n [userConfig]=\"this.userConfig\"\r\n [formsList]=\"this.rendererService.formsList\"\r\n [formsListCompleted]=\"this.rendererService.formsListCompleted\"\r\n [isMobileView]=\"this.rendererService.isMobileView\"\r\n (onClickSetActiveForm)=\"this.handleOnClickSetActiveForm($event)\"\r\n (onClickSubmitForms)=\"this.handleOnClickSubmitForms($event)\"\r\n ></kwikid-forms-list>\r\n </div>\r\n <div\r\n ngClass=\"kwikid-forms-container\"\r\n *ngIf=\"this.showForm && this.showFormFields\"\r\n [class.active]=\"showFormFields\"\r\n [class.mobile]=\"rendererService.isMobileView\"\r\n [@panelInOut]\r\n >\r\n <kwikid-form-view\r\n [formConfig]=\"this.rendererService.activeFormConfig\"\r\n [formData]=\"this.rendererService.activeFormData\"\r\n [apiCallResponse]=\"this.apiCallResponse\"\r\n [formsList]=\"this.rendererService.formsList\"\r\n [allFormsData]=\"this.rendererService.allFormsData\"\r\n [isMobileView]=\"this.rendererService.isMobileView\"\r\n (onClickApiCall)=\"this.handleOnClickApiCall($event)\"\r\n (onClickViewForms)=\"this.handleOnClickViewForms($event)\"\r\n (onClickSaveForm)=\"this.handleOnClickSaveForm($event)\"\r\n (getActiveFormData)=\"this.handleGetActiveFormData($event)\"\r\n ></kwikid-form-view>\r\n </div>\r\n </div>\r\n</div>\r\n<div\r\n ngClass=\"kwikid-forms-renderer-loader\"\r\n *ngIf=\"loader\"\r\n>\r\n <span class=\"loader\"></span>\r\n</div>\r\n<tui-push\r\n id=\"error-notification\"\r\n *tuiPush=\"showErrorNotification\"\r\n heading=\"Please complete the required Forms!\"\r\n type=\"Error\"\r\n (close)=\"toggleErrorNotification(false)\"\r\n>\r\n <tui-svg\r\n src=\"tuiIconCancel\"\r\n style=\"color: #fff !important\"\r\n >\r\n </tui-svg>\r\n</tui-push>\r\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);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-primary)}.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", "formsList", "formsListCompleted", "isMobileView"], outputs: ["onClickSetActiveForm", "onClickHideFormsList", "onClickSubmitForms"] }, { type: KwikIDFormViewComponent, selector: "kwikid-form-view", inputs: ["formConfig", "formData", "apiCallResponse", "isMobileView", "allFormsData", "formsList"], outputs: ["onClickViewForms", "onClickSaveForm", "onClickApiCall", "getActiveFormData"] }, { type: i4__namespace.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.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i4__namespace.TuiPushDirective, selector: "tui-push" }], animations: [
|
|
4082
|
+
/** @nocollapse */ KwikIDFormsRendererComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.16", 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)" } }, providers: [KwikIDRendererService], usesOnChanges: true, ngImport: i0__namespace, template: "<div ngClass=\"kwikid-renderer\">\r\n <div\r\n ngClass=\"kwikid-layout-container\"\r\n *ngIf=\"!loading\"\r\n >\r\n <div\r\n ngClass=\"kwikid-sections-container\"\r\n *ngIf=\"showFormSections\"\r\n class=\"active\"\r\n [class.active]=\"showFormSections\"\r\n [class.mobile]=\"rendererService.isMobileView\"\r\n >\r\n <kwikid-forms-list\r\n [showFormFields]=\"this.showFormFields\"\r\n [userConfig]=\"this.userConfig\"\r\n [formsList]=\"this.rendererService.formsList\"\r\n [formsListCompleted]=\"this.rendererService.formsListCompleted\"\r\n [isMobileView]=\"this.rendererService.isMobileView\"\r\n (onClickSetActiveForm)=\"this.handleOnClickSetActiveForm($event)\"\r\n (onClickSubmitForms)=\"this.handleOnClickSubmitForms($event)\"\r\n ></kwikid-forms-list>\r\n </div>\r\n <div\r\n ngClass=\"kwikid-forms-container\"\r\n *ngIf=\"this.showForm && this.showFormFields\"\r\n [class.active]=\"showFormFields\"\r\n [class.mobile]=\"rendererService.isMobileView\"\r\n [@panelInOut]\r\n >\r\n <kwikid-form-view\r\n [formConfig]=\"this.rendererService.activeFormConfig\"\r\n [formData]=\"this.rendererService.activeFormData\"\r\n [apiCallResponse]=\"this.apiCallResponse\"\r\n [formsList]=\"this.rendererService.formsList\"\r\n [allFormsData]=\"this.rendererService.allFormsData\"\r\n [isMobileView]=\"this.rendererService.isMobileView\"\r\n (onClickApiCall)=\"this.handleOnClickApiCall($event)\"\r\n (onClickViewForms)=\"this.handleOnClickViewForms($event)\"\r\n (onClickSaveForm)=\"this.handleOnClickSaveForm($event)\"\r\n (getActiveFormData)=\"this.handleGetActiveFormData($event)\"\r\n ></kwikid-form-view>\r\n </div>\r\n </div>\r\n</div>\r\n<div\r\n ngClass=\"kwikid-forms-renderer-loader\"\r\n *ngIf=\"loader\"\r\n>\r\n <span class=\"loader\"></span>\r\n</div>\r\n<tui-push\r\n id=\"error-notification\"\r\n *tuiPush=\"showErrorNotification\"\r\n heading=\"Please complete the required Forms!\"\r\n type=\"Error\"\r\n (close)=\"toggleErrorNotification(false)\"\r\n>\r\n <tui-svg\r\n src=\"tuiIconCancel\"\r\n style=\"color: #fff !important\"\r\n >\r\n </tui-svg>\r\n</tui-push>\r\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);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-primary)}.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", "formsList", "formsListCompleted", "isMobileView"], outputs: ["onClickSetActiveForm", "onClickHideFormsList", "onClickSubmitForms"] }, { type: KwikIDFormViewComponent, selector: "kwikid-form-view", inputs: ["formConfig", "formData", "apiCallResponse", "isMobileView", "allFormsData", "formsList"], outputs: ["onClickViewForms", "onClickSaveForm", "onClickApiCall", "getActiveFormData"] }, { type: i4__namespace.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.TuiPushAlertDirective, selector: "[tuiPush]", inputs: ["tuiPush"] }, { type: i4__namespace.TuiPushDirective, selector: "tui-push" }], animations: [
|
|
4074
4083
|
animations.trigger("panelInOut", [
|
|
4075
4084
|
animations.transition(":enter", [
|
|
4076
4085
|
animations.style({ transform: "translateY(100%)" }),
|
|
@@ -4106,6 +4115,8 @@
|
|
|
4106
4115
|
}], ctorParameters: function () { return [{ type: KwikIDRendererService }, { type: i0__namespace.ElementRef }]; }, propDecorators: { windowResizeWatcher: [{
|
|
4107
4116
|
type: i0.HostListener,
|
|
4108
4117
|
args: ["window:resize", ["$event"]]
|
|
4118
|
+
}], stepConfig: [{
|
|
4119
|
+
type: i0.Input
|
|
4109
4120
|
}], userConfig: [{
|
|
4110
4121
|
type: i0.Input
|
|
4111
4122
|
}], formsData: [{
|