import { __decorate } from "tslib";
import { Component, Input, ViewChild, Output, EventEmitter, ChangeDetectorRef, AfterViewInit, OnDestroy, ViewEncapsulation } from '@angular/core';
import * as uuid from 'uuid';
var TextareaControlComponent = /** @class */ (function () {
    function TextareaControlComponent(ref) {
        this.ref = ref;
        this.name = uuid.v4();
        this.rows = 5;
        this.modelChange = new EventEmitter();
    }
    Object.defineProperty(TextareaControlComponent.prototype, "model", {
        set: function (value) {
            this.ref.detectChanges();
            // setTimeout(() => {
            //     this._model = value;
            // }, 0);
            this._model = value;
        },
        enumerable: true,
        configurable: true
    });
    TextareaControlComponent.prototype.ngAfterViewInit = function () {
        if (this.form && this.formModel) {
            this.form.addControl(this.formModel);
        }
    };
    TextareaControlComponent.prototype.ngOnDestroy = function () {
        if (this.form && this.formModel) {
            this.form.removeControl(this.formModel);
        }
    };
    TextareaControlComponent.prototype.onChange = function (value) {
        this._model = value;
        this.modelChange.emit(this._model);
    };
    TextareaControlComponent.ctorParameters = function () { return [
        { type: ChangeDetectorRef }
    ]; };
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "form", void 0);
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "label", void 0);
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "placeholder", void 0);
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "rows", void 0);
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "model", null);
    __decorate([
        Output()
    ], TextareaControlComponent.prototype, "modelChange", void 0);
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "required", void 0);
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "maxlength", void 0);
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "pattern", void 0);
    __decorate([
        Input()
    ], TextareaControlComponent.prototype, "disabled", void 0);
    __decorate([
        ViewChild('formModel')
    ], TextareaControlComponent.prototype, "formModel", void 0);
    TextareaControlComponent = __decorate([
        Component({
            selector: 'sd-textarea-control',
            template: "<mat-form-field class=\"sd-form\" appearance=\"outline\">\r\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n  <textarea class=\"sd-input\" #formModel=\"ngModel\" [name]=\"name\" matInput placeholder=\"{{placeholder || label}}\" [ngModel]=\"_model\"\r\n    (ngModelChange)=\"onChange($event)\" [required]=\"required\" [disabled]=\"disabled\" autocomplete=\"off\" [rows]=\"rows\" [maxlength]=\"maxlength\"></textarea>\r\n  <span *ngIf=\"maxlength\" matSuffix>{{_model?.length || 0}}/{{maxlength}}</span>\r\n  <mat-error *ngIf=\"formModel?.errors?.required\">\r\n    {{'This field is required' | sdTranslate}}\r\n  </mat-error>\r\n</mat-form-field>",
            encapsulation: ViewEncapsulation.None,
            styles: [".sd-form{width:100%;font-size:12px}.sd-form.sd-form-with-information{width:calc(100% - 30px)}.sd-form .sd-input,.sd-form .sd-select{font-size:14px}.sd-form .sd-input::-webkit-input-placeholder,.sd-form .sd-select::-webkit-input-placeholder{font-size:12px!important}.sd-form .sd-input::-moz-placeholder,.sd-form .sd-select::-moz-placeholder{font-size:12px!important}.sd-form .sd-input::-ms-input-placeholder,.sd-form .sd-select::-ms-input-placeholder{font-size:12px!important}.sd-form .sd-input::placeholder,.sd-form .sd-select::placeholder{font-size:12px!important}@media (max-width:768px){.sd-form{font-size:10px}}.sd-form.sd-form-sm{font-size:10px}.sd-form.sd-form-xs{font-size:8px}.sd-form.mat-form-field-appearance-outline .mat-form-field-infix{padding:.7em 0}.sd-form.mat-form-field-appearance-outline.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label,.sd-form.mat-form-field-appearance-outline.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label{color:#333}.sd-form .mat-form-field-required-marker{color:#ff4081}.sd-form.mat-form-field-appearance-legacy.mat-form-field-can-float .mat-input-server:focus+.mat-form-field-label-wrapper .mat-form-field-label,.sd-form.mat-form-field-appearance-legacy.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label{transform:translateY(-1.28125em) scale(.9);color:#333}.sd-information{display:inline-block;text-align:center;margin:auto;width:30px}sd-grid-control .mat-form-field-wrapper{padding-bottom:0}.cdk-overlay-container .mat-option{font-size:12px}.swal2-popup .swal2-content .swal2-html-container{line-height:1.7;color:#7c7c7e}.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month{opacity:1;cursor:pointer}.daterangepicker{z-index:99999}", "textarea.mat-input-element{resize:none}"]
        })
    ], TextareaControlComponent);
    return TextareaControlComponent;
}());
export { TextareaControlComponent };
//# sourceMappingURL=data:application/json;base64, 