design-angular-kit
Version:
Un toolkit Angular conforme alle linee guida di design per i servizi web della PA
55 lines • 11 kB
JavaScript
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { ItAbstractFormComponent } from '../../../abstracts/abstract-form.component';
import { AsyncPipe } from '@angular/common';
import { ReactiveFormsModule } from '@angular/forms';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
export class ItTextareaComponent extends ItAbstractFormComponent {
constructor() {
super(...arguments);
/**
* Textarea Rows
* @default 3
*/
this.rows = 3;
/**
* The textarea placeholder
*/
this.placeholder = '';
}
/**
* Return the invalid message string from TranslateService
*/
get invalidMessage() {
if (this.hasError('maxlength')) {
const error = this.getError('maxlength');
return this._translateService.get('it.errors.max-length-invalid', { max: error.requiredLength });
}
if (this.hasError('pattern')) {
const error = this.getError('pattern');
return this._translateService.get('it.errors.pattern-invalid', { pattern: error.requiredPattern });
}
return super.invalidMessage;
}
/**
* Check is readonly field
*/
get isReadonly() {
return this.readonly === 'plaintext' || !!this.readonly;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTextareaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.0.6", type: ItTextareaComponent, isStandalone: true, selector: "it-textarea", inputs: { rows: "rows", placeholder: "placeholder", description: "description", readonly: "readonly" }, usesInheritance: true, ngImport: i0, template: "<div class=\"form-group\">\n @if (label) {\n <label [for]=\"id\" [class.active]=\"!!control.value || !!placeholder\">{{ label }}</label>\n }\n <textarea\n [id]=\"id\"\n [rows]=\"rows\"\n [class.form-control]=\"readonly !== 'plaintext'\"\n [class.form-control-plaintext]=\"readonly === 'plaintext'\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [placeholder]=\"placeholder\"\n [formControl]=\"control\"\n [readonly]=\"isReadonly\"\n (blur)=\"markAsTouched()\"></textarea>\n\n @if (description) {\n <small [id]=\"id + '-description'\" class=\"form-text\">{{ description }}</small>\n }\n @if (isInvalid) {\n <div class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError><ng-content select=\"[error]\"></ng-content></div>\n @if (!customError.hasChildNodes()) {\n {{ invalidMessage | async }}\n }\n </div>\n }\n</div>\n", styles: ["textarea.is-invalid{border-color:#cc334d}\n"], dependencies: [{ kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.6", ngImport: i0, type: ItTextareaComponent, decorators: [{
type: Component,
args: [{ standalone: true, selector: 'it-textarea', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ReactiveFormsModule, AsyncPipe], template: "<div class=\"form-group\">\n @if (label) {\n <label [for]=\"id\" [class.active]=\"!!control.value || !!placeholder\">{{ label }}</label>\n }\n <textarea\n [id]=\"id\"\n [rows]=\"rows\"\n [class.form-control]=\"readonly !== 'plaintext'\"\n [class.form-control-plaintext]=\"readonly === 'plaintext'\"\n [class.is-invalid]=\"isInvalid\"\n [class.is-valid]=\"isValid\"\n [placeholder]=\"placeholder\"\n [formControl]=\"control\"\n [readonly]=\"isReadonly\"\n (blur)=\"markAsTouched()\"></textarea>\n\n @if (description) {\n <small [id]=\"id + '-description'\" class=\"form-text\">{{ description }}</small>\n }\n @if (isInvalid) {\n <div class=\"form-feedback just-validate-error-label\" [id]=\"id + '-error'\">\n <div #customError><ng-content select=\"[error]\"></ng-content></div>\n @if (!customError.hasChildNodes()) {\n {{ invalidMessage | async }}\n }\n </div>\n }\n</div>\n", styles: ["textarea.is-invalid{border-color:#cc334d}\n"] }]
}], propDecorators: { rows: [{
type: Input
}], placeholder: [{
type: Input
}], description: [{
type: Input
}], readonly: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGV4dGFyZWEuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZGVzaWduLWFuZ3VsYXIta2l0L3NyYy9saWIvY29tcG9uZW50cy9mb3JtL3RleHRhcmVhL3RleHRhcmVhLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2Rlc2lnbi1hbmd1bGFyLWtpdC9zcmMvbGliL2NvbXBvbmVudHMvZm9ybS90ZXh0YXJlYS90ZXh0YXJlYS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMxRSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUVyRixPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDNUMsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7OztBQVVyRCxNQUFNLE9BQU8sbUJBQW9CLFNBQVEsdUJBQWtEO0lBUjNGOztRQVNFOzs7V0FHRztRQUNNLFNBQUksR0FBWSxDQUFDLENBQUM7UUFFM0I7O1dBRUc7UUFDTSxnQkFBVyxHQUFXLEVBQUUsQ0FBQztLQW9DbkM7SUF0QkM7O09BRUc7SUFDSCxJQUFhLGNBQWM7UUFDekIsSUFBSSxJQUFJLENBQUMsUUFBUSxDQUFDLFdBQVcsQ0FBQyxFQUFFLENBQUM7WUFDL0IsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQyxXQUFXLENBQUMsQ0FBQztZQUN6QyxPQUFPLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxHQUFHLENBQUMsOEJBQThCLEVBQUUsRUFBRSxHQUFHLEVBQUUsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDLENBQUM7UUFDbkcsQ0FBQztRQUNELElBQUksSUFBSSxDQUFDLFFBQVEsQ0FBQyxTQUFTLENBQUMsRUFBRSxDQUFDO1lBQzdCLE1BQU0sS0FBSyxHQUFHLElBQUksQ0FBQyxRQUFRLENBQUMsU0FBUyxDQUFDLENBQUM7WUFDdkMsT0FBTyxJQUFJLENBQUMsaUJBQWlCLENBQUMsR0FBRyxDQUFDLDJCQUEyQixFQUFFLEVBQUUsT0FBTyxFQUFFLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQyxDQUFDO1FBQ3JHLENBQUM7UUFFRCxPQUFPLEtBQUssQ0FBQyxjQUFjLENBQUM7SUFDOUIsQ0FBQztJQUVEOztPQUVHO0lBQ0gsSUFBYyxVQUFVO1FBQ3RCLE9BQU8sSUFBSSxDQUFDLFFBQVEsS0FBSyxXQUFXLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDMUQsQ0FBQzs4R0E3Q1UsbUJBQW1CO2tHQUFuQixtQkFBbUIsc01DZGhDLG03QkE0QkEsb0dEaEJZLG1CQUFtQixxa0JBQUUsU0FBUzs7MkZBRTdCLG1CQUFtQjtrQkFSL0IsU0FBUztpQ0FDSSxJQUFJLFlBQ04sYUFBYSxtQkFHTix1QkFBdUIsQ0FBQyxNQUFNLFdBQ3RDLENBQUMsbUJBQW1CLEVBQUUsU0FBUyxDQUFDOzhCQU9oQyxJQUFJO3NCQUFaLEtBQUs7Z0JBS0csV0FBVztzQkFBbkIsS0FBSztnQkFLRyxXQUFXO3NCQUFuQixLQUFLO2dCQU9HLFFBQVE7c0JBQWhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSXRBYnN0cmFjdEZvcm1Db21wb25lbnQgfSBmcm9tICcuLi8uLi8uLi9hYnN0cmFjdHMvYWJzdHJhY3QtZm9ybS5jb21wb25lbnQnO1xuaW1wb3J0IHsgT2JzZXJ2YWJsZSB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgQXN5bmNQaXBlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IFJlYWN0aXZlRm9ybXNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XG5cbkBDb21wb25lbnQoe1xuICBzdGFuZGFsb25lOiB0cnVlLFxuICBzZWxlY3RvcjogJ2l0LXRleHRhcmVhJyxcbiAgdGVtcGxhdGVVcmw6ICcuL3RleHRhcmVhLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vdGV4dGFyZWEuY29tcG9uZW50LnNjc3MnXSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIGltcG9ydHM6IFtSZWFjdGl2ZUZvcm1zTW9kdWxlLCBBc3luY1BpcGVdLFxufSlcbmV4cG9ydCBjbGFzcyBJdFRleHRhcmVhQ29tcG9uZW50IGV4dGVuZHMgSXRBYnN0cmFjdEZvcm1Db21wb25lbnQ8c3RyaW5nIHwgbnVsbCB8IHVuZGVmaW5lZD4ge1xuICAvKipcbiAgICogVGV4dGFyZWEgUm93c1xuICAgKiBAZGVmYXVsdCAzXG4gICAqL1xuICBASW5wdXQoKSByb3dzPzogbnVtYmVyID0gMztcblxuICAvKipcbiAgICogVGhlIHRleHRhcmVhIHBsYWNlaG9sZGVyXG4gICAqL1xuICBASW5wdXQoKSBwbGFjZWhvbGRlcjogc3RyaW5nID0gJyc7XG5cbiAgLyoqXG4gICAqIFRoZSBpbnB1dCBkZXNjcmlwdGlvblxuICAgKi9cbiAgQElucHV0KCkgZGVzY3JpcHRpb246IHN0cmluZyB8IHVuZGVmaW5lZDtcblxuICAvKipcbiAgICogVG8gcHJldmVudCBtb2RpZmljYXRpb24gb2YgdGhlIGNvbnRhaW5lZCB2YWx1ZS5cbiAgICogLSA8Yj5wbGFpbnRleHQ8L2I+OiBSZWFkb25seSBmaWVsZCBpbiB0aGUgZm9ybSBzdHlsaXplZCBhcyBwbGFpbiB0ZXh0XG4gICAqIEBkZWZhdWx0IHVuZGVmaW5lZFxuICAgKi9cbiAgQElucHV0KCkgcmVhZG9ubHk6IGJvb2xlYW4gfCAncGxhaW50ZXh0JyB8IHVuZGVmaW5lZDtcblxuICAvKipcbiAgICogUmV0dXJuIHRoZSBpbnZhbGlkIG1lc3NhZ2Ugc3RyaW5nIGZyb20gVHJhbnNsYXRlU2VydmljZVxuICAgKi9cbiAgb3ZlcnJpZGUgZ2V0IGludmFsaWRNZXNzYWdlKCk6IE9ic2VydmFibGU8c3RyaW5nPiB7XG4gICAgaWYgKHRoaXMuaGFzRXJyb3IoJ21heGxlbmd0aCcpKSB7XG4gICAgICBjb25zdCBlcnJvciA9IHRoaXMuZ2V0RXJyb3IoJ21heGxlbmd0aCcpO1xuICAgICAgcmV0dXJuIHRoaXMuX3RyYW5zbGF0ZVNlcnZpY2UuZ2V0KCdpdC5lcnJvcnMubWF4LWxlbmd0aC1pbnZhbGlkJywgeyBtYXg6IGVycm9yLnJlcXVpcmVkTGVuZ3RoIH0pO1xuICAgIH1cbiAgICBpZiAodGhpcy5oYXNFcnJvcigncGF0dGVybicpKSB7XG4gICAgICBjb25zdCBlcnJvciA9IHRoaXMuZ2V0RXJyb3IoJ3BhdHRlcm4nKTtcbiAgICAgIHJldHVybiB0aGlzLl90cmFuc2xhdGVTZXJ2aWNlLmdldCgnaXQuZXJyb3JzLnBhdHRlcm4taW52YWxpZCcsIHsgcGF0dGVybjogZXJyb3IucmVxdWlyZWRQYXR0ZXJuIH0pO1xuICAgIH1cblxuICAgIHJldHVybiBzdXBlci5pbnZhbGlkTWVzc2FnZTtcbiAgfVxuXG4gIC8qKlxuICAgKiBDaGVjayBpcyByZWFkb25seSBmaWVsZFxuICAgKi9cbiAgcHJvdGVjdGVkIGdldCBpc1JlYWRvbmx5KCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLnJlYWRvbmx5ID09PSAncGxhaW50ZXh0JyB8fCAhIXRoaXMucmVhZG9ubHk7XG4gIH1cbn1cbiIsIjxkaXYgY2xhc3M9XCJmb3JtLWdyb3VwXCI+XG4gIEBpZiAobGFiZWwpIHtcbiAgICA8bGFiZWwgW2Zvcl09XCJpZFwiIFtjbGFzcy5hY3RpdmVdPVwiISFjb250cm9sLnZhbHVlIHx8ICEhcGxhY2Vob2xkZXJcIj57eyBsYWJlbCB9fTwvbGFiZWw+XG4gIH1cbiAgPHRleHRhcmVhXG4gICAgW2lkXT1cImlkXCJcbiAgICBbcm93c109XCJyb3dzXCJcbiAgICBbY2xhc3MuZm9ybS1jb250cm9sXT1cInJlYWRvbmx5ICE9PSAncGxhaW50ZXh0J1wiXG4gICAgW2NsYXNzLmZvcm0tY29udHJvbC1wbGFpbnRleHRdPVwicmVhZG9ubHkgPT09ICdwbGFpbnRleHQnXCJcbiAgICBbY2xhc3MuaXMtaW52YWxpZF09XCJpc0ludmFsaWRcIlxuICAgIFtjbGFzcy5pcy12YWxpZF09XCJpc1ZhbGlkXCJcbiAgICBbcGxhY2Vob2xkZXJdPVwicGxhY2Vob2xkZXJcIlxuICAgIFtmb3JtQ29udHJvbF09XCJjb250cm9sXCJcbiAgICBbcmVhZG9ubHldPVwiaXNSZWFkb25seVwiXG4gICAgKGJsdXIpPVwibWFya0FzVG91Y2hlZCgpXCI+PC90ZXh0YXJlYT5cblxuICBAaWYgKGRlc2NyaXB0aW9uKSB7XG4gICAgPHNtYWxsIFtpZF09XCJpZCArICctZGVzY3JpcHRpb24nXCIgY2xhc3M9XCJmb3JtLXRleHRcIj57eyBkZXNjcmlwdGlvbiB9fTwvc21hbGw+XG4gIH1cbiAgQGlmIChpc0ludmFsaWQpIHtcbiAgICA8ZGl2IGNsYXNzPVwiZm9ybS1mZWVkYmFjayBqdXN0LXZhbGlkYXRlLWVycm9yLWxhYmVsXCIgW2lkXT1cImlkICsgJy1lcnJvcidcIj5cbiAgICAgIDxkaXYgI2N1c3RvbUVycm9yPjxuZy1jb250ZW50IHNlbGVjdD1cIltlcnJvcl1cIj48L25nLWNvbnRlbnQ+PC9kaXY+XG4gICAgICBAaWYgKCFjdXN0b21FcnJvci5oYXNDaGlsZE5vZGVzKCkpIHtcbiAgICAgICAge3sgaW52YWxpZE1lc3NhZ2UgfCBhc3luYyB9fVxuICAgICAgfVxuICAgIDwvZGl2PlxuICB9XG48L2Rpdj5cbiJdfQ==