@covalent/core
Version:
Core Teradata UI Platform for layouts, icons, custom components and themes. This should be added as a dependency for any project that wants to use layouts, icons and themes for Angular Material.
1,480 lines • 90.3 kB
JavaScript
import * as i0 from '@angular/core';
import { Component, Input, ViewChild, Directive, HostListener, forwardRef, Optional, Inject, SecurityContext, ContentChildren, NgModule } from '@angular/core';
import { MatSidenav, MatSidenavContainer } from '@angular/material/sidenav';
import { mixinDisabled, tdCollapseAnimation } from '@covalent/core/common';
import * as i2 from '@angular/common';
import { CommonModule } from '@angular/common';
import { MatIcon } from '@angular/material/icon';
import { MatToolbar } from '@angular/material/toolbar';
import * as i1 from '@angular/router';
import * as i2$1 from '@angular/material/card';
import { MatCardModule } from '@angular/material/card';
import { MatDivider } from '@angular/material/divider';
import * as i2$2 from '@angular/platform-browser';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { MatIconButton } from '@angular/material/button';
const _c0$6 = [[["td-navigation-drawer"]], [["", "td-sidenav-content", ""]], "*"];
const _c1$5 = ["td-navigation-drawer", "[td-sidenav-content]", "*"];
class TdLayoutComponent {
sidenav;
/**
* mode?: 'side', 'push' or 'over'
*
* The mode or styling of the sidenav.
* Defaults to "over".
* See "MatSidenav" documentation for more info.
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
mode = 'over';
/**
* opened?: boolean
*
* Whether or not the sidenav is opened. Use this binding to open/close the sidenav.
* Defaults to "false".
*
* See "MatSidenav" documentation for more info.
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
opened = false;
/**
* sidenavWidth?: string
*
* Sets the "width" of the sidenav in either "px" or "%"
* Defaults to "320px".
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
sidenavWidth = '320px';
/**
* containerAutosize?: boolean
*
* Sets "autosize" of the sidenav-container.
* Defaults to "false".
*
* See documentation for more info and potential performance risks.
*
* https://github.com/angular/material2/blob/main/src/lib/sidenav/sidenav.md#resizing-an-open-sidenav
*/
containerAutosize = false;
/**
* Checks if `ESC` should close the sidenav
* Should only close it for `push` and `over` modes
*/
get disableClose() {
return this.mode === 'side';
}
/**
* Proxy toggle method to access sidenav from outside (from td-layout template).
*/
toggle() {
return this.sidenav.toggle(!this.sidenav.opened);
}
/**
* Proxy open method to access sidenav from outside (from td-layout template).
*/
open() {
return this.sidenav.open();
}
/**
* Proxy close method to access sidenav from outside (from td-layout template).
*/
close() {
return this.sidenav.close();
}
static ɵfac = function TdLayoutComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutComponent)(); };
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdLayoutComponent, selectors: [["td-layout"]], viewQuery: function TdLayoutComponent_Query(rf, ctx) { if (rf & 1) {
i0.ɵɵviewQuery(MatSidenav, 7);
} if (rf & 2) {
let _t;
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.sidenav = _t.first);
} }, inputs: { mode: "mode", opened: "opened", sidenavWidth: "sidenavWidth", containerAutosize: "containerAutosize" }, ngContentSelectors: _c1$5, decls: 6, vars: 8, consts: [["sidenav", ""], ["fullscreen", "", 3, "autosize"], [1, "td-layout-sidenav", 3, "mode", "opened", "disableClose"]], template: function TdLayoutComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef(_c0$6);
i0.ɵɵelementStart(0, "mat-sidenav-container", 1)(1, "mat-sidenav", 2, 0);
i0.ɵɵprojection(3);
i0.ɵɵprojection(4, 1);
i0.ɵɵelementEnd();
i0.ɵɵprojection(5, 2);
i0.ɵɵelementEnd();
} if (rf & 2) {
i0.ɵɵproperty("autosize", ctx.containerAutosize);
i0.ɵɵadvance();
i0.ɵɵstyleProp("max-width", ctx.sidenavWidth)("min-width", ctx.sidenavWidth);
i0.ɵɵproperty("mode", ctx.mode)("opened", ctx.opened)("disableClose", ctx.disableClose);
} }, dependencies: [MatSidenav, MatSidenavContainer], styles: ["[_nghost-%COMP%]{display:flex;margin:0;width:100%;min-height:100%;height:100%;overflow:hidden}[_nghost-%COMP%] >mat-sidenav-container .mat-drawer>.mat-drawer-inner-container{display:flex;flex-direction:column}"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutComponent, [{
type: Component,
args: [{ selector: 'td-layout', imports: [MatSidenav, MatSidenavContainer], template: "<mat-sidenav-container fullscreen [autosize]=\"containerAutosize\">\n <mat-sidenav\n #sidenav\n class=\"td-layout-sidenav\"\n [mode]=\"mode\"\n [opened]=\"opened\"\n [style.max-width]=\"sidenavWidth\"\n [style.min-width]=\"sidenavWidth\"\n [disableClose]=\"disableClose\"\n >\n <ng-content select=\"td-navigation-drawer\"></ng-content>\n <ng-content select=\"[td-sidenav-content]\"></ng-content>\n </mat-sidenav>\n <ng-content></ng-content>\n</mat-sidenav-container>\n", styles: [":host{display:flex;margin:0;width:100%;min-height:100%;height:100%;overflow:hidden}:host ::ng-deep>mat-sidenav-container .mat-drawer>.mat-drawer-inner-container{display:flex;flex-direction:column}\n"] }]
}], null, { sidenav: [{
type: ViewChild,
args: [MatSidenav, { static: true }]
}], mode: [{
type: Input
}], opened: [{
type: Input
}], sidenavWidth: [{
type: Input
}], containerAutosize: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdLayoutComponent, { className: "TdLayoutComponent", filePath: "layout.component.ts", lineNumber: 13 }); })();
class LayoutToggleBase {
}
/* tslint:disable-next-line */
const _TdLayoutToggleMixinBase = mixinDisabled(LayoutToggleBase);
class BaseLayoutToggleDirective extends _TdLayoutToggleMixinBase {
_layout;
_renderer;
_elementRef;
_toggleSubs;
_initialized = false;
_hideWhenOpened = false;
/**
* hideWhenOpened?: boolean
* When this is set to true, the host will be hidden when
* the sidenav is opened.
*/
set hideWhenOpened(hideWhenOpened) {
this._hideWhenOpened = hideWhenOpened;
if (this._initialized) {
this._toggleVisibility();
}
}
constructor(_layout, _renderer, _elementRef) {
super();
this._layout = _layout;
this._renderer = _renderer;
this._elementRef = _elementRef;
// if layout has not been provided
// show warn message
if (!this._layout) {
this._noLayoutMessage();
}
this._renderer.addClass(this._elementRef.nativeElement, 'td-layout-menu-button');
}
ngAfterViewInit() {
this._initialized = true;
if (this._layout && this._layout.sidenav) {
this._toggleSubs = this._layout.sidenav._animationStarted.subscribe(() => {
this._toggleVisibility();
});
}
// execute toggleVisibility since the onOpenStart and onCloseStart
// methods might not be executed always when the element is rendered
this._toggleVisibility();
}
ngOnDestroy() {
if (this._toggleSubs) {
this._toggleSubs.unsubscribe();
this._toggleSubs = undefined;
}
}
/**
* Listens to host click event to trigger the layout toggle
*/
clickListener(event) {
event.preventDefault();
if (!this.disabled) {
// if layout has been provided, try triggering the click on it
// else show warn message
if (this._layout) {
this.onClick();
}
else {
this._noLayoutMessage();
}
}
}
_toggleVisibility() {
if (this._layout) {
if (this._layout.sidenav.opened && this._hideWhenOpened) {
this._renderer.setStyle(this._elementRef.nativeElement, 'display', 'none');
}
else {
this._renderer.setStyle(this._elementRef.nativeElement, 'display', '');
}
}
}
_noLayoutMessage() {
/* tslint:disable-next-line */
console.warn('Covalent: Parent layout not found for layout toggle directive');
}
static ɵfac = function BaseLayoutToggleDirective_Factory(__ngFactoryType__) { i0.ɵɵinvalidFactory(); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: BaseLayoutToggleDirective, hostBindings: function BaseLayoutToggleDirective_HostBindings(rf, ctx) { if (rf & 1) {
i0.ɵɵlistener("click", function BaseLayoutToggleDirective_click_HostBindingHandler($event) { return ctx.clickListener($event); });
} }, inputs: { hideWhenOpened: "hideWhenOpened" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(BaseLayoutToggleDirective, [{
type: Directive
}], () => [{ type: undefined }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { hideWhenOpened: [{
type: Input
}], clickListener: [{
type: HostListener,
args: ['click', ['$event']]
}] }); })();
class TdLayoutToggleDirective extends BaseLayoutToggleDirective {
set tdLayoutToggle(tdLayoutToggle) {
this.disabled = !(tdLayoutToggle === '' || tdLayoutToggle);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.toggle();
}
static ɵfac = function TdLayoutToggleDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutToggleDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutToggleDirective, selectors: [["", "tdLayoutToggle", ""]], inputs: { tdLayoutToggle: "tdLayoutToggle" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutToggleDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutToggle]',
}]
}], () => [{ type: TdLayoutComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutToggle: [{
type: Input
}] }); })();
class TdLayoutCloseDirective extends BaseLayoutToggleDirective {
set tdLayoutClose(tdLayoutClose) {
this.disabled = !(tdLayoutClose === '' || tdLayoutClose);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.close();
}
static ɵfac = function TdLayoutCloseDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutCloseDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutCloseDirective, selectors: [["", "tdLayoutClose", ""]], inputs: { tdLayoutClose: "tdLayoutClose" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutCloseDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutClose]',
}]
}], () => [{ type: TdLayoutComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutClose: [{
type: Input
}] }); })();
class TdLayoutOpenDirective extends BaseLayoutToggleDirective {
set tdLayoutClose(tdLayoutOpen) {
this.disabled = !(tdLayoutOpen === '' || tdLayoutOpen);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.open();
}
static ɵfac = function TdLayoutOpenDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutOpenDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutOpenDirective, selectors: [["", "tdLayoutOpen", ""]], inputs: { tdLayoutClose: [0, "tdLayoutOpen", "tdLayoutClose"] }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutOpenDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutOpen]',
}]
}], () => [{ type: TdLayoutComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutClose: [{
type: Input,
args: ['tdLayoutOpen']
}] }); })();
const _c0$5 = [[["", "td-menu-button", ""]], [["", "td-toolbar-content", ""]], "*", [["td-layout-footer"]]];
const _c1$4 = ["[td-menu-button]", "[td-toolbar-content]", "*", "td-layout-footer"];
function TdLayoutNavComponent_span_3_mat_icon_1_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "mat-icon");
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵadvance();
i0.ɵɵtextInterpolate(ctx_r1.icon);
} }
function TdLayoutNavComponent_span_3_mat_icon_2_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelement(0, "mat-icon", 7);
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵproperty("svgIcon", ctx_r1.logo);
} }
function TdLayoutNavComponent_span_3_span_3_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "span");
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵadvance();
i0.ɵɵtextInterpolate(ctx_r1.toolbarTitle);
} }
function TdLayoutNavComponent_span_3_Template(rf, ctx) { if (rf & 1) {
const _r1 = i0.ɵɵgetCurrentView();
i0.ɵɵelementStart(0, "span", 4);
i0.ɵɵlistener("click", function TdLayoutNavComponent_span_3_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleNavigationClick()); });
i0.ɵɵtemplate(1, TdLayoutNavComponent_span_3_mat_icon_1_Template, 2, 1, "mat-icon", 5)(2, TdLayoutNavComponent_span_3_mat_icon_2_Template, 1, 1, "mat-icon", 6)(3, TdLayoutNavComponent_span_3_span_3_Template, 2, 1, "span", 5);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext();
i0.ɵɵclassProp("cursor-pointer", ctx_r1.routerEnabled);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.icon);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.logo && !ctx_r1.icon);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.toolbarTitle);
} }
class TdLayoutNavComponent {
_router;
/**
* toolbarTitle?: string
*
* Title set in toolbar.
*/
toolbarTitle;
/**
* icon?: string
*
* icon name to be displayed before the title
*/
icon;
/**
* logo?: string
*
* logo icon name to be displayed before the title.
* If [icon] is set, then this will not be shown.
*/
logo;
/**
* color?: 'accent' | 'primary' | 'warn'
*
* toolbar color option: primary | accent | warn.
* If [color] is not set, primary is used.
*/
color;
/**
* navigationRoute?: string
*
* option to set the combined route for the icon, logo, and toolbarTitle.
*/
navigationRoute;
/**
* Checks if router was injected.
*/
get routerEnabled() {
return !!this._router && !!this.navigationRoute;
}
constructor(_router) {
this._router = _router;
}
handleNavigationClick() {
if (this.routerEnabled && this.navigationRoute) {
this._router.navigateByUrl(this.navigationRoute);
}
}
static ɵfac = function TdLayoutNavComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutNavComponent)(i0.ɵɵdirectiveInject(i1.Router, 8)); };
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdLayoutNavComponent, selectors: [["td-layout-nav"]], inputs: { toolbarTitle: "toolbarTitle", icon: "icon", logo: "logo", color: "color", navigationRoute: "navigationRoute" }, ngContentSelectors: _c1$4, decls: 8, vars: 2, consts: [[1, "td-layout-nav-wrapper"], [1, "td-layout-toolbar", 3, "color"], ["class", "td-layout-nav-toolbar-content", 3, "cursor-pointer", "click", 4, "ngIf"], ["cdkScrollable", "", 1, "td-layout-nav-content"], [1, "td-layout-nav-toolbar-content", 3, "click"], [4, "ngIf"], ["class", "mat-icon-logo", 3, "svgIcon", 4, "ngIf"], [1, "mat-icon-logo", 3, "svgIcon"]], template: function TdLayoutNavComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef(_c0$5);
i0.ɵɵelementStart(0, "div", 0)(1, "mat-toolbar", 1);
i0.ɵɵprojection(2);
i0.ɵɵtemplate(3, TdLayoutNavComponent_span_3_Template, 4, 5, "span", 2);
i0.ɵɵprojection(4, 1);
i0.ɵɵelementEnd();
i0.ɵɵelementStart(5, "div", 3);
i0.ɵɵprojection(6, 2);
i0.ɵɵelementEnd();
i0.ɵɵprojection(7, 3);
i0.ɵɵelementEnd();
} if (rf & 2) {
i0.ɵɵadvance();
i0.ɵɵproperty("color", ctx.color);
i0.ɵɵadvance(2);
i0.ɵɵproperty("ngIf", ctx.icon || ctx.logo || ctx.toolbarTitle);
} }, dependencies: [CommonModule, i2.NgIf, MatToolbar, MatIcon], styles: [".td-menu-button[_ngcontent-%COMP%]{margin-left:0} [dir=rtl] .td-menu-button{margin-right:0;margin-left:6px}[_nghost-%COMP%]{display:flex;margin:0;width:100%;min-height:100%;height:100%;overflow:hidden}[_nghost-%COMP%] .td-layout-nav-wrapper[_ngcontent-%COMP%]{flex-direction:column;box-sizing:border-box;display:flex;margin:0;width:100%;min-height:100%;height:100%}[_nghost-%COMP%] .td-layout-nav-wrapper[_ngcontent-%COMP%] .td-layout-nav-toolbar-content[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex;align-items:center;align-content:center;max-width:100%;justify-content:flex-start}[_nghost-%COMP%] .td-layout-nav-wrapper[_ngcontent-%COMP%] .td-layout-nav-content[_ngcontent-%COMP%]{flex-direction:column;box-sizing:border-box;display:flex;flex:1;position:relative;overflow:auto;-webkit-overflow-scrolling:touch}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%]{z-index:2;box-shadow:0 3px 3px -2px #0003,0 3px 4px #00000024,0 1px 8px #0000001f}"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutNavComponent, [{
type: Component,
args: [{ selector: 'td-layout-nav', imports: [CommonModule, MatToolbar, MatIcon], template: "<div class=\"td-layout-nav-wrapper\">\n <mat-toolbar class=\"td-layout-toolbar\" [color]=\"color\">\n <ng-content select=\"[td-menu-button]\"></ng-content>\n <span\n *ngIf=\"icon || logo || toolbarTitle\"\n [class.cursor-pointer]=\"routerEnabled\"\n (click)=\"handleNavigationClick()\"\n class=\"td-layout-nav-toolbar-content\"\n >\n <mat-icon *ngIf=\"icon\">{{ icon }}</mat-icon>\n <mat-icon\n *ngIf=\"logo && !icon\"\n class=\"mat-icon-logo\"\n [svgIcon]=\"logo\"\n ></mat-icon>\n <span *ngIf=\"toolbarTitle\">{{ toolbarTitle }}</span>\n </span>\n <ng-content select=\"[td-toolbar-content]\"></ng-content>\n </mat-toolbar>\n <div class=\"td-layout-nav-content\" cdkScrollable>\n <ng-content></ng-content>\n </div>\n <ng-content select=\"td-layout-footer\"></ng-content>\n</div>\n", styles: [".td-menu-button{margin-left:0}::ng-deep [dir=rtl] .td-menu-button{margin-right:0;margin-left:6px}:host{display:flex;margin:0;width:100%;min-height:100%;height:100%;overflow:hidden}:host .td-layout-nav-wrapper{flex-direction:column;box-sizing:border-box;display:flex;margin:0;width:100%;min-height:100%;height:100%}:host .td-layout-nav-wrapper .td-layout-nav-toolbar-content{flex-direction:row;box-sizing:border-box;display:flex;align-items:center;align-content:center;max-width:100%;justify-content:flex-start}:host .td-layout-nav-wrapper .td-layout-nav-content{flex-direction:column;box-sizing:border-box;display:flex;flex:1;position:relative;overflow:auto;-webkit-overflow-scrolling:touch}:host mat-toolbar{z-index:2;box-shadow:0 3px 3px -2px #0003,0 3px 4px #00000024,0 1px 8px #0000001f}\n"] }]
}], () => [{ type: i1.Router, decorators: [{
type: Optional
}] }], { toolbarTitle: [{
type: Input
}], icon: [{
type: Input
}], logo: [{
type: Input
}], color: [{
type: Input
}], navigationRoute: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdLayoutNavComponent, { className: "TdLayoutNavComponent", filePath: "layout-nav/layout-nav.component.ts", lineNumber: 13 }); })();
const _c0$4 = [[["", "td-menu-button", ""]], [["", "td-sidenav-toolbar-content", ""]], [["", "td-sidenav-content", ""]], [["", "td-toolbar-content", ""]], "*", [["td-layout-footer-inner"]], [["td-layout-footer"]]];
const _c1$3 = ["[td-menu-button]", "[td-sidenav-toolbar-content]", "[td-sidenav-content]", "[td-toolbar-content]", "*", "td-layout-footer-inner", "td-layout-footer"];
function TdLayoutNavListComponent_span_6_mat_icon_1_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "mat-icon");
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵadvance();
i0.ɵɵtextInterpolate(ctx_r1.icon);
} }
function TdLayoutNavListComponent_span_6_mat_icon_2_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelement(0, "mat-icon", 11);
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵproperty("svgIcon", ctx_r1.logo);
} }
function TdLayoutNavListComponent_span_6_span_3_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "span");
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵadvance();
i0.ɵɵtextInterpolate(ctx_r1.toolbarTitle);
} }
function TdLayoutNavListComponent_span_6_Template(rf, ctx) { if (rf & 1) {
const _r1 = i0.ɵɵgetCurrentView();
i0.ɵɵelementStart(0, "span", 8);
i0.ɵɵlistener("click", function TdLayoutNavListComponent_span_6_Template_span_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.handleNavigationClick()); });
i0.ɵɵtemplate(1, TdLayoutNavListComponent_span_6_mat_icon_1_Template, 2, 1, "mat-icon", 9)(2, TdLayoutNavListComponent_span_6_mat_icon_2_Template, 1, 1, "mat-icon", 10)(3, TdLayoutNavListComponent_span_6_span_3_Template, 2, 1, "span", 9);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext();
i0.ɵɵclassProp("cursor-pointer", ctx_r1.routerEnabled);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.icon);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.logo && !ctx_r1.icon);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.toolbarTitle);
} }
class TdLayoutNavListComponent {
_router;
sidenav;
/**
* toolbarTitle?: string
*
* Title set in toolbar.
*/
toolbarTitle;
/**
* icon?: string
* icon name to be displayed before the title
*/
icon;
/**
* logo?: string
*
* logo icon name to be displayed before the title.
* If [icon] is set, then this will not be shown.
*/
logo;
/**
* color?: 'accent' | 'primary' | 'warn'
*
* toolbar color option: primary | accent | warn.
* If [color] is not set, primary is used.
*/
color;
/**
* mode?: 'side', 'push' or 'over'
*
* The mode or styling of the sidenav.
* Defaults to "side".
* See "MatSidenav" documentation for more info.
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
mode = 'side';
/**
* opened?: boolean
* Whether or not the sidenav is opened. Use this binding to open/close the sidenav.
* Defaults to "true".
*
* See "MatSidenav" documentation for more info.
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
opened = true;
/**
* sidenavWidth?: string
*
* Sets the "width" of the sidenav in either "px" or "%"
* Defaults to "350px".
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
sidenavWidth = '350px';
/**
* containerAutosize?: boolean
*
* Sets "autosize" of the sidenav-container.
* Defaults to "false".
*
* See documentation for more info and potential performance risks.
*
* https://github.com/angular/material2/blob/main/src/lib/sidenav/sidenav.md#resizing-an-open-sidenav
*/
containerAutosize = false;
/**
* navigationRoute?: string
*
* option to set the combined route for the icon, logo, and toolbarTitle.
*/
navigationRoute;
/**
* Checks if `ESC` should close the sidenav
* Should only close it for `push` and `over` modes
*/
get disableClose() {
return this.mode === 'side';
}
/**
* Checks if router was injected.
*/
get routerEnabled() {
return !!this._router && !!this.navigationRoute;
}
constructor(_router) {
this._router = _router;
}
handleNavigationClick() {
if (this.routerEnabled && this.navigationRoute) {
this._router.navigateByUrl(this.navigationRoute);
}
}
/**
* Proxy toggle method to access sidenav from outside (from td-layout template).
*/
toggle() {
return this.sidenav.toggle(!this.sidenav.opened);
}
/**
* Proxy open method to access sidenav from outside (from td-layout template).
*/
open() {
return this.sidenav.open();
}
/**
* Proxy close method to access sidenav from outside (from td-layout template).
*/
close() {
return this.sidenav.close();
}
static ɵfac = function TdLayoutNavListComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutNavListComponent)(i0.ɵɵdirectiveInject(i1.Router, 8)); };
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdLayoutNavListComponent, selectors: [["td-layout-nav-list"]], viewQuery: function TdLayoutNavListComponent_Query(rf, ctx) { if (rf & 1) {
i0.ɵɵviewQuery(MatSidenav, 7);
} if (rf & 2) {
let _t;
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.sidenav = _t.first);
} }, inputs: { toolbarTitle: "toolbarTitle", icon: "icon", logo: "logo", color: "color", mode: "mode", opened: "opened", sidenavWidth: "sidenavWidth", containerAutosize: "containerAutosize", navigationRoute: "navigationRoute" }, ngContentSelectors: _c1$3, decls: 17, vars: 11, consts: [["sidenav", ""], [1, "td-layout-nav-list-wrapper"], ["fullscreen", "", 1, "td-layout-nav-list", 3, "autosize"], ["position", "start", 3, "mode", "opened", "disableClose"], [1, "td-layout-toolbar", 3, "color"], ["class", "td-layout-nav-list-toolbar-content", 3, "cursor-pointer", "click", 4, "ngIf"], ["cdkScrollable", "", 1, "td-layout-nav-list-content"], [1, "td-layout-nav-list-main"], [1, "td-layout-nav-list-toolbar-content", 3, "click"], [4, "ngIf"], ["class", "mat-icon-logo", 3, "svgIcon", 4, "ngIf"], [1, "mat-icon-logo", 3, "svgIcon"]], template: function TdLayoutNavListComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef(_c0$4);
i0.ɵɵelementStart(0, "div", 1)(1, "mat-sidenav-container", 2)(2, "mat-sidenav", 3, 0)(4, "mat-toolbar", 4);
i0.ɵɵprojection(5);
i0.ɵɵtemplate(6, TdLayoutNavListComponent_span_6_Template, 4, 5, "span", 5);
i0.ɵɵprojection(7, 1);
i0.ɵɵelementEnd();
i0.ɵɵelementStart(8, "div", 6);
i0.ɵɵprojection(9, 2);
i0.ɵɵelementEnd()();
i0.ɵɵelementStart(10, "div", 7)(11, "mat-toolbar", 4);
i0.ɵɵprojection(12, 3);
i0.ɵɵelementEnd();
i0.ɵɵelementStart(13, "div", 6);
i0.ɵɵprojection(14, 4);
i0.ɵɵelementEnd();
i0.ɵɵprojection(15, 5);
i0.ɵɵelementEnd()()();
i0.ɵɵprojection(16, 6);
} if (rf & 2) {
i0.ɵɵadvance();
i0.ɵɵproperty("autosize", ctx.containerAutosize);
i0.ɵɵadvance();
i0.ɵɵstyleProp("max-width", ctx.sidenavWidth)("min-width", ctx.sidenavWidth);
i0.ɵɵproperty("mode", ctx.mode)("opened", ctx.opened)("disableClose", ctx.disableClose);
i0.ɵɵadvance(2);
i0.ɵɵproperty("color", ctx.color);
i0.ɵɵadvance(2);
i0.ɵɵproperty("ngIf", ctx.icon || ctx.logo || ctx.toolbarTitle);
i0.ɵɵadvance(5);
i0.ɵɵproperty("color", ctx.color);
} }, dependencies: [CommonModule, i2.NgIf, MatSidenav, MatSidenavContainer, MatToolbar, MatIcon], styles: ["[_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] > .mat-sidenav-container[_ngcontent-%COMP%] > mat-sidenav.mat-drawer-side[_ngcontent-%COMP%]{border-right:0}[dir=rtl] [_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] > .mat-sidenav-container[_ngcontent-%COMP%] > mat-sidenav.mat-drawer-side[_ngcontent-%COMP%]{border-left:0}[_nghost-%COMP%]{margin:0;width:100%;min-height:100%;height:100%;overflow:hidden;flex-direction:column;box-sizing:border-box;display:flex;flex:1}[_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%]{flex-direction:column;box-sizing:border-box;display:flex;flex:1;position:relative;overflow:auto;-webkit-overflow-scrolling:touch}[_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] .td-layout-nav-list-toolbar-content[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex;align-items:center;align-content:center;max-width:100%;justify-content:flex-start}[_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] .td-layout-nav-list-content[_ngcontent-%COMP%]{text-align:start;flex:1;display:block;position:relative;overflow:auto;-webkit-overflow-scrolling:touch}[_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] .td-layout-nav-list-main[_ngcontent-%COMP%]{flex-direction:column;box-sizing:border-box;display:flex;margin:0;width:100%;min-height:100%;height:100%;position:relative;overflow:auto}[_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] .td-layout-nav-list-main[_ngcontent-%COMP%] .td-layout-nav-list-content[_ngcontent-%COMP%]{display:block;position:relative;overflow:auto;-webkit-overflow-scrolling:touch;flex:1}[_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] mat-sidenav-container.td-layout-nav-list[_ngcontent-%COMP%]{flex:1}[_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] mat-sidenav-container.td-layout-nav-list[_ngcontent-%COMP%] > mat-sidenav.mat-drawer-opened[_ngcontent-%COMP%], [_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] mat-sidenav-container.td-layout-nav-list[_ngcontent-%COMP%] > mat-sidenav.mat-drawer-opening[_ngcontent-%COMP%], [_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] mat-sidenav-container.td-layout-nav-list[_ngcontent-%COMP%] > mat-sidenav.mat-drawer-closed[_ngcontent-%COMP%], [_nghost-%COMP%] .td-layout-nav-list-wrapper[_ngcontent-%COMP%] mat-sidenav-container.td-layout-nav-list[_ngcontent-%COMP%] > mat-sidenav.mat-drawer-closing[_ngcontent-%COMP%]{box-shadow:none}[_nghost-%COMP%] mat-sidenav-container.td-layout-nav-list>.mat-drawer-content{flex-grow:1}[_nghost-%COMP%] mat-sidenav-container.td-layout-nav-list>.mat-drawer>.mat-drawer-inner-container{box-shadow:0 1px 3px #0003,0 1px 1px #00000024,0 2px 1px -1px #0000001f;box-sizing:border-box;display:flex;flex-direction:column}"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutNavListComponent, [{
type: Component,
args: [{ selector: 'td-layout-nav-list', imports: [CommonModule, MatSidenav, MatSidenavContainer, MatToolbar, MatIcon], template: "<div class=\"td-layout-nav-list-wrapper\">\n <mat-sidenav-container\n fullscreen\n [autosize]=\"containerAutosize\"\n class=\"td-layout-nav-list\"\n >\n <mat-sidenav\n #sidenav\n position=\"start\"\n [mode]=\"mode\"\n [opened]=\"opened\"\n [disableClose]=\"disableClose\"\n [style.max-width]=\"sidenavWidth\"\n [style.min-width]=\"sidenavWidth\"\n >\n <mat-toolbar class=\"td-layout-toolbar\" [color]=\"color\">\n <ng-content select=\"[td-menu-button]\"></ng-content>\n <span\n *ngIf=\"icon || logo || toolbarTitle\"\n class=\"td-layout-nav-list-toolbar-content\"\n [class.cursor-pointer]=\"routerEnabled\"\n (click)=\"handleNavigationClick()\"\n >\n <mat-icon *ngIf=\"icon\">{{ icon }}</mat-icon>\n <mat-icon\n *ngIf=\"logo && !icon\"\n class=\"mat-icon-logo\"\n [svgIcon]=\"logo\"\n ></mat-icon>\n <span *ngIf=\"toolbarTitle\">{{ toolbarTitle }}</span>\n </span>\n <ng-content select=\"[td-sidenav-toolbar-content]\"></ng-content>\n </mat-toolbar>\n <div class=\"td-layout-nav-list-content\" cdkScrollable>\n <ng-content select=\"[td-sidenav-content]\"></ng-content>\n </div>\n </mat-sidenav>\n <div class=\"td-layout-nav-list-main\">\n <mat-toolbar class=\"td-layout-toolbar\" [color]=\"color\">\n <ng-content select=\"[td-toolbar-content]\"></ng-content>\n </mat-toolbar>\n <div class=\"td-layout-nav-list-content\" cdkScrollable>\n <ng-content></ng-content>\n </div>\n <ng-content select=\"td-layout-footer-inner\"></ng-content>\n </div>\n </mat-sidenav-container>\n</div>\n<ng-content select=\"td-layout-footer\"></ng-content>\n", styles: [":host .td-layout-nav-list-wrapper>.mat-sidenav-container>mat-sidenav.mat-drawer-side{border-right:0}[dir=rtl] :host .td-layout-nav-list-wrapper>.mat-sidenav-container>mat-sidenav.mat-drawer-side{border-left:0}:host{margin:0;width:100%;min-height:100%;height:100%;overflow:hidden;flex-direction:column;box-sizing:border-box;display:flex;flex:1}:host .td-layout-nav-list-wrapper{flex-direction:column;box-sizing:border-box;display:flex;flex:1;position:relative;overflow:auto;-webkit-overflow-scrolling:touch}:host .td-layout-nav-list-wrapper .td-layout-nav-list-toolbar-content{flex-direction:row;box-sizing:border-box;display:flex;align-items:center;align-content:center;max-width:100%;justify-content:flex-start}:host .td-layout-nav-list-wrapper .td-layout-nav-list-content{text-align:start;flex:1;display:block;position:relative;overflow:auto;-webkit-overflow-scrolling:touch}:host .td-layout-nav-list-wrapper .td-layout-nav-list-main{flex-direction:column;box-sizing:border-box;display:flex;margin:0;width:100%;min-height:100%;height:100%;position:relative;overflow:auto}:host .td-layout-nav-list-wrapper .td-layout-nav-list-main .td-layout-nav-list-content{display:block;position:relative;overflow:auto;-webkit-overflow-scrolling:touch;flex:1}:host .td-layout-nav-list-wrapper mat-sidenav-container.td-layout-nav-list{flex:1}:host .td-layout-nav-list-wrapper mat-sidenav-container.td-layout-nav-list>mat-sidenav.mat-drawer-opened,:host .td-layout-nav-list-wrapper mat-sidenav-container.td-layout-nav-list>mat-sidenav.mat-drawer-opening,:host .td-layout-nav-list-wrapper mat-sidenav-container.td-layout-nav-list>mat-sidenav.mat-drawer-closed,:host .td-layout-nav-list-wrapper mat-sidenav-container.td-layout-nav-list>mat-sidenav.mat-drawer-closing{box-shadow:none}:host ::ng-deep mat-sidenav-container.td-layout-nav-list>.mat-drawer-content{flex-grow:1}:host ::ng-deep mat-sidenav-container.td-layout-nav-list>.mat-drawer>.mat-drawer-inner-container{box-shadow:0 1px 3px #0003,0 1px 1px #00000024,0 2px 1px -1px #0000001f;box-sizing:border-box;display:flex;flex-direction:column}\n"] }]
}], () => [{ type: i1.Router, decorators: [{
type: Optional
}] }], { sidenav: [{
type: ViewChild,
args: [MatSidenav, { static: true }]
}], toolbarTitle: [{
type: Input
}], icon: [{
type: Input
}], logo: [{
type: Input
}], color: [{
type: Input
}], mode: [{
type: Input
}], opened: [{
type: Input
}], sidenavWidth: [{
type: Input
}], containerAutosize: [{
type: Input
}], navigationRoute: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdLayoutNavListComponent, { className: "TdLayoutNavListComponent", filePath: "layout-nav-list/layout-nav-list.component.ts", lineNumber: 18 }); })();
class TdLayoutNavListToggleDirective extends BaseLayoutToggleDirective {
set tdLayoutNavListToggle(tdLayoutNavListToggle) {
this.disabled = !(tdLayoutNavListToggle === '' || tdLayoutNavListToggle);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.toggle();
}
static ɵfac = function TdLayoutNavListToggleDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutNavListToggleDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutNavListComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutNavListToggleDirective, selectors: [["", "tdLayoutNavListToggle", ""]], inputs: { tdLayoutNavListToggle: "tdLayoutNavListToggle" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutNavListToggleDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutNavListToggle]',
}]
}], () => [{ type: TdLayoutNavListComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutNavListComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutNavListToggle: [{
type: Input
}] }); })();
class TdLayoutNavListCloseDirective extends BaseLayoutToggleDirective {
set tdLayoutNavListClose(tdLayoutNavListClose) {
this.disabled = !(tdLayoutNavListClose === '' || tdLayoutNavListClose);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.close();
}
static ɵfac = function TdLayoutNavListCloseDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutNavListCloseDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutNavListComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutNavListCloseDirective, selectors: [["", "tdLayoutNavListClose", ""]], inputs: { tdLayoutNavListClose: "tdLayoutNavListClose" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutNavListCloseDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutNavListClose]',
}]
}], () => [{ type: TdLayoutNavListComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutNavListComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutNavListClose: [{
type: Input
}] }); })();
class TdLayoutNavListOpenDirective extends BaseLayoutToggleDirective {
set tdLayoutNavListOpen(tdLayoutNavListOpen) {
this.disabled = !(tdLayoutNavListOpen === '' || tdLayoutNavListOpen);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.open();
}
static ɵfac = function TdLayoutNavListOpenDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutNavListOpenDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutNavListComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutNavListOpenDirective, selectors: [["", "tdLayoutNavListOpen", ""]], inputs: { tdLayoutNavListOpen: "tdLayoutNavListOpen" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutNavListOpenDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutNavListOpen]',
}]
}], () => [{ type: TdLayoutNavListComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutNavListComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutNavListOpen: [{
type: Input
}] }); })();
const _c0$3 = ["*", [["", "td-after-card", ""]]];
const _c1$2 = ["*", "[td-after-card]"];
function TdLayoutCardOverComponent_mat_card_title_5_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "mat-card-title");
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext();
i0.ɵɵadvance();
i0.ɵɵtextInterpolate(ctx_r0.cardTitle);
} }
function TdLayoutCardOverComponent_mat_card_subtitle_6_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "mat-card-subtitle");
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext();
i0.ɵɵadvance();
i0.ɵɵtextInterpolate(ctx_r0.cardSubtitle);
} }
function TdLayoutCardOverComponent_mat_divider_7_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelement(0, "mat-divider");
} }
class TdLayoutCardOverComponent {
/**
* cardTitle?: string
*
* Title set in card.
*/
cardTitle;
/**
* cardSubtitle?: string
*
* Subtitle set in card.
*/
cardSubtitle;
/**
* cardWidth?: string
*
* Card flex width in %.
* Defaults to 70%.
*/
cardWidth = 70;
/**
* color?: 'accent' | 'primary' | 'warn'
*
* toolbar color option: primary | accent | warn.
* If [color] is not set, primary is used.
*/
color;
static ɵfac = function TdLayoutCardOverComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutCardOverComponent)(); };
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdLayoutCardOverComponent, selectors: [["td-layout-card-over"]], inputs: { cardTitle: "cardTitle", cardSubtitle: "cardSubtitle", cardWidth: "cardWidth", color: "color" }, ngContentSelectors: _c1$2, decls: 11, vars: 12, consts: [[1, "td-layout-toolbar", 3, "color"], [1, "td-layout-card-over-wrapper"], [1, "td-layout-card-over"], [4, "ngIf"]], template: function TdLayoutCardOverComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef(_c0$3);
i0.ɵɵelement(0, "mat-toolbar", 0);
i0.ɵɵelementStart(1, "div", 1)(2, "div", 2)(3, "mat-card")(4, "mat-card-header");
i0.ɵɵtemplate(5, TdLayoutCardOverComponent_mat_card_title_5_Template, 2, 1, "mat-card-title", 3)(6, TdLayoutCardOverComponent_mat_card_subtitle_6_Template, 2, 1, "mat-card-subtitle", 3);
i0.ɵɵelementEnd();
i0.ɵɵtemplate(7, TdLayoutCardOverComponent_mat_divider_7_Template, 1, 0, "mat-divider", 3);
i0.ɵɵelementStart(8, "mat-card-content");
i0.ɵɵprojection(9);
i0.ɵɵelementEnd()();
i0.ɵɵprojection(10, 1);
i0.ɵɵelementEnd()();
} if (rf & 2) {
i0.ɵɵproperty("color", ctx.color);
i0.ɵɵadvance(2);
i0.ɵɵstyleProp("max-width", ctx.cardWidth, "%")("flex", "1 1 " + ctx.cardWidth + "%")("-ms-flex", "1 1 " + ctx.cardWidth + "%")("-webkit-box-flex", 1);
i0.ɵɵadvance(3);
i0.ɵɵproperty("ngIf", ctx.cardTitle);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx.cardSubtitle);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx.cardTitle || ctx.cardSubtitle);
} }, dependencies: [CommonModule, i2.NgIf, MatToolbar, MatCardModule, i2$1.MatCard, i2$1.MatCardContent, i2$1.MatCardHeader, i2$1.MatCardSubtitle, i2$1.MatCardTitle, MatDivider], styles: ["[_nghost-%COMP%]{position:relative;display:block;z-index:2;width:100%;min-height:100%;height:100%}[_nghost-%COMP%] [td-after-card][_ngcontent-%COMP%]{display:block}.td-layout-card-over-wrapper[_ngcontent-%COMP%]{margin:-64px 0;width:100%;min-height:100%;height:100%}@media (min-width: 600px){.td-layout-card-over-wrapper[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex;align-items:flex-start;align-content:flex-start;justify-content:center}.td-layout-card-over-wrapper[_ngcontent-%COMP%] .td-layout-card-over[_ngcontent-%COMP%]{max-height:100%;box-sizing:border-box}}@media (max-width: 599px){.td-layout-card-over-wrapper[_ngcontent-%COMP%] .td-layout-card-over[_ngcontent-%COMP%]{max-width:100%!important}}"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutCardOverComponent, [{
type: Component,
args: [{ selector: 'td-layout-card-over', imports: [CommonModule, MatToolbar, MatCardModule, MatDivider], template: "<mat-toolbar class=\"td-layout-toolbar\" [color]=\"color\"></mat-toolbar>\n<div class=\"td-layout-card-over-wrapper\">\n <div\n class=\"td-layout-card-over\"\n [style.max-width.%]=\"cardWidth\"\n [style.flex]=\"'1 1 ' + cardWidth + '%'\"\n [style.-ms-flex]=\"'1 1 ' + cardWidth + '%'\"\n [style.-webkit-box-flex]=\"1\"\n >\n <mat-card>\n <mat-card-header>\n <mat-card-title *ngIf=\"cardTitle\">{{ cardTitle }}</mat-card-title>\n <mat-card-subtitle *ngIf=\"cardSubtitle\">{{\n cardSubtitle\n }}</mat-card-subtitle>\n </mat-card-header>\n <mat-divider *ngIf=\"cardTitle || cardSubtitle\"></mat-divider>\n <mat-card-content>\n <ng-content></ng-content>\n </mat-card-content>\n </mat-card>\n <ng-content select=\"[td-after-card]\"></ng-content>\n </div>\n</div>\n", styles: [":host{position:relative;display:block;z-index:2;width:100%;min-height:100%;height:100%}:host [td-after-card]{display:block}.td-layout-card-over-wrapper{margin:-64px 0;width:100%;min-height:100%;height:100%}@media (min-width: 600px){.td-layout-card-over-wrapper{flex-direction:row;box-sizing:border-box;display:flex;align-items:flex-start;align-content:flex-start;justify-content:center}.td-layout-card-over-wrapper .td-layout-card-over{max-height:100%;box-sizing:border-box}}@media (max-width: 599px){.td-layout-card-over-wrapper .td-layout-card-over{max-width:100%!important}}\n"] }]
}], null, { cardTitle: [{
type: Input
}], cardSubtitle: [{
type: Input
}], cardWidth: [{
type: Input
}], color: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdLayoutCardOverComponent, { className: "TdLayoutCardOverComponent", filePath: "layout-card-over/layout-card-over.component.ts", lineNumber: 13 }); })();
const _c0$2 = [[["mat-toolbar", "td-sidenav-content", ""]], [["", "td-sidenav-content", ""]], [["mat-toolbar"]], "*", [["td-layout-footer-inner"]]];
const _c1$1 = ["mat-toolbar[td-sidenav-content]", "[td-sidenav-content]", "mat-toolbar", "*", "td-layout-footer-inner"];
class TdLayoutManageListComponent {
sidenav;
/**
* mode?: 'side', 'push' or 'over'
*
* The mode or styling of the sidenav.
* Defaults to "side".
* See "MatSidenav" documentation for more info.
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
mode = 'side';
/**
* opened?: boolean
*
* Whether or not the sidenav is opened. Use this binding to open/close the sidenav.
* Defaults to "true".
*
* See "MatSidenav" documentation for more info.
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
opened = true;
/**
* sidenavWidth?: string
*
* Sets the "width" of the sidenav in either "px" or "%"
* Defaults to "257px".
*
* https://github.com/angular/material2/tree/main/src/lib/sidenav
*/
sidenavWidth = '257px';
/**
* containerAutosize?: boolean
*
* Sets "autosize" of the sidenav-container.
* Defaults to "false".
*
* See documentation for more info and potential performance risks.
*
* https://github.com/angular/material2/blob/main/src/lib/sidenav/sidenav.md#resizing-an-open-sidenav
*/
containerAutosize = false;
/**
* Checks if `ESC` should close the sidenav
* Should only close it for `push` and `over` modes
*/
get disableClose() {
return this.mode === 'side';
}
/**
* Proxy toggle method to access sidenav from outside (from td-layout template).
*/
toggle() {
return this.sidenav.toggle(!this.sidenav.opened);
}
/**
* Proxy open method to access sidenav from outside (from td-layout template).
*/
open() {
return this.sidenav.open();
}
/**
* Proxy close method to access sidenav from outside (from td-layout template).
*/
close() {
return this.sidenav.close();
}
static ɵfac = function TdLayoutManageListComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutManageListComponent)(); };
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdLayoutManageListComponent, selectors: [["td-layout-manage-list"]], viewQuery: function TdLayoutManageListComponent_Query(rf, ctx) { if (rf & 1) {
i0.ɵɵviewQuery(MatSidenav, 7);
} if (rf & 2) {
let _t;
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.sidenav = _t.first);
} }, inputs: { mode: "mode", opened: "opened", sidenavWidth: "sidenavWidth", containerAutosize: "containerAutosize" }, ngContentSelectors: _c1$1, decls: 11, vars: 8, consts: [["sidenav", ""], ["fullscreen", "", 1, "td-layout-manage-list", 3, "autosize"], ["position", "start", 3, "mode", "opened", "disableClose"], ["cdkScrollable", "", 1, "td-layout-manage-list-sidenav"], [1, "td-layout-manage-list-main"], ["cdkScrollable", "", 1, "td-layout-manage-list-content"]], template: function TdLayoutManageListComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef(_c0$2);
i0.ɵɵelementStart(0, "mat-sidenav-container", 1)(1, "mat-sidenav", 2, 0);
i0.ɵɵprojection(3);
i0.ɵɵelementStart(4, "div", 3);
i0.ɵɵprojection(5, 1);
i0.ɵɵelementEnd()();
i0.ɵɵelementStart(6, "div", 4);
i0.ɵɵprojection(7, 2);
i0.ɵɵelementStart(8, "div", 5);
i0.ɵɵprojection(9, 3);
i0.ɵɵelementEnd();
i0.ɵɵprojection(10, 4);
i0.ɵɵelementEnd()();
} if (rf & 2) {
i0.ɵɵproperty("autosize", ctx.containerAutosize);
i0.ɵɵadvance();
i0.ɵɵstyleProp("max-width", ctx.sidenavWidth)("min-width", ctx.sidenavWidth);
i0.ɵɵproperty("mode", ctx.mode)("opened", ctx.opened)("disableClose", ctx.disableClose);
} }, dependencies: [MatSidenav, MatSidenavContainer], styles: ["[_nghost-%COMP%]{display:flex;margin:0;width:100%;min-height:100%;height:100%;overflow:hidden}[_nghost-%COMP%] mat-sidenav-container.td-layout-manage-list[_ngcontent-%COMP%]{flex:1}[_nghost-%COMP%] mat-sidenav-container.td-layout-manage-list[_ngcontent-%COMP%] > .mat-drawer[_ngcontent-%COMP%] > .mat-drawer-inner-container.mat-drawer-opened[_ngcontent-%COMP%], [_nghost-%COMP%] mat-sidenav-container.td-layout-manage-list[_ngcontent-%COMP%] > .mat-drawer[_ngcontent-%COMP%] > .mat-drawer-inner-container.mat-drawer-opening[_ngcontent-%COMP%], [_nghost-%COMP%] mat-sidenav-container.td-layout-manage-list[_ngcontent-%COMP%] > .mat-drawer[_ngcontent-%COMP%] > .mat-drawer-inner-container.mat-drawer-closed[_ngcontent-%COMP%], [_nghost-%COMP%] mat-sidenav-container.td-layout-manage-list[_ngcontent-%COMP%] > .mat-drawer[_ngcontent-%COMP%] > .mat-drawer-inner-container.mat-drawer-closing[_ngcontent-%COMP%]{box-shadow:0 1px 3px #0003}[_nghost-%COMP%] .td-layout-manage-list-sidenav[_ngcontent-%COMP%]{text-align:start;flex:1;display:block;position:relative;overflow:auto;-webkit-overflow-scrolling:touch}[_nghost-%COMP%] .td-layout-manage-list-main[_ngcontent-%COMP%]{margin:0;width:100%;min-height:100%;height:100%;position:relative;overflow:auto;flex-direction:column;box-sizing:border-box;display:flex}[_nghost-%COMP%] .td-layout-manage-list-main[_ngcontent-%COMP%] .td-layout-manage-list-content[_ngcontent-%COMP%]{display:block;position:relative;overflow:auto;-webkit-overflow-scrolling:touch;flex:1}[_nghost-%COMP%] mat-sidenav-container.td-layout-manage-list>.mat-drawer-content{flex-grow:1}[_nghost-%COMP%] mat-sidenav-container.td-layout-manage-list>.mat-drawer>.mat-drawer-inner-container{box-shadow:0 1px 3px #0003,0 1px 1px #00000024,0 2px 1px -1px #0000001f;box-sizing:border-box;display:flex;flex-direction:column}[_nghost-%COMP%] mat-nav-list a[mat-list-item] .mat-list-item-content{font-size:14px}[_nghost-%COMP%] .mat-toolbar{font-weight:400}"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutManageListComponent, [{
type: Component,
args: [{ selector: 'td-layout-manage-list', imports: [MatSidenav, MatSidenavContainer], template: "<mat-sidenav-container\n fullscreen\n [autosize]=\"containerAutosize\"\n class=\"td-layout-manage-list\"\n>\n <mat-sidenav\n #sidenav\n position=\"start\"\n [mode]=\"mode\"\n [opened]=\"opened\"\n [disableClose]=\"disableClose\"\n [style.max-width]=\"sidenavWidth\"\n [style.min-width]=\"sidenavWidth\"\n >\n <ng-content select=\"mat-toolbar[td-sidenav-content]\"></ng-content>\n <div class=\"td-layout-manage-list-sidenav\" cdkScrollable>\n <ng-content select=\"[td-sidenav-content]\"></ng-content>\n </div>\n </mat-sidenav>\n <div class=\"td-layout-manage-list-main\">\n <ng-content select=\"mat-toolbar\"></ng-content>\n <div class=\"td-layout-manage-list-content\" cdkScrollable>\n <ng-content></ng-content>\n </div>\n <ng-content select=\"td-layout-footer-inner\"></ng-content>\n </div>\n</mat-sidenav-container>\n", styles: [":host{display:flex;margin:0;width:100%;min-height:100%;height:100%;overflow:hidden}:host mat-sidenav-container.td-layout-manage-list{flex:1}:host mat-sidenav-container.td-layout-manage-list>.mat-drawer>.mat-drawer-inner-container.mat-drawer-opened,:host mat-sidenav-container.td-layout-manage-list>.mat-drawer>.mat-drawer-inner-container.mat-drawer-opening,:host mat-sidenav-container.td-layout-manage-list>.mat-drawer>.mat-drawer-inner-container.mat-drawer-closed,:host mat-sidenav-container.td-layout-manage-list>.mat-drawer>.mat-drawer-inner-container.mat-drawer-closing{box-shadow:0 1px 3px #0003}:host .td-layout-manage-list-sidenav{text-align:start;flex:1;display:block;position:relative;overflow:auto;-webkit-overflow-scrolling:touch}:host .td-layout-manage-list-main{margin:0;width:100%;min-height:100%;height:100%;position:relative;overflow:auto;flex-direction:column;box-sizing:border-box;display:flex}:host .td-layout-manage-list-main .td-layout-manage-list-content{display:block;position:relative;overflow:auto;-webkit-overflow-scrolling:touch;flex:1}:host ::ng-deep mat-sidenav-container.td-layout-manage-list>.mat-drawer-content{flex-grow:1}:host ::ng-deep mat-sidenav-container.td-layout-manage-list>.mat-drawer>.mat-drawer-inner-container{box-shadow:0 1px 3px #0003,0 1px 1px #00000024,0 2px 1px -1px #0000001f;box-sizing:border-box;display:flex;flex-direction:column}:host ::ng-deep mat-nav-list a[mat-list-item] .mat-list-item-content{font-size:14px}:host ::ng-deep .mat-toolbar{font-weight:400}\n"] }]
}], null, { sidenav: [{
type: ViewChild,
args: [MatSidenav, { static: true }]
}], mode: [{
type: Input
}], opened: [{
type: Input
}], sidenavWidth: [{
type: Input
}], containerAutosize: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdLayoutManageListComponent, { className: "TdLayoutManageListComponent", filePath: "layout-manage-list/layout-manage-list.component.ts", lineNumber: 13 }); })();
class TdLayoutManageListToggleDirective extends BaseLayoutToggleDirective {
set tdLayoutManageListToggle(tdLayoutManageListToggle) {
this.disabled = !(tdLayoutManageListToggle === '' || tdLayoutManageListToggle);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.toggle();
}
static ɵfac = function TdLayoutManageListToggleDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutManageListToggleDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutManageListComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutManageListToggleDirective, selectors: [["", "tdLayoutManageListToggle", ""]], inputs: { tdLayoutManageListToggle: "tdLayoutManageListToggle" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutManageListToggleDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutManageListToggle]',
}]
}], () => [{ type: TdLayoutManageListComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutManageListComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutManageListToggle: [{
type: Input
}] }); })();
class TdLayoutManageListCloseDirective extends BaseLayoutToggleDirective {
set tdLayoutManageListClose(tdLayoutManageListClose) {
this.disabled = !(tdLayoutManageListClose === '' || tdLayoutManageListClose);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.close();
}
static ɵfac = function TdLayoutManageListCloseDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutManageListCloseDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutManageListComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutManageListCloseDirective, selectors: [["", "tdLayoutManageListClose", ""]], inputs: { tdLayoutManageListClose: "tdLayoutManageListClose" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutManageListCloseDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutManageListClose]',
}]
}], () => [{ type: TdLayoutManageListComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutManageListComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutManageListClose: [{
type: Input
}] }); })();
class TdLayoutManageListOpenDirective extends BaseLayoutToggleDirective {
set tdLayoutManageListOpen(tdLayoutManageListOpen) {
this.disabled = !(tdLayoutManageListOpen === '' || tdLayoutManageListOpen);
}
constructor(layout, renderer, elementRef) {
super(layout, renderer, elementRef);
}
onClick() {
this._layout.open();
}
static ɵfac = function TdLayoutManageListOpenDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutManageListOpenDirective)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutManageListComponent), 8), i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdLayoutManageListOpenDirective, selectors: [["", "tdLayoutManageListOpen", ""]], inputs: { tdLayoutManageListOpen: "tdLayoutManageListOpen" }, features: [i0.ɵɵInheritDefinitionFeature] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutManageListOpenDirective, [{
type: Directive,
args: [{
selector: '[tdLayoutManageListOpen]',
}]
}], () => [{ type: TdLayoutManageListComponent, decorators: [{
type: Optional
}, {
type: Inject,
args: [forwardRef(() => TdLayoutManageListComponent)]
}] }, { type: i0.Renderer2 }, { type: i0.ElementRef }], { tdLayoutManageListOpen: [{
type: Input
}] }); })();
const _c0$1 = ["*"];
class TdLayoutFooterComponent {
_renderer;
_elementRef;
_color;
/**
* color?: 'accent' | 'primary' | 'warn'
*
* Optional color option: primary | accent | warn.
*/
set color(color) {
if (color) {
this._renderer.removeClass(this._elementRef.nativeElement, 'mat-' + this._color);
this._color = color;
this._renderer.addClass(this._elementRef.nativeElement, 'mat-' + this._color);
}
}
get color() {
return this._color;
}
constructor(_renderer, _elementRef) {
this._renderer = _renderer;
this._elementRef = _elementRef;
this._renderer.addClass(this._elementRef.nativeElement, 'td-layout-footer');
}
static ɵfac = function TdLayoutFooterComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdLayoutFooterComponent)(i0.ɵɵdirectiveInject(i0.Renderer2), i0.ɵɵdirectiveInject(i0.ElementRef)); };
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdLayoutFooterComponent, selectors: [["td-layout-footer"], ["td-layout-footer-inner"]], inputs: { color: "color" }, ngContentSelectors: _c0$1, decls: 1, vars: 0, template: function TdLayoutFooterComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef();
i0.ɵɵprojection(0);
} }, styles: ["[_nghost-%COMP%]{display:block;padding:10px 16px}"] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdLayoutFooterComponent, [{
type: Component,
args: [{ selector: 'td-layout-footer,td-layout-footer-inner', template: "<ng-content></ng-content>\n", styles: [":host{display:block;padding:10px 16px}\n"] }]
}], () => [{ type: i0.Renderer2 }, { type: i0.ElementRef }], { color: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdLayoutFooterComponent, { className: "TdLayoutFooterComponent", filePath: "layout-footer/layout-footer.component.ts", lineNumber: 9 }); })();
const _c0 = [[["", "td-navigation-drawer-toolbar", ""]], "*", [["", "td-navigation-drawer-menu", ""]]];
const _c1 = ["[td-navigation-drawer-toolbar]", "*", "[td-navigation-drawer-menu]"];
function TdNavigationDrawerComponent_ng_container_2_div_1_mat_icon_1_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "mat-icon");
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(3);
i0.ɵɵadvance();
i0.ɵɵtextInterpolate(ctx_r1.icon);
} }
function TdNavigationDrawerComponent_ng_container_2_div_1_mat_icon_2_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelement(0, "mat-icon", 11);
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(3);
i0.ɵɵproperty("svgIcon", ctx_r1.logo);
} }
function TdNavigationDrawerComponent_ng_container_2_div_1_img_3_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelement(0, "img", 12);
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(3);
i0.ɵɵattribute("src", ctx_r1.avatar, i0.ɵɵsanitizeUrl);
} }
function TdNavigationDrawerComponent_ng_container_2_div_1_span_4_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "span", 13);
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(3);
i0.ɵɵadvance();
i0.ɵɵtextInterpolate(ctx_r1.sidenavTitle);
} }
function TdNavigationDrawerComponent_ng_container_2_div_1_Template(rf, ctx) { if (rf & 1) {
const _r1 = i0.ɵɵgetCurrentView();
i0.ɵɵelementStart(0, "div", 7);
i0.ɵɵlistener("click", function TdNavigationDrawerComponent_ng_container_2_div_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.handleNavigationClick()); });
i0.ɵɵtemplate(1, TdNavigationDrawerComponent_ng_container_2_div_1_mat_icon_1_Template, 2, 1, "mat-icon", 1)(2, TdNavigationDrawerComponent_ng_container_2_div_1_mat_icon_2_Template, 1, 1, "mat-icon", 8)(3, TdNavigationDrawerComponent_ng_container_2_div_1_img_3_Template, 1, 1, "img", 9)(4, TdNavigationDrawerComponent_ng_container_2_div_1_span_4_Template, 2, 1, "span", 10);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵclassProp("cursor-pointer", ctx_r1.routerEnabled);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.icon);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.logo && !ctx_r1.icon);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.avatar && !ctx_r1.logo && !ctx_r1.icon);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.sidenavTitle);
} }
function TdNavigationDrawerComponent_ng_container_2_div_2_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "div", 14);
i0.ɵɵtext(1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵadvance();
i0.ɵɵtextInterpolate1(" ", ctx_r1.name, " ");
} }
function TdNavigationDrawerComponent_ng_container_2_div_3_button_3_mat_icon_1_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "mat-icon");
i0.ɵɵtext(1, "arrow_drop_down");
i0.ɵɵelementEnd();
} }
function TdNavigationDrawerComponent_ng_container_2_div_3_button_3_mat_icon_2_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "mat-icon");
i0.ɵɵtext(1, "arrow_drop_up");
i0.ɵɵelementEnd();
} }
function TdNavigationDrawerComponent_ng_container_2_div_3_button_3_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "button", 18);
i0.ɵɵtemplate(1, TdNavigationDrawerComponent_ng_container_2_div_3_button_3_mat_icon_1_Template, 2, 0, "mat-icon", 1)(2, TdNavigationDrawerComponent_ng_container_2_div_3_button_3_mat_icon_2_Template, 2, 0, "mat-icon", 1);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(3);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", !ctx_r1.menuToggled);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.menuToggled);
} }
function TdNavigationDrawerComponent_ng_container_2_div_3_Template(rf, ctx) { if (rf & 1) {
const _r3 = i0.ɵɵgetCurrentView();
i0.ɵɵelementStart(0, "div", 15);
i0.ɵɵlistener("click", function TdNavigationDrawerComponent_ng_container_2_div_3_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.toggleMenu()); });
i0.ɵɵelementStart(1, "span", 16);
i0.ɵɵtext(2);
i0.ɵɵelementEnd();
i0.ɵɵtemplate(3, TdNavigationDrawerComponent_ng_container_2_div_3_button_3_Template, 3, 2, "button", 17);
i0.ɵɵelementEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext(2);
i0.ɵɵadvance(2);
i0.ɵɵtextInterpolate(ctx_r1.email || ctx_r1.name);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.isMenuAvailable);
} }
function TdNavigationDrawerComponent_ng_container_2_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementContainerStart(0);
i0.ɵɵtemplate(1, TdNavigationDrawerComponent_ng_container_2_div_1_Template, 5, 6, "div", 4)(2, TdNavigationDrawerComponent_ng_container_2_div_2_Template, 2, 1, "div", 5)(3, TdNavigationDrawerComponent_ng_container_2_div_3_Template, 4, 2, "div", 6);
i0.ɵɵelementContainerEnd();
} if (rf & 2) {
const ctx_r1 = i0.ɵɵnextContext();
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.icon || ctx_r1.logo || ctx_r1.sidenavTitle || ctx_r1.avatar);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.email && ctx_r1.name);
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r1.email || ctx_r1.name);
} }
class TdNavigationDrawerMenuDirective {
static ɵfac = function TdNavigationDrawerMenuDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdNavigationDrawerMenuDirective)(); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdNavigationDrawerMenuDirective, selectors: [["", "tdNavigationDrawerMenu", ""]] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdNavigationDrawerMenuDirective, [{
type: Directive,
args: [{
selector: '[tdNavigationDrawerMenu]',
}]
}], null, null); })();
class TdNavigationDrawerToolbarDirective {
static ɵfac = function TdNavigationDrawerToolbarDirective_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdNavigationDrawerToolbarDirective)(); };
static ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: TdNavigationDrawerToolbarDirective, selectors: [["", "tdNavigationDrawerToolbar", ""]] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdNavigationDrawerToolbarDirective, [{
type: Directive,
args: [{
selector: '[tdNavigationDrawerToolbar]',
}]
}], null, null); })();
class TdNavigationDrawerComponent {
_layout;
_router;
_sanitize;
_menuToggled = false;
_backgroundImage;
_destroy$ = new Subject();
get menuToggled() {
return this._menuToggled;
}
_drawerMenu;
_toolbar;
/**
* Checks if there is a [TdNavigationDrawerMenuDirective] has content.
*/
get isMenuAvailable() {
return this._drawerMenu ? this._drawerMenu.length > 0 : false;
}
/**
* Checks if there is a [TdNavigationDrawerToolbarDirective] has content.
*/
get isCustomToolbar() {
return this._toolbar ? this._toolbar.length > 0 : false;
}
/**
* Checks if there is a background image for the toolbar.
*/
get isBackgroundAvailable() {
return !!this._backgroundImage;
}
/**
* sidenavTitle?: string
* Title set in sideNav.
*/
sidenavTitle;
/**
* icon?: string
*
* icon name to be displayed before the title
*/
icon;
/**
* logo?: string
*
* logo icon name to be displayed before the title.
* If [icon] is set, then this will not be shown.
*/
logo;
/**
* avatar?: string
*
* avatar url to be displayed before the title
* If [icon] or [logo] are set, then this will not be shown.
*/
avatar;
/**
* color?: 'accent' | 'primary' | 'warn'
*
* toolbar color option: primary | accent | warn.
* If [color] is not set, default is used.
*/
color;
/**
* navigationRoute?: string
*
* option to set the combined route for the icon, logo, and sidenavTitle.
*/
navigationRoute;
/**
* backgroundUrl?: SafeResourceUrl
*
* image to be displayed as the background of the toolbar.
* URL used will be sanitized, but it should be always from a trusted source to avoid XSS.
*/
set backgroundUrl(backgroundUrl) {
if (backgroundUrl) {
const sanitizedUrl = this._sanitize.sanitize(SecurityContext.RESOURCE_URL, backgroundUrl);
this._backgroundImage = this._sanitize.sanitize(SecurityContext.STYLE, 'url(' + sanitizedUrl + ')');
}
}
get backgroundImage() {
return this._backgroundImage;
}
/**
* name?: string
*
* string to be displayed as part of the navigation drawer sublabel.
* if [email] is not set, then [name] will be the toggle menu text.
*/
name;
/**
* email?: string
*
* string to be displayed as part of the navigation drawer sublabel in the [toggle] menu text.
* if [email] and [name] are not set, then the toggle menu is not rendered.
*/
email;
/**
* Checks if router was injected.
*/
get routerEnabled() {
return !!this._router && !!this.navigationRoute;
}
constructor(_layout, _router, _sanitize) {
this._layout = _layout;
this._router = _router;
this._sanitize = _sanitize;
}
ngOnInit() {
this._layout.sidenav.openedChange
.pipe(takeUntil(this._destroy$))
.subscribe((opened) => {
if (!opened) {
this._menuToggled = false;
}
});
}
ngOnDestroy() {
this._destroy$.next();
}
toggleMenu() {
if (this.isMenuAvailable) {
this._menuToggled = !this._menuToggled;
}
}
handleNavigationClick() {
if (this.routerEnabled && this.navigationRoute) {
this._router.navigateByUrl(this.navigationRoute);
this.close();
}
}
/**
* Proxy toggle method to access sidenav from outside (from td-layout template).
*/
toggle() {
return this._layout.toggle();
}
/**
* Proxy open method to access sidenav from outside (from td-layout template).
*/
open() {
return this._layout.open();
}
/**
* Proxy close method to access sidenav from outside (from td-layout template).
*/
close() {
return this._layout.close();
}
static ɵfac = function TdNavigationDrawerComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || TdNavigationDrawerComponent)(i0.ɵɵdirectiveInject(forwardRef(() => TdLayoutComponent)), i0.ɵɵdirectiveInject(i1.Router, 8), i0.ɵɵdirectiveInject(i2$2.DomSanitizer)); };
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: TdNavigationDrawerComponent, selectors: [["td-navigation-drawer"]], contentQueries: function TdNavigationDrawerComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
i0.ɵɵcontentQuery(dirIndex, TdNavigationDrawerMenuDirective, 5);
i0.ɵɵcontentQuery(dirIndex, TdNavigationDrawerToolbarDirective, 5);
} if (rf & 2) {
let _t;
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx._drawerMenu = _t);
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx._toolbar = _t);
} }, inputs: { sidenavTitle: "sidenavTitle", icon: "icon", logo: "logo", avatar: "avatar", color: "color", navigationRoute: "navigationRoute", backgroundUrl: "backgroundUrl", name: "name", email: "email" }, ngContentSelectors: _c1, decls: 7, vars: 8, consts: [[1, "td-nagivation-drawer-toolbar", 3, "color"], [4, "ngIf"], [1, "td-navigation-drawer-content"], [1, "td-navigation-drawer-menu-content"], ["class", "td-navigation-drawer-toolbar-content", 3, "cursor-pointer", "click", 4, "ngIf"], ["class", "td-navigation-drawer-name", 4, "ngIf"], ["class", "td-navigation-drawer-menu-toggle", "href", "", 3, "click", 4, "ngIf"], [1, "td-navigation-drawer-toolbar-content", 3, "click"], ["class", "mat-icon-logo", 3, "svgIcon", 4, "ngIf"], ["class", "td-nagivation-drawer-toolbar-avatar", 4, "ngIf"], ["class", "td-navigation-drawer-title", 4, "ngIf"], [1, "mat-icon-logo", 3, "svgIcon"], [1, "td-nagivation-drawer-toolbar-avatar"], [1, "td-navigation-drawer-title"], [1, "td-navigation-drawer-name"], ["href", "", 1, "td-navigation-drawer-menu-toggle", 3, "click"], [1, "td-navigation-drawer-label"], ["mat-icon-button", "", "class", "td-navigation-drawer-menu-button", 4, "ngIf"], ["mat-icon-button", "", 1, "td-navigation-drawer-menu-button"]], template: function TdNavigationDrawerComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵprojectionDef(_c0);
i0.ɵɵelementStart(0, "mat-toolbar", 0);
i0.ɵɵprojection(1);
i0.ɵɵtemplate(2, TdNavigationDrawerComponent_ng_container_2_Template, 4, 3, "ng-container", 1);
i0.ɵɵelementEnd();
i0.ɵɵelementStart(3, "div", 2);
i0.ɵɵprojection(4, 1);
i0.ɵɵelementEnd();
i0.ɵɵelementStart(5, "div", 3);
i0.ɵɵprojection(6, 2);
i0.ɵɵelementEnd();
} if (rf & 2) {
i0.ɵɵstyleProp("background-image", ctx.backgroundImage);
i0.ɵɵclassProp("td-toolbar-background", !!ctx.isBackgroundAvailable);
i0.ɵɵproperty("color", ctx.color);
i0.ɵɵadvance(2);
i0.ɵɵproperty("ngIf", !ctx.isCustomToolbar);
i0.ɵɵadvance();
i0.ɵɵproperty("@tdCollapse", ctx.menuToggled);
i0.ɵɵadvance(2);
i0.ɵɵproperty("@tdCollapse", !ctx.menuToggled);
} }, dependencies: [CommonModule, i2.NgIf, MatToolbar, MatIcon, MatIconButton], styles: ["[_nghost-%COMP%]{width:100%}[_nghost-%COMP%] .td-navigation-drawer-content.ng-animating[_ngcontent-%COMP%], [_nghost-%COMP%] .td-navigation-drawer-menu-content.ng-animating[_ngcontent-%COMP%]{overflow:hidden}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%]{padding:16px}[_nghost-%COMP%] mat-toolbar.td-toolbar-background[_ngcontent-%COMP%]{background-repeat:no-repeat;background-size:cover}[_nghost-%COMP%] mat-toolbar.td-nagivation-drawer-toolbar[_ngcontent-%COMP%]{flex-direction:column;height:auto!important;display:block!important}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%] .td-navigation-drawer-toolbar-content[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex;align-items:center;align-content:center;max-width:100%;justify-content:flex-start}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%] .td-navigation-drawer-toolbar-content[_ngcontent-%COMP%] .td-nagivation-drawer-toolbar-avatar[_ngcontent-%COMP%]{border-radius:50%;height:60px;width:60px;margin:0 12px 12px 0}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%] .td-navigation-drawer-toolbar-content[_ngcontent-%COMP%] .td-navigation-drawer-title[_ngcontent-%COMP%]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%] .td-navigation-drawer-name[_ngcontent-%COMP%]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%] .td-navigation-drawer-menu-toggle[_ngcontent-%COMP%]{flex-direction:row;box-sizing:border-box;display:flex}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%] .td-navigation-drawer-menu-toggle[_ngcontent-%COMP%] .td-navigation-drawer-label[_ngcontent-%COMP%]{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}[_nghost-%COMP%] mat-toolbar[_ngcontent-%COMP%] .td-navigation-drawer-menu-toggle[_ngcontent-%COMP%] .td-navigation-drawer-menu-button[_ngcontent-%COMP%]{width:24px;height:24px;padding:0}[_nghost-%COMP%] > div[_ngcontent-%COMP%]{overflow:hidden}"], data: { animation: [tdCollapseAnimation] } });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(TdNavigationDrawerComponent, [{
type: Component,
args: [{ selector: 'td-navigation-drawer', animations: [tdCollapseAnimation], imports: [CommonModule, MatToolbar, MatIcon, MatIconButton], template: "<mat-toolbar\n [color]=\"color\"\n [style.background-image]=\"backgroundImage\"\n [class.td-toolbar-background]=\"!!isBackgroundAvailable\"\n class=\"td-nagivation-drawer-toolbar\"\n>\n <ng-content select=\"[td-navigation-drawer-toolbar]\"></ng-content>\n <ng-container *ngIf=\"!isCustomToolbar\">\n <div\n *ngIf=\"icon || logo || sidenavTitle || avatar\"\n class=\"td-navigation-drawer-toolbar-content\"\n [class.cursor-pointer]=\"routerEnabled\"\n (click)=\"handleNavigationClick()\"\n >\n <mat-icon *ngIf=\"icon\">{{ icon }}</mat-icon>\n <mat-icon\n *ngIf=\"logo && !icon\"\n class=\"mat-icon-logo\"\n [svgIcon]=\"logo\"\n ></mat-icon>\n <img\n *ngIf=\"avatar && !logo && !icon\"\n class=\"td-nagivation-drawer-toolbar-avatar\"\n [attr.src]=\"avatar\"\n />\n <span *ngIf=\"sidenavTitle\" class=\"td-navigation-drawer-title\">{{\n sidenavTitle\n }}</span>\n </div>\n <div class=\"td-navigation-drawer-name\" *ngIf=\"email && name\">\n {{ name }}\n </div>\n <div\n class=\"td-navigation-drawer-menu-toggle\"\n href\n *ngIf=\"email || name\"\n (click)=\"toggleMenu()\"\n >\n <span class=\"td-navigation-drawer-label\">{{ email || name }}</span>\n <button\n mat-icon-button\n class=\"td-navigation-drawer-menu-button\"\n *ngIf=\"isMenuAvailable\"\n >\n <mat-icon *ngIf=\"!menuToggled\">arrow_drop_down</mat-icon>\n <mat-icon *ngIf=\"menuToggled\">arrow_drop_up</mat-icon>\n </button>\n </div>\n </ng-container>\n</mat-toolbar>\n<div class=\"td-navigation-drawer-content\" [@tdCollapse]=\"menuToggled\">\n <ng-content></ng-content>\n</div>\n<div class=\"td-navigation-drawer-menu-content\" [@tdCollapse]=\"!menuToggled\">\n <ng-content select=\"[td-navigation-drawer-menu]\"></ng-content>\n</div>\n", styles: [":host{width:100%}:host .td-navigation-drawer-content.ng-animating,:host .td-navigation-drawer-menu-content.ng-animating{overflow:hidden}:host mat-toolbar{padding:16px}:host mat-toolbar.td-toolbar-background{background-repeat:no-repeat;background-size:cover}:host mat-toolbar.td-nagivation-drawer-toolbar{flex-direction:column;height:auto!important;display:block!important}:host mat-toolbar .td-navigation-drawer-toolbar-content{flex-direction:row;box-sizing:border-box;display:flex;align-items:center;align-content:center;max-width:100%;justify-content:flex-start}:host mat-toolbar .td-navigation-drawer-toolbar-content .td-nagivation-drawer-toolbar-avatar{border-radius:50%;height:60px;width:60px;margin:0 12px 12px 0}:host mat-toolbar .td-navigation-drawer-toolbar-content .td-navigation-drawer-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host mat-toolbar .td-navigation-drawer-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host mat-toolbar .td-navigation-drawer-menu-toggle{flex-direction:row;box-sizing:border-box;display:flex}:host mat-toolbar .td-navigation-drawer-menu-toggle .td-navigation-drawer-label{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host mat-toolbar .td-navigation-drawer-menu-toggle .td-navigation-drawer-menu-button{width:24px;height:24px;padding:0}:host>div{overflow:hidden}\n"] }]
}], () => [{ type: TdLayoutComponent, decorators: [{
type: Inject,
args: [forwardRef(() => TdLayoutComponent)]
}] }, { type: i1.Router, decorators: [{
type: Optional
}] }, { type: i2$2.DomSanitizer }], { _drawerMenu: [{
type: ContentChildren,
args: [TdNavigationDrawerMenuDirective, { descendants: true }]
}], _toolbar: [{
type: ContentChildren,
args: [TdNavigationDrawerToolbarDirective, { descendants: true }]
}], sidenavTitle: [{
type: Input
}], icon: [{
type: Input
}], logo: [{
type: Input
}], avatar: [{
type: Input
}], color: [{
type: Input
}], navigationRoute: [{
type: Input
}], backgroundUrl: [{
type: Input
}], name: [{
type: Input
}], email: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(TdNavigationDrawerComponent, { className: "TdNavigationDrawerComponent", filePath: "navigation-drawer/navigation-drawer.component.ts", lineNumber: 46 }); })();
const TD_LAYOUTS = [
TdLayoutComponent,
TdLayoutToggleDirective,
TdLayoutCloseDirective,
TdLayoutOpenDirective,
TdLayoutNavComponent,
TdLayoutNavListComponent,
TdLayoutNavListToggleDirective,
TdLayoutNavListCloseDirective,
TdLayoutNavListOpenDirective,
TdLayoutCardOverComponent,
TdLayoutManageListComponent,
TdLayoutManageListToggleDirective,
TdLayoutManageListCloseDirective,
TdLayoutManageListOpenDirective,
TdLayoutFooterComponent,
TdNavigationDrawerComponent,
TdNavigationDrawerMenuDirective,
TdNavigationDrawerToolbarDirective,
];
/**
* @deprecated This module is deprecated and will be removed in future versions.
* Please migrate to using standalone components as soon as possible.
*/
class CovalentLayoutModule {
static ɵfac = function CovalentLayoutModule_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CovalentLayoutModule)(); };
static ɵmod = /*@__PURE__*/ i0.ɵɵdefineNgModule({ type: CovalentLayoutModule });
static ɵinj = /*@__PURE__*/ i0.ɵɵdefineInjector({ imports: [TdLayoutComponent,
TdLayoutNavComponent,
TdLayoutNavListComponent,
TdLayoutCardOverComponent,
TdLayoutManageListComponent,
TdNavigationDrawerComponent] });
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(CovalentLayoutModule, [{
type: NgModule,
args: [{
imports: [...TD_LAYOUTS],
exports: [...TD_LAYOUTS],
}]
}], null, null); })();
(function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(CovalentLayoutModule, { imports: [TdLayoutComponent,
TdLayoutToggleDirective,
TdLayoutCloseDirective,
TdLayoutOpenDirective,
TdLayoutNavComponent,
TdLayoutNavListComponent,
TdLayoutNavListToggleDirective,
TdLayoutNavListCloseDirective,
TdLayoutNavListOpenDirective,
TdLayoutCardOverComponent,
TdLayoutManageListComponent,
TdLayoutManageListToggleDirective,
TdLayoutManageListCloseDirective,
TdLayoutManageListOpenDirective,
TdLayoutFooterComponent,
TdNavigationDrawerComponent,
TdNavigationDrawerMenuDirective,
TdNavigationDrawerToolbarDirective], exports: [TdLayoutComponent,
TdLayoutToggleDirective,
TdLayoutCloseDirective,
TdLayoutOpenDirective,
TdLayoutNavComponent,
TdLayoutNavListComponent,
TdLayoutNavListToggleDirective,
TdLayoutNavListCloseDirective,
TdLayoutNavListOpenDirective,
TdLayoutCardOverComponent,
TdLayoutManageListComponent,
TdLayoutManageListToggleDirective,
TdLayoutManageListCloseDirective,
TdLayoutManageListOpenDirective,
TdLayoutFooterComponent,
TdNavigationDrawerComponent,
TdNavigationDrawerMenuDirective,
TdNavigationDrawerToolbarDirective] }); })();
/**
* Generated bundle index. Do not edit.
*/
export { BaseLayoutToggleDirective, CovalentLayoutModule, LayoutToggleBase, TdLayoutCardOverComponent, TdLayoutCloseDirective, TdLayoutComponent, TdLayoutFooterComponent, TdLayoutManageListCloseDirective, TdLayoutManageListComponent, TdLayoutManageListOpenDirective, TdLayoutManageListToggleDirective, TdLayoutNavComponent, TdLayoutNavListCloseDirective, TdLayoutNavListComponent, TdLayoutNavListOpenDirective, TdLayoutNavListToggleDirective, TdLayoutOpenDirective, TdLayoutToggleDirective, TdNavigationDrawerComponent, TdNavigationDrawerMenuDirective, TdNavigationDrawerToolbarDirective, _TdLayoutToggleMixinBase };
//# sourceMappingURL=covalent-core-layout.mjs.map