@ionic/angular
Version:
Angular specific wrappers for @ionic/core
58 lines • 3.83 kB
JavaScript
import { Component, ContentChild, ContentChildren, ViewChild } from '@angular/core';
import { IonTabs as IonTabsBase } from '@ionic/angular/common';
import { IonTabBar, IonTab } from '../proxies';
import { IonRouterOutlet } from './ion-router-outlet';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "./ion-router-outlet";
export class IonTabs extends IonTabsBase {
outlet;
tabBar;
tabBars;
tabs;
/** @nocollapse */ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: IonTabs, deps: null, target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.0", type: IonTabs, isStandalone: false, selector: "ion-tabs", queries: [{ propertyName: "tabBar", first: true, predicate: IonTabBar, descendants: true }, { propertyName: "tabBars", predicate: IonTabBar }, { propertyName: "tabs", predicate: IonTab }], viewQueries: [{ propertyName: "outlet", first: true, predicate: ["outlet"], descendants: true, read: IonRouterOutlet }], usesInheritance: true, ngImport: i0, template: `
<ng-content select="[slot=top]"></ng-content>
<div class="tabs-inner" #tabsInner>
<ion-router-outlet
*ngIf="tabs.length === 0"
#outlet
tabs="true"
(stackWillChange)="onStackWillChange($event)"
(stackDidChange)="onStackDidChange($event)"
></ion-router-outlet>
<ng-content *ngIf="tabs.length > 0" select="ion-tab"></ng-content>
</div>
<ng-content></ng-content>
`, isInline: true, styles: ["\n :host {\n display: flex;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n flex-direction: column;\n\n width: 100%;\n height: 100%;\n\n contain: layout size style;\n }\n .tabs-inner {\n position: relative;\n\n flex: 1;\n\n contain: layout size style;\n }\n "], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IonRouterOutlet, selector: "ion-router-outlet" }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.0", ngImport: i0, type: IonTabs, decorators: [{
type: Component,
args: [{ standalone: false, selector: 'ion-tabs', template: `
<ng-content select="[slot=top]"></ng-content>
<div class="tabs-inner" #tabsInner>
<ion-router-outlet
*ngIf="tabs.length === 0"
#outlet
tabs="true"
(stackWillChange)="onStackWillChange($event)"
(stackDidChange)="onStackDidChange($event)"
></ion-router-outlet>
<ng-content *ngIf="tabs.length > 0" select="ion-tab"></ng-content>
</div>
<ng-content></ng-content>
`, styles: ["\n :host {\n display: flex;\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n\n flex-direction: column;\n\n width: 100%;\n height: 100%;\n\n contain: layout size style;\n }\n .tabs-inner {\n position: relative;\n\n flex: 1;\n\n contain: layout size style;\n }\n "] }]
}], propDecorators: { outlet: [{
type: ViewChild,
args: ['outlet', { read: IonRouterOutlet, static: false }]
}], tabBar: [{
type: ContentChild,
args: [IonTabBar, { static: false }]
}], tabBars: [{
type: ContentChildren,
args: [IonTabBar]
}], tabs: [{
type: ContentChildren,
args: [IonTab]
}] } });
//# sourceMappingURL=ion-tabs.js.map