UNPKG

@douglas-serena/ng-inputs

Version:
50 lines 7.58 kB
import { ChangeDetectorRef, Component, forwardRef, Input, ViewChild, } from '@angular/core'; import { ControlContainer, NG_VALUE_ACCESSOR } from '@angular/forms'; import { NgInputConfigService } from '../../core/ng-input-config.service'; import { InputCustomControlValueAccessor } from '../input-custom-control-value-accessor.domain'; export class NgTextAreaComponent extends InputCustomControlValueAccessor { constructor(controlContainer, configService, changeDetectorRef) { super(controlContainer, configService, changeDetectorRef); this.controlContainer = controlContainer; this.configService = configService; this.length = 300; this.rows = 100; } ngOnInit() { this.ngOnInitSuper(); } get className() { const validField = this.control.valid && this.control.touched; const invalidField = this.control.invalid && this.control.touched; return { floating: this.field === 'floating', readonly: this.readonly, 'is-invalid': !this.readonly && invalidField, 'is-valid': validField, }; } } NgTextAreaComponent.decorators = [ { type: Component, args: [{ selector: 'dss-text-area', template: "<div\r\n class=\"form-group form-control-text-area\"\r\n [ngClass]=\"{\r\n invalid: control.invalid && control.touched,\r\n valid: control.valid && control.touched,\r\n 'form-group-counter': !!length,\r\n 'form-group-help': !!help,\r\n 'form-group-label': !!label,\r\n active: !!control?.value\r\n }\"\r\n>\r\n <div class=\"form-content\">\r\n <!-- TEXT AREA -->\r\n <textarea\r\n #textarea\r\n [id]=\"name\"\r\n [readonly]=\"readonly\"\r\n [formControl]=\"control\"\r\n class=\"form-control\"\r\n [cols]=\"cols\"\r\n [maxlength]=\"length\"\r\n [ngStyle]=\"{ height: rows + 'px' }\"\r\n [ngClass]=\"className\"\r\n (blur)=\"blur.emit($event)\"\r\n (focus)=\"focus.emit($event)\"\r\n ></textarea>\r\n\r\n <!-- BORDER -->\r\n <span class=\"focus-border\">\r\n <i></i>\r\n </span>\r\n\r\n <!-- LABEL -->\r\n <label *ngIf=\"label\" [for]=\"name\">\r\n {{ label }}<span *ngIf=\"required\" class=\"required\">*</span>\r\n </label>\r\n </div>\r\n\r\n <ng-container *ngFor=\"let error of getKeys(errors)\">\r\n <!-- MESSAGE ERROR -->\r\n <div *ngIf=\"getError(error)\" class=\"message error\">\r\n {{ errors[error] }}\r\n </div>\r\n </ng-container>\r\n\r\n <!-- MESSAGE HELp -->\r\n <div *ngIf=\"!!help\" class=\"message\">\r\n {{ help }}\r\n </div>\r\n\r\n <!-- COUNTER CHARACTER -->\r\n <div class=\"counter\" *ngIf=\"!!length\">\r\n {{ !!control.value ? control.value.length : 0 }}/{{ length }}\r\n </div>\r\n</div>\r\n", providers: [ { provide: NG_VALUE_ACCESSOR, multi: true, useExisting: forwardRef(() => NgTextAreaComponent), }, ] },] } ]; NgTextAreaComponent.ctorParameters = () => [ { type: ControlContainer }, { type: NgInputConfigService }, { type: ChangeDetectorRef } ]; NgTextAreaComponent.propDecorators = { textarea: [{ type: ViewChild, args: ['textarea', { static: true },] }], length: [{ type: Input }], rows: [{ type: Input }] }; //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctdGV4dC1hcmVhLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25nLWlucHV0cy9zcmMvbGliL25nLWlucHV0L25nLXRleHQtYXJlYS9uZy10ZXh0LWFyZWEuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxpQkFBaUIsRUFDakIsU0FBUyxFQUVULFVBQVUsRUFDVixLQUFLLEVBRUwsU0FBUyxHQUNWLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQ3JFLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLG9DQUFvQyxDQUFDO0FBQzFFLE9BQU8sRUFBRSwrQkFBK0IsRUFBRSxNQUFNLCtDQUErQyxDQUFDO0FBYWhHLE1BQU0sT0FBTyxtQkFBb0IsU0FBUSwrQkFBK0I7SUFNdEUsWUFDWSxnQkFBa0MsRUFDckMsYUFBbUMsRUFDMUMsaUJBQW9DO1FBRXBDLEtBQUssQ0FBQyxnQkFBZ0IsRUFBRSxhQUFhLEVBQUUsaUJBQWlCLENBQUMsQ0FBQztRQUpoRCxxQkFBZ0IsR0FBaEIsZ0JBQWdCLENBQWtCO1FBQ3JDLGtCQUFhLEdBQWIsYUFBYSxDQUFzQjtRQUxuQyxXQUFNLEdBQW9CLEdBQUcsQ0FBQztRQUM5QixTQUFJLEdBQVcsR0FBRyxDQUFDO0lBUTVCLENBQUM7SUFFRCxRQUFRO1FBQ04sSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO0lBQ3ZCLENBQUM7SUFFRCxJQUFJLFNBQVM7UUFDWCxNQUFNLFVBQVUsR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQztRQUM5RCxNQUFNLFlBQVksR0FBRyxJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sSUFBSSxJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQztRQUNsRSxPQUFPO1lBQ0wsUUFBUSxFQUFFLElBQUksQ0FBQyxLQUFLLEtBQUssVUFBVTtZQUNuQyxRQUFRLEVBQUUsSUFBSSxDQUFDLFFBQVE7WUFDdkIsWUFBWSxFQUFFLENBQUMsSUFBSSxDQUFDLFFBQVEsSUFBSSxZQUFZO1lBQzVDLFVBQVUsRUFBRSxVQUFVO1NBQ3ZCLENBQUM7SUFDSixDQUFDOzs7WUF0Q0YsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSxlQUFlO2dCQUN6QixpaURBQTRDO2dCQUM1QyxTQUFTLEVBQUU7b0JBQ1Q7d0JBQ0UsT0FBTyxFQUFFLGlCQUFpQjt3QkFDMUIsS0FBSyxFQUFFLElBQUk7d0JBQ1gsV0FBVyxFQUFFLFVBQVUsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxtQkFBbUIsQ0FBQztxQkFDbkQ7aUJBQ0Y7YUFDRjs7O1lBZFEsZ0JBQWdCO1lBQ2hCLG9CQUFvQjtZQVQzQixpQkFBaUI7Ozt1QkF3QmhCLFNBQVMsU0FBQyxVQUFVLEVBQUUsRUFBRSxNQUFNLEVBQUUsSUFBSSxFQUFFO3FCQUV0QyxLQUFLO21CQUNMLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xyXG4gIENoYW5nZURldGVjdG9yUmVmLFxyXG4gIENvbXBvbmVudCxcclxuICBFbGVtZW50UmVmLFxyXG4gIGZvcndhcmRSZWYsXHJcbiAgSW5wdXQsXHJcbiAgT25Jbml0LFxyXG4gIFZpZXdDaGlsZCxcclxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ29udHJvbENvbnRhaW5lciwgTkdfVkFMVUVfQUNDRVNTT1IgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcbmltcG9ydCB7IE5nSW5wdXRDb25maWdTZXJ2aWNlIH0gZnJvbSAnLi4vLi4vY29yZS9uZy1pbnB1dC1jb25maWcuc2VydmljZSc7XHJcbmltcG9ydCB7IElucHV0Q3VzdG9tQ29udHJvbFZhbHVlQWNjZXNzb3IgfSBmcm9tICcuLi9pbnB1dC1jdXN0b20tY29udHJvbC12YWx1ZS1hY2Nlc3Nvci5kb21haW4nO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdkc3MtdGV4dC1hcmVhJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vbmctdGV4dC1hcmVhLmNvbXBvbmVudC5odG1sJyxcclxuICBwcm92aWRlcnM6IFtcclxuICAgIHtcclxuICAgICAgcHJvdmlkZTogTkdfVkFMVUVfQUNDRVNTT1IsXHJcbiAgICAgIG11bHRpOiB0cnVlLFxyXG4gICAgICB1c2VFeGlzdGluZzogZm9yd2FyZFJlZigoKSA9PiBOZ1RleHRBcmVhQ29tcG9uZW50KSxcclxuICAgIH0sXHJcbiAgXSxcclxufSlcclxuZXhwb3J0IGNsYXNzIE5nVGV4dEFyZWFDb21wb25lbnQgZXh0ZW5kcyBJbnB1dEN1c3RvbUNvbnRyb2xWYWx1ZUFjY2Vzc29yIHtcclxuICBAVmlld0NoaWxkKCd0ZXh0YXJlYScsIHsgc3RhdGljOiB0cnVlIH0pXHJcbiAgdGV4dGFyZWE6IEVsZW1lbnRSZWY8SFRNTFRleHRBcmVhRWxlbWVudD47XHJcbiAgQElucHV0KCkgbGVuZ3RoOiBudW1iZXIgfCBzdHJpbmcgPSAzMDA7XHJcbiAgQElucHV0KCkgcm93czogbnVtYmVyID0gMTAwO1xyXG5cclxuICBjb25zdHJ1Y3RvcihcclxuICAgIHByb3RlY3RlZCBjb250cm9sQ29udGFpbmVyOiBDb250cm9sQ29udGFpbmVyLFxyXG4gICAgcHVibGljIGNvbmZpZ1NlcnZpY2U6IE5nSW5wdXRDb25maWdTZXJ2aWNlLFxyXG4gICAgY2hhbmdlRGV0ZWN0b3JSZWY6IENoYW5nZURldGVjdG9yUmVmXHJcbiAgKSB7XHJcbiAgICBzdXBlcihjb250cm9sQ29udGFpbmVyLCBjb25maWdTZXJ2aWNlLCBjaGFuZ2VEZXRlY3RvclJlZik7XHJcbiAgfVxyXG5cclxuICBuZ09uSW5pdCgpIHtcclxuICAgIHRoaXMubmdPbkluaXRTdXBlcigpO1xyXG4gIH1cclxuXHJcbiAgZ2V0IGNsYXNzTmFtZSgpIHtcclxuICAgIGNvbnN0IHZhbGlkRmllbGQgPSB0aGlzLmNvbnRyb2wudmFsaWQgJiYgdGhpcy5jb250cm9sLnRvdWNoZWQ7XHJcbiAgICBjb25zdCBpbnZhbGlkRmllbGQgPSB0aGlzLmNvbnRyb2wuaW52YWxpZCAmJiB0aGlzLmNvbnRyb2wudG91Y2hlZDtcclxuICAgIHJldHVybiB7XHJcbiAgICAgIGZsb2F0aW5nOiB0aGlzLmZpZWxkID09PSAnZmxvYXRpbmcnLFxyXG4gICAgICByZWFkb25seTogdGhpcy5yZWFkb25seSxcclxuICAgICAgJ2lzLWludmFsaWQnOiAhdGhpcy5yZWFkb25seSAmJiBpbnZhbGlkRmllbGQsXHJcbiAgICAgICdpcy12YWxpZCc6IHZhbGlkRmllbGQsXHJcbiAgICB9O1xyXG4gIH1cclxufVxyXG4iXX0=