kwikid-forms 0.1.17 → 0.1.18
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 +4 -4
- package/bundles/kwikid-forms.umd.js.map +1 -1
- package/esm2015/lib/renderer/forms-list/forms-list.component.js +1 -1
- package/esm2015/lib/renderer/renderer.component.js +4 -4
- package/fesm2015/kwikid-forms.js +4 -4
- package/fesm2015/kwikid-forms.js.map +1 -1
- package/package.json +1 -1
|
@@ -2935,7 +2935,7 @@
|
|
|
2935
2935
|
return KwikIDFormsListComponent;
|
|
2936
2936
|
}());
|
|
2937
2937
|
/** @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 });
|
|
2938
|
-
/** @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 id=\"sidebar-container\">\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 [disabled]=\"false\"\n id=\"\"\n label=\"Submit\"\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)}
|
|
2938
|
+
/** @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 id=\"sidebar-container\">\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 [disabled]=\"false\"\n id=\"\"\n label=\"Submit\"\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.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: 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"] }, { type: i5__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "safeHtml": SafeHtmlPipe } });
|
|
2939
2939
|
__decorate([
|
|
2940
2940
|
kwikidToolkit.logMethod
|
|
2941
2941
|
], KwikIDFormsListComponent.prototype, "ngOnChanges", null);
|
|
@@ -3808,14 +3808,14 @@
|
|
|
3808
3808
|
form.type = "form";
|
|
3809
3809
|
}
|
|
3810
3810
|
if (kwikidToolkit.checkObjectKeyExists(form, "formContent")) {
|
|
3811
|
-
form.props.url
|
|
3811
|
+
form = kwikidToolkit.setValueToObjectPath(form, "props.url", form.formContent.url);
|
|
3812
3812
|
delete form["formContent"]["url"];
|
|
3813
3813
|
}
|
|
3814
3814
|
if (kwikidToolkit.isEmptyValue(form.formContent)) {
|
|
3815
3815
|
delete form["formContent"];
|
|
3816
3816
|
}
|
|
3817
3817
|
if (kwikidToolkit.checkObjectKeyExists(form, "title")) {
|
|
3818
|
-
form.props.title
|
|
3818
|
+
form = kwikidToolkit.setValueToObjectPath(form, "props.title", form.title);
|
|
3819
3819
|
delete form["title"];
|
|
3820
3820
|
}
|
|
3821
3821
|
return form;
|
|
@@ -4273,7 +4273,7 @@
|
|
|
4273
4273
|
return KwikIDFormsRendererComponent;
|
|
4274
4274
|
}());
|
|
4275
4275
|
/** @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 });
|
|
4276
|
-
/** @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 [formData]=\"this.activeFormData\"\n [apiCallResponse]=\"this.apiCallResponse\"\n [formsList]=\"this.formsList\"\n [allFormsData]=\"this.allFormsData\"\n [isMobileView]=\"this.isMobileView\"\n (onClickApiCall)=\"this.handleOnClickApiCall($event)\"\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);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-
|
|
4276
|
+
/** @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 [formData]=\"this.activeFormData\"\n [apiCallResponse]=\"this.apiCallResponse\"\n [formsList]=\"this.formsList\"\n [allFormsData]=\"this.allFormsData\"\n [isMobileView]=\"this.isMobileView\"\n (onClickApiCall)=\"this.handleOnClickApiCall($event)\"\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", "apiCallResponse", "isMobileView", "allFormsData", "formsList"], outputs: ["onClickViewForms", "onClickSaveForm", "onClickApiCall"] }, { 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: [
|
|
4277
4277
|
animations.trigger("panelInOut", [
|
|
4278
4278
|
animations.transition(":enter", [
|
|
4279
4279
|
animations.style({ transform: "translateY(100%)" }),
|