import { Directive, Renderer2, ElementRef, NgZone, HostBinding, Input } from '@angular/core';
var NzTabsInkBarDirective = (function () {
    function NzTabsInkBarDirective(_renderer, _elementRef, _ngZone) {
        this._renderer = _renderer;
        this._elementRef = _elementRef;
        this._ngZone = _ngZone;
        this._nzTabsInkBar = true;
        this.nzPositionMode = 'horizontal';
    }
    NzTabsInkBarDirective.prototype.alignToElement = function (element) {
        var _this = this;
        this.show();
        this._ngZone.runOutsideAngular(function () {
            requestAnimationFrame(function () {
                /** when horizontal remove height style and add transfrom left **/
                if (_this.nzPositionMode === 'horizontal') {
                    _this._renderer.removeStyle(_this._elementRef.nativeElement, 'height');
                    _this._renderer.setStyle(_this._elementRef.nativeElement, 'transform', "translate3d(" + _this._getLeftPosition(element) + ", 0px, 0px)");
                    _this._renderer.setStyle(_this._elementRef.nativeElement, 'width', _this._getElementWidth(element));
                }
                else {
                    /** when vertical remove width style and add transfrom top **/
                    _this._renderer.removeStyle(_this._elementRef.nativeElement, 'width');
                    _this._renderer.setStyle(_this._elementRef.nativeElement, 'transform', "translate3d(0px, " + _this._getTopPosition(element) + ", 0px)");
                    _this._renderer.setStyle(_this._elementRef.nativeElement, 'height', _this._getElementHeight(element));
                }
            });
        });
    };
    NzTabsInkBarDirective.prototype.show = function () {
        this._renderer.setStyle(this._elementRef.nativeElement, 'visibility', 'visible');
    };
    NzTabsInkBarDirective.prototype.setDisplay = function (value) {
        this._renderer.setStyle(this._elementRef.nativeElement, 'display', value);
    };
    NzTabsInkBarDirective.prototype.hide = function () {
        this._renderer.setStyle(this._elementRef.nativeElement, 'visibility', 'hidden');
    };
    NzTabsInkBarDirective.prototype._getLeftPosition = function (element) {
        return element ? element.offsetLeft + 'px' : '0';
    };
    NzTabsInkBarDirective.prototype._getElementWidth = function (element) {
        return element ? element.offsetWidth + 'px' : '0';
    };
    NzTabsInkBarDirective.prototype._getTopPosition = function (element) {
        return element ? element.offsetTop + 'px' : '0';
    };
    NzTabsInkBarDirective.prototype._getElementHeight = function (element) {
        return element ? element.offsetHeight + 'px' : '0';
    };
    return NzTabsInkBarDirective;
}());
export { NzTabsInkBarDirective };
NzTabsInkBarDirective.decorators = [
    { type: Directive, args: [{
                selector: '[nz-tabs-ink-bar]',
            },] },
];
/** @nocollapse */
NzTabsInkBarDirective.ctorParameters = function () { return [
    { type: Renderer2, },
    { type: ElementRef, },
    { type: NgZone, },
]; };
NzTabsInkBarDirective.propDecorators = {
    '_nzTabsInkBar': [{ type: HostBinding, args: ['class.ant-tabs-ink-bar',] },],
    'nzAnimated': [{ type: Input }, { type: HostBinding, args: ['class.ant-tabs-ink-bar-animated',] },],
    'nzPositionMode': [{ type: Input },],
};
