import * as tslib_1 from "tslib";
import { Component, Input, ChangeDetectorRef, Renderer2, ViewEncapsulation, ChangeDetectionStrategy, ElementRef, forwardRef, ViewChild } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { OnChange } from '../core/decorators';
/*
 * Provider Expression that allows component to register as a ControlValueAccessor.
 * This allows it to support [(ngModel)].
 * @docs-private
 */
var TEXTLINE_VALUE_ACCESSOR = {
    provide: NG_VALUE_ACCESSOR,
    useExisting: forwardRef(function () { return TextLineComponent; }),
    multi: true
};
var TextLineComponent = /** @class */ (function () {
    function TextLineComponent(_cd, _render) {
        this._cd = _cd;
        this._render = _render;
        /**
         * text-line value
         * @default ''
         */
        this.value = '';
        /**
         * text-line placeholder
         * @default ''
         */
        this.placeholder = '';
        /**
         * Whether the text-line is disabled
         * @default false
         */
        this.disabled = false;
        /**
         * content dom
         * @docs-private
         */
        this.lines = [];
    }
    TextLineComponent.prototype.ngOnInit = function () {
        this.lines = this.value.replace(/\r/gi, '').split('\n').map(function (line) { return line || "\u200B" + line; });
        this._markForCheck();
    };
    /**
     * in text-line content region input string
     * @docs-private
     */
    TextLineComponent.prototype.onInput = function (event, txtContent, txtLines) {
        var _this = this;
        var value = event.target.value;
        this.lines = value = value.replace(/\r/gi, '').split('\n');
        this.value = event.target.value;
        this._markForCheck();
        setTimeout(function () {
            _this._render.setProperty(txtContent, 'scrollTop', txtContent.scrollTop);
            _this._render.setProperty(txtLines, 'scrollTop', txtContent.scrollTop);
        }, 0);
    };
    TextLineComponent.prototype.onBlur = function () {
        if (!this.value) {
            return;
        }
        this.value = this.value.split('\n').map(function (word) { return word.trim(); }).filter(function (item) { return item; }).join('\n');
        this.lines = this.value.replace(/\r/gi, '').split('\n');
        this._markForCheck();
    };
    /**
     * listen text-line content region scroll event
     * @docs-private
     */
    TextLineComponent.prototype.scrollHandler = function (event, txtLines) {
        this._render.setProperty(txtLines, 'scrollTop', event.target.scrollTop);
    };
    /**
     * Registers a callback that will be triggered when the value has changed.
     * Implemented as part of ControlValueAccessor.
     * @param fn On change callback function.
     */
    TextLineComponent.prototype.registerOnChange = function (fn) {
        this._onModelChange = fn;
    };
    /**
     * Registers a callback that will be triggered when the control has been touched.
     * Implemented as part of ControlValueAccessor.
     * @param fn On touch callback function.
     */
    TextLineComponent.prototype.registerOnTouched = function (fn) {
        this._onTouch = fn;
    };
    /** set text-line model value */
    TextLineComponent.prototype.writeValue = function (value) {
        this.value = value;
        if (value) {
            this.lines = value.replace(/\r/gi, '').split('\n');
        }
        this._cd.markForCheck();
    };
    /**
     * Toggles the disabled state of the component. Implemented as part of ControlValueAccessor.
     * @param {boolean} isDisabled - Whether the component should be disabled.
     */
    TextLineComponent.prototype.setDisabledState = function (isDisabled) {
        this.disabled = isDisabled;
    };
    /**
     * update form model value and mark for check
     * @docs-private
     */
    TextLineComponent.prototype._markForCheck = function () {
        if (this._onModelChange) {
            this._onModelChange(this.value);
        }
        if (this._onTouch) {
            this._onTouch(this.value);
        }
        this._cd.markForCheck();
    };
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], TextLineComponent.prototype, "value", void 0);
    tslib_1.__decorate([
        Input(),
        tslib_1.__metadata("design:type", String)
    ], TextLineComponent.prototype, "placeholder", void 0);
    tslib_1.__decorate([
        OnChange(true),
        Input(),
        tslib_1.__metadata("design:type", Boolean)
    ], TextLineComponent.prototype, "disabled", void 0);
    tslib_1.__decorate([
        ViewChild('txtContent', { static: false }),
        tslib_1.__metadata("design:type", ElementRef)
    ], TextLineComponent.prototype, "txtContent", void 0);
    TextLineComponent = tslib_1.__decorate([
        Component({
            selector: 'nb-text-line',
            template: "<div #txtLines class=\"nb-text-line-measurer\"><div *ngFor=\"let line of lines; let i = index;\" class=\"nb-text-line-measurer-line\"><div class=\"nb-text-line-measurer-line-number\">{{ i + 1 }}</div><div class=\"nb-text-line-measurer-line-content\">{{ line }}</div></div></div><textarea #txtContent class=\"nb-text-line-textarea\" [placeholder]=\"placeholder\" [disabled]=\"disabled\" [value]=\"value\" (scroll)=\"scrollHandler($event, txtLines)\" (input)=\"onInput($event, txtContent, txtLines)\" (blur)=\"onBlur()\"> </textarea>",
            encapsulation: ViewEncapsulation.Emulated,
            changeDetection: ChangeDetectionStrategy.OnPush,
            preserveWhitespaces: false,
            providers: [TEXTLINE_VALUE_ACCESSOR],
            host: {
                'class': 'nb-widget nb-text-line',
                '[class.nb-text-line-disabled]': 'disabled'
            }
        }),
        tslib_1.__metadata("design:paramtypes", [ChangeDetectorRef,
            Renderer2])
    ], TextLineComponent);
    return TextLineComponent;
}());
export { TextLineComponent };
//# sourceMappingURL=text-line.js.map