import { Component, ElementRef, Input, Directive, NgZone, Optional, Inject, TemplateRef, Host, Self, InjectionToken, EventEmitter, ViewEncapsulation, ChangeDetectionStrategy, Output, ViewChild, ContentChild, ChangeDetectorRef, ContentChildren, QueryList, NgModule } from '@angular/core';
import { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';
import { reqAnimFrame } from 'ng-zorro-antd/core/polyfill';
import { FocusKeyManager, A11yModule } from '@angular/cdk/a11y';
import { Directionality } from '@angular/cdk/bidi';
import { coerceNumberProperty } from '@angular/cdk/coercion';
import { hasModifierKey, SPACE, ENTER, DOWN_ARROW, RIGHT_ARROW, UP_ARROW, LEFT_ARROW } from '@angular/cdk/keycodes';
import { ViewportRuler } from '@angular/cdk/overlay';
import { Subject, animationFrameScheduler, asapScheduler, of, merge, fromEvent, Subscription } from 'rxjs';
import { takeUntil, auditTime, startWith, first, filter, delay } from 'rxjs/operators';
import { NzResizeObserver } from 'ng-zorro-antd/core/resize-observers';
import { __decorate, __metadata } from 'tslib';
import { InputBoolean, wrapIntoObservable } from 'ng-zorro-antd/core/util';
import { RouterLink, RouterLinkWithHref, NavigationEnd, Router } from '@angular/router';
import { warnDeprecation, PREFIX } from 'ng-zorro-antd/core/logger';
import { ObserversModule } from '@angular/cdk/observers';
import { PlatformModule } from '@angular/cdk/platform';
import { CdkScrollableModule } from '@angular/cdk/scrolling';
import { CommonModule } from '@angular/common';
import { NzOutletModule } from 'ng-zorro-antd/core/outlet';
import { NzDropDownModule } from 'ng-zorro-antd/dropdown';
import { NzIconModule } from 'ng-zorro-antd/icon';
import { NzConfigService, WithConfig } from 'ng-zorro-antd/core/config';

/**
 * @fileoverview added by tsickle
 * Generated from: tab-add-button.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class NzTabAddButtonComponent {
    /**
     * @param {?} elementRef
     */
    constructor(elementRef) {
        this.elementRef = elementRef;
        this.addIcon = 'plus';
        this.element = this.elementRef.nativeElement;
    }
    /**
     * @return {?}
     */
    getElementWidth() {
        var _a;
        return ((_a = this.element) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0;
    }
    /**
     * @return {?}
     */
    getElementHeight() {
        var _a;
        return ((_a = this.element) === null || _a === void 0 ? void 0 : _a.offsetHeight) || 0;
    }
}
NzTabAddButtonComponent.decorators = [
    { type: Component, args: [{
                selector: 'nz-tab-add-button, button[nz-tab-add-button]',
                template: `
    <ng-container *nzStringTemplateOutlet="addIcon; let icon">
      <i nz-icon [nzType]="icon" nzTheme="outline"></i>
    </ng-container>
  `,
                host: {
                    class: 'ant-tabs-nav-add',
                    'aria-label': 'Add tab',
                    type: 'button'
                }
            }] }
];
/** @nocollapse */
NzTabAddButtonComponent.ctorParameters = () => [
    { type: ElementRef }
];
NzTabAddButtonComponent.propDecorators = {
    addIcon: [{ type: Input }]
};
if (false) {
    /** @type {?} */
    NzTabAddButtonComponent.prototype.addIcon;
    /**
     * @type {?}
     * @private
     */
    NzTabAddButtonComponent.prototype.element;
    /**
     * @type {?}
     * @private
     */
    NzTabAddButtonComponent.prototype.elementRef;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tabs-ink-bar.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class NzTabsInkBarDirective {
    /**
     * @param {?} elementRef
     * @param {?} ngZone
     * @param {?=} animationMode
     */
    constructor(elementRef, ngZone, animationMode) {
        this.elementRef = elementRef;
        this.ngZone = ngZone;
        this.animationMode = animationMode;
        this.position = 'horizontal';
        this.animated = true;
    }
    /**
     * @return {?}
     */
    get _animated() {
        return this.animationMode !== 'NoopAnimations' && this.animated;
    }
    /**
     * @param {?} element
     * @return {?}
     */
    alignToElement(element) {
        this.ngZone.runOutsideAngular((/**
         * @return {?}
         */
        () => {
            reqAnimFrame((/**
             * @return {?}
             */
            () => this.setStyles(element)));
        }));
    }
    /**
     * @param {?} element
     * @return {?}
     */
    setStyles(element) {
        /** @type {?} */
        const inkBar = this.elementRef.nativeElement;
        if (this.position === 'horizontal') {
            inkBar.style.top = '';
            inkBar.style.height = '';
            inkBar.style.left = this.getLeftPosition(element);
            inkBar.style.width = this.getElementWidth(element);
        }
        else {
            inkBar.style.left = '';
            inkBar.style.width = '';
            inkBar.style.top = this.getTopPosition(element);
            inkBar.style.height = this.getElementHeight(element);
        }
    }
    /**
     * @param {?} element
     * @return {?}
     */
    getLeftPosition(element) {
        return element ? (element.offsetLeft || 0) + 'px' : '0';
    }
    /**
     * @param {?} element
     * @return {?}
     */
    getElementWidth(element) {
        return element ? (element.offsetWidth || 0) + 'px' : '0';
    }
    /**
     * @param {?} element
     * @return {?}
     */
    getTopPosition(element) {
        return element ? (element.offsetTop || 0) + 'px' : '0';
    }
    /**
     * @param {?} element
     * @return {?}
     */
    getElementHeight(element) {
        return element ? (element.offsetHeight || 0) + 'px' : '0';
    }
}
NzTabsInkBarDirective.decorators = [
    { type: Directive, args: [{
                selector: 'nz-tabs-ink-bar, [nz-tabs-ink-bar]',
                host: {
                    class: 'ant-tabs-ink-bar',
                    '[class.ant-tabs-ink-bar-animated]': '_animated'
                }
            },] }
];
/** @nocollapse */
NzTabsInkBarDirective.ctorParameters = () => [
    { type: ElementRef },
    { type: NgZone },
    { type: String, decorators: [{ type: Optional }, { type: Inject, args: [ANIMATION_MODULE_TYPE,] }] }
];
NzTabsInkBarDirective.propDecorators = {
    position: [{ type: Input }],
    animated: [{ type: Input }]
};
if (false) {
    /** @type {?} */
    NzTabsInkBarDirective.prototype.position;
    /** @type {?} */
    NzTabsInkBarDirective.prototype.animated;
    /**
     * @type {?}
     * @private
     */
    NzTabsInkBarDirective.prototype.elementRef;
    /**
     * @type {?}
     * @private
     */
    NzTabsInkBarDirective.prototype.ngZone;
    /** @type {?} */
    NzTabsInkBarDirective.prototype.animationMode;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tab-link.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * Fix https://github.com/angular/angular/issues/8563
 */
class NzTabLinkTemplateDirective {
    /**
     * @param {?} templateRef
     */
    constructor(templateRef) {
        this.templateRef = templateRef;
    }
}
NzTabLinkTemplateDirective.decorators = [
    { type: Directive, args: [{
                selector: 'ng-template[nzTabLink]',
                exportAs: 'nzTabLinkTemplate'
            },] }
];
/** @nocollapse */
NzTabLinkTemplateDirective.ctorParameters = () => [
    { type: TemplateRef, decorators: [{ type: Host }] }
];
if (false) {
    /** @type {?} */
    NzTabLinkTemplateDirective.prototype.templateRef;
}
/**
 * This component is for catching `routerLink` directive.
 */
class NzTabLinkDirective {
    /**
     * @param {?=} routerLink
     * @param {?=} routerLinkWithHref
     * @param {?=} nzTabLinkTemplateDirective
     */
    constructor(routerLink, routerLinkWithHref, nzTabLinkTemplateDirective) {
        this.routerLink = routerLink;
        this.routerLinkWithHref = routerLinkWithHref;
        if (!nzTabLinkTemplateDirective) {
            warnDeprecation(`'a[nz-tab-link]' is deprecated. Please use 'ng-template[nzTabLink] > a[nz-tab-link]' instead.`);
        }
    }
}
NzTabLinkDirective.decorators = [
    { type: Directive, args: [{
                selector: 'a[nz-tab-link]',
                exportAs: 'nzTabLink'
            },] }
];
/** @nocollapse */
NzTabLinkDirective.ctorParameters = () => [
    { type: RouterLink, decorators: [{ type: Optional }, { type: Self }] },
    { type: RouterLinkWithHref, decorators: [{ type: Optional }, { type: Self }] },
    { type: NzTabLinkTemplateDirective, decorators: [{ type: Optional }] }
];
if (false) {
    /** @type {?} */
    NzTabLinkDirective.prototype.routerLink;
    /** @type {?} */
    NzTabLinkDirective.prototype.routerLinkWithHref;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tab.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * Decorates the `ng-template` tags and reads out the template from it.
 */
class NzTabDirective {
}
NzTabDirective.decorators = [
    { type: Directive, args: [{
                selector: '[nz-tab]',
                exportAs: 'nzTab'
            },] }
];

/**
 * @fileoverview added by tsickle
 * Generated from: tab.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * Used to provide a tab set to a tab without causing a circular dependency.
 * @type {?}
 */
const NZ_TAB_SET = new InjectionToken('NZ_TAB_SET');
class NzTabComponent {
    /**
     * @param {?} closestTabSet
     */
    constructor(closestTabSet) {
        this.closestTabSet = closestTabSet;
        this.nzTitle = '';
        this.nzClosable = false;
        this.nzCloseIcon = 'close';
        this.nzDisabled = false;
        this.nzForceRender = false;
        this.nzSelect = new EventEmitter();
        this.nzDeselect = new EventEmitter();
        this.nzClick = new EventEmitter();
        this.template = null;
        this.isActive = false;
        this.position = null;
        this.origin = null;
        this.stateChanges = new Subject();
    }
    /**
     * @return {?}
     */
    get content() {
        return this.template || this.contentTemplate;
    }
    /**
     * @return {?}
     */
    get label() {
        var _a;
        return this.nzTitle || ((_a = this.nzTabLinkTemplateDirective) === null || _a === void 0 ? void 0 : _a.templateRef) || this.tabLinkTemplate;
    }
    /**
     * @param {?} changes
     * @return {?}
     */
    ngOnChanges(changes) {
        const { nzTitle, nzDisabled, nzForceRender } = changes;
        if (nzTitle || nzDisabled || nzForceRender) {
            this.stateChanges.next();
        }
    }
    /**
     * @return {?}
     */
    ngOnDestroy() {
        this.stateChanges.complete();
    }
    /**
     * @return {?}
     */
    ngOnInit() { }
}
NzTabComponent.decorators = [
    { type: Component, args: [{
                selector: 'nz-tab',
                exportAs: 'nzTab',
                preserveWhitespaces: false,
                encapsulation: ViewEncapsulation.None,
                changeDetection: ChangeDetectionStrategy.OnPush,
                template: `
    <ng-template #tabLinkTemplate>
      <ng-content select="[nz-tab-link]"></ng-content>
    </ng-template>
    <ng-template #contentTemplate><ng-content></ng-content></ng-template>
  `
            }] }
];
/** @nocollapse */
NzTabComponent.ctorParameters = () => [
    { type: undefined, decorators: [{ type: Inject, args: [NZ_TAB_SET,] }] }
];
NzTabComponent.propDecorators = {
    nzTitle: [{ type: Input }],
    nzClosable: [{ type: Input }],
    nzCloseIcon: [{ type: Input }],
    nzDisabled: [{ type: Input }],
    nzForceRender: [{ type: Input }],
    nzSelect: [{ type: Output }],
    nzDeselect: [{ type: Output }],
    nzClick: [{ type: Output }],
    tabLinkTemplate: [{ type: ViewChild, args: ['tabLinkTemplate', { static: true },] }],
    nzTabLinkTemplateDirective: [{ type: ContentChild, args: [NzTabLinkTemplateDirective, { static: false },] }],
    template: [{ type: ContentChild, args: [NzTabDirective, { static: false, read: TemplateRef },] }],
    linkDirective: [{ type: ContentChild, args: [NzTabLinkDirective, { static: false },] }],
    contentTemplate: [{ type: ViewChild, args: ['contentTemplate', { static: true },] }]
};
__decorate([
    InputBoolean(),
    __metadata("design:type", Object)
], NzTabComponent.prototype, "nzClosable", void 0);
__decorate([
    InputBoolean(),
    __metadata("design:type", Object)
], NzTabComponent.prototype, "nzDisabled", void 0);
__decorate([
    InputBoolean(),
    __metadata("design:type", Object)
], NzTabComponent.prototype, "nzForceRender", void 0);
if (false) {
    /** @type {?} */
    NzTabComponent.ngAcceptInputType_nzDisabled;
    /** @type {?} */
    NzTabComponent.ngAcceptInputType_nzClosable;
    /** @type {?} */
    NzTabComponent.ngAcceptInputType_nzForceRender;
    /** @type {?} */
    NzTabComponent.prototype.nzTitle;
    /** @type {?} */
    NzTabComponent.prototype.nzClosable;
    /** @type {?} */
    NzTabComponent.prototype.nzCloseIcon;
    /** @type {?} */
    NzTabComponent.prototype.nzDisabled;
    /** @type {?} */
    NzTabComponent.prototype.nzForceRender;
    /** @type {?} */
    NzTabComponent.prototype.nzSelect;
    /** @type {?} */
    NzTabComponent.prototype.nzDeselect;
    /** @type {?} */
    NzTabComponent.prototype.nzClick;
    /**
     * @deprecated Will be removed in 11.0.0
     * \@breaking-change 11.0.0
     * @type {?}
     */
    NzTabComponent.prototype.tabLinkTemplate;
    /** @type {?} */
    NzTabComponent.prototype.nzTabLinkTemplateDirective;
    /** @type {?} */
    NzTabComponent.prototype.template;
    /** @type {?} */
    NzTabComponent.prototype.linkDirective;
    /** @type {?} */
    NzTabComponent.prototype.contentTemplate;
    /** @type {?} */
    NzTabComponent.prototype.isActive;
    /** @type {?} */
    NzTabComponent.prototype.position;
    /** @type {?} */
    NzTabComponent.prototype.origin;
    /** @type {?} */
    NzTabComponent.prototype.stateChanges;
    /** @type {?} */
    NzTabComponent.prototype.closestTabSet;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tab-nav-item.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class NzTabNavItemDirective {
    /**
     * @param {?} elementRef
     */
    constructor(elementRef) {
        this.elementRef = elementRef;
        this.disabled = false;
        this.active = false;
        this.el = elementRef.nativeElement;
        this.parentElement = (/** @type {?} */ (this.el.parentElement));
    }
    /**
     * @return {?}
     */
    focus() {
        this.el.focus();
    }
    /**
     * @return {?}
     */
    get width() {
        return this.parentElement.offsetWidth;
    }
    /**
     * @return {?}
     */
    get height() {
        return this.parentElement.offsetHeight;
    }
    /**
     * @return {?}
     */
    get left() {
        return this.parentElement.offsetLeft;
    }
    /**
     * @return {?}
     */
    get top() {
        return this.parentElement.offsetTop;
    }
}
NzTabNavItemDirective.decorators = [
    { type: Directive, args: [{
                selector: '[nzTabNavItem]'
            },] }
];
/** @nocollapse */
NzTabNavItemDirective.ctorParameters = () => [
    { type: ElementRef }
];
NzTabNavItemDirective.propDecorators = {
    disabled: [{ type: Input }],
    tab: [{ type: Input }],
    active: [{ type: Input }]
};
if (false) {
    /** @type {?} */
    NzTabNavItemDirective.prototype.disabled;
    /** @type {?} */
    NzTabNavItemDirective.prototype.tab;
    /** @type {?} */
    NzTabNavItemDirective.prototype.active;
    /**
     * @type {?}
     * @private
     */
    NzTabNavItemDirective.prototype.el;
    /**
     * @type {?}
     * @private
     */
    NzTabNavItemDirective.prototype.parentElement;
    /** @type {?} */
    NzTabNavItemDirective.prototype.elementRef;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tab-nav-operation.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class NzTabNavOperationComponent {
    /**
     * @param {?} cdr
     * @param {?} elementRef
     */
    constructor(cdr, elementRef) {
        this.cdr = cdr;
        this.elementRef = elementRef;
        this.items = [];
        this.addable = false;
        this.addIcon = 'plus';
        this.addClicked = new EventEmitter();
        this.selected = new EventEmitter();
        this.closeAnimationWaitTimeoutId = -1;
        this.menuOpened = false;
        this.element = this.elementRef.nativeElement;
    }
    /**
     * @param {?} item
     * @return {?}
     */
    onSelect(item) {
        if (!item.disabled) {
            // ignore nzCanDeactivate
            item.tab.nzClick.emit();
            this.selected.emit(item);
        }
    }
    /**
     * @return {?}
     */
    showItems() {
        window.clearTimeout(this.closeAnimationWaitTimeoutId);
        this.menuOpened = true;
        this.cdr.markForCheck();
    }
    /**
     * @param {?} visible
     * @return {?}
     */
    menuVisChange(visible) {
        if (!visible) {
            this.closeAnimationWaitTimeoutId = setTimeout((/**
             * @return {?}
             */
            () => {
                this.menuOpened = false;
                this.cdr.markForCheck();
            }), 150);
        }
    }
    /**
     * @return {?}
     */
    getElementWidth() {
        var _a;
        return ((_a = this.element) === null || _a === void 0 ? void 0 : _a.offsetWidth) || 0;
    }
    /**
     * @return {?}
     */
    getElementHeight() {
        var _a;
        return ((_a = this.element) === null || _a === void 0 ? void 0 : _a.offsetHeight) || 0;
    }
    /**
     * @return {?}
     */
    ngOnDestroy() {
        window.clearTimeout(this.closeAnimationWaitTimeoutId);
    }
}
NzTabNavOperationComponent.decorators = [
    { type: Component, args: [{
                selector: 'nz-tab-nav-operation',
                exportAs: 'nzTabNavOperation',
                preserveWhitespaces: false,
                changeDetection: ChangeDetectionStrategy.OnPush,
                encapsulation: ViewEncapsulation.None,
                template: `
    <button
      nz-dropdown
      class="ant-tabs-nav-more"
      type="button"
      tabindex="-1"
      aria-hidden="true"
      nzOverlayClassName="nz-tabs-dropdown"
      #dropdownTrigger="nzDropdown"
      [nzDropdownMenu]="menu"
      [nzOverlayStyle]="{ minWidth: '46px' }"
      [nzMatchWidthElement]="null"
      (nzVisibleChange)="menuVisChange($event)"
      (mouseenter)="showItems()"
    >
      <i nz-icon nzType="ellipsis"></i>
    </button>
    <nz-dropdown-menu #menu="nzDropdownMenu">
      <ul nz-menu *ngIf="menuOpened">
        <li
          nz-menu-item
          *ngFor="let item of items"
          class="ant-tabs-dropdown-menu-item"
          [class.ant-tabs-dropdown-menu-item-disabled]="item.disabled"
          [nzSelected]="item.active"
          [nzDisabled]="item.disabled"
          (click)="onSelect(item)"
        >
          <ng-container *nzStringTemplateOutlet="item.tab.label">{{ item.tab.label }}</ng-container>
        </li>
      </ul>
    </nz-dropdown-menu>
    <button *ngIf="addable" nz-tab-add-button [addIcon]="addIcon" (click)="addClicked.emit()"></button>
  `,
                host: {
                    class: 'ant-tabs-nav-operations',
                    '[class.ant-tabs-nav-operations-hidden]': 'items.length === 0'
                }
            }] }
];
/** @nocollapse */
NzTabNavOperationComponent.ctorParameters = () => [
    { type: ChangeDetectorRef },
    { type: ElementRef }
];
NzTabNavOperationComponent.propDecorators = {
    items: [{ type: Input }],
    addable: [{ type: Input }],
    addIcon: [{ type: Input }],
    addClicked: [{ type: Output }],
    selected: [{ type: Output }]
};
if (false) {
    /** @type {?} */
    NzTabNavOperationComponent.prototype.items;
    /** @type {?} */
    NzTabNavOperationComponent.prototype.addable;
    /** @type {?} */
    NzTabNavOperationComponent.prototype.addIcon;
    /** @type {?} */
    NzTabNavOperationComponent.prototype.addClicked;
    /** @type {?} */
    NzTabNavOperationComponent.prototype.selected;
    /** @type {?} */
    NzTabNavOperationComponent.prototype.closeAnimationWaitTimeoutId;
    /** @type {?} */
    NzTabNavOperationComponent.prototype.menuOpened;
    /**
     * @type {?}
     * @private
     */
    NzTabNavOperationComponent.prototype.element;
    /** @type {?} */
    NzTabNavOperationComponent.prototype.cdr;
    /**
     * @type {?}
     * @private
     */
    NzTabNavOperationComponent.prototype.elementRef;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tab-nav-bar.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
const RESIZE_SCHEDULER = typeof requestAnimationFrame !== 'undefined' ? animationFrameScheduler : asapScheduler;
/** @type {?} */
const CSS_TRANSFORM_TIME = 150;
class NzTabNavBarComponent {
    /**
     * @param {?} cdr
     * @param {?} ngZone
     * @param {?} viewportRuler
     * @param {?} nzResizeObserver
     * @param {?} dir
     */
    constructor(cdr, ngZone, viewportRuler, nzResizeObserver, dir) {
        this.cdr = cdr;
        this.ngZone = ngZone;
        this.viewportRuler = viewportRuler;
        this.nzResizeObserver = nzResizeObserver;
        this.dir = dir;
        this.indexFocused = new EventEmitter();
        this.selectFocusedIndex = new EventEmitter();
        this.addClicked = new EventEmitter();
        this.tabScroll = new EventEmitter();
        this.position = 'horizontal';
        this.addable = false;
        this.hideBar = false;
        this.addIcon = 'plus';
        this.inkBarAnimated = true;
        this.translate = null;
        this.transformX = 0;
        this.transformY = 0;
        this.pingLeft = false;
        this.pingRight = false;
        this.pingTop = false;
        this.pingBottom = false;
        this.hiddenItems = [];
        this.destroy$ = new Subject();
        this._selectedIndex = 0;
        this.wrapperWidth = 0;
        this.wrapperHeight = 0;
        this.scrollListWidth = 0;
        this.scrollListHeight = 0;
        this.operationWidth = 0;
        this.operationHeight = 0;
        this.addButtonWidth = 0;
        this.addButtonHeight = 0;
        this.selectedIndexChanged = false;
        this.lockAnimationTimeoutId = -1;
        this.cssTransformTimeWaitingId = -1;
    }
    /**
     * @return {?}
     */
    get selectedIndex() {
        return this._selectedIndex;
    }
    /**
     * @param {?} value
     * @return {?}
     */
    set selectedIndex(value) {
        /** @type {?} */
        const newValue = coerceNumberProperty(value);
        if (this._selectedIndex !== newValue) {
            this._selectedIndex = value;
            this.selectedIndexChanged = true;
            if (this.keyManager) {
                this.keyManager.updateActiveItem(value);
            }
        }
    }
    /**
     * Tracks which element has focus; used for keyboard navigation
     * @return {?}
     */
    get focusIndex() {
        return this.keyManager ? (/** @type {?} */ (this.keyManager.activeItemIndex)) : 0;
    }
    /**
     * When the focus index is set, we must manually send focus to the correct label
     * @param {?} value
     * @return {?}
     */
    set focusIndex(value) {
        if (!this.isValidIndex(value) || this.focusIndex === value || !this.keyManager) {
            return;
        }
        this.keyManager.setActiveItem(value);
    }
    /**
     * @return {?}
     */
    get showAddButton() {
        return this.hiddenItems.length === 0 && this.addable;
    }
    /**
     * @return {?}
     */
    ngOnInit() { }
    /**
     * @return {?}
     */
    ngAfterViewInit() {
        /** @type {?} */
        const dirChange = this.dir ? this.dir.change : of(null);
        /** @type {?} */
        const resize = this.viewportRuler.change(150);
        /** @type {?} */
        const realign = (/**
         * @return {?}
         */
        () => {
            this.updateScrollListPosition();
            this.alignInkBarToSelectedTab();
        });
        this.keyManager = new FocusKeyManager(this.items)
            .withHorizontalOrientation(this.getLayoutDirection())
            .withWrap();
        this.keyManager.updateActiveItem(0);
        reqAnimFrame(realign);
        merge(this.nzResizeObserver.observe(this.navWarpRef), this.nzResizeObserver.observe(this.navListRef))
            .pipe(takeUntil(this.destroy$), auditTime(16, RESIZE_SCHEDULER))
            .subscribe((/**
         * @return {?}
         */
        () => {
            this.updateScrollListPosition();
        }));
        merge(dirChange, resize, this.items.changes)
            .pipe(takeUntil(this.destroy$))
            .subscribe((/**
         * @return {?}
         */
        () => {
            Promise.resolve().then(realign);
            this.keyManager.withHorizontalOrientation(this.getLayoutDirection());
        }));
        this.keyManager.change.pipe(takeUntil(this.destroy$)).subscribe((/**
         * @param {?} newFocusIndex
         * @return {?}
         */
        newFocusIndex => {
            this.indexFocused.emit(newFocusIndex);
            this.setTabFocus(newFocusIndex);
            this.scrollToTab((/** @type {?} */ (this.keyManager.activeItem)));
        }));
    }
    /**
     * @return {?}
     */
    ngAfterContentChecked() {
        if (this.selectedIndexChanged) {
            this.updateScrollListPosition();
            this.alignInkBarToSelectedTab();
            this.selectedIndexChanged = false;
            this.cdr.markForCheck();
        }
    }
    /**
     * @return {?}
     */
    ngOnDestroy() {
        window.clearTimeout(this.lockAnimationTimeoutId);
        window.clearTimeout(this.cssTransformTimeWaitingId);
        this.destroy$.next();
        this.destroy$.complete();
    }
    /**
     * @param {?} tab
     * @return {?}
     */
    onSelectedFromMenu(tab) {
        /** @type {?} */
        const tabIndex = this.items.toArray().findIndex((/**
         * @param {?} e
         * @return {?}
         */
        e => e === tab));
        if (tabIndex !== -1) {
            this.keyManager.updateActiveItem(tabIndex);
            if (this.focusIndex !== this.selectedIndex) {
                this.selectFocusedIndex.emit(this.focusIndex);
                this.scrollToTab(tab);
            }
        }
    }
    /**
     * @param {?} e
     * @return {?}
     */
    onOffsetChange(e) {
        if (this.position === 'horizontal') {
            if (this.lockAnimationTimeoutId === -1) {
                if (this.transformX >= 0 && e.x > 0) {
                    return;
                }
                if (this.transformX <= this.wrapperWidth - this.scrollListWidth && e.x < 0) {
                    return;
                }
            }
            e.event.preventDefault();
            this.transformX = this.clampTransformX(this.transformX + e.x);
            this.setTransform(this.transformX, 0);
        }
        else {
            if (this.lockAnimationTimeoutId === -1) {
                if (this.transformY >= 0 && e.y > 0) {
                    return;
                }
                if (this.transformY <= this.wrapperHeight - this.scrollListHeight && e.y < 0) {
                    return;
                }
            }
            e.event.preventDefault();
            this.transformY = this.clampTransformY(this.transformY + e.y);
            this.setTransform(0, this.transformY);
        }
        this.lockAnimation();
        this.setVisibleRange();
        this.setPingStatus();
    }
    /**
     * @param {?} event
     * @return {?}
     */
    handleKeydown(event) {
        if (hasModifierKey(event)) {
            return;
        }
        switch (event.keyCode) {
            case LEFT_ARROW:
            case UP_ARROW:
            case RIGHT_ARROW:
            case DOWN_ARROW:
                this.lockAnimation();
                this.keyManager.onKeydown(event);
                break;
            case ENTER:
            case SPACE:
                if (this.focusIndex !== this.selectedIndex) {
                    this.selectFocusedIndex.emit(this.focusIndex);
                }
                break;
            default:
                this.keyManager.onKeydown(event);
        }
    }
    /**
     * @private
     * @param {?} index
     * @return {?}
     */
    isValidIndex(index) {
        if (!this.items) {
            return true;
        }
        /** @type {?} */
        const tab = this.items ? this.items.toArray()[index] : null;
        return !!tab && !tab.disabled;
    }
    /**
     * @private
     * @param {?} tab
     * @return {?}
     */
    scrollToTab(tab) {
        if (!this.items.find((/**
         * @param {?} e
         * @return {?}
         */
        e => e === tab))) {
            return;
        }
        /** @type {?} */
        const tabs = this.items.toArray();
        if (this.position === 'horizontal') {
            /** @type {?} */
            let newTransform = this.transformX;
            if (this.getLayoutDirection() === 'rtl') {
                /** @type {?} */
                const right = tabs[0].left + tabs[0].width - tab.left - tab.width;
                if (right < this.transformX) {
                    newTransform = right;
                }
                else if (right + tab.width > this.transformX + this.wrapperWidth) {
                    newTransform = right + tab.width - this.wrapperWidth;
                }
            }
            else if (tab.left < -this.transformX) {
                newTransform = -tab.left;
            }
            else if (tab.left + tab.width > -this.transformX + this.wrapperWidth) {
                newTransform = -(tab.left + tab.width - this.wrapperWidth);
            }
            this.transformX = newTransform;
            this.transformY = 0;
            this.setTransform(newTransform, 0);
        }
        else {
            /** @type {?} */
            let newTransform = this.transformY;
            if (tab.top < -this.transformY) {
                newTransform = -tab.top;
            }
            else if (tab.top + tab.height > -this.transformY + this.wrapperHeight) {
                newTransform = -(tab.top + tab.height - this.wrapperHeight);
            }
            this.transformY = newTransform;
            this.transformX = 0;
            this.setTransform(0, newTransform);
        }
        window.clearTimeout(this.cssTransformTimeWaitingId);
        this.cssTransformTimeWaitingId = setTimeout((/**
         * @return {?}
         */
        () => {
            this.setVisibleRange();
        }), CSS_TRANSFORM_TIME);
    }
    /**
     * @private
     * @return {?}
     */
    lockAnimation() {
        if (this.lockAnimationTimeoutId === -1) {
            this.ngZone.runOutsideAngular((/**
             * @return {?}
             */
            () => {
                this.navListRef.nativeElement.style.transition = 'none';
                this.lockAnimationTimeoutId = setTimeout((/**
                 * @return {?}
                 */
                () => {
                    this.navListRef.nativeElement.style.transition = '';
                    this.lockAnimationTimeoutId = -1;
                }), CSS_TRANSFORM_TIME);
            }));
        }
    }
    /**
     * @private
     * @param {?} x
     * @param {?} y
     * @return {?}
     */
    setTransform(x, y) {
        this.navListRef.nativeElement.style.transform = `translate(${x}px, ${y}px)`;
    }
    /**
     * @private
     * @param {?} transform
     * @return {?}
     */
    clampTransformX(transform) {
        /** @type {?} */
        const scrollWidth = this.wrapperWidth - this.scrollListWidth;
        if (this.getLayoutDirection() === 'rtl') {
            return Math.max(Math.min(scrollWidth, transform), 0);
        }
        else {
            return Math.min(Math.max(scrollWidth, transform), 0);
        }
    }
    /**
     * @private
     * @param {?} transform
     * @return {?}
     */
    clampTransformY(transform) {
        return Math.min(Math.max(this.wrapperHeight - this.scrollListHeight, transform), 0);
    }
    /**
     * @private
     * @return {?}
     */
    updateScrollListPosition() {
        this.resetSizes();
        this.transformX = this.clampTransformX(this.transformX);
        this.transformY = this.clampTransformY(this.transformY);
        this.setVisibleRange();
        this.setPingStatus();
        if (this.keyManager) {
            this.keyManager.updateActiveItem((/** @type {?} */ (this.keyManager.activeItemIndex)));
            if (this.keyManager.activeItem) {
                this.scrollToTab(this.keyManager.activeItem);
            }
        }
    }
    /**
     * @private
     * @return {?}
     */
    resetSizes() {
        this.addButtonWidth = this.addBtnRef ? this.addBtnRef.getElementWidth() : 0;
        this.addButtonHeight = this.addBtnRef ? this.addBtnRef.getElementHeight() : 0;
        this.operationWidth = this.operationRef.getElementWidth();
        this.operationHeight = this.operationRef.getElementHeight();
        this.wrapperWidth = this.navWarpRef.nativeElement.offsetWidth || 0;
        this.wrapperHeight = this.navWarpRef.nativeElement.offsetHeight || 0;
        this.scrollListHeight = this.navListRef.nativeElement.offsetHeight || 0;
        this.scrollListWidth = this.navListRef.nativeElement.offsetWidth || 0;
    }
    /**
     * @private
     * @return {?}
     */
    alignInkBarToSelectedTab() {
        /** @type {?} */
        const selectedItem = this.items && this.items.length ? this.items.toArray()[this.selectedIndex] : null;
        /** @type {?} */
        const selectedItemElement = selectedItem ? selectedItem.elementRef.nativeElement : null;
        if (selectedItemElement) {
            /**
             * .ant-tabs-nav-list - Target offset parent element
             *   └──.ant-tabs-tab
             *        └──.ant-tabs-tab-btn - Currently focused element
             */
            this.inkBar.alignToElement((/** @type {?} */ (selectedItemElement.parentElement)));
        }
    }
    /**
     * @private
     * @return {?}
     */
    setPingStatus() {
        /** @type {?} */
        const ping = {
            top: false,
            right: false,
            bottom: false,
            left: false
        };
        /** @type {?} */
        const navWarp = this.navWarpRef.nativeElement;
        if (this.position === 'horizontal') {
            if (this.getLayoutDirection() === 'rtl') {
                ping.right = this.transformX > 0;
                ping.left = this.transformX + this.wrapperWidth < this.scrollListWidth;
            }
            else {
                ping.left = this.transformX < 0;
                ping.right = -this.transformX + this.wrapperWidth < this.scrollListWidth;
            }
        }
        else {
            ping.top = this.transformY < 0;
            ping.bottom = -this.transformY + this.wrapperHeight < this.scrollListHeight;
        }
        ((/** @type {?} */ (Object.keys(ping)))).forEach((/**
         * @param {?} pos
         * @return {?}
         */
        pos => {
            /** @type {?} */
            const className = `ant-tabs-nav-wrap-ping-${pos}`;
            if (ping[pos]) {
                navWarp.classList.add(className);
            }
            else {
                navWarp.classList.remove(className);
            }
        }));
    }
    /**
     * @private
     * @return {?}
     */
    setVisibleRange() {
        /** @type {?} */
        let unit;
        /** @type {?} */
        let position;
        /** @type {?} */
        let transformSize;
        /** @type {?} */
        let basicSize;
        /** @type {?} */
        let tabContentSize;
        /** @type {?} */
        let addSize;
        /** @type {?} */
        const tabs = this.items.toArray();
        /** @type {?} */
        const DEFAULT_SIZE = { width: 0, height: 0, left: 0, top: 0, right: 0 };
        /** @type {?} */
        const getOffset = (/**
         * @param {?} index
         * @return {?}
         */
        (index) => {
            /** @type {?} */
            let offset;
            /** @type {?} */
            const size = tabs[index] || DEFAULT_SIZE;
            if (position === 'right') {
                offset = tabs[0].left + tabs[0].width - tabs[index].left - tabs[index].width;
            }
            else {
                offset = size[position];
            }
            return offset;
        });
        if (this.position === 'horizontal') {
            unit = 'width';
            basicSize = this.wrapperWidth;
            tabContentSize = this.scrollListWidth - (this.hiddenItems.length ? this.operationWidth : 0);
            addSize = this.addButtonWidth;
            transformSize = Math.abs(this.transformX);
            if (this.getLayoutDirection() === 'rtl') {
                position = 'right';
                this.pingRight = this.transformX > 0;
                this.pingLeft = this.transformX + this.wrapperWidth < this.scrollListWidth;
            }
            else {
                this.pingLeft = this.transformX < 0;
                this.pingRight = -this.transformX + this.wrapperWidth < this.scrollListWidth;
                position = 'left';
            }
        }
        else {
            unit = 'height';
            basicSize = this.wrapperHeight;
            tabContentSize = this.scrollListHeight - (this.hiddenItems.length ? this.operationHeight : 0);
            addSize = this.addButtonHeight;
            position = 'top';
            transformSize = -this.transformY;
            this.pingTop = this.transformY < 0;
            this.pingBottom = -this.transformY + this.wrapperHeight < this.scrollListHeight;
        }
        /** @type {?} */
        let mergedBasicSize = basicSize;
        if (tabContentSize + addSize > basicSize) {
            mergedBasicSize = basicSize - addSize;
        }
        if (!tabs.length) {
            this.hiddenItems = [];
            this.cdr.markForCheck();
            return;
        }
        /** @type {?} */
        const len = tabs.length;
        /** @type {?} */
        let endIndex = len;
        for (let i = 0; i < len; i += 1) {
            /** @type {?} */
            const offset = getOffset(i);
            /** @type {?} */
            const size = tabs[i] || DEFAULT_SIZE;
            if (offset + size[unit] > transformSize + mergedBasicSize) {
                endIndex = i - 1;
                break;
            }
        }
        /** @type {?} */
        let startIndex = 0;
        for (let i = len - 1; i >= 0; i -= 1) {
            /** @type {?} */
            const offset = getOffset(i);
            if (offset < transformSize) {
                startIndex = i + 1;
                break;
            }
        }
        /** @type {?} */
        const startHiddenTabs = tabs.slice(0, startIndex);
        /** @type {?} */
        const endHiddenTabs = tabs.slice(endIndex + 1);
        this.hiddenItems = [...startHiddenTabs, ...endHiddenTabs];
        this.cdr.markForCheck();
    }
    /**
     * @private
     * @return {?}
     */
    getLayoutDirection() {
        return this.dir && this.dir.value === 'rtl' ? 'rtl' : 'ltr';
    }
    /**
     * @private
     * @param {?} _tabIndex
     * @return {?}
     */
    setTabFocus(_tabIndex) { }
    /**
     * @param {?} changes
     * @return {?}
     */
    ngOnChanges(changes) {
        const { position } = changes;
        // The first will be aligning in ngAfterViewInit
        if (position && !position.isFirstChange()) {
            this.alignInkBarToSelectedTab();
            this.lockAnimation();
            this.updateScrollListPosition();
        }
    }
}
NzTabNavBarComponent.decorators = [
    { type: Component, args: [{
                selector: 'nz-tabs-nav',
                exportAs: 'nzTabsNav',
                preserveWhitespaces: false,
                changeDetection: ChangeDetectionStrategy.OnPush,
                encapsulation: ViewEncapsulation.None,
                template: `
    <div
      class="ant-tabs-nav-wrap"
      [class.ant-tabs-nav-wrap-ping-left]="pingLeft"
      [class.ant-tabs-nav-wrap-ping-right]="pingRight"
      [class.ant-tabs-nav-wrap-ping-top]="pingTop"
      [class.ant-tabs-nav-wrap-ping-bottom]="pingBottom"
      #navWarp
    >
      <div class="ant-tabs-nav-list" #navList nzTabScrollList (offsetChange)="onOffsetChange($event)" (tabScroll)="tabScroll.emit($event)">
        <ng-content></ng-content>
        <button *ngIf="showAddButton" nz-tab-add-button [addIcon]="addIcon" (click)="addClicked.emit()"></button>
        <div nz-tabs-ink-bar [hidden]="hideBar" [position]="position" [animated]="inkBarAnimated"></div>
      </div>
    </div>
    <nz-tab-nav-operation
      (addClicked)="addClicked.emit()"
      (selected)="onSelectedFromMenu($event)"
      [addIcon]="addIcon"
      [addable]="addable"
      [items]="hiddenItems"
    ></nz-tab-nav-operation>
    <div class="ant-tabs-extra-content" *ngIf="extraTemplate">
      <ng-template [ngTemplateOutlet]="extraTemplate"></ng-template>
    </div>
  `,
                host: {
                    role: 'tablist',
                    class: 'ant-tabs-nav',
                    '(keydown)': 'handleKeydown($event)'
                }
            }] }
];
/** @nocollapse */
NzTabNavBarComponent.ctorParameters = () => [
    { type: ChangeDetectorRef },
    { type: NgZone },
    { type: ViewportRuler },
    { type: NzResizeObserver },
    { type: Directionality, decorators: [{ type: Optional }] }
];
NzTabNavBarComponent.propDecorators = {
    indexFocused: [{ type: Output }],
    selectFocusedIndex: [{ type: Output }],
    addClicked: [{ type: Output }],
    tabScroll: [{ type: Output }],
    position: [{ type: Input }],
    addable: [{ type: Input }],
    hideBar: [{ type: Input }],
    addIcon: [{ type: Input }],
    inkBarAnimated: [{ type: Input }],
    extraTemplate: [{ type: Input }],
    selectedIndex: [{ type: Input }],
    navWarpRef: [{ type: ViewChild, args: ['navWarp', { static: true },] }],
    navListRef: [{ type: ViewChild, args: ['navList', { static: true },] }],
    operationRef: [{ type: ViewChild, args: [NzTabNavOperationComponent, { static: true },] }],
    addBtnRef: [{ type: ViewChild, args: [NzTabAddButtonComponent, { static: false },] }],
    inkBar: [{ type: ViewChild, args: [NzTabsInkBarDirective, { static: true },] }],
    items: [{ type: ContentChildren, args: [NzTabNavItemDirective, { descendants: true },] }]
};
if (false) {
    /** @type {?} */
    NzTabNavBarComponent.prototype.indexFocused;
    /** @type {?} */
    NzTabNavBarComponent.prototype.selectFocusedIndex;
    /** @type {?} */
    NzTabNavBarComponent.prototype.addClicked;
    /** @type {?} */
    NzTabNavBarComponent.prototype.tabScroll;
    /** @type {?} */
    NzTabNavBarComponent.prototype.position;
    /** @type {?} */
    NzTabNavBarComponent.prototype.addable;
    /** @type {?} */
    NzTabNavBarComponent.prototype.hideBar;
    /** @type {?} */
    NzTabNavBarComponent.prototype.addIcon;
    /** @type {?} */
    NzTabNavBarComponent.prototype.inkBarAnimated;
    /** @type {?} */
    NzTabNavBarComponent.prototype.extraTemplate;
    /** @type {?} */
    NzTabNavBarComponent.prototype.navWarpRef;
    /** @type {?} */
    NzTabNavBarComponent.prototype.navListRef;
    /** @type {?} */
    NzTabNavBarComponent.prototype.operationRef;
    /** @type {?} */
    NzTabNavBarComponent.prototype.addBtnRef;
    /** @type {?} */
    NzTabNavBarComponent.prototype.inkBar;
    /** @type {?} */
    NzTabNavBarComponent.prototype.items;
    /** @type {?} */
    NzTabNavBarComponent.prototype.translate;
    /** @type {?} */
    NzTabNavBarComponent.prototype.transformX;
    /** @type {?} */
    NzTabNavBarComponent.prototype.transformY;
    /** @type {?} */
    NzTabNavBarComponent.prototype.pingLeft;
    /** @type {?} */
    NzTabNavBarComponent.prototype.pingRight;
    /** @type {?} */
    NzTabNavBarComponent.prototype.pingTop;
    /** @type {?} */
    NzTabNavBarComponent.prototype.pingBottom;
    /** @type {?} */
    NzTabNavBarComponent.prototype.hiddenItems;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.keyManager;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.destroy$;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype._selectedIndex;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.wrapperWidth;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.wrapperHeight;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.scrollListWidth;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.scrollListHeight;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.operationWidth;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.operationHeight;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.addButtonWidth;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.addButtonHeight;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.selectedIndexChanged;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.lockAnimationTimeoutId;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.cssTransformTimeWaitingId;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.cdr;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.ngZone;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.viewportRuler;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.nzResizeObserver;
    /**
     * @type {?}
     * @private
     */
    NzTabNavBarComponent.prototype.dir;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tab-body.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class NzTabBodyComponent {
    constructor() {
        this.content = null;
        this.active = false;
        this.tabPaneAnimated = true;
        this.forceRender = false;
    }
}
NzTabBodyComponent.decorators = [
    { type: Component, args: [{
                selector: '[nz-tab-body]',
                exportAs: 'nzTabBody',
                preserveWhitespaces: false,
                encapsulation: ViewEncapsulation.None,
                changeDetection: ChangeDetectionStrategy.OnPush,
                template: `
    <ng-container *ngIf="active || forceRender">
      <ng-template [ngTemplateOutlet]="content"></ng-template>
    </ng-container>
  `,
                host: {
                    class: 'ant-tabs-tabpane',
                    '[class.ant-tabs-tabpane-active]': 'active',
                    '[attr.tabindex]': 'active ? 0 : -1',
                    '[attr.aria-hidden]': '!active',
                    '[style.visibility]': 'tabPaneAnimated ? active ? null : "hidden" : null',
                    '[style.height]': 'tabPaneAnimated ? active ? null : 0 : null',
                    '[style.overflow-y]': 'tabPaneAnimated ? active ? null : "none" : null',
                    '[style.display]': '!tabPaneAnimated ? active ? null : "none" : null'
                }
            }] }
];
NzTabBodyComponent.propDecorators = {
    content: [{ type: Input }],
    active: [{ type: Input }],
    tabPaneAnimated: [{ type: Input }],
    forceRender: [{ type: Input }]
};
if (false) {
    /** @type {?} */
    NzTabBodyComponent.prototype.content;
    /** @type {?} */
    NzTabBodyComponent.prototype.active;
    /** @type {?} */
    NzTabBodyComponent.prototype.tabPaneAnimated;
    /** @type {?} */
    NzTabBodyComponent.prototype.forceRender;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tab-scroll-list.directive.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
const MIN_SWIPE_DISTANCE = 0.1;
/** @type {?} */
const STOP_SWIPE_DISTANCE = 0.01;
/** @type {?} */
const REFRESH_INTERVAL = 20;
/** @type {?} */
const SPEED_OFF_MULTIPLE = Math.pow(0.995, REFRESH_INTERVAL);
class NzTabScrollListDirective {
    /**
     * @param {?} ngZone
     * @param {?} elementRef
     */
    constructor(ngZone, elementRef) {
        this.ngZone = ngZone;
        this.elementRef = elementRef;
        this.lastWheelDirection = null;
        this.lastWheelTimestamp = 0;
        this.lastTimestamp = 0;
        this.lastTimeDiff = 0;
        this.lastMixedWheel = 0;
        this.lastWheelPrevent = false;
        this.touchPosition = null;
        this.lastOffset = null;
        this.motion = -1;
        this.unsubscribe = (/**
         * @return {?}
         */
        () => void 0);
        this.offsetChange = new EventEmitter();
        this.tabScroll = new EventEmitter();
        this.onTouchEnd = (/**
         * @param {?} e
         * @return {?}
         */
        (e) => {
            if (!this.touchPosition) {
                return;
            }
            /** @type {?} */
            const lastOffset = this.lastOffset;
            /** @type {?} */
            const lastTimeDiff = this.lastTimeDiff;
            this.lastOffset = this.touchPosition = null;
            if (lastOffset) {
                /** @type {?} */
                const distanceX = lastOffset.x / lastTimeDiff;
                /** @type {?} */
                const distanceY = lastOffset.y / lastTimeDiff;
                /** @type {?} */
                const absX = Math.abs(distanceX);
                /** @type {?} */
                const absY = Math.abs(distanceY);
                // Skip swipe if low distance
                if (Math.max(absX, absY) < MIN_SWIPE_DISTANCE) {
                    return;
                }
                /** @type {?} */
                let currentX = distanceX;
                /** @type {?} */
                let currentY = distanceY;
                this.motion = window.setInterval((/**
                 * @return {?}
                 */
                () => {
                    if (Math.abs(currentX) < STOP_SWIPE_DISTANCE && Math.abs(currentY) < STOP_SWIPE_DISTANCE) {
                        window.clearInterval(this.motion);
                        return;
                    }
                    currentX *= SPEED_OFF_MULTIPLE;
                    currentY *= SPEED_OFF_MULTIPLE;
                    this.onOffset(currentX * REFRESH_INTERVAL, currentY * REFRESH_INTERVAL, e);
                }), REFRESH_INTERVAL);
            }
        });
        this.onTouchMove = (/**
         * @param {?} e
         * @return {?}
         */
        (e) => {
            if (!this.touchPosition) {
                return;
            }
            e.preventDefault();
            const { screenX, screenY } = e.touches[0];
            /** @type {?} */
            const offsetX = screenX - this.touchPosition.x;
            /** @type {?} */
            const offsetY = screenY - this.touchPosition.y;
            this.onOffset(offsetX, offsetY, e);
            /** @type {?} */
            const now = Date.now();
            this.lastTimeDiff = now - this.lastTimestamp;
            this.lastTimestamp = now;
            this.lastOffset = { x: offsetX, y: offsetY };
            this.touchPosition = { x: screenX, y: screenY };
        });
        this.onTouchStart = (/**
         * @param {?} e
         * @return {?}
         */
        (e) => {
            const { screenX, screenY } = e.touches[0];
            this.touchPosition = { x: screenX, y: screenY };
            window.clearInterval(this.motion);
        });
        this.onWheel = (/**
         * @param {?} e
         * @return {?}
         */
        (e) => {
            const { deltaX, deltaY } = e;
            /** @type {?} */
            let mixed;
            /** @type {?} */
            const absX = Math.abs(deltaX);
            /** @type {?} */
            const absY = Math.abs(deltaY);
            if (absX === absY) {
                mixed = this.lastWheelDirection === 'x' ? deltaX : deltaY;
            }
            else if (absX > absY) {
                mixed = deltaX;
                this.lastWheelDirection = 'x';
            }
            else {
                mixed = deltaY;
                this.lastWheelDirection = 'y';
            }
            // Optimize mac touch scroll
            /** @type {?} */
            const now = Date.now();
            /** @type {?} */
            const absMixed = Math.abs(mixed);
            if (now - this.lastWheelTimestamp > 100 || absMixed - this.lastMixedWheel > 10) {
                this.lastWheelPrevent = false;
            }
            this.onOffset(-mixed, -mixed, e);
            if (e.defaultPrevented || this.lastWheelPrevent) {
                this.lastWheelPrevent = true;
            }
            this.lastWheelTimestamp = now;
            this.lastMixedWheel = absMixed;
        });
    }
    /**
     * @return {?}
     */
    ngOnInit() {
        this.unsubscribe = this.ngZone.runOutsideAngular((/**
         * @return {?}
         */
        () => {
            /** @type {?} */
            const el = this.elementRef.nativeElement;
            /** @type {?} */
            const wheel$ = fromEvent(el, 'wheel');
            /** @type {?} */
            const touchstart$ = fromEvent(el, 'touchstart');
            /** @type {?} */
            const touchmove$ = fromEvent(el, 'touchmove');
            /** @type {?} */
            const touchend$ = fromEvent(el, 'touchend');
            /** @type {?} */
            const subscription = new Subscription();
            subscription.add(this.subscribeWrap('wheel', wheel$, this.onWheel));
            subscription.add(this.subscribeWrap('touchstart', touchstart$, this.onTouchStart));
            subscription.add(this.subscribeWrap('touchmove', touchmove$, this.onTouchMove));
            subscription.add(this.subscribeWrap('touchend', touchend$, this.onTouchEnd));
            return (/**
             * @return {?}
             */
            () => {
                subscription.unsubscribe();
            });
        }));
    }
    /**
     * @template T
     * @param {?} type
     * @param {?} observable
     * @param {?} handler
     * @return {?}
     */
    subscribeWrap(type, observable, handler) {
        return observable.subscribe((/**
         * @param {?} event
         * @return {?}
         */
        event => {
            this.tabScroll.emit((/** @type {?} */ ({
                type,
                event
            })));
            if (!event.defaultPrevented) {
                handler(event);
            }
        }));
    }
    /**
     * @param {?} x
     * @param {?} y
     * @param {?} event
     * @return {?}
     */
    onOffset(x, y, event) {
        this.ngZone.run((/**
         * @return {?}
         */
        () => {
            this.offsetChange.emit({
                x,
                y,
                event
            });
        }));
    }
    /**
     * @return {?}
     */
    ngOnDestroy() {
        this.unsubscribe();
    }
}
NzTabScrollListDirective.decorators = [
    { type: Directive, args: [{
                selector: '[nzTabScrollList]'
            },] }
];
/** @nocollapse */
NzTabScrollListDirective.ctorParameters = () => [
    { type: NgZone },
    { type: ElementRef }
];
NzTabScrollListDirective.propDecorators = {
    offsetChange: [{ type: Output }],
    tabScroll: [{ type: Output }]
};
if (false) {
    /** @type {?} */
    NzTabScrollListDirective.prototype.lastWheelDirection;
    /** @type {?} */
    NzTabScrollListDirective.prototype.lastWheelTimestamp;
    /** @type {?} */
    NzTabScrollListDirective.prototype.lastTimestamp;
    /** @type {?} */
    NzTabScrollListDirective.prototype.lastTimeDiff;
    /** @type {?} */
    NzTabScrollListDirective.prototype.lastMixedWheel;
    /** @type {?} */
    NzTabScrollListDirective.prototype.lastWheelPrevent;
    /** @type {?} */
    NzTabScrollListDirective.prototype.touchPosition;
    /** @type {?} */
    NzTabScrollListDirective.prototype.lastOffset;
    /** @type {?} */
    NzTabScrollListDirective.prototype.motion;
    /** @type {?} */
    NzTabScrollListDirective.prototype.unsubscribe;
    /** @type {?} */
    NzTabScrollListDirective.prototype.offsetChange;
    /** @type {?} */
    NzTabScrollListDirective.prototype.tabScroll;
    /** @type {?} */
    NzTabScrollListDirective.prototype.onTouchEnd;
    /** @type {?} */
    NzTabScrollListDirective.prototype.onTouchMove;
    /** @type {?} */
    NzTabScrollListDirective.prototype.onTouchStart;
    /** @type {?} */
    NzTabScrollListDirective.prototype.onWheel;
    /**
     * @type {?}
     * @private
     */
    NzTabScrollListDirective.prototype.ngZone;
    /**
     * @type {?}
     * @private
     */
    NzTabScrollListDirective.prototype.elementRef;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tab-close-button.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
class NzTabCloseButtonComponent {
    constructor() {
        this.closeIcon = 'close';
    }
}
NzTabCloseButtonComponent.decorators = [
    { type: Component, args: [{
                selector: 'nz-tab-close-button, button[nz-tab-close-button]',
                template: `
    <ng-container *nzStringTemplateOutlet="closeIcon; let icon">
      <i nz-icon [nzType]="icon" nzTheme="outline"></i>
    </ng-container>
  `,
                host: {
                    class: 'ant-tabs-tab-remove',
                    'aria-label': 'Close tab',
                    type: 'button'
                }
            }] }
];
/** @nocollapse */
NzTabCloseButtonComponent.ctorParameters = () => [];
NzTabCloseButtonComponent.propDecorators = {
    closeIcon: [{ type: Input }]
};
if (false) {
    /** @type {?} */
    NzTabCloseButtonComponent.prototype.closeIcon;
}

/**
 * @fileoverview added by tsickle
 * Generated from: interfaces.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/**
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
 */
/**
 * @record
 */
function NzAnimatedInterface() { }
if (false) {
    /** @type {?} */
    NzAnimatedInterface.prototype.inkBar;
    /** @type {?} */
    NzAnimatedInterface.prototype.tabPane;
}
class NzTabChangeEvent {
}
if (false) {
    /** @type {?} */
    NzTabChangeEvent.prototype.index;
    /** @type {?} */
    NzTabChangeEvent.prototype.tab;
}
/**
 * @record
 */
function NzTabScrollListOffset() { }
if (false) {
    /** @type {?} */
    NzTabScrollListOffset.prototype.x;
    /** @type {?} */
    NzTabScrollListOffset.prototype.y;
}
/**
 * @record
 */
function NzTabWheelScrollEvent() { }
if (false) {
    /** @type {?} */
    NzTabWheelScrollEvent.prototype.type;
    /** @type {?} */
    NzTabWheelScrollEvent.prototype.event;
}
/**
 * @record
 */
function NzTabTouchScrollEvent() { }
if (false) {
    /** @type {?} */
    NzTabTouchScrollEvent.prototype.type;
    /** @type {?} */
    NzTabTouchScrollEvent.prototype.event;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tabset.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
const NZ_CONFIG_COMPONENT_NAME = 'tabs';
/** @type {?} */
let nextId = 0;
class NzTabSetComponent {
    /**
     * @param {?} nzConfigService
     * @param {?} cdr
     * @param {?} router
     */
    constructor(nzConfigService, cdr, router) {
        this.nzConfigService = nzConfigService;
        this.cdr = cdr;
        this.router = router;
        this.nzTabPosition = 'top';
        this.nzCanDeactivate = null;
        this.nzAddIcon = 'plus';
        this.nzTabBarStyle = null;
        this.nzType = 'line';
        this.nzSize = 'default';
        this.nzAnimated = true;
        this.nzTabBarGutter = undefined;
        this.nzHideAdd = false;
        this.nzCentered = false;
        this.nzHideAll = false;
        this.nzLinkRouter = false;
        this.nzLinkExact = true;
        this.nzSelectChange = new EventEmitter(true);
        this.nzSelectedIndexChange = new EventEmitter();
        this.nzTabListScroll = new EventEmitter();
        this.nzClose = new EventEmitter();
        this.nzAdd = new EventEmitter();
        /**
         * @deprecated Not supported.
         * \@breaking-change 11.0.0
         */
        this.nzShowPagination = true;
        /**
         * @deprecated Not supported.
         * \@breaking-change 11.0.0
         */
        this.nzOnNextClick = new EventEmitter();
        /**
         * @deprecated Not supported.
         * \@breaking-change 11.0.0
         */
        this.nzOnPrevClick = new EventEmitter();
        // Pick up only direct descendants under ivy rendering engine
        // We filter out only the tabs that belong to this tab set in `tabs`.
        this.allTabs = new QueryList();
        // All the direct tabs for this tab set
        this.tabs = new QueryList();
        this.destroy$ = new Subject();
        this.indexToSelect = 0;
        this.selectedIndex = null;
        this.tabLabelSubscription = Subscription.EMPTY;
        this.tabsSubscription = Subscription.EMPTY;
        this.canDeactivateSubscription = Subscription.EMPTY;
        this.tabSetId = nextId++;
    }
    /**
     * @return {?}
     */
    get nzSelectedIndex() {
        return this.selectedIndex;
    }
    /**
     * @param {?} value
     * @return {?}
     */
    set nzSelectedIndex(value) {
        this.indexToSelect = coerceNumberProperty(value, null);
    }
    /**
     * @return {?}
     */
    get position() {
        return ['top', 'bottom'].indexOf(this.nzTabPosition) === -1 ? 'vertical' : 'horizontal';
    }
    /**
     * @return {?}
     */
    get addable() {
        return this.nzType === 'editable-card' && !this.nzHideAdd;
    }
    /**
     * @return {?}
     */
    get closable() {
        return this.nzType === 'editable-card';
    }
    /**
     * @return {?}
     */
    get line() {
        return this.nzType === 'line';
    }
    /**
     * @return {?}
     */
    get inkBarAnimated() {
        return this.line && (typeof this.nzAnimated === 'boolean' ? this.nzAnimated : this.nzAnimated.inkBar);
    }
    /**
     * @return {?}
     */
    get tabPaneAnimated() {
        return (this.position === 'horizontal' && this.line && (typeof this.nzAnimated === 'boolean' ? this.nzAnimated : this.nzAnimated.tabPane));
    }
    /**
     * @return {?}
     */
    ngOnInit() {
        if (this.nzOnNextClick.observers.length) {
            warnDeprecation(`(nzOnNextClick) of nz-tabset is not support, will be removed in 11.0.0`);
        }
        if (this.nzOnPrevClick.observers.length) {
            warnDeprecation(`(nzOnPrevClick) of nz-tabset is not support, will be removed in 11.0.0`);
        }
    }
    /**
     * @return {?}
     */
    ngOnDestroy() {
        this.destroy$.next();
        this.destroy$.complete();
        this.tabs.destroy();
        this.tabLabelSubscription.unsubscribe();
        this.tabsSubscription.unsubscribe();
        this.canDeactivateSubscription.unsubscribe();
    }
    /**
     * @return {?}
     */
    ngAfterContentInit() {
        Promise.resolve().then((/**
         * @return {?}
         */
        () => {
            this.setUpRouter();
        }));
        this.subscribeToTabLabels();
        this.subscribeToAllTabChanges();
        // Subscribe to changes in the amount of tabs, in order to be
        // able to re-render the content as new tabs are added or removed.
        this.tabsSubscription = this.tabs.changes.subscribe((/**
         * @return {?}
         */
        () => {
            /** @type {?} */
            const indexToSelect = this.clampTabIndex(this.indexToSelect);
            // Maintain the previously-selected tab if a new tab is added or removed and there is no
            // explicit change that selects a different tab.
            if (indexToSelect === this.selectedIndex) {
                /** @type {?} */
                const tabs = this.tabs.toArray();
                for (let i = 0; i < tabs.length; i++) {
                    if (tabs[i].isActive) {
                        // Assign both to the `indexToSelect` and `selectedIndex` so we don't fire a changed
                        // event, otherwise the consumer may end up in an infinite loop in some edge cases like
                        // adding a tab within the `nzSelectedIndexChange` event.
                        this.indexToSelect = this.selectedIndex = i;
                        break;
                    }
                }
            }
            this.subscribeToTabLabels();
            this.cdr.markForCheck();
        }));
    }
    /**
     * @return {?}
     */
    ngAfterContentChecked() {
        // Don't clamp the `indexToSelect` immediately in the setter because it can happen that
        // the amount of tabs changes before the actual change detection runs.
        /** @type {?} */
        const indexToSelect = (this.indexToSelect = this.clampTabIndex(this.indexToSelect));
        // If there is a change in selected index, emit a change event. Should not trigger if
        // the selected index has not yet been initialized.
        if (this.selectedIndex !== indexToSelect) {
            /** @type {?} */
            const isFirstRun = this.selectedIndex == null;
            if (!isFirstRun) {
                this.nzSelectChange.emit(this.createChangeEvent(indexToSelect));
            }
            // Changing these values after change detection has run
            // since the checked content may contain references to them.
            Promise.resolve().then((/**
             * @return {?}
             */
            () => {
                this.tabs.forEach((/**
                 * @param {?} tab
                 * @param {?} index
                 * @return {?}
                 */
                (tab, index) => (tab.isActive = index === indexToSelect)));
                if (!isFirstRun) {
                    this.nzSelectedIndexChange.emit(indexToSelect);
                }
            }));
        }
        // Setup the position for each tab and optionally setup an origin on the next selected tab.
        this.tabs.forEach((/**
         * @param {?} tab
         * @param {?} index
         * @return {?}
         */
        (tab, index) => {
            tab.position = index - indexToSelect;
            // If there is already a selected tab, then set up an origin for the next selected tab
            // if it doesn't have one already.
            if (this.selectedIndex != null && tab.position === 0 && !tab.origin) {
                tab.origin = indexToSelect - this.selectedIndex;
            }
        }));
        if (this.selectedIndex !== indexToSelect) {
            this.selectedIndex = indexToSelect;
            this.cdr.markForCheck();
        }
    }
    /**
     * @param {?} index
     * @param {?} e
     * @return {?}
     */
    onClose(index, e) {
        e.preventDefault();
        e.stopPropagation();
        this.nzClose.emit({ index });
    }
    /**
     * @return {?}
     */
    onAdd() {
        this.nzAdd.emit();
    }
    /**
     * @private
     * @param {?} index
     * @return {?}
     */
    clampTabIndex(index) {
        return Math.min(this.tabs.length - 1, Math.max(index || 0, 0));
    }
    /**
     * @private
     * @param {?} index
     * @return {?}
     */
    createChangeEvent(index) {
        /** @type {?} */
        const event = new NzTabChangeEvent();
        event.index = index;
        if (this.tabs && this.tabs.length) {
            event.tab = this.tabs.toArray()[index];
            this.tabs.forEach((/**
             * @param {?} tab
             * @param {?} i
             * @return {?}
             */
            (tab, i) => {
                if (i !== index) {
                    tab.nzDeselect.emit();
                }
            }));
            event.tab.nzSelect.emit();
        }
        return event;
    }
    /**
     * @private
     * @return {?}
     */
    subscribeToTabLabels() {
        if (this.tabLabelSubscription) {
            this.tabLabelSubscription.unsubscribe();
        }
        this.tabLabelSubscription = merge(...this.tabs.map((/**
         * @param {?} tab
         * @return {?}
         */
        tab => tab.stateChanges))).subscribe((/**
         * @return {?}
         */
        () => this.cdr.markForCheck()));
    }
    /**
     * @private
     * @return {?}
     */
    subscribeToAllTabChanges() {
        this.allTabs.changes.pipe(startWith(this.allTabs)).subscribe((/**
         * @param {?} tabs
         * @return {?}
         */
        (tabs) => {
            this.tabs.reset(tabs.filter((/**
             * @param {?} tab
             * @return {?}
             */
            tab => tab.closestTabSet === this)));
            this.tabs.notifyOnChanges();
        }));
    }
    /**
     * @param {?} pre
     * @param {?} next
     * @return {?}
     */
    canDeactivateFun(pre, next) {
        if (typeof this.nzCanDeactivate === 'function') {
            /** @type {?} */
            const observable = wrapIntoObservable(this.nzCanDeactivate(pre, next));
            return observable.pipe(first(), takeUntil(this.destroy$));
        }
        else {
            return of(true);
        }
    }
    /**
     * @param {?} tab
     * @param {?} index
     * @return {?}
     */
    clickNavItem(tab, index) {
        if (!tab.nzDisabled) {
            // ignore nzCanDeactivate
            tab.nzClick.emit();
            this.setSelectedIndex(index);
        }
    }
    /**
     * @param {?} index
     * @return {?}
     */
    setSelectedIndex(index) {
        this.canDeactivateSubscription.unsubscribe();
        this.canDeactivateSubscription = this.canDeactivateFun((/** @type {?} */ (this.selectedIndex)), index).subscribe((/**
         * @param {?} can
         * @return {?}
         */
        can => {
            if (can) {
                this.nzSelectedIndex = index;
                this.tabNavBarRef.focusIndex = index;
                this.cdr.markForCheck();
            }
        }));
    }
    /**
     * @param {?} tab
     * @param {?} index
     * @return {?}
     */
    getTabIndex(tab, index) {
        if (tab.nzDisabled) {
            return null;
        }
        return this.selectedIndex === index ? 0 : -1;
    }
    /**
     * @param {?} i
     * @return {?}
     */
    getTabContentId(i) {
        return `nz-tabs-${this.tabSetId}-tab-${i}`;
    }
    /**
     * @private
     * @return {?}
     */
    setUpRouter() {
        if (this.nzLinkRouter) {
            if (!this.router) {
                throw new Error(`${PREFIX} you should import 'RouterModule' if you want to use 'nzLinkRouter'!`);
            }
            this.router.events
                .pipe(takeUntil(this.destroy$), filter((/**
             * @param {?} e
             * @return {?}
             */
            e => e instanceof NavigationEnd)), startWith(true), delay(0))
                .subscribe((/**
             * @return {?}
             */
            () => {
                this.updateRouterActive();
                this.cdr.markForCheck();
            }));
        }
    }
    /**
     * @private
     * @return {?}
     */
    updateRouterActive() {
        if (this.router.navigated) {
            /** @type {?} */
            const index = this.findShouldActiveTabIndex();
            if (index !== this.selectedIndex) {
                this.setSelectedIndex(index);
                this.nzSelectedIndexChange.emit(index);
            }
            this.nzHideAll = index === -1;
        }
    }
    /**
     * @private
     * @return {?}
     */
    findShouldActiveTabIndex() {
        /** @type {?} */
        const tabs = this.tabs.toArray();
        /** @type {?} */
        const isActive = this.isLinkActive(this.router);
        return tabs.findIndex((/**
         * @param {?} tab
         * @return {?}
         */
        tab => {
            /** @type {?} */
            const c = tab.linkDirective;
            console.log(c);
            return c ? isActive(c.routerLink) || isActive(c.routerLinkWithHref) : false;
        }));
    }
    /**
     * @private
     * @param {?} router
     * @return {?}
     */
    isLinkActive(router) {
        return (/**
         * @param {?=} link
         * @return {?}
         */
        (link) => (link ? router.isActive(link.urlTree, this.nzLinkExact) : false));
    }
    /**
     * @param {?} changes
     * @return {?}
     */
    ngOnChanges(changes) {
        if (changes.hasOwnProperty('nzShowPagination')) {
            warnDeprecation(`[nzOnPrevClick] of nz-tabset is not support, will be removed in 11.0.0`);
        }
    }
}
NzTabSetComponent.decorators = [
    { type: Component, args: [{
                selector: 'nz-tabset',
                exportAs: 'nzTabset',
                preserveWhitespaces: false,
                encapsulation: ViewEncapsulation.None,
                changeDetection: ChangeDetectionStrategy.Default,
                providers: [
                    {
                        provide: NZ_TAB_SET,
                        useExisting: NzTabSetComponent
                    }
                ],
                template: `
    <nz-tabs-nav
      *ngIf="tabs.length"
      [ngStyle]="nzTabBarStyle"
      [selectedIndex]="nzSelectedIndex || 0"
      [inkBarAnimated]="inkBarAnimated"
      [addable]="addable"
      [addIcon]="nzAddIcon"
      [hideBar]="nzHideAll"
      [position]="position"
      [extraTemplate]="nzTabBarExtraContent"
      (tabScroll)="nzTabListScroll.emit($event)"
      (selectFocusedIndex)="setSelectedIndex($event)"
      (addClicked)="onAdd()"
    >
      <div
        class="ant-tabs-tab"
        [class.ant-tabs-tab-active]="nzSelectedIndex === i"
        [class.ant-tabs-tab-disabled]="tab.nzDisabled"
        (click)="clickNavItem(tab, i)"
        *ngFor="let tab of tabs; let i = index"
      >
        <div
          role="tab"
          [style.margin-right.px]="nzTabBarGutter"
          [attr.tabIndex]="getTabIndex(tab, i)"
          [attr.aria-disabled]="tab.nzDisabled"
          [attr.aria-selected]="nzSelectedIndex === i && !nzHideAll"
          [attr.aria-controls]="getTabContentId(i)"
          [disabled]="tab.nzDisabled"
          [tab]="tab"
          [active]="nzSelectedIndex === i"
          class="ant-tabs-tab-btn"
          nzTabNavItem
          cdkMonitorElementFocus
        >
          <ng-container *nzStringTemplateOutlet="tab.label">{{ tab.label }}</ng-container>
          <button
            nz-tab-close-button
            *ngIf="tab.nzClosable && closable && !tab.nzDisabled"
            [closeIcon]="tab.nzCloseIcon"
            (click)="onClose(i, $event)"
          ></button>
        </div>
      </div>
    </nz-tabs-nav>
    <div class="ant-tabs-content-holder">
      <div
        class="ant-tabs-content"
        [class.ant-tabs-content-top]="nzTabPosition === 'top'"
        [class.ant-tabs-content-bottom]="nzTabPosition === 'bottom'"
        [class.ant-tabs-content-left]="nzTabPosition === 'left'"
        [class.ant-tabs-content-right]="nzTabPosition === 'right'"
        [class.ant-tabs-content-animated]="tabPaneAnimated"
        [style.margin-left.%]="tabPaneAnimated ? -(nzSelectedIndex || 0) * 100 : null"
      >
        <div
          nz-tab-body
          *ngFor="let tab of tabs; let i = index"
          [active]="nzSelectedIndex == i && !nzHideAll"
          [content]="tab.content"
          [forceRender]="tab.nzForceRender"
          [tabPaneAnimated]="tabPaneAnimated"
        ></div>
      </div>
    </div>
  `,
                host: {
                    class: 'ant-tabs',
                    '[class.ant-tabs-card]': `nzType === 'card' || nzType === 'editable-card'`,
                    '[class.ant-tabs-editable]': `nzType === 'editable-card'`,
                    '[class.ant-tabs-editable-card]': `nzType === 'editable-card'`,
                    '[class.ant-tabs-centered]': `nzCentered`,
                    '[class.ant-tabs-top]': `nzTabPosition === 'top'`,
                    '[class.ant-tabs-bottom]': `nzTabPosition === 'bottom'`,
                    '[class.ant-tabs-left]': `nzTabPosition === 'left'`,
                    '[class.ant-tabs-right]': `nzTabPosition === 'right'`,
                    '[class.ant-tabs-default]': `nzSize === 'default'`,
                    '[class.ant-tabs-small]': `nzSize === 'small'`,
                    '[class.ant-tabs-large]': `nzSize === 'large'`
                }
            }] }
];
/** @nocollapse */
NzTabSetComponent.ctorParameters = () => [
    { type: NzConfigService },
    { type: ChangeDetectorRef },
    { type: Router, decorators: [{ type: Optional }] }
];
NzTabSetComponent.propDecorators = {
    nzSelectedIndex: [{ type: Input }],
    nzTabPosition: [{ type: Input }],
    nzTabBarExtraContent: [{ type: Input }],
    nzCanDeactivate: [{ type: Input }],
    nzAddIcon: [{ type: Input }],
    nzTabBarStyle: [{ type: Input }],
    nzType: [{ type: Input }],
    nzSize: [{ type: Input }],
    nzAnimated: [{ type: Input }],
    nzTabBarGutter: [{ type: Input }],
    nzHideAdd: [{ type: Input }],
    nzCentered: [{ type: Input }],
    nzHideAll: [{ type: Input }],
    nzLinkRouter: [{ type: Input }],
    nzLinkExact: [{ type: Input }],
    nzSelectChange: [{ type: Output }],
    nzSelectedIndexChange: [{ type: Output }],
    nzTabListScroll: [{ type: Output }],
    nzClose: [{ type: Output }],
    nzAdd: [{ type: Output }],
    nzShowPagination: [{ type: Input }],
    nzOnNextClick: [{ type: Output }],
    nzOnPrevClick: [{ type: Output }],
    allTabs: [{ type: ContentChildren, args: [NzTabComponent, { descendants: true },] }],
    tabNavBarRef: [{ type: ViewChild, args: [NzTabNavBarComponent, { static: false },] }]
};
__decorate([
    WithConfig(NZ_CONFIG_COMPONENT_NAME),
    __metadata("design:type", String)
], NzTabSetComponent.prototype, "nzType", void 0);
__decorate([
    WithConfig(NZ_CONFIG_COMPONENT_NAME),
    __metadata("design:type", String)
], NzTabSetComponent.prototype, "nzSize", void 0);
__decorate([
    WithConfig(NZ_CONFIG_COMPONENT_NAME),
    __metadata("design:type", Object)
], NzTabSetComponent.prototype, "nzAnimated", void 0);
__decorate([
    WithConfig(NZ_CONFIG_COMPONENT_NAME),
    __metadata("design:type", Number)
], NzTabSetComponent.prototype, "nzTabBarGutter", void 0);
__decorate([
    InputBoolean(),
    __metadata("design:type", Boolean)
], NzTabSetComponent.prototype, "nzHideAdd", void 0);
__decorate([
    InputBoolean(),
    __metadata("design:type", Boolean)
], NzTabSetComponent.prototype, "nzCentered", void 0);
__decorate([
    InputBoolean(),
    __metadata("design:type", Object)
], NzTabSetComponent.prototype, "nzHideAll", void 0);
__decorate([
    InputBoolean(),
    __metadata("design:type", Object)
], NzTabSetComponent.prototype, "nzLinkRouter", void 0);
__decorate([
    InputBoolean(),
    __metadata("design:type", Object)
], NzTabSetComponent.prototype, "nzLinkExact", void 0);
__decorate([
    InputBoolean(),
    __metadata("design:type", Object)
], NzTabSetComponent.prototype, "nzShowPagination", void 0);
if (false) {
    /** @type {?} */
    NzTabSetComponent.ngAcceptInputType_nzHideAdd;
    /** @type {?} */
    NzTabSetComponent.ngAcceptInputType_nzHideAll;
    /** @type {?} */
    NzTabSetComponent.ngAcceptInputType_nzCentered;
    /** @type {?} */
    NzTabSetComponent.ngAcceptInputType_nzLinkRouter;
    /** @type {?} */
    NzTabSetComponent.ngAcceptInputType_nzLinkExact;
    /** @type {?} */
    NzTabSetComponent.ngAcceptInputType_nzSelectedIndex;
    /**
     * @deprecated
     * \@breaking-change 11.0.0
     * @type {?}
     */
    NzTabSetComponent.ngAcceptInputType_nzShowPagination;
    /** @type {?} */
    NzTabSetComponent.prototype.nzTabPosition;
    /** @type {?} */
    NzTabSetComponent.prototype.nzTabBarExtraContent;
    /** @type {?} */
    NzTabSetComponent.prototype.nzCanDeactivate;
    /** @type {?} */
    NzTabSetComponent.prototype.nzAddIcon;
    /** @type {?} */
    NzTabSetComponent.prototype.nzTabBarStyle;
    /** @type {?} */
    NzTabSetComponent.prototype.nzType;
    /** @type {?} */
    NzTabSetComponent.prototype.nzSize;
    /** @type {?} */
    NzTabSetComponent.prototype.nzAnimated;
    /** @type {?} */
    NzTabSetComponent.prototype.nzTabBarGutter;
    /** @type {?} */
    NzTabSetComponent.prototype.nzHideAdd;
    /** @type {?} */
    NzTabSetComponent.prototype.nzCentered;
    /** @type {?} */
    NzTabSetComponent.prototype.nzHideAll;
    /** @type {?} */
    NzTabSetComponent.prototype.nzLinkRouter;
    /** @type {?} */
    NzTabSetComponent.prototype.nzLinkExact;
    /** @type {?} */
    NzTabSetComponent.prototype.nzSelectChange;
    /** @type {?} */
    NzTabSetComponent.prototype.nzSelectedIndexChange;
    /** @type {?} */
    NzTabSetComponent.prototype.nzTabListScroll;
    /** @type {?} */
    NzTabSetComponent.prototype.nzClose;
    /** @type {?} */
    NzTabSetComponent.prototype.nzAdd;
    /**
     * @deprecated Not supported.
     * \@breaking-change 11.0.0
     * @type {?}
     */
    NzTabSetComponent.prototype.nzShowPagination;
    /**
     * @deprecated Not supported.
     * \@breaking-change 11.0.0
     * @type {?}
     */
    NzTabSetComponent.prototype.nzOnNextClick;
    /**
     * @deprecated Not supported.
     * \@breaking-change 11.0.0
     * @type {?}
     */
    NzTabSetComponent.prototype.nzOnPrevClick;
    /** @type {?} */
    NzTabSetComponent.prototype.allTabs;
    /** @type {?} */
    NzTabSetComponent.prototype.tabNavBarRef;
    /** @type {?} */
    NzTabSetComponent.prototype.tabs;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.tabSetId;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.destroy$;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.indexToSelect;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.selectedIndex;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.tabLabelSubscription;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.tabsSubscription;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.canDeactivateSubscription;
    /** @type {?} */
    NzTabSetComponent.prototype.nzConfigService;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.cdr;
    /**
     * @type {?}
     * @private
     */
    NzTabSetComponent.prototype.router;
}

/**
 * @fileoverview added by tsickle
 * Generated from: tabs.module.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @type {?} */
const DIRECTIVES = [
    NzTabSetComponent,
    NzTabComponent,
    NzTabNavBarComponent,
    NzTabNavItemDirective,
    NzTabsInkBarDirective,
    NzTabScrollListDirective,
    NzTabNavOperationComponent,
    NzTabAddButtonComponent,
    NzTabCloseButtonComponent,
    NzTabDirective,
    NzTabBodyComponent,
    NzTabLinkDirective,
    NzTabLinkTemplateDirective
];
class NzTabsModule {
}
NzTabsModule.decorators = [
    { type: NgModule, args: [{
                declarations: [DIRECTIVES],
                exports: [DIRECTIVES],
                imports: [CommonModule, ObserversModule, NzIconModule, NzOutletModule, PlatformModule, A11yModule, CdkScrollableModule, NzDropDownModule]
            },] }
];

/**
 * @fileoverview added by tsickle
 * Generated from: public-api.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

/**
 * @fileoverview added by tsickle
 * Generated from: ng-zorro-antd-tabs.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */

export { NZ_TAB_SET, NzTabChangeEvent, NzTabComponent, NzTabDirective, NzTabLinkDirective, NzTabLinkTemplateDirective, NzTabSetComponent, NzTabsModule, NzTabAddButtonComponent as ɵNzTabAddButtonComponent, NzTabBodyComponent as ɵNzTabBodyComponent, NzTabCloseButtonComponent as ɵNzTabCloseButtonComponent, NzTabNavBarComponent as ɵNzTabNavBarComponent, NzTabNavItemDirective as ɵNzTabNavItemDirective, NzTabNavOperationComponent as ɵNzTabNavOperationComponent, NzTabScrollListDirective as ɵNzTabScrollListDirective, NzTabsInkBarDirective as ɵNzTabsInkBarDirective };
//# sourceMappingURL=ng-zorro-antd-tabs.js.map
