@cfstratos/ajsf-material
Version:
Angular JSON Schema Form builder using Angular Material UI
52 lines (51 loc) • 12.9 kB
JavaScript
import { __decorate, __param } from "tslib";
import { Component, Inject, Input, Optional } from '@angular/core';
import { JsonSchemaFormService } from '@cfstratos/ajsf-core';
import { MAT_LABEL_GLOBAL_OPTIONS } from '@angular/material/core';
import { MAT_FORM_FIELD_DEFAULT_OPTIONS } from '@angular/material/form-field';
var MaterialTextareaComponent = /** @class */ (function () {
function MaterialTextareaComponent(matFormFieldDefaultOptions, matLabelGlobalOptions, jsf) {
this.matFormFieldDefaultOptions = matFormFieldDefaultOptions;
this.matLabelGlobalOptions = matLabelGlobalOptions;
this.jsf = jsf;
this.controlDisabled = false;
this.boundControl = false;
}
MaterialTextareaComponent.prototype.ngOnInit = function () {
this.options = this.layoutNode.options || {};
this.jsf.initializeControl(this);
if (!this.options.notitle && !this.options.description && this.options.placeholder) {
this.options.description = this.options.placeholder;
}
};
MaterialTextareaComponent.prototype.updateValue = function (event) {
this.jsf.updateValue(this, event.target.value);
};
MaterialTextareaComponent.ctorParameters = function () { return [
{ type: undefined, decorators: [{ type: Inject, args: [MAT_FORM_FIELD_DEFAULT_OPTIONS,] }, { type: Optional }] },
{ type: undefined, decorators: [{ type: Inject, args: [MAT_LABEL_GLOBAL_OPTIONS,] }, { type: Optional }] },
{ type: JsonSchemaFormService }
]; };
__decorate([
Input()
], MaterialTextareaComponent.prototype, "layoutNode", void 0);
__decorate([
Input()
], MaterialTextareaComponent.prototype, "layoutIndex", void 0);
__decorate([
Input()
], MaterialTextareaComponent.prototype, "dataIndex", void 0);
MaterialTextareaComponent = __decorate([
Component({
// tslint:disable-next-line:component-selector
selector: 'material-textarea-widget',
template: "\n <mat-form-field [appearance]=\"options?.appearance || matFormFieldDefaultOptions?.appearance || 'standard'\"\n [class]=\"options?.htmlClass || ''\"\n [floatLabel]=\"options?.floatLabel || matLabelGlobalOptions?.float || (options?.notitle ? 'never' : 'auto')\"\n [hideRequiredMarker]=\"options?.hideRequired ? 'true' : 'false'\"\n [style.width]=\"'100%'\">\n <mat-label *ngIf=\"!options?.notitle\">{{options?.title}}</mat-label>\n <span matPrefix *ngIf=\"options?.prefix || options?.fieldAddonLeft\"\n [innerHTML]=\"options?.prefix || options?.fieldAddonLeft\"></span>\n <textarea matInput *ngIf=\"boundControl\"\n [formControl]=\"formControl\"\n [attr.aria-describedby]=\"'control' + layoutNode?._id + 'Status'\"\n [attr.list]=\"'control' + layoutNode?._id + 'Autocomplete'\"\n [attr.maxlength]=\"options?.maxLength\"\n [attr.minlength]=\"options?.minLength\"\n [attr.pattern]=\"options?.pattern\"\n [required]=\"options?.required\"\n [id]=\"'control' + layoutNode?._id\"\n [name]=\"controlName\"\n [placeholder]=\"options?.notitle ? options?.placeholder : options?.title\"\n [readonly]=\"options?.readonly ? 'readonly' : null\"\n [style.width]=\"'100%'\"\n (blur)=\"options.showErrors = true\"></textarea>\n <textarea matInput *ngIf=\"!boundControl\"\n [attr.aria-describedby]=\"'control' + layoutNode?._id + 'Status'\"\n [attr.list]=\"'control' + layoutNode?._id + 'Autocomplete'\"\n [attr.maxlength]=\"options?.maxLength\"\n [attr.minlength]=\"options?.minLength\"\n [attr.pattern]=\"options?.pattern\"\n [required]=\"options?.required\"\n [disabled]=\"controlDisabled\"\n [id]=\"'control' + layoutNode?._id\"\n [name]=\"controlName\"\n [placeholder]=\"options?.notitle ? options?.placeholder : options?.title\"\n [readonly]=\"options?.readonly ? 'readonly' : null\"\n [style.width]=\"'100%'\"\n [value]=\"controlValue\"\n (input)=\"updateValue($event)\"\n (blur)=\"options.showErrors = true\"></textarea>\n <span matSuffix *ngIf=\"options?.suffix || options?.fieldAddonRight\"\n [innerHTML]=\"options?.suffix || options?.fieldAddonRight\"></span>\n <mat-hint *ngIf=\"options?.description && (!options?.showErrors || !options?.errorMessage)\"\n align=\"end\" [innerHTML]=\"options?.description\"></mat-hint>\n </mat-form-field>\n <mat-error *ngIf=\"options?.showErrors && options?.errorMessage\"\n [innerHTML]=\"options?.errorMessage\"></mat-error>",
styles: ["\n mat-error { font-size: 75%; margin-top: -1rem; margin-bottom: 0.5rem; }\n ::ng-deep json-schema-form mat-form-field .mat-form-field-wrapper .mat-form-field-flex\n .mat-form-field-infix { width: initial; }\n "]
}),
__param(0, Inject(MAT_FORM_FIELD_DEFAULT_OPTIONS)), __param(0, Optional()),
__param(1, Inject(MAT_LABEL_GLOBAL_OPTIONS)), __param(1, Optional())
], MaterialTextareaComponent);
return MaterialTextareaComponent;
}());
export { MaterialTextareaComponent };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibWF0ZXJpYWwtdGV4dGFyZWEuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGFqc2YvbWF0ZXJpYWwvIiwic291cmNlcyI6WyJsaWIvd2lkZ2V0cy9tYXRlcmlhbC10ZXh0YXJlYS5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IjtBQUNBLE9BQU8sRUFBQyxTQUFTLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBVSxRQUFRLEVBQUMsTUFBTSxlQUFlLENBQUM7QUFDekUsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDN0QsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDbEUsT0FBTyxFQUFFLDhCQUE4QixFQUFFLE1BQU0sOEJBQThCLENBQUM7QUF5RDlFO0lBV0UsbUNBQzZELDBCQUEwQixFQUNoQyxxQkFBcUIsRUFDbEUsR0FBMEI7UUFGeUIsK0JBQTBCLEdBQTFCLDBCQUEwQixDQUFBO1FBQ2hDLDBCQUFxQixHQUFyQixxQkFBcUIsQ0FBQTtRQUNsRSxRQUFHLEdBQUgsR0FBRyxDQUF1QjtRQVZwQyxvQkFBZSxHQUFHLEtBQUssQ0FBQztRQUN4QixpQkFBWSxHQUFHLEtBQUssQ0FBQztJQVVqQixDQUFDO0lBRUwsNENBQVEsR0FBUjtRQUNFLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxPQUFPLElBQUksRUFBRSxDQUFDO1FBQzdDLElBQUksQ0FBQyxHQUFHLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDakMsSUFBSSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsT0FBTyxJQUFJLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxXQUFXLElBQUksSUFBSSxDQUFDLE9BQU8sQ0FBQyxXQUFXLEVBQUU7WUFDbEYsSUFBSSxDQUFDLE9BQU8sQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDLE9BQU8sQ0FBQyxXQUFXLENBQUM7U0FDckQ7SUFDSCxDQUFDO0lBRUQsK0NBQVcsR0FBWCxVQUFZLEtBQUs7UUFDZixJQUFJLENBQUMsR0FBRyxDQUFDLFdBQVcsQ0FBQyxJQUFJLEVBQUUsS0FBSyxDQUFDLE1BQU0sQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNqRCxDQUFDOztnREFmRSxNQUFNLFNBQUMsOEJBQThCLGNBQUcsUUFBUTtnREFDaEQsTUFBTSxTQUFDLHdCQUF3QixjQUFHLFFBQVE7Z0JBQzlCLHFCQUFxQjs7SUFQM0I7UUFBUixLQUFLLEVBQUU7aUVBQWlCO0lBQ2hCO1FBQVIsS0FBSyxFQUFFO2tFQUF1QjtJQUN0QjtRQUFSLEtBQUssRUFBRTtnRUFBcUI7SUFUbEIseUJBQXlCO1FBdkRyQyxTQUFTLENBQUM7WUFDVCw4Q0FBOEM7WUFDOUMsUUFBUSxFQUFFLDBCQUEwQjtZQUNwQyxRQUFRLEVBQUUsNmtGQTZDMkM7cUJBQzVDLGdPQUlSO1NBQ0YsQ0FBQztRQWFHLFdBQUEsTUFBTSxDQUFDLDhCQUE4QixDQUFDLENBQUEsRUFBRSxXQUFBLFFBQVEsRUFBRSxDQUFBO1FBQ2xELFdBQUEsTUFBTSxDQUFDLHdCQUF3QixDQUFDLENBQUEsRUFBRSxXQUFBLFFBQVEsRUFBRSxDQUFBO09BYnBDLHlCQUF5QixDQTRCckM7SUFBRCxnQ0FBQztDQUFBLEFBNUJELElBNEJDO1NBNUJZLHlCQUF5QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFic3RyYWN0Q29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcbmltcG9ydCB7Q29tcG9uZW50LCBJbmplY3QsIElucHV0LCBPbkluaXQsIE9wdGlvbmFsfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEpzb25TY2hlbWFGb3JtU2VydmljZSB9IGZyb20gJ0BjZnN0cmF0b3MvYWpzZi1jb3JlJztcbmltcG9ydCB7IE1BVF9MQUJFTF9HTE9CQUxfT1BUSU9OUyB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2NvcmUnO1xuaW1wb3J0IHsgTUFUX0ZPUk1fRklFTERfREVGQVVMVF9PUFRJT05TIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvZm9ybS1maWVsZCc7XG5cbkBDb21wb25lbnQoe1xuICAvLyB0c2xpbnQ6ZGlzYWJsZS1uZXh0LWxpbmU6Y29tcG9uZW50LXNlbGVjdG9yXG4gIHNlbGVjdG9yOiAnbWF0ZXJpYWwtdGV4dGFyZWEtd2lkZ2V0JyxcbiAgdGVtcGxhdGU6IGBcbiAgICA8bWF0LWZvcm0tZmllbGQgW2FwcGVhcmFuY2VdPVwib3B0aW9ucz8uYXBwZWFyYW5jZSB8fCBtYXRGb3JtRmllbGREZWZhdWx0T3B0aW9ucz8uYXBwZWFyYW5jZSB8fCAnc3RhbmRhcmQnXCJcbiAgICAgIFtjbGFzc109XCJvcHRpb25zPy5odG1sQ2xhc3MgfHwgJydcIlxuICAgICAgW2Zsb2F0TGFiZWxdPVwib3B0aW9ucz8uZmxvYXRMYWJlbCB8fCBtYXRMYWJlbEdsb2JhbE9wdGlvbnM/LmZsb2F0IHx8IChvcHRpb25zPy5ub3RpdGxlID8gJ25ldmVyJyA6ICdhdXRvJylcIlxuICAgICAgW2hpZGVSZXF1aXJlZE1hcmtlcl09XCJvcHRpb25zPy5oaWRlUmVxdWlyZWQgPyAndHJ1ZScgOiAnZmFsc2UnXCJcbiAgICAgIFtzdHlsZS53aWR0aF09XCInMTAwJSdcIj5cbiAgICAgIDxtYXQtbGFiZWwgKm5nSWY9XCIhb3B0aW9ucz8ubm90aXRsZVwiPnt7b3B0aW9ucz8udGl0bGV9fTwvbWF0LWxhYmVsPlxuICAgICAgPHNwYW4gbWF0UHJlZml4ICpuZ0lmPVwib3B0aW9ucz8ucHJlZml4IHx8IG9wdGlvbnM/LmZpZWxkQWRkb25MZWZ0XCJcbiAgICAgICAgW2lubmVySFRNTF09XCJvcHRpb25zPy5wcmVmaXggfHwgb3B0aW9ucz8uZmllbGRBZGRvbkxlZnRcIj48L3NwYW4+XG4gICAgICA8dGV4dGFyZWEgbWF0SW5wdXQgKm5nSWY9XCJib3VuZENvbnRyb2xcIlxuICAgICAgICBbZm9ybUNvbnRyb2xdPVwiZm9ybUNvbnRyb2xcIlxuICAgICAgICBbYXR0ci5hcmlhLWRlc2NyaWJlZGJ5XT1cIidjb250cm9sJyArIGxheW91dE5vZGU/Ll9pZCArICdTdGF0dXMnXCJcbiAgICAgICAgW2F0dHIubGlzdF09XCInY29udHJvbCcgKyBsYXlvdXROb2RlPy5faWQgKyAnQXV0b2NvbXBsZXRlJ1wiXG4gICAgICAgIFthdHRyLm1heGxlbmd0aF09XCJvcHRpb25zPy5tYXhMZW5ndGhcIlxuICAgICAgICBbYXR0ci5taW5sZW5ndGhdPVwib3B0aW9ucz8ubWluTGVuZ3RoXCJcbiAgICAgICAgW2F0dHIucGF0dGVybl09XCJvcHRpb25zPy5wYXR0ZXJuXCJcbiAgICAgICAgW3JlcXVpcmVkXT1cIm9wdGlvbnM/LnJlcXVpcmVkXCJcbiAgICAgICAgW2lkXT1cIidjb250cm9sJyArIGxheW91dE5vZGU/Ll9pZFwiXG4gICAgICAgIFtuYW1lXT1cImNvbnRyb2xOYW1lXCJcbiAgICAgICAgW3BsYWNlaG9sZGVyXT1cIm9wdGlvbnM/Lm5vdGl0bGUgPyBvcHRpb25zPy5wbGFjZWhvbGRlciA6IG9wdGlvbnM/LnRpdGxlXCJcbiAgICAgICAgW3JlYWRvbmx5XT1cIm9wdGlvbnM/LnJlYWRvbmx5ID8gJ3JlYWRvbmx5JyA6IG51bGxcIlxuICAgICAgICBbc3R5bGUud2lkdGhdPVwiJzEwMCUnXCJcbiAgICAgICAgKGJsdXIpPVwib3B0aW9ucy5zaG93RXJyb3JzID0gdHJ1ZVwiPjwvdGV4dGFyZWE+XG4gICAgICA8dGV4dGFyZWEgbWF0SW5wdXQgKm5nSWY9XCIhYm91bmRDb250cm9sXCJcbiAgICAgICAgW2F0dHIuYXJpYS1kZXNjcmliZWRieV09XCInY29udHJvbCcgKyBsYXlvdXROb2RlPy5faWQgKyAnU3RhdHVzJ1wiXG4gICAgICAgIFthdHRyLmxpc3RdPVwiJ2NvbnRyb2wnICsgbGF5b3V0Tm9kZT8uX2lkICsgJ0F1dG9jb21wbGV0ZSdcIlxuICAgICAgICBbYXR0ci5tYXhsZW5ndGhdPVwib3B0aW9ucz8ubWF4TGVuZ3RoXCJcbiAgICAgICAgW2F0dHIubWlubGVuZ3RoXT1cIm9wdGlvbnM/Lm1pbkxlbmd0aFwiXG4gICAgICAgIFthdHRyLnBhdHRlcm5dPVwib3B0aW9ucz8ucGF0dGVyblwiXG4gICAgICAgIFtyZXF1aXJlZF09XCJvcHRpb25zPy5yZXF1aXJlZFwiXG4gICAgICAgIFtkaXNhYmxlZF09XCJjb250cm9sRGlzYWJsZWRcIlxuICAgICAgICBbaWRdPVwiJ2NvbnRyb2wnICsgbGF5b3V0Tm9kZT8uX2lkXCJcbiAgICAgICAgW25hbWVdPVwiY29udHJvbE5hbWVcIlxuICAgICAgICBbcGxhY2Vob2xkZXJdPVwib3B0aW9ucz8ubm90aXRsZSA/IG9wdGlvbnM/LnBsYWNlaG9sZGVyIDogb3B0aW9ucz8udGl0bGVcIlxuICAgICAgICBbcmVhZG9ubHldPVwib3B0aW9ucz8ucmVhZG9ubHkgPyAncmVhZG9ubHknIDogbnVsbFwiXG4gICAgICAgIFtzdHlsZS53aWR0aF09XCInMTAwJSdcIlxuICAgICAgICBbdmFsdWVdPVwiY29udHJvbFZhbHVlXCJcbiAgICAgICAgKGlucHV0KT1cInVwZGF0ZVZhbHVlKCRldmVudClcIlxuICAgICAgICAoYmx1cik9XCJvcHRpb25zLnNob3dFcnJvcnMgPSB0cnVlXCI+PC90ZXh0YXJlYT5cbiAgICAgIDxzcGFuIG1hdFN1ZmZpeCAqbmdJZj1cIm9wdGlvbnM/LnN1ZmZpeCB8fCBvcHRpb25zPy5maWVsZEFkZG9uUmlnaHRcIlxuICAgICAgICBbaW5uZXJIVE1MXT1cIm9wdGlvbnM/LnN1ZmZpeCB8fCBvcHRpb25zPy5maWVsZEFkZG9uUmlnaHRcIj48L3NwYW4+XG4gICAgICA8bWF0LWhpbnQgKm5nSWY9XCJvcHRpb25zPy5kZXNjcmlwdGlvbiAmJiAoIW9wdGlvbnM/LnNob3dFcnJvcnMgfHwgIW9wdGlvbnM/LmVycm9yTWVzc2FnZSlcIlxuICAgICAgICBhbGlnbj1cImVuZFwiIFtpbm5lckhUTUxdPVwib3B0aW9ucz8uZGVzY3JpcHRpb25cIj48L21hdC1oaW50PlxuICAgIDwvbWF0LWZvcm0tZmllbGQ+XG4gICAgPG1hdC1lcnJvciAqbmdJZj1cIm9wdGlvbnM/LnNob3dFcnJvcnMgJiYgb3B0aW9ucz8uZXJyb3JNZXNzYWdlXCJcbiAgICAgIFtpbm5lckhUTUxdPVwib3B0aW9ucz8uZXJyb3JNZXNzYWdlXCI+PC9tYXQtZXJyb3I+YCxcbiAgc3R5bGVzOiBbYFxuICAgIG1hdC1lcnJvciB7IGZvbnQtc2l6ZTogNzUlOyBtYXJnaW4tdG9wOiAtMXJlbTsgbWFyZ2luLWJvdHRvbTogMC41cmVtOyB9XG4gICAgOjpuZy1kZWVwIGpzb24tc2NoZW1hLWZvcm0gbWF0LWZvcm0tZmllbGQgLm1hdC1mb3JtLWZpZWxkLXdyYXBwZXIgLm1hdC1mb3JtLWZpZWxkLWZsZXhcbiAgICAgIC5tYXQtZm9ybS1maWVsZC1pbmZpeCB7IHdpZHRoOiBpbml0aWFsOyB9XG4gIGBdLFxufSlcbmV4cG9ydCBjbGFzcyBNYXRlcmlhbFRleHRhcmVhQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcbiAgZm9ybUNvbnRyb2w6IEFic3RyYWN0Q29udHJvbDtcbiAgY29udHJvbE5hbWU6IHN0cmluZztcbiAgY29udHJvbFZhbHVlOiBhbnk7XG4gIGNvbnRyb2xEaXNhYmxlZCA9IGZhbHNlO1xuICBib3VuZENvbnRyb2wgPSBmYWxzZTtcbiAgb3B0aW9uczogYW55O1xuICBASW5wdXQoKSBsYXlvdXROb2RlOiBhbnk7XG4gIEBJbnB1dCgpIGxheW91dEluZGV4OiBudW1iZXJbXTtcbiAgQElucHV0KCkgZGF0YUluZGV4OiBudW1iZXJbXTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBASW5qZWN0KE1BVF9GT1JNX0ZJRUxEX0RFRkFVTFRfT1BUSU9OUykgQE9wdGlvbmFsKCkgcHVibGljIG1hdEZvcm1GaWVsZERlZmF1bHRPcHRpb25zLFxuICAgIEBJbmplY3QoTUFUX0xBQkVMX0dMT0JBTF9PUFRJT05TKSBAT3B0aW9uYWwoKSBwdWJsaWMgbWF0TGFiZWxHbG9iYWxPcHRpb25zLFxuICAgIHByaXZhdGUganNmOiBKc29uU2NoZW1hRm9ybVNlcnZpY2VcbiAgKSB7IH1cblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLm9wdGlvbnMgPSB0aGlzLmxheW91dE5vZGUub3B0aW9ucyB8fCB7fTtcbiAgICB0aGlzLmpzZi5pbml0aWFsaXplQ29udHJvbCh0aGlzKTtcbiAgICBpZiAoIXRoaXMub3B0aW9ucy5ub3RpdGxlICYmICF0aGlzLm9wdGlvbnMuZGVzY3JpcHRpb24gJiYgdGhpcy5vcHRpb25zLnBsYWNlaG9sZGVyKSB7XG4gICAgICB0aGlzLm9wdGlvbnMuZGVzY3JpcHRpb24gPSB0aGlzLm9wdGlvbnMucGxhY2Vob2xkZXI7XG4gICAgfVxuICB9XG5cbiAgdXBkYXRlVmFsdWUoZXZlbnQpIHtcbiAgICB0aGlzLmpzZi51cGRhdGVWYWx1ZSh0aGlzLCBldmVudC50YXJnZXQudmFsdWUpO1xuICB9XG59XG4iXX0=