@rangertechnologies/ngnxt
Version:
This library was used for creating dymanic UI based on the input JSON/data
44 lines • 8.36 kB
JavaScript
// AP-29JAN25
import { Component, EventEmitter, Input, Output } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "../element/element.component";
import * as i2 from "../properties/properties.component";
export class FormComponent {
// Input data for app-element
// bookletJson: any = {}; // Replace with your actual JSON object
// bookletId: string = '123'; // Replace with your actual booklet ID
bookletJSON;
bookletId;
formButtonHandler = new EventEmitter();
templateSaveHandler = new EventEmitter();
// Input data for app-properties
// api: string = 'https://example.com/api'; // Replace with your actual API endpoint
// apiMethod: string = 'GET'; // Replace with your actual API method
selectedElementType = 'button'; // Replace with the default selected element type
isTemplateSelected = false;
onTemplateModeChange(status) {
this.isTemplateSelected = status;
}
// Event handler for app-element
formButtonHandlerClick(event) {
this.formButtonHandler.emit(event);
}
saveTemplate(event) {
this.templateSaveHandler.emit(event);
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FormComponent, selector: "app-form-builder", inputs: { bookletJSON: "bookletJSON", bookletId: "bookletId" }, outputs: { formButtonHandler: "formButtonHandler", templateSaveHandler: "templateSaveHandler" }, ngImport: i0, template: "<!-- AP-29JAN25 -->\n<div class=\"form-container \">\n <!-- app-element Component -->\n <!--AP-08APR25 Passes a boolean to indicate if a template is selected -->\n <app-element \n [bookletJSON]=\"bookletJSON\" \n [bookletId]=\"bookletId\"\n (templateMode)=\"onTemplateModeChange($event)\">\n </app-element>\n <!-- app-properties Component -->\n <!-- AP-08APR25 Emits an event when the template mode -->\n <app-properties \n (formButtonHandler)=\"formButtonHandlerClick($event)\"\n (templateSaveHandler)=\"saveTemplate($event)\"\n [templateSelected]=\"isTemplateSelected\">\n </app-properties>\n \n ", styles: [".form-container{display:flex;flex-wrap:wrap;border:10px solid #86A8CD}app-element{width:75%}app-properties{border-left:10px solid #86A8CD;width:25%}:host ::ng-deep .questiondiv1{padding-left:0!important;padding-right:0!important}:host ::ng-deep .form-group.content-box{padding-bottom:0!important}\n"], dependencies: [{ kind: "component", type: i1.ElementComponent, selector: "app-element", inputs: ["bookletJSON", "bookletId"], outputs: ["templateMode"] }, { kind: "component", type: i2.PropertiesComponent, selector: "app-properties", inputs: ["selectedElementType", "templateSelected"], outputs: ["formButtonHandler", "templateSaveHandler"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormComponent, decorators: [{
type: Component,
args: [{ selector: 'app-form-builder', template: "<!-- AP-29JAN25 -->\n<div class=\"form-container \">\n <!-- app-element Component -->\n <!--AP-08APR25 Passes a boolean to indicate if a template is selected -->\n <app-element \n [bookletJSON]=\"bookletJSON\" \n [bookletId]=\"bookletId\"\n (templateMode)=\"onTemplateModeChange($event)\">\n </app-element>\n <!-- app-properties Component -->\n <!-- AP-08APR25 Emits an event when the template mode -->\n <app-properties \n (formButtonHandler)=\"formButtonHandlerClick($event)\"\n (templateSaveHandler)=\"saveTemplate($event)\"\n [templateSelected]=\"isTemplateSelected\">\n </app-properties>\n \n ", styles: [".form-container{display:flex;flex-wrap:wrap;border:10px solid #86A8CD}app-element{width:75%}app-properties{border-left:10px solid #86A8CD;width:25%}:host ::ng-deep .questiondiv1{padding-left:0!important;padding-right:0!important}:host ::ng-deep .form-group.content-box{padding-bottom:0!important}\n"] }]
}], propDecorators: { bookletJSON: [{
type: Input
}], bookletId: [{
type: Input
}], formButtonHandler: [{
type: Output
}], templateSaveHandler: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZm9ybS5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9ueHQtYXBwL3NyYy9saWIvcGFnZXMvYnVpbGRlci9mb3JtL2Zvcm0uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvbnh0LWFwcC9zcmMvbGliL3BhZ2VzL2J1aWxkZXIvZm9ybS9mb3JtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWM7QUFDZCxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7O0FBT3ZFLE1BQU0sT0FBTyxhQUFhO0lBQ3hCLDZCQUE2QjtJQUM3QixpRUFBaUU7SUFDakUsb0VBQW9FO0lBQ3pELFdBQVcsQ0FBTTtJQUNqQixTQUFTLENBQU07SUFDZCxpQkFBaUIsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO0lBQy9DLG1CQUFtQixHQUFHLElBQUksWUFBWSxFQUFVLENBQUM7SUFFN0QsZ0NBQWdDO0lBQ2hDLG9GQUFvRjtJQUNwRixvRUFBb0U7SUFDcEUsbUJBQW1CLEdBQVcsUUFBUSxDQUFDLENBQUMsaURBQWlEO0lBQ3pGLGtCQUFrQixHQUFHLEtBQUssQ0FBQztJQUU3QixvQkFBb0IsQ0FBQyxNQUFlO1FBQ2xDLElBQUksQ0FBQyxrQkFBa0IsR0FBRyxNQUFNLENBQUM7SUFDbkMsQ0FBQztJQUVDLGdDQUFnQztJQUNoQyxzQkFBc0IsQ0FBQyxLQUFLO1FBQzFCLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDckMsQ0FBQztJQUVELFlBQVksQ0FBQyxLQUFVO1FBQ3JCLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDdkMsQ0FBQzt3R0ExQlUsYUFBYTs0RkFBYixhQUFhLHlOQ1IxQixxbkJBaUJFOzs0RkRUVyxhQUFhO2tCQUx6QixTQUFTOytCQUNFLGtCQUFrQjs4QkFRakIsV0FBVztzQkFBbkIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLO2dCQUNJLGlCQUFpQjtzQkFBMUIsTUFBTTtnQkFDRyxtQkFBbUI7c0JBQTVCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyIvLyBBUC0yOUpBTjI1IFxuaW1wb3J0IHsgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYXBwLWZvcm0tYnVpbGRlcicsXG4gIHRlbXBsYXRlVXJsOiAnLi9mb3JtLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vZm9ybS5jb21wb25lbnQuY3NzJ10sXG59KVxuZXhwb3J0IGNsYXNzIEZvcm1Db21wb25lbnQge1xuICAvLyBJbnB1dCBkYXRhIGZvciBhcHAtZWxlbWVudFxuICAvLyBib29rbGV0SnNvbjogYW55ID0ge307IC8vIFJlcGxhY2Ugd2l0aCB5b3VyIGFjdHVhbCBKU09OIG9iamVjdFxuICAvLyBib29rbGV0SWQ6IHN0cmluZyA9ICcxMjMnOyAvLyBSZXBsYWNlIHdpdGggeW91ciBhY3R1YWwgYm9va2xldCBJRFxuICAgIEBJbnB1dCgpIGJvb2tsZXRKU09OOiBhbnk7XG4gICAgQElucHV0KCkgYm9va2xldElkOiBhbnk7XG4gICAgQE91dHB1dCgpIGZvcm1CdXR0b25IYW5kbGVyID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XG4gICAgQE91dHB1dCgpIHRlbXBsYXRlU2F2ZUhhbmRsZXIgPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcblxuICAvLyBJbnB1dCBkYXRhIGZvciBhcHAtcHJvcGVydGllc1xuICAvLyBhcGk6IHN0cmluZyA9ICdodHRwczovL2V4YW1wbGUuY29tL2FwaSc7IC8vIFJlcGxhY2Ugd2l0aCB5b3VyIGFjdHVhbCBBUEkgZW5kcG9pbnRcbiAgLy8gYXBpTWV0aG9kOiBzdHJpbmcgPSAnR0VUJzsgLy8gUmVwbGFjZSB3aXRoIHlvdXIgYWN0dWFsIEFQSSBtZXRob2RcbiAgc2VsZWN0ZWRFbGVtZW50VHlwZTogc3RyaW5nID0gJ2J1dHRvbic7IC8vIFJlcGxhY2Ugd2l0aCB0aGUgZGVmYXVsdCBzZWxlY3RlZCBlbGVtZW50IHR5cGVcbiAgaXNUZW1wbGF0ZVNlbGVjdGVkID0gZmFsc2U7XG5cbm9uVGVtcGxhdGVNb2RlQ2hhbmdlKHN0YXR1czogYm9vbGVhbikge1xuICB0aGlzLmlzVGVtcGxhdGVTZWxlY3RlZCA9IHN0YXR1cztcbn1cblxuICAvLyBFdmVudCBoYW5kbGVyIGZvciBhcHAtZWxlbWVudFxuICBmb3JtQnV0dG9uSGFuZGxlckNsaWNrKGV2ZW50KXtcbiAgICB0aGlzLmZvcm1CdXR0b25IYW5kbGVyLmVtaXQoZXZlbnQpO1xuICB9XG5cbiAgc2F2ZVRlbXBsYXRlKGV2ZW50OiBhbnkpIHsgIFxuICAgIHRoaXMudGVtcGxhdGVTYXZlSGFuZGxlci5lbWl0KGV2ZW50KTtcbiAgfSAgXG4gIFxufVxuIiwiPCEtLSBBUC0yOUpBTjI1IC0tPlxuPGRpdiBjbGFzcz1cImZvcm0tY29udGFpbmVyIFwiPlxuICAgIDwhLS0gYXBwLWVsZW1lbnQgQ29tcG9uZW50IC0tPlxuICAgICA8IS0tQVAtMDhBUFIyNSBQYXNzZXMgYSBib29sZWFuIHRvIGluZGljYXRlIGlmIGEgdGVtcGxhdGUgaXMgc2VsZWN0ZWQgLS0+XG4gICAgPGFwcC1lbGVtZW50IFxuICAgIFtib29rbGV0SlNPTl09XCJib29rbGV0SlNPTlwiIFxuICAgIFtib29rbGV0SWRdPVwiYm9va2xldElkXCJcbiAgICAodGVtcGxhdGVNb2RlKT1cIm9uVGVtcGxhdGVNb2RlQ2hhbmdlKCRldmVudClcIj5cbiAgPC9hcHAtZWxlbWVudD5cbiAgIDwhLS0gYXBwLXByb3BlcnRpZXMgQ29tcG9uZW50IC0tPlxuICA8IS0tIEFQLTA4QVBSMjUgRW1pdHMgYW4gZXZlbnQgd2hlbiB0aGUgdGVtcGxhdGUgbW9kZSAtLT5cbiAgPGFwcC1wcm9wZXJ0aWVzIFxuICAoZm9ybUJ1dHRvbkhhbmRsZXIpPVwiZm9ybUJ1dHRvbkhhbmRsZXJDbGljaygkZXZlbnQpXCJcbiAgKHRlbXBsYXRlU2F2ZUhhbmRsZXIpPVwic2F2ZVRlbXBsYXRlKCRldmVudClcIlxuICBbdGVtcGxhdGVTZWxlY3RlZF09XCJpc1RlbXBsYXRlU2VsZWN0ZWRcIj5cbiA8L2FwcC1wcm9wZXJ0aWVzPlxuICBcbiAgIl19