import { ChangeDetectionStrategy, Component, ElementRef, EventEmitter, Input, Output, Optional } from '@angular/core';
import { NgControl } from '@angular/forms';
import * as _ from 'lodash';
/**
 * Angular 2 wrapper around Semantic UI Input Element.
 * @see http://semantic-ui.com/elements/input.html
 */
var InputText = (function () {
    function InputText(control, _elementRef) {
        this._elementRef = _elementRef;
        this.placeholder = '';
        this.type = 'text';
        this.disabled = false;
        this.readonly = false;
        this.focused = false;
        this.tabIndex = null;
        this.required = false;
        this.blur = new EventEmitter();
        if (control) {
            control.valueAccessor = this;
        }
    }
    InputText.prototype.ngOnChanges = function (change) {
        if (change.focused) {
            var f = change.focused.currentValue === true || change.focused.currentValue === 'true';
            if (f) {
                var el_1 = this._elementRef.nativeElement;
                // More info: http://stackoverflow.com/questions/36332418/angular-2-exception-expression-ngclassuntouched-has-changed-after-it-was-che
                setTimeout(function () {
                    el_1.querySelector('input').focus();
                }, 0);
            }
        }
    };
    Object.defineProperty(InputText.prototype, "value", {
        get: function () {
            return this._modelValue;
        },
        set: function (v) {
            this.writeValue(v);
        },
        enumerable: true,
        configurable: true
    });
    InputText.prototype.onBlur = function (value) {
        this.onTouched();
        this.blur.emit(value);
    };
    InputText.prototype.writeValue = function (value) {
        this._modelValue = _.isEmpty(value) ? '' : value;
        this._elementRef.nativeElement.firstElementChild.firstElementChild.setAttribute('value', this._modelValue);
    };
    InputText.prototype.registerOnChange = function (fn) {
        this.onChange = fn;
    };
    InputText.prototype.registerOnTouched = function (fn) {
        this.onTouched = fn;
    };
    return InputText;
}());
export { InputText };
InputText.decorators = [
    { type: Component, args: [{
                changeDetection: ChangeDetectionStrategy.OnPush,
                host: { 'role': 'text' },
                selector: 'cw-input-text',
                template: "<div flex layout=\"row\" layout-wrap class=\"ui fluid input\"  [ngClass]=\"{disabled: disabled, icon: icon, required: required}\">\n    <input flex\n           type=\"{{type}}\"\n           [value]=\"_modelValue\"\n           [disabled]=\"disabled\"\n           [readonly]=\"readonly\"\n           tabindex=\"{{tabIndex || ''}}\"\n           placeholder=\"{{placeholder}}\"\n           (blur)=\"onBlur($event)\"\n           (change)=\"$event.stopPropagation()\"\n           (input)=\"onChange($event.target.value)\" />\n    <i [ngClass]=\"icon\" *ngIf=\"icon\"></i>\n</div>\n  ",
            },] },
];
/** @nocollapse */
InputText.ctorParameters = function () { return [
    { type: NgControl, decorators: [{ type: Optional },] },
    { type: ElementRef, },
]; };
InputText.propDecorators = {
    'placeholder': [{ type: Input },],
    'type': [{ type: Input },],
    'icon': [{ type: Input },],
    'disabled': [{ type: Input },],
    'readonly': [{ type: Input },],
    'focused': [{ type: Input },],
    'tabIndex': [{ type: Input },],
    'required': [{ type: Input },],
    'blur': [{ type: Output },],
    'value': [{ type: Input },],
};
//# sourceMappingURL=input-text.js.map