import { __decorate, __metadata } from "tslib";
import { FormGroupHelper } from '../../shared/form-group.helper';
import { Component, Input, ViewChild, ElementRef } from '@angular/core';
import { TranslateService } from "@ngx-translate/core";
import { FormControlBase } from "../form-control-base";
import { ValidationMessageService } from "../../core/validation-message.service";
import { Validators } from '@angular/forms';
/** Advanced validation for textbox form controls */
export const textboxValidation = (validatorParams) => {
    return (control) => {
        let validators = [];
        // Innocent until proven guilty
        validatorParams.valid = true;
        if (validatorParams.required) {
            validators.push(Validators.required);
        }
        if (validatorParams.minLength !== undefined) {
            validators.push(Validators.minLength(validatorParams.minLength));
        }
        if (validatorParams.maxLength !== undefined) {
            validators.push(Validators.maxLength(validatorParams.maxLength));
        }
        if (validatorParams.pattern !== undefined) {
            validators.push(Validators.pattern(validatorParams.pattern));
        }
        validators.forEach(validator => {
            let validationResult = validator(control);
            if (validationResult) {
                validatorParams.valid = false;
            }
        });
        if (validatorParams.valid) {
            return null;
        }
        else {
            return {
                textbox: validatorParams
            };
        }
    };
};
let TextboxComponent = class TextboxComponent extends FormControlBase {
    constructor(validationMessageService, formGroupHelper, translate) {
        super(validationMessageService, formGroupHelper);
        this.validationMessageService = validationMessageService;
        this.formGroupHelper = formGroupHelper;
        this.translate = translate;
        /**
         * Set the value of the input's autocomplete attribute
         */
        this.autocomplete = 'off';
        /**
         * The textbox type
         */
        this.type = "text";
        /**
         * The value of the rows attiribute for a textarea. Only applies to multi-line type
         */
        this.rows = 3;
        /**
         * If set to true, we will select all text within the input if
         * autofocus is also set to true
         */
        this.selectOnAutofocus = false;
        /**
         * If set to true, we will upper case on focus out
         */
        this.upperCase = false;
    }
    ngOnChanges(changes) {
        super.ngOnChanges(changes);
    }
    /**
     * The angular onInit lifecycle hook
     */
    ngOnInit() {
        super.ngOnInit();
        if (this.placeholder) {
            this.translate.get(this.placeholder)
                .subscribe((translated) => {
                this.placeholder = translated;
            });
        }
    }
    /**
     * The angular afterViewInit lifecycle hook
     */
    ngAfterViewInit() {
        if (this.autofocus) {
            this.setFocus(this.selectOnAutofocus);
        }
    }
    /**
     * Function to set focus on an input programatically after the page
     * had been rendered.  The highlight text flag will select the text
     * within the input if passed in and true
     */
    setFocus(highlightText) {
        this.inputElement.nativeElement.focus();
        if (highlightText) {
            this.inputElement.nativeElement.select();
        }
    }
    /**
  * Focus out event handler
  * will upper case and trim value if upperCase is true (this is what we do on the apis)
  */
    focusOutEvent() {
        if (this.upperCase && this.formModel.value) {
            this.formModel.setValue(this.formModel.value.toUpperCase().trim());
        }
    }
};
TextboxComponent.ctorParameters = () => [
    { type: ValidationMessageService },
    { type: FormGroupHelper },
    { type: TranslateService }
];
__decorate([
    Input(),
    __metadata("design:type", String)
], TextboxComponent.prototype, "autocomplete", void 0);
__decorate([
    Input(),
    __metadata("design:type", String)
], TextboxComponent.prototype, "type", void 0);
__decorate([
    Input(),
    __metadata("design:type", String)
], TextboxComponent.prototype, "placeholder", void 0);
__decorate([
    Input(),
    __metadata("design:type", Number)
], TextboxComponent.prototype, "maxlength", void 0);
__decorate([
    Input(),
    __metadata("design:type", Number)
], TextboxComponent.prototype, "minlength", void 0);
__decorate([
    Input(),
    __metadata("design:type", Number)
], TextboxComponent.prototype, "rows", void 0);
__decorate([
    Input(),
    __metadata("design:type", Boolean)
], TextboxComponent.prototype, "selectOnAutofocus", void 0);
__decorate([
    Input(),
    __metadata("design:type", Boolean)
], TextboxComponent.prototype, "upperCase", void 0);
__decorate([
    ViewChild('textboxInput'),
    __metadata("design:type", ElementRef)
], TextboxComponent.prototype, "inputElement", void 0);
TextboxComponent = __decorate([
    Component({
        selector: 'ec-textbox',
        template: "<div class=\"control control-label-{{labelPosition}}\"\r\n     [ngClass]=\"{'is-readonly': readonly}\">\r\n    <label *ngIf=\"label\" ngPreserveWhitespaces>\r\n\r\n        <span>{{label | translate}}</span>\r\n\r\n        <span *ngIf=\"validationErrors.length > 0 && formModel.touched && formModel.invalid\">{{validationErrors | translate}}</span>\r\n    </label>\r\n    <div class=\"input-wrapper control-input\">\r\n        <input *ngIf=\"type !== 'multi_line'\"\r\n               #textboxInput\r\n               email=\"{{type === 'email' ? true : false}}\"\r\n               pattern=\"{{type === 'url' ? '([A-Za-z])+(:\\/\\/)+[^\\\\s]*' : ''}}\"\r\n               type=\"{{type}}\"\r\n               tabindex=\"{{tabindex}}\"\r\n               title=\"{{tooltip}}\"\r\n               [attr.id]=\"inputId\"\r\n               [attr.autocomplete]=\"autocomplete\"\r\n               [attr.placeholder]=\"placeholder\"\r\n               [attr.maxlength]=\"maxlength\"\r\n               [attr.minlength]=\"minlength\"\r\n               [attr.required]=\"required ? required : null\"\r\n               [formControl]=\"formModel\"\r\n               [ngClass]=\"{'is-empty': !formModel?.value, 'is-pending': pending, 'is-uppercase': upperCase}\"\r\n               (focusout)=\"focusOutEvent()\">\r\n\r\n        <textarea *ngIf=\"type === 'multi_line'\"\r\n                  [attr.rows]=\"rows\"\r\n                  #textboxInput\r\n                  tabindex=\"{{tabindex}}\"\r\n                  [attr.id]=\"inputId\"\r\n                  [attr.placeholder]=\"placeholder\"\r\n                  [attr.maxlength]=\"maxlength\"\r\n                  [attr.minlength]=\"minlength\"\r\n                  [attr.required]=\"required ? required : null\"\r\n                  [formControl]=\"formModel\"\r\n                  [ngClass]=\"{'is-empty': formModel?.value === '', 'is-pending': pending}\">\r\n        </textarea>\r\n    </div>\r\n</div>",
        styles: ["@-webkit-keyframes spin{from{transform:rotate(0)}to{transform:rotate(1turn)}}@keyframes spin{from{transform:rotate(0)}to{transform:rotate(1turn)}}:host{color:#1a1a23;font-family:Roboto,-apple-system,BlinkMacSystemFont,\"Segoe UI\",Oxygen,Ubuntu,\"Fira Sans\",\"Droid Sans\",\"Helvetica Neue\",sans-serif;font-size:1rem;display:block;margin-bottom:1rem;width:100%}:host :host-context(.form-condensed){margin-bottom:.5rem}:host .control{width:100%;display:flex;flex-direction:column}:host .control.control-label-bottom{flex-direction:column-reverse}:host .control.control-label-left{flex-direction:row}:host .control.control-label-left label{margin-right:.25rem}:host .control.control-label-right{flex-direction:row-reverse}:host .control.control-label-right label{margin-left:.25rem}:host .control.control-label-left,:host .control.control-label-right{align-items:center}:host .control.control-label-left label,:host .control.control-label-right label{flex:1 1;margin-top:0;margin-bottom:0}:host .control.control-label-left .control-input,:host .control.control-label-right .control-input{flex:2 2}:host .control.is-readonly input{border-color:transparent;background-color:rgba(26,26,35,.12);background-image:none;color:#1a1a23;opacity:1;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none;overflow:hidden;white-space:nowrap}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid,:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid{background-color:#fff8cc;background-image:url('data:image/svg+xml;charset=utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\"><path fill=\"%235e6d79\" d=\"M20.21 20.21h-8.42L10.95 0h10.1l-.84 20.21zm-8.42 3.37h8.42V32h-8.42z\"/></svg>');background-repeat:no-repeat;background-position:.25em center;background-size:1em 1em;padding-left:1.5em}:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-invalid:not(:focus),:host .control.invalid .textbox-group-input ::ng-deep .control input.ng-valid:not(:focus){border-color:#ffe433}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button{background-color:#fff8cc}:host .control.invalid:not(.open) .textbox-group-btn-right ::ng-deep button:not(:focus){border-color:#ffe433}:host .textbox-group{display:flex;position:relative}:host input:focus,:host textarea:focus{outline:0}:host label{color:rgba(26,26,35,.66);display:block;font-size:.75rem;line-height:1;margin:.375rem 0}:host input{background-color:#fff;background-image:none;background-clip:padding-box;border-radius:0;width:100%;height:2rem;line-height:1.25;padding:.3125em .5em;transition:border-color .3s,box-shadow .3s;border:.0625rem solid #d2d7d9}:host input::-moz-selection{background-color:#0084a9;color:#fff}:host input::selection{background-color:#0084a9;color:#fff}:host input::-webkit-input-placeholder{color:rgba(26,26,35,.38)}:host input::-moz-placeholder{color:rgba(26,26,35,.38);opacity:1}:host input:-ms-input-placeholder{color:rgba(26,26,35,.38)}:host input:-moz-placeholder{color:rgba(26,26,35,.38);opacity:1}:host input:required.is-empty{border-color:#d2d7d9;background-color:#fff;background-image:url('data:image/svg+xml;charset=utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\"><path fill=\"%23ffe433\" d=\"M31.32 21.69l-.09.18-2.48 4.35c-.36.54-.77.62-1.25.27-.12 0-.2 0-.2-.09L19.53 22v9.37a1.26 1.26 0 0 1-.72.67h-5.26c-.59 0-.83-.3-.83-.89 0-.12.15-.21.15-.27V22l-8 4.71h-.12c-.42.66-.8.21-1.16-.27L1 21.82a.82.82 0 0 1 .35-1.26l.18-.1L9 16 .87 11.47v-.09c0-.36-.39-.74-.09-1.16l2.75-4.35v-.09c0-.42.82-.54 1.29-.36l8 4.62V.89c0-.59.18-.89.77-.89h5c.65 0 .91.3.91.89V10l7.94-4.53c.48-.29.72-.21 1.08.27l2.32 4.35v.09c.66.48.45.89-.08 1.25L23 16l7.91 4.53v.09c-.04.18.53.54.41 1.07z\"/></svg>');background-repeat:no-repeat;background-position:.25em center;background-size:1em 1em;padding-left:1.5em}:host input.ng-invalid.ng-touched{background-color:#fff8cc;background-image:url('data:image/svg+xml;charset=utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\"><path fill=\"%235e6d79\" d=\"M20.21 20.21h-8.42L10.95 0h10.1l-.84 20.21zm-8.42 3.37h8.42V32h-8.42z\"/></svg>');background-repeat:no-repeat;background-position:.25em center;background-size:1em 1em;padding-left:1.5em}:host input.ng-invalid.ng-touched:not(:focus){border-color:#ffe433}:host input.is-pending.ng-invalid,:host input.is-pending.ng-valid{background-image:url('data:image/svg+xml;charset=utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"40\" viewBox=\"0 0 50 50\"><path fill=\"%230084a9\" d=\"M43.935 25.145c0-10.318-8.364-18.683-18.683-18.683-10.318 0-18.683 8.365-18.683 18.683h4.068c0-8.071 6.543-14.615 14.615-14.615s14.615 6.543 14.615 14.615h4.068z\"><animateTransform attributeType=\"xml\" attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\" dur=\"0.8s\" repeatCount=\"indefinite\"/></path></svg>');background-repeat:no-repeat;background-position:.25em center;background-size:1em 1em;padding-left:1.5em}:host input:focus,:host input:focus.is-empty{border-color:#0084a9;box-shadow:0 0 0 1px #0084a9;position:relative;z-index:1}:host input:disabled{background-color:rgba(26,26,35,.1);border-color:#d2d7d9;color:rgba(26,26,35,.66);opacity:.65}:host input:disabled:required,:host input:disabled:required.is-empty{background-image:none;padding-left:.5em;background-color:rgba(26,26,35,.1);border-color:#d2d7d9}:host input.is-uppercase:not(.is-empty){text-transform:uppercase}:host textarea{background-color:#fff;background-image:none;background-clip:padding-box;border-radius:0;width:100%;height:auto;line-height:1.25;padding:.3125em .5em;transition:border-color .3s,box-shadow .3s;resize:none;display:block;border:.0625rem solid #d2d7d9}:host textarea::-moz-selection{background-color:#0084a9;color:#fff}:host textarea::selection{background-color:#0084a9;color:#fff}:host textarea::-webkit-input-placeholder{color:rgba(26,26,35,.38)}:host textarea::-moz-placeholder{color:rgba(26,26,35,.38);opacity:1}:host textarea:-ms-input-placeholder{color:rgba(26,26,35,.38)}:host textarea:-moz-placeholder{color:rgba(26,26,35,.38);opacity:1}:host textarea:required.is-empty{border-color:#d2d7d9;background-color:#fff;background-image:url('data:image/svg+xml;charset=utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\"><path fill=\"%23ffe433\" d=\"M31.32 21.69l-.09.18-2.48 4.35c-.36.54-.77.62-1.25.27-.12 0-.2 0-.2-.09L19.53 22v9.37a1.26 1.26 0 0 1-.72.67h-5.26c-.59 0-.83-.3-.83-.89 0-.12.15-.21.15-.27V22l-8 4.71h-.12c-.42.66-.8.21-1.16-.27L1 21.82a.82.82 0 0 1 .35-1.26l.18-.1L9 16 .87 11.47v-.09c0-.36-.39-.74-.09-1.16l2.75-4.35v-.09c0-.42.82-.54 1.29-.36l8 4.62V.89c0-.59.18-.89.77-.89h5c.65 0 .91.3.91.89V10l7.94-4.53c.48-.29.72-.21 1.08.27l2.32 4.35v.09c.66.48.45.89-.08 1.25L23 16l7.91 4.53v.09c-.04.18.53.54.41 1.07z\"/></svg>');background-repeat:no-repeat;background-position:.25em .5rem;background-size:1em 1em;padding-left:1.5em}:host textarea.ng-invalid.ng-touched{background-color:#fff8cc;background-image:url('data:image/svg+xml;charset=utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\"><path fill=\"%235e6d79\" d=\"M20.21 20.21h-8.42L10.95 0h10.1l-.84 20.21zm-8.42 3.37h8.42V32h-8.42z\"/></svg>');background-repeat:no-repeat;background-position:.25em .5rem;background-size:1em 1em;padding-left:1.5em}:host textarea.ng-invalid.ng-touched:not(:focus){border-color:#ffe433}:host textarea.is-pending.ng-invalid,:host textarea.is-pending.ng-valid{background-image:url('data:image/svg+xml;charset=utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"40\" height=\"40\" viewBox=\"0 0 50 50\"><path fill=\"%230084a9\" d=\"M43.935 25.145c0-10.318-8.364-18.683-18.683-18.683-10.318 0-18.683 8.365-18.683 18.683h4.068c0-8.071 6.543-14.615 14.615-14.615s14.615 6.543 14.615 14.615h4.068z\"><animateTransform attributeType=\"xml\" attributeName=\"transform\" type=\"rotate\" from=\"0 25 25\" to=\"360 25 25\" dur=\"0.8s\" repeatCount=\"indefinite\"/></path></svg>');background-repeat:no-repeat;background-position:.25em .5rem;background-size:1em 1em;padding-left:1.5em}:host textarea:focus,:host textarea:focus.is-empty{border-color:#0084a9;box-shadow:0 0 0 1px #0084a9;position:relative;z-index:1}:host textarea:disabled{background-color:rgba(26,26,35,.1);border-color:#d2d7d9;color:rgba(26,26,35,.66);opacity:.65}:host textarea:disabled:required,:host textarea:disabled:required.is-empty{background-image:none;padding-left:.5em;background-color:rgba(26,26,35,.1);border-color:#d2d7d9}:host textarea.is-uppercase:not(.is-empty){text-transform:uppercase}:host(.textbox-group-input:not(:last-child)){flex:1 1 0%;width:1px}:host(.textbox-group-input:not(:last-child)) .control{margin-bottom:0}:host(.textbox-group-input:not(:last-child)) .control.is-readonly input{border-right-width:.0625rem}:host(.textbox-group-input:not(:last-child)) input{border-top-right-radius:0;border-bottom-right-radius:0;border-right-width:0}:host(.textbox-group-input:not(:last-child)) input:focus{position:relative;z-index:1;border-right-width:.0625rem}:host(.text-truncate) input{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}"]
    }),
    __metadata("design:paramtypes", [ValidationMessageService,
        FormGroupHelper,
        TranslateService])
], TextboxComponent);
export { TextboxComponent };
//# sourceMappingURL=data:application/json;base64, 