@fivethree/core/esm2015/lib/app-bar/app-bar-tab/app-bar-tab.component.js

Fivethree Core Components

/**
 * @fileoverview added by tsickle
 * Generated from: lib/app-bar/app-bar-tab/app-bar-tab.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import { Component, Input, Host, HostBinding, ElementRef } from '@angular/core';
import { Router } from '@angular/router';
import { IonTabs } from '@ionic/angular';
import { FivAppBar } from '../app-bar.component';
export class FivAppBarTab {
    /**
     * @param {?} appBar
     * @param {?} ionTabs
     * @param {?} router
     * @param {?} el
     */
    constructor(appBar, ionTabs, router, el) {
        this.appBar = appBar;
        this.ionTabs = ionTabs;
        this.router = router;
        this.el = el;
        this.type = 'unbounded';
    }
    /**
     * @return {?}
     */
    get active() {
        return this.router.url.endsWith(this.href);
    }
    /**
     * @return {?}
     */
    get classes() {
        return `label-${this.appBar.titleMode}`;
    }
    /**
     * @return {?}
     */
    ngOnInit() { }
    /**
     * @return {?}
     */
    onClick() {
        this.ionTabs.select(this.tab);
    }
}
FivAppBarTab.decorators = [
    { type: Component, args: [{
                selector: 'fiv-app-bar-tab',
                template: "<ng-template>\n  <ng-content></ng-content>\n</ng-template>\n\n<div (click)=\"onClick()\" class=\"tab ion-activatable\" [ngClass]=\"{'active': active}\">\n  <ng-content select=\"fiv-icon\"></ng-content>\n  <ng-content *ngIf=\"appBar.titleMode === 'show' || (active && appBar.titleMode === 'active-only')\" select=\"ion-label\">\n  </ng-content>\n  <ion-ripple-effect [type]=\"type\"></ion-ripple-effect>\n</div>",
                styles: [":host{width:50%;height:100%;display:inline-block;position:relative}:host .tab{width:100%;height:100%;display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;overflow:visible}:host .tab.active{--fiv-icon-color:var(--fiv-icon-activ-color, var(--ion-color-primary))}:host .tab.active ::ng-deep ion-label{color:var(--ion-color-primary)}:host(.label-hide) ::ng-deep ion-label{display:none}:host(.label-active-only) .tab:not(.active) ::ng-deep ion-label{display:none}"]
            }] }
];
/** @nocollapse */
FivAppBarTab.ctorParameters = () => [
    { type: FivAppBar, decorators: [{ type: Host }] },
    { type: IonTabs, decorators: [{ type: Host }] },
    { type: Router },
    { type: ElementRef }
];
FivAppBarTab.propDecorators = {
    tab: [{ type: Input }],
    href: [{ type: Input }],
    type: [{ type: Input }],
    classes: [{ type: HostBinding, args: ['class',] }]
};
if (false) {
    /** @type {?} */
    FivAppBarTab.prototype.tab;
    /** @type {?} */
    FivAppBarTab.prototype.href;
    /** @type {?} */
    FivAppBarTab.prototype.type;
    /** @type {?} */
    FivAppBarTab.prototype.appBar;
    /** @type {?} */
    FivAppBarTab.prototype.ionTabs;
    /** @type {?} */
    FivAppBarTab.prototype.router;
    /** @type {?} */
    FivAppBarTab.prototype.el;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXBwLWJhci10YWIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGZpdmV0aHJlZS9jb3JlLyIsInNvdXJjZXMiOlsibGliL2FwcC1iYXIvYXBwLWJhci10YWIvYXBwLWJhci10YWIuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUNMLFNBQVMsRUFFVCxLQUFLLEVBQ0wsSUFBSSxFQUNKLFdBQVcsRUFDWCxVQUFVLEVBQ1gsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQ3pDLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUN6QyxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFPakQsTUFBTSxPQUFPLFlBQVk7Ozs7Ozs7SUFhdkIsWUFDaUIsTUFBaUIsRUFDakIsT0FBZ0IsRUFDeEIsTUFBYyxFQUNkLEVBQWM7UUFITixXQUFNLEdBQU4sTUFBTSxDQUFXO1FBQ2pCLFlBQU8sR0FBUCxPQUFPLENBQVM7UUFDeEIsV0FBTSxHQUFOLE1BQU0sQ0FBUTtRQUNkLE9BQUUsR0FBRixFQUFFLENBQVk7UUFkZCxTQUFJLEdBQTRCLFdBQVcsQ0FBQztJQWVsRCxDQUFDOzs7O0lBYkosSUFBSSxNQUFNO1FBQ1IsT0FBTyxJQUFJLENBQUMsTUFBTSxDQUFDLEdBQUcsQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzdDLENBQUM7Ozs7SUFFRCxJQUEwQixPQUFPO1FBQy9CLE9BQU8sU0FBUyxJQUFJLENBQUMsTUFBTSxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQzFDLENBQUM7Ozs7SUFTRCxRQUFRLEtBQUksQ0FBQzs7OztJQUViLE9BQU87UUFDTCxJQUFJLENBQUMsT0FBTyxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7SUFDaEMsQ0FBQzs7O1lBN0JGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsaUJBQWlCO2dCQUMzQixzYUFBMkM7O2FBRTVDOzs7O1lBTlEsU0FBUyx1QkFxQmIsSUFBSTtZQXRCQSxPQUFPLHVCQXVCWCxJQUFJO1lBeEJBLE1BQU07WUFGYixVQUFVOzs7a0JBWVQsS0FBSzttQkFDTCxLQUFLO21CQUNMLEtBQUs7c0JBTUwsV0FBVyxTQUFDLE9BQU87Ozs7SUFScEIsMkJBQXFCOztJQUNyQiw0QkFBc0I7O0lBQ3RCLDRCQUFxRDs7SUFXbkQsOEJBQWdDOztJQUNoQywrQkFBK0I7O0lBQy9CLDhCQUFxQjs7SUFDckIsMEJBQXFCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBPbkluaXQsXG4gIElucHV0LFxuICBIb3N0LFxuICBIb3N0QmluZGluZyxcbiAgRWxlbWVudFJlZlxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFJvdXRlciB9IGZyb20gJ0Bhbmd1bGFyL3JvdXRlcic7XG5pbXBvcnQgeyBJb25UYWJzIH0gZnJvbSAnQGlvbmljL2FuZ3VsYXInO1xuaW1wb3J0IHsgRml2QXBwQmFyIH0gZnJvbSAnLi4vYXBwLWJhci5jb21wb25lbnQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdmaXYtYXBwLWJhci10YWInLFxuICB0ZW1wbGF0ZVVybDogJy4vYXBwLWJhci10YWIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9hcHAtYmFyLXRhYi5jb21wb25lbnQuc2NzcyddXG59KVxuZXhwb3J0IGNsYXNzIEZpdkFwcEJhclRhYiBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIHRhYjogc3RyaW5nO1xuICBASW5wdXQoKSBocmVmOiBzdHJpbmc7XG4gIEBJbnB1dCgpIHR5cGU6ICdib3VuZGVkJyB8ICd1bmJvdW5kZWQnID0gJ3VuYm91bmRlZCc7XG5cbiAgZ2V0IGFjdGl2ZSgpIHtcbiAgICByZXR1cm4gdGhpcy5yb3V0ZXIudXJsLmVuZHNXaXRoKHRoaXMuaHJlZik7XG4gIH1cblxuICBASG9zdEJpbmRpbmcoJ2NsYXNzJykgZ2V0IGNsYXNzZXMoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gYGxhYmVsLSR7dGhpcy5hcHBCYXIudGl0bGVNb2RlfWA7XG4gIH1cblxuICBjb25zdHJ1Y3RvcihcbiAgICBASG9zdCgpIHB1YmxpYyBhcHBCYXI6IEZpdkFwcEJhcixcbiAgICBASG9zdCgpIHB1YmxpYyBpb25UYWJzOiBJb25UYWJzLFxuICAgIHB1YmxpYyByb3V0ZXI6IFJvdXRlcixcbiAgICBwdWJsaWMgZWw6IEVsZW1lbnRSZWZcbiAgKSB7fVxuXG4gIG5nT25Jbml0KCkge31cblxuICBvbkNsaWNrKCkge1xuICAgIHRoaXMuaW9uVGFicy5zZWxlY3QodGhpcy50YWIpO1xuICB9XG59XG4iXX0=