import { __decorate } from "tslib";
import { Component, Input, ViewChild, Output, EventEmitter, ChangeDetectorRef, OnDestroy, AfterViewInit, ViewEncapsulation, ElementRef } from '@angular/core';
import * as uuid from 'uuid';
let InputControlComponent = class InputControlComponent {
    constructor(ref) {
        this.ref = ref;
        this.name = uuid.v4();
        this.appearance = 'legacy ';
        this.type = 'text';
        this.step = 0.01;
        this.modelChange = new EventEmitter();
        this.icon = 'fa fa-search';
        // tslint:disable-next-line: no-output-native
        this.click = new EventEmitter();
        this.sdClick = new EventEmitter();
        // tslint:disable-next-line: no-output-native
        this.change = new EventEmitter();
        this.sdChange = new EventEmitter();
        this.sdFocus = new EventEmitter();
        this.keyupEnter = new EventEmitter();
        this.reValidate = () => {
            var _a;
            (_a = this.formModel) === null || _a === void 0 ? void 0 : _a.control.updateValueAndValidity({ onlySelf: false, emitEvent: true });
        };
        this.onFocus = () => {
            this.sdFocus.emit();
        };
        this.blur = () => {
            $(this.control.nativeElement).trigger('blur');
        };
    }
    set model(value) {
        this._model = value;
        this.ref.detectChanges();
    }
    ngAfterViewInit() {
        var _a;
        (_a = this.form) === null || _a === void 0 ? void 0 : _a.addControl(this.formModel);
    }
    ngOnDestroy() {
        var _a;
        (_a = this.form) === null || _a === void 0 ? void 0 : _a.removeControl(this.formModel);
    }
    onChange(value) {
        this._model = value;
        this.modelChange.emit(this._model);
        this.change.emit(this._model);
        this.sdChange.emit(this._model);
    }
    onKeyupEnter() {
        this.keyupEnter.emit(this._model);
    }
    onClick() {
        this.click.emit(this._model);
        this.sdClick.emit(this._model);
    }
};
InputControlComponent.ctorParameters = () => [
    { type: ChangeDetectorRef }
];
__decorate([
    Input()
], InputControlComponent.prototype, "appearance", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "form", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "label", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "placeholder", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "type", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "step", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "model", null);
__decorate([
    Output()
], InputControlComponent.prototype, "modelChange", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "required", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "maxlength", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "pattern", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "disabled", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "icon", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "validator", void 0);
__decorate([
    Input()
], InputControlComponent.prototype, "tooltip", void 0);
__decorate([
    Output()
], InputControlComponent.prototype, "click", void 0);
__decorate([
    Output()
], InputControlComponent.prototype, "sdClick", void 0);
__decorate([
    Output()
], InputControlComponent.prototype, "change", void 0);
__decorate([
    Output()
], InputControlComponent.prototype, "sdChange", void 0);
__decorate([
    Output()
], InputControlComponent.prototype, "sdFocus", void 0);
__decorate([
    Output()
], InputControlComponent.prototype, "keyupEnter", void 0);
__decorate([
    ViewChild('control')
], InputControlComponent.prototype, "control", void 0);
__decorate([
    ViewChild('formModel')
], InputControlComponent.prototype, "formModel", void 0);
InputControlComponent = __decorate([
    Component({
        selector: 'sd-input-control',
        template: "<mat-form-field class=\"sd-form\" [ngClass]=\"{'sd-form-with-information':tooltip}\" appearance=\"outline\">\r\n  <mat-label *ngIf=\"label\">{{label}}</mat-label>\r\n  <input class=\"sd-input\" #formModel=\"ngModel\" [type]=\"type\" [name]=\"name\" #control matInput\r\n    placeholder=\"{{placeholder || label}}\" [ngModel]=\"_model\" (ngModelChange)=\"onChange($event)\"\r\n    (keyup.enter)=\"onKeyupEnter()\" (focus)=\"onFocus()\" [required]=\"required\" [maxlength]=\"maxlength\" [pattern]=\"pattern\"\r\n    [disabled]=\"disabled\" [sdCustomValidator]=\"validator\" autocomplete=\"off\">\r\n  <span class=\"mr-1\" *ngIf=\"maxlength\" matSuffix>{{_model?.length || 0}}/{{maxlength}}</span>\r\n  <i *ngIf=\"click?.observers?.length || sdClick?.observers?.length\" [className]=\"icon\" (click)=\"onClick()\"\r\n    style=\"cursor:pointer\" matSuffix></i>\r\n\r\n  <mat-error *ngIf=\"formModel?.errors?.required\">\r\n    {{'This field is required' | sdTranslate}}\r\n  </mat-error>\r\n  <mat-error *ngIf=\"formModel?.errors?.maxlength\">\r\n    {{'Max length' | sdTranslate}} <strong>{{maxlength}}</strong>\r\n  </mat-error>\r\n  <mat-error *ngIf=\"formModel?.errors?.pattern\">\r\n    {{'Pattern error' | sdTranslate}}\r\n  </mat-error>\r\n  <mat-error *ngIf=\"formModel?.errors?.customValidator\">\r\n    <strong>{{formModel?.errors?.customValidator}}</strong>\r\n  </mat-error>\r\n</mat-form-field>\r\n<div *ngIf=\"tooltip\" class=\"sd-information\">\r\n  <i class=\"fa fa-info-circle fa-fw\" [matTooltip]=\"_model | inputTooltipPipe:tooltip\" (click)=\"sdTooltip.toggle()\" #sdTooltip=\"matTooltip\"></i>\r\n</div>",
        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}"]
    })
], InputControlComponent);
export { InputControlComponent };
//# sourceMappingURL=data:application/json;base64, 