tango-app-ui-shared 3.0.0 → 3.0.1

package/fesm2022/tango-app-ui-shared.mjs

@@ -0,0 +1,3420 @@
+import * as i0 from '@angular/core';
+import { Component, Input, HostBinding, ViewChild, NgModule, Injectable } from '@angular/core';
+import * as i1$1 from '@angular/router';
+import { NavigationEnd, NavigationCancel, ResolveEnd, RouterModule } from '@angular/router';
+import * as i1 from 'tango-app-metronics';
+import { MenuComponent, StickyComponent as StickyComponent$1, ScrollTopComponent as ScrollTopComponent$1, ToggleComponent as ToggleComponent$1, DrawerComponent as DrawerComponent$1, ScrollComponent as ScrollComponent$1 } from 'tango-app-metronics';
+import * as i2 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { filter } from 'rxjs/operators';
+import * as i1$2 from 'tango-app-ui-metronics';
+import { ToggleComponent, ScrollTopComponent, DrawerComponent, StickyComponent, MenuComponent as MenuComponent$1, ScrollComponent } from 'tango-app-ui-metronics';
+import * as i3 from '@angular/platform-browser';
+import * as i1$3 from '@ngx-translate/core';
+import { TranslateModule } from '@ngx-translate/core';
+import { InlineSVGModule } from 'ng-inline-svg-2';
+import { NgbDropdownModule, NgbProgressbarModule, NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
+import { BehaviorSubject } from 'rxjs';
+
+class HeaderMenuComponent {
+    pageInfo;
+    cd;
+    unsubscribe = [];
+    appPageTitleDirection = '';
+    appPageTitleDescription = true;
+    title$;
+    description$;
+    constructor(pageInfo, cd) {
+        this.pageInfo = pageInfo;
+        this.cd = cd;
+    }
+    ngOnInit() {
+        this.title$ = this.pageInfo.title.asObservable();
+        this.description$ = this.pageInfo.description.asObservable();
+        this.title$.subscribe((e) => {
+            this.cd.detectChanges();
+        });
+        this.description$.subscribe((e) => {
+            this.cd.detectChanges();
+        });
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HeaderMenuComponent, deps: [{ token: i1.PageInfoService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: HeaderMenuComponent, selector: "lib-header-menu", inputs: { appPageTitleDirection: "appPageTitleDirection", appPageTitleDescription: "appPageTitleDescription" }, ngImport: i0, template: "<ng-container *ngIf=\"title$ | async as title\">\r\n  <!-- begin::Title -->\r\n  <h1 class=\"page-heading d-flex text-gray-900 fw-bold fs-3 my-0 flex-column justify-content-center\">\r\n    {{ title }}\r\n    <ng-container *ngIf=\"appPageTitleDescription\">\r\n      <ng-container *ngIf=\"description$ | async as description\">\r\n\r\n\r\n        <!--begin::Description-->\r\n        <span class=\"page-desc text-muted fs-7 fw-semibold\" [ngClass]=\"{'pt-2': appPageTitleDirection === 'column'}\">\r\n          <ng-container *ngIf=\"appPageTitleDirection === 'row'\">\r\n            <!--begin::Separator-->\r\n            <span class=\"h-20px border-1 border-gray-300 border-start ms-3 mx-2\"></span>\r\n            <!--end::Separator-->\r\n          </ng-container>\r\n\r\n          {{description}}\r\n        </span>\r\n        <!--end::Description-->\r\n      </ng-container>\r\n\r\n    </ng-container>\r\n\r\n  </h1>\r\n  <!-- end::Title -->\r\n\r\n</ng-container>\r\n", styles: [":host{height:inherit;width:inherit}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HeaderMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-header-menu', template: "<ng-container *ngIf=\"title$ | async as title\">\r\n  <!-- begin::Title -->\r\n  <h1 class=\"page-heading d-flex text-gray-900 fw-bold fs-3 my-0 flex-column justify-content-center\">\r\n    {{ title }}\r\n    <ng-container *ngIf=\"appPageTitleDescription\">\r\n      <ng-container *ngIf=\"description$ | async as description\">\r\n\r\n\r\n        <!--begin::Description-->\r\n        <span class=\"page-desc text-muted fs-7 fw-semibold\" [ngClass]=\"{'pt-2': appPageTitleDirection === 'column'}\">\r\n          <ng-container *ngIf=\"appPageTitleDirection === 'row'\">\r\n            <!--begin::Separator-->\r\n            <span class=\"h-20px border-1 border-gray-300 border-start ms-3 mx-2\"></span>\r\n            <!--end::Separator-->\r\n          </ng-container>\r\n\r\n          {{description}}\r\n        </span>\r\n        <!--end::Description-->\r\n      </ng-container>\r\n\r\n    </ng-container>\r\n\r\n  </h1>\r\n  <!-- end::Title -->\r\n\r\n</ng-container>\r\n", styles: [":host{height:inherit;width:inherit}\n"] }]
+        }], ctorParameters: () => [{ type: i1.PageInfoService }, { type: i0.ChangeDetectorRef }], propDecorators: { appPageTitleDirection: [{
+                type: Input
+            }], appPageTitleDescription: [{
+                type: Input
+            }] } });
+
+class NavbarComponent {
+    appHeaderDefaulMenuDisplay;
+    isRtl;
+    itemClass = 'ms-1 ms-lg-3';
+    btnClass = 'btn btn-icon btn-custom btn-icon-muted btn-active-light btn-active-color-primary w-35px h-35px w-md-40px h-md-40px';
+    userAvatarClass = 'symbol-35px symbol-md-40px';
+    btnIconClass = 'fs-2 fs-md-1';
+    constructor() { }
+    ngOnInit() { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: NavbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: NavbarComponent, selector: "lib-navbar", inputs: { appHeaderDefaulMenuDisplay: "appHeaderDefaulMenuDisplay", isRtl: "isRtl" }, ngImport: i0, template: "\r\n<!--begin::Theme mode-->\r\n<div class=\"app-navbar-item\" [ngClass]=\"itemClass\">\r\n  <img src=\"./assets/tango/layout/bell.svg\" alt=\"\">\r\n</div>\r\n<!--end::Theme mode-->\r\n\r\n\r\n\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: NavbarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-navbar', template: "\r\n<!--begin::Theme mode-->\r\n<div class=\"app-navbar-item\" [ngClass]=\"itemClass\">\r\n  <img src=\"./assets/tango/layout/bell.svg\" alt=\"\">\r\n</div>\r\n<!--end::Theme mode-->\r\n\r\n\r\n\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { appHeaderDefaulMenuDisplay: [{
+                type: Input
+            }], isRtl: [{
+                type: Input
+            }] } });
+
+var categories = {
+	abstract: [
+		"abstract-33",
+		"abstract-27",
+		"abstract-26",
+		"abstract-32",
+		"abstract-18",
+		"abstract-24",
+		"abstract-30",
+		"abstract-8",
+		"abstract-9",
+		"abstract-31",
+		"abstract-25",
+		"abstract-19",
+		"abstract-21",
+		"abstract-35",
+		"abstract-34",
+		"abstract-20",
+		"abstract-36",
+		"abstract-22",
+		"abstract-23",
+		"abstract-37",
+		"abstract-44",
+		"abstract",
+		"abstract-45",
+		"abstract-47",
+		"abstract-46",
+		"abstract-42",
+		"abstract-43",
+		"abstract-41",
+		"abstract-40",
+		"abstract-48",
+		"abstract-49",
+		"abstract-12",
+		"abstract-2",
+		"abstract-3",
+		"abstract-13",
+		"abstract-39",
+		"abstract-11",
+		"abstract-1",
+		"abstract-10",
+		"abstract-38",
+		"abstract-14",
+		"abstract-28",
+		"abstract-4",
+		"abstract-5",
+		"abstract-29",
+		"abstract-15",
+		"abstract-17",
+		"abstract-7",
+		"abstract-6",
+		"abstract-16"
+	],
+	settings: [
+		"toggle-on",
+		"toggle-on-circle",
+		"toggle-off",
+		"category",
+		"setting",
+		"toggle-off-circle",
+		"more-2",
+		"setting-4",
+		"setting-2",
+		"setting-3"
+	],
+	design: [
+		"eraser",
+		"paintbucket",
+		"add-item",
+		"design-2",
+		"brush",
+		"size",
+		"design",
+		"copy",
+		"text",
+		"design-frame",
+		"bucket",
+		"glass",
+		"feather",
+		"pencil",
+		"colors-square",
+		"design-mask",
+		"bucket-square",
+		"copy-success",
+		"color-swatch"
+	],
+	"social-media": [
+		"instagram",
+		"snapchat",
+		"classmates",
+		"facebook",
+		"whatsapp",
+		"social-media",
+		"youtube",
+		"dribbble",
+		"twitter",
+		"tiktok",
+		"behance"
+	],
+	"it-network": [
+		"underlining",
+		"disconnect",
+		"code",
+		"gear",
+		"loading",
+		"scroll",
+		"wrench",
+		"square-brackets",
+		"frame",
+		"message-programming",
+		"data",
+		"fasten",
+		"click"
+	],
+	technologies: [
+		"tech-wifi",
+		"joystick",
+		"faceid",
+		"technology-3",
+		"technology-2",
+		"electricity",
+		"fingerprint-scanning",
+		"technology-4",
+		"artificial-intelligence",
+		"technology"
+	],
+	ecommerce: [
+		"basket-ok",
+		"cheque",
+		"handcart",
+		"shop",
+		"tag",
+		"purchase",
+		"discount",
+		"package",
+		"percentage",
+		"barcode",
+		"lots-shopping",
+		"basket"
+	],
+	archive: [
+		"book-square",
+		"receipt-square",
+		"save-2",
+		"archive-tick"
+	],
+	security: [
+		"shield-search",
+		"password-check",
+		"shield-tick",
+		"lock",
+		"key",
+		"shield",
+		"shield-cross",
+		"key-square",
+		"eye-slash",
+		"security-check",
+		"lock-3",
+		"scan-barcode",
+		"lock-2",
+		"eye",
+		"shield-slash",
+		"security-user"
+	],
+	general: [
+		"triangle",
+		"subtitle",
+		"ghost",
+		"information",
+		"milk",
+		"home",
+		"happy-emoji",
+		"mouse-square",
+		"filter-tick",
+		"filter-search",
+		"wifi-home",
+		"trash-square",
+		"paper-clip",
+		"archive",
+		"pin",
+		"wifi-square",
+		"auto-brightness",
+		"coffee",
+		"icon",
+		"emoji-happy",
+		"general-mouse",
+		"ranking",
+		"slider",
+		"crown-2",
+		"rescue",
+		"flash-circle",
+		"safe-home",
+		"cloud-change",
+		"crown",
+		"filter-edit",
+		"picture",
+		"verify",
+		"send",
+		"tag-cross",
+		"cloud-add",
+		"home-3",
+		"disk",
+		"trash",
+		"star",
+		"cd",
+		"home-2",
+		"mouse-circle",
+		"home-1",
+		"call",
+		"gift",
+		"share",
+		"sort",
+		"magnifier",
+		"filter-square",
+		"tree",
+		"filter",
+		"switch",
+		"cloud",
+		"cup",
+		"diamonds",
+		"status",
+		"rocket",
+		"cloud-download",
+		"menu",
+		"chrome"
+	],
+	location: [
+		"geolocation-home",
+		"map",
+		"telephone-geolocation",
+		"satellite",
+		"flag",
+		"focus",
+		"pointers",
+		"compass",
+		"route",
+		"geolocation"
+	],
+	education: [
+		"brifecase-timer",
+		"briefcase",
+		"clipboard",
+		"bookmark-2",
+		"note",
+		"note-2",
+		"book-open",
+		"book",
+		"teacher",
+		"award",
+		"brifecase-tick",
+		"brifecase-cros",
+		"bookmark"
+	],
+	business: [
+		"chart-line",
+		"chart",
+		"graph-3",
+		"chart-pie-3",
+		"graph-2",
+		"chart-line-down",
+		"chart-pie-too",
+		"chart-pie-4",
+		"chart-line-down-2",
+		"graph-4",
+		"chart-line-up-2",
+		"badge",
+		"chart-line-up",
+		"chart-simple-3",
+		"chart-pie-simple",
+		"chart-simple-2",
+		"graph-up",
+		"chart-line-star",
+		"graph",
+		"chart-simple"
+	],
+	"files-folders": [
+		"tablet-delete",
+		"file-added",
+		"file-up",
+		"minus-folder",
+		"file",
+		"delete-files",
+		"add-folder",
+		"file-left",
+		"file-deleted",
+		"some-files",
+		"file-right",
+		"notepad",
+		"notepad-bookmark",
+		"document",
+		"like-folder",
+		"folder-up",
+		"folder-added",
+		"file-down",
+		"filter-tablet",
+		"tablet-book",
+		"update-file",
+		"add-notepad",
+		"questionnaire-tablet",
+		"tablet-up",
+		"tablet-ok",
+		"update-folder",
+		"files-tablet",
+		"folder-down",
+		"notepad-edit",
+		"tablet-text-up",
+		"search-list",
+		"tablet-text-down",
+		"add-files",
+		"tablet-down",
+		"delete-folder",
+		"folder",
+		"file-sheet"
+	],
+	software: [
+		"bootstrap",
+		"figma",
+		"dropbox",
+		"xaomi",
+		"microsoft",
+		"android",
+		"vue",
+		"js",
+		"spring-framework",
+		"github",
+		"dj",
+		"google-play",
+		"angular",
+		"soft-3",
+		"python",
+		"soft-2",
+		"ts",
+		"xd",
+		"spotify",
+		"js-2",
+		"laravel",
+		"css",
+		"google",
+		"photoshop",
+		"twitch",
+		"illustrator",
+		"pails",
+		"react",
+		"html",
+		"slack",
+		"soft",
+		"yii",
+		"apple",
+		"vuesax"
+	],
+	time: [
+		"calendar-add",
+		"calendar-search",
+		"calendar-2",
+		"calendar-tick",
+		"time",
+		"watch",
+		"calendar-edit",
+		"calendar",
+		"calendar-8",
+		"timer",
+		"calendar-remove"
+	],
+	support: [
+		"heart-circle",
+		"like",
+		"information-4",
+		"information-5",
+		"information-2",
+		"information-3",
+		"question",
+		"dislike",
+		"message-question",
+		"medal-star",
+		"like-tag",
+		"like-2",
+		"support-24",
+		"question-2",
+		"lovely",
+		"like-shapes",
+		"heart"
+	],
+	users: [
+		"user",
+		"user-square",
+		"user-tick",
+		"people",
+		"user-edit",
+		"profile-user",
+		"profile-circle"
+	],
+	medicine: [
+		"capsule",
+		"virus",
+		"bandage",
+		"thermometer",
+		"flask",
+		"test-tubes",
+		"syringe",
+		"mask",
+		"pill",
+		"pulse"
+	],
+	"burger-menu": [
+		"burger-menu",
+		"burger-menu-6",
+		"burger-menu-5",
+		"burger-menu-4",
+		"burger-menu-1",
+		"burger-menu-3",
+		"burger-menu-2"
+	],
+	typography: [
+		"text-align-center",
+		"text-italic",
+		"text-bold",
+		"text-strikethrough",
+		"text-underline",
+		"text-number",
+		"text-align-left",
+		"text-align-right",
+		"text-circle",
+		"text-align-justify-center"
+	],
+	finance: [
+		"theta",
+		"dollar",
+		"binance",
+		"nexo",
+		"euro",
+		"avalanche",
+		"bitcoin",
+		"wallet",
+		"price-tag",
+		"finance-calculator",
+		"dash",
+		"lts",
+		"vibe",
+		"credit-cart",
+		"paypal",
+		"bill",
+		"ocean",
+		"celsius",
+		"educare",
+		"enjin-coin",
+		"two-credit-cart",
+		"bank",
+		"binance-usd",
+		"wanchain",
+		"trello",
+		"save-deposit",
+		"xmr",
+		"financial-schedule",
+		"office-bag"
+	],
+	weather: [
+		"night-day",
+		"sun",
+		"drop",
+		"moon"
+	],
+	arrows: [
+		"exit-right-corner",
+		"dots-circle-vertical",
+		"check-square",
+		"right-left",
+		"arrow-down",
+		"dots-horizontal",
+		"arrow-right-left",
+		"up-down",
+		"double-check",
+		"arrow-up-left",
+		"down",
+		"exit-up",
+		"up-square",
+		"down-square",
+		"plus-square",
+		"dots-circle",
+		"arrow-down-left",
+		"double-check-circle",
+		"up",
+		"entrance-right",
+		"arrow-right",
+		"arrow-two-diagonals",
+		"minus-square",
+		"arrow-diagonal",
+		"black-left",
+		"arrow-down-refraction",
+		"black-right",
+		"double-left",
+		"arrow-circle-left",
+		"arrow-zigzag",
+		"plus",
+		"check",
+		"exit-left",
+		"arrow-circle-right",
+		"cross-square",
+		"entrance-left",
+		"left-square",
+		"arrows-loop",
+		"black-left-line",
+		"double-left-arrow",
+		"check-circle",
+		"right",
+		"dots-square-vertical",
+		"arrow-up-right",
+		"exit-down",
+		"dots-square",
+		"to-left",
+		"double-down",
+		"plus-circle",
+		"black-down",
+		"double-up",
+		"black-up",
+		"double-right-arrow",
+		"arrow-up",
+		"black-right-line",
+		"arrow-up-refraction",
+		"arrow-left",
+		"cross",
+		"minus-circle",
+		"arrow-down-right",
+		"exit-right",
+		"to-right",
+		"double-right",
+		"arrow-mix",
+		"right-square",
+		"arrows-circle",
+		"cross-circle",
+		"left",
+		"minus",
+		"dots-vertical",
+		"arrow-up-down"
+	],
+	communication: [
+		"message-text-2",
+		"message-notif",
+		"message-add",
+		"sms",
+		"directbox-default",
+		"message-text",
+		"messages",
+		"address-book",
+		"message-edit",
+		"message-minus"
+	],
+	notifications: [
+		"notification-circle",
+		"notification-favorite",
+		"notification-2",
+		"notification",
+		"notification-bing",
+		"notification-status",
+		"notification-on"
+	],
+	"delivery-and-logistics": [
+		"scooter-2",
+		"parcel",
+		"delivery-time",
+		"delivery",
+		"delivery-24",
+		"ship",
+		"courier",
+		"logistic",
+		"trailer",
+		"car-2",
+		"car-3",
+		"airplane-square",
+		"scooter",
+		"truck",
+		"cube-3",
+		"bus",
+		"cube-2",
+		"delivery-door",
+		"delivery-3",
+		"delivery-2",
+		"car",
+		"courier-express",
+		"airplane",
+		"delivery-geolocation",
+		"parcel-tracking"
+	],
+	devices: [
+		"monitor-mobile",
+		"devices",
+		"keyboard",
+		"devices-2",
+		"bluetooth",
+		"wifi",
+		"airpod",
+		"simcard-2",
+		"speaker",
+		"printer",
+		"simcard",
+		"router",
+		"phone",
+		"electronic-clock",
+		"external-drive",
+		"laptop",
+		"tablet",
+		"screen",
+		"calculator",
+		"mouse"
+	],
+	grid: [
+		"grid",
+		"slider-vertical-2",
+		"maximize",
+		"slider-vertical",
+		"row-horizontal",
+		"kanban",
+		"row-vertical",
+		"fat-rows",
+		"grid-2",
+		"element-8",
+		"element-9",
+		"element-12",
+		"element-4",
+		"element-5",
+		"grid-frame",
+		"element-11",
+		"element-7",
+		"element-6",
+		"element-10",
+		"element-2",
+		"element-3",
+		"element-equal",
+		"element-1",
+		"slider-horizontal-2",
+		"slider-horizontal",
+		"element-plus"
+	]
+};
+var number = 573;
+var icons = {
+	"free-version-categories": [
+	"general",
+	"abstract",
+	"devices",
+	"location",
+	"users",
+	"it-newtwork",
+	"design",
+	"archive",
+	"typography",
+	"technologies",
+	"social-media",
+	"weather"
+],
+	categories: categories,
+	"duotone-paths": {
+	"abstract-33": 2,
+	"abstract-27": 2,
+	"abstract-26": 2,
+	"abstract-32": 2,
+	"abstract-18": 2,
+	"abstract-24": 2,
+	"abstract-30": 2,
+	"abstract-8": 2,
+	"abstract-9": 2,
+	"abstract-31": 2,
+	"abstract-25": 2,
+	"abstract-19": 2,
+	"abstract-21": 2,
+	"abstract-35": 2,
+	"abstract-34": 2,
+	"abstract-20": 2,
+	"abstract-36": 2,
+	"abstract-22": 2,
+	"abstract-23": 2,
+	"abstract-37": 2,
+	"abstract-44": 2,
+	abstract: 2,
+	"abstract-45": 2,
+	"abstract-47": 2,
+	"abstract-46": 2,
+	"abstract-42": 2,
+	"abstract-43": 2,
+	"abstract-41": 2,
+	"abstract-40": 2,
+	"abstract-48": 3,
+	"abstract-49": 3,
+	"abstract-12": 2,
+	"abstract-2": 2,
+	"abstract-3": 2,
+	"abstract-13": 2,
+	"abstract-39": 2,
+	"abstract-11": 2,
+	"abstract-1": 2,
+	"abstract-10": 2,
+	"abstract-38": 2,
+	"abstract-14": 2,
+	"abstract-28": 2,
+	"abstract-4": 2,
+	"abstract-5": 2,
+	"abstract-29": 2,
+	"abstract-15": 2,
+	"abstract-17": 2,
+	"abstract-7": 2,
+	"abstract-6": 0,
+	"abstract-16": 2,
+	"toggle-on": 2,
+	"toggle-on-circle": 2,
+	"toggle-off": 2,
+	category: 4,
+	setting: 2,
+	"toggle-off-circle": 2,
+	"more-2": 4,
+	"setting-4": 0,
+	"setting-2": 2,
+	"setting-3": 5,
+	eraser: 3,
+	paintbucket: 3,
+	"add-item": 3,
+	"design-2": 2,
+	brush: 2,
+	size: 2,
+	design: 2,
+	copy: 0,
+	text: 0,
+	"design-frame": 2,
+	bucket: 4,
+	glass: 3,
+	feather: 2,
+	pencil: 2,
+	"colors-square": 4,
+	"design-mask": 2,
+	"bucket-square": 3,
+	"copy-success": 2,
+	"color-swatch": 21,
+	instagram: 2,
+	snapchat: 2,
+	classmates: 2,
+	facebook: 2,
+	whatsapp: 2,
+	"social-media": 2,
+	youtube: 2,
+	dribbble: 6,
+	twitter: 2,
+	tiktok: 2,
+	behance: 2,
+	underlining: 3,
+	disconnect: 5,
+	code: 4,
+	gear: 2,
+	loading: 2,
+	scroll: 3,
+	wrench: 2,
+	"square-brackets": 4,
+	frame: 4,
+	"message-programming": 4,
+	data: 5,
+	fasten: 2,
+	click: 5,
+	"tech-wifi": 2,
+	joystick: 4,
+	faceid: 6,
+	"technology-3": 4,
+	"technology-2": 2,
+	electricity: 10,
+	"fingerprint-scanning": 5,
+	"technology-4": 7,
+	"artificial-intelligence": 8,
+	technology: 9,
+	"basket-ok": 4,
+	cheque: 7,
+	handcart: 0,
+	shop: 5,
+	tag: 3,
+	purchase: 2,
+	discount: 2,
+	"package": 3,
+	percentage: 2,
+	barcode: 8,
+	"lots-shopping": 8,
+	basket: 4,
+	"book-square": 3,
+	"receipt-square": 2,
+	"save-2": 2,
+	"archive-tick": 2,
+	"shield-search": 3,
+	"password-check": 5,
+	"shield-tick": 2,
+	lock: 3,
+	key: 2,
+	shield: 2,
+	"shield-cross": 3,
+	"key-square": 2,
+	"eye-slash": 4,
+	"security-check": 4,
+	"lock-3": 3,
+	"scan-barcode": 8,
+	"lock-2": 5,
+	eye: 3,
+	"shield-slash": 3,
+	"security-user": 2,
+	triangle: 3,
+	subtitle: 5,
+	ghost: 3,
+	information: 3,
+	milk: 3,
+	home: 0,
+	"happy-emoji": 2,
+	"mouse-square": 2,
+	"filter-tick": 2,
+	"filter-search": 3,
+	"wifi-home": 4,
+	"trash-square": 4,
+	"paper-clip": 0,
+	archive: 3,
+	pin: 2,
+	"wifi-square": 4,
+	"auto-brightness": 3,
+	coffee: 6,
+	icon: 3,
+	"emoji-happy": 4,
+	"general-mouse": 2,
+	ranking: 4,
+	slider: 4,
+	"crown-2": 3,
+	rescue: 2,
+	"flash-circle": 2,
+	"safe-home": 2,
+	"cloud-change": 3,
+	crown: 2,
+	"filter-edit": 2,
+	picture: 2,
+	verify: 2,
+	send: 2,
+	"tag-cross": 3,
+	"cloud-add": 2,
+	"home-3": 2,
+	disk: 2,
+	trash: 5,
+	star: 0,
+	cd: 2,
+	"home-2": 2,
+	"mouse-circle": 2,
+	"home-1": 2,
+	call: 8,
+	gift: 4,
+	share: 6,
+	sort: 4,
+	magnifier: 2,
+	"filter-square": 2,
+	tree: 3,
+	filter: 2,
+	"switch": 2,
+	cloud: 0,
+	cup: 2,
+	diamonds: 2,
+	status: 3,
+	rocket: 2,
+	"cloud-download": 2,
+	menu: 4,
+	chrome: 2,
+	"geolocation-home": 2,
+	map: 3,
+	"telephone-geolocation": 3,
+	satellite: 6,
+	flag: 2,
+	focus: 2,
+	pointers: 3,
+	compass: 2,
+	route: 4,
+	geolocation: 2,
+	"brifecase-timer": 3,
+	briefcase: 2,
+	clipboard: 3,
+	"bookmark-2": 2,
+	note: 2,
+	"note-2": 4,
+	"book-open": 4,
+	book: 4,
+	teacher: 2,
+	award: 3,
+	"brifecase-tick": 3,
+	"brifecase-cros": 3,
+	bookmark: 2,
+	"chart-line": 2,
+	chart: 2,
+	"graph-3": 2,
+	"chart-pie-3": 3,
+	"graph-2": 3,
+	"chart-line-down": 2,
+	"chart-pie-too": 2,
+	"chart-pie-4": 3,
+	"chart-line-down-2": 3,
+	"graph-4": 2,
+	"chart-line-up-2": 2,
+	badge: 5,
+	"chart-line-up": 2,
+	"chart-simple-3": 4,
+	"chart-pie-simple": 2,
+	"chart-simple-2": 4,
+	"graph-up": 6,
+	"chart-line-star": 3,
+	graph: 4,
+	"chart-simple": 4,
+	"tablet-delete": 3,
+	"file-added": 2,
+	"file-up": 2,
+	"minus-folder": 2,
+	file: 2,
+	"delete-files": 2,
+	"add-folder": 2,
+	"file-left": 2,
+	"file-deleted": 2,
+	"some-files": 2,
+	"file-right": 2,
+	notepad: 5,
+	"notepad-bookmark": 6,
+	document: 2,
+	"like-folder": 2,
+	"folder-up": 2,
+	"folder-added": 2,
+	"file-down": 2,
+	"filter-tablet": 2,
+	"tablet-book": 2,
+	"update-file": 4,
+	"add-notepad": 4,
+	"questionnaire-tablet": 2,
+	"tablet-up": 3,
+	"tablet-ok": 3,
+	"update-folder": 2,
+	"files-tablet": 2,
+	"folder-down": 2,
+	"notepad-edit": 2,
+	"tablet-text-up": 2,
+	"search-list": 3,
+	"tablet-text-down": 4,
+	"add-files": 3,
+	"tablet-down": 3,
+	"delete-folder": 2,
+	folder: 2,
+	"file-sheet": 2,
+	bootstrap: 3,
+	figma: 5,
+	dropbox: 5,
+	xaomi: 2,
+	microsoft: 4,
+	android: 6,
+	vue: 2,
+	js: 2,
+	"spring-framework": 0,
+	github: 2,
+	dj: 0,
+	"google-play": 2,
+	angular: 3,
+	"soft-3": 2,
+	python: 2,
+	"soft-2": 2,
+	ts: 3,
+	xd: 3,
+	spotify: 2,
+	"js-2": 2,
+	laravel: 7,
+	css: 2,
+	google: 2,
+	photoshop: 2,
+	twitch: 3,
+	illustrator: 4,
+	pails: 9,
+	react: 2,
+	html: 2,
+	slack: 8,
+	soft: 6,
+	yii: 3,
+	apple: 2,
+	vuesax: 3,
+	"calendar-add": 6,
+	"calendar-search": 4,
+	"calendar-2": 5,
+	"calendar-tick": 6,
+	time: 2,
+	watch: 2,
+	"calendar-edit": 3,
+	calendar: 2,
+	"calendar-8": 6,
+	timer: 3,
+	"calendar-remove": 6,
+	"heart-circle": 2,
+	like: 2,
+	"information-4": 3,
+	"information-5": 3,
+	"information-2": 3,
+	"information-3": 3,
+	question: 3,
+	dislike: 2,
+	"message-question": 3,
+	"medal-star": 4,
+	"like-tag": 2,
+	"like-2": 2,
+	"support-24": 3,
+	"question-2": 3,
+	lovely: 2,
+	"like-shapes": 2,
+	heart: 2,
+	user: 2,
+	"user-square": 3,
+	"user-tick": 3,
+	people: 5,
+	"user-edit": 3,
+	"profile-user": 4,
+	"profile-circle": 3,
+	capsule: 2,
+	virus: 3,
+	bandage: 2,
+	thermometer: 2,
+	flask: 2,
+	"test-tubes": 2,
+	syringe: 3,
+	mask: 3,
+	pill: 0,
+	pulse: 2,
+	"burger-menu": 4,
+	"burger-menu-6": 0,
+	"burger-menu-5": 0,
+	"burger-menu-4": 0,
+	"burger-menu-1": 4,
+	"burger-menu-3": 9,
+	"burger-menu-2": 10,
+	"text-align-center": 4,
+	"text-italic": 4,
+	"text-bold": 3,
+	"text-strikethrough": 3,
+	"text-underline": 3,
+	"text-number": 6,
+	"text-align-left": 4,
+	"text-align-right": 4,
+	"text-circle": 6,
+	"text-align-justify-center": 4,
+	theta: 2,
+	dollar: 3,
+	binance: 5,
+	nexo: 2,
+	euro: 3,
+	avalanche: 2,
+	bitcoin: 2,
+	wallet: 4,
+	"price-tag": 3,
+	"finance-calculator": 7,
+	dash: 2,
+	lts: 2,
+	vibe: 2,
+	"credit-cart": 2,
+	paypal: 2,
+	bill: 6,
+	ocean: 19,
+	celsius: 2,
+	educare: 4,
+	"enjin-coin": 2,
+	"two-credit-cart": 5,
+	bank: 2,
+	"binance-usd": 4,
+	wanchain: 2,
+	trello: 3,
+	"save-deposit": 4,
+	xmr: 2,
+	"financial-schedule": 4,
+	"office-bag": 4,
+	"night-day": 10,
+	sun: 9,
+	drop: 2,
+	moon: 2,
+	"exit-right-corner": 2,
+	"dots-circle-vertical": 4,
+	"check-square": 2,
+	"right-left": 3,
+	"arrow-down": 2,
+	"dots-horizontal": 3,
+	"arrow-right-left": 2,
+	"up-down": 3,
+	"double-check": 2,
+	"arrow-up-left": 2,
+	down: 0,
+	"exit-up": 2,
+	"up-square": 2,
+	"down-square": 2,
+	"plus-square": 3,
+	"dots-circle": 4,
+	"arrow-down-left": 2,
+	"double-check-circle": 3,
+	up: 0,
+	"entrance-right": 2,
+	"arrow-right": 2,
+	"arrow-two-diagonals": 5,
+	"minus-square": 2,
+	"arrow-diagonal": 3,
+	"black-left": 0,
+	"arrow-down-refraction": 2,
+	"black-right": 0,
+	"double-left": 2,
+	"arrow-circle-left": 2,
+	"arrow-zigzag": 2,
+	plus: 0,
+	check: 0,
+	"exit-left": 2,
+	"arrow-circle-right": 2,
+	"cross-square": 2,
+	"entrance-left": 2,
+	"left-square": 2,
+	"arrows-loop": 2,
+	"black-left-line": 2,
+	"double-left-arrow": 2,
+	"check-circle": 2,
+	right: 0,
+	"dots-square-vertical": 4,
+	"arrow-up-right": 2,
+	"exit-down": 2,
+	"dots-square": 4,
+	"to-left": 0,
+	"double-down": 3,
+	"plus-circle": 2,
+	"black-down": 0,
+	"double-up": 3,
+	"black-up": 0,
+	"double-right-arrow": 2,
+	"arrow-up": 2,
+	"black-right-line": 2,
+	"arrow-up-refraction": 2,
+	"arrow-left": 2,
+	cross: 2,
+	"minus-circle": 2,
+	"arrow-down-right": 2,
+	"exit-right": 2,
+	"to-right": 0,
+	"double-right": 2,
+	"arrow-mix": 2,
+	"right-square": 2,
+	"arrows-circle": 2,
+	"cross-circle": 2,
+	left: 0,
+	minus: 0,
+	"dots-vertical": 3,
+	"arrow-up-down": 2,
+	"message-text-2": 3,
+	"message-notif": 5,
+	"message-add": 3,
+	sms: 2,
+	"directbox-default": 4,
+	"message-text": 3,
+	messages: 5,
+	"address-book": 3,
+	"message-edit": 2,
+	"message-minus": 2,
+	"notification-circle": 2,
+	"notification-favorite": 3,
+	"notification-2": 2,
+	notification: 3,
+	"notification-bing": 3,
+	"notification-status": 4,
+	"notification-on": 5,
+	"scooter-2": 0,
+	parcel: 5,
+	"delivery-time": 5,
+	delivery: 5,
+	"delivery-24": 4,
+	ship: 3,
+	courier: 3,
+	logistic: 7,
+	trailer: 5,
+	"car-2": 6,
+	"car-3": 3,
+	"airplane-square": 2,
+	scooter: 7,
+	truck: 5,
+	"cube-3": 2,
+	bus: 5,
+	"cube-2": 3,
+	"delivery-door": 4,
+	"delivery-3": 3,
+	"delivery-2": 9,
+	car: 5,
+	"courier-express": 7,
+	airplane: 2,
+	"delivery-geolocation": 5,
+	"parcel-tracking": 3,
+	"monitor-mobile": 2,
+	devices: 5,
+	keyboard: 2,
+	"devices-2": 3,
+	bluetooth: 2,
+	wifi: 4,
+	airpod: 3,
+	"simcard-2": 2,
+	speaker: 3,
+	printer: 5,
+	simcard: 5,
+	router: 2,
+	phone: 2,
+	"electronic-clock": 4,
+	"external-drive": 5,
+	laptop: 2,
+	tablet: 3,
+	screen: 4,
+	calculator: 6,
+	mouse: 2,
+	grid: 2,
+	"slider-vertical-2": 3,
+	maximize: 5,
+	"slider-vertical": 3,
+	"row-horizontal": 2,
+	kanban: 2,
+	"row-vertical": 2,
+	"fat-rows": 2,
+	"grid-2": 2,
+	"element-8": 2,
+	"element-9": 2,
+	"element-12": 3,
+	"element-4": 2,
+	"element-5": 2,
+	"grid-frame": 3,
+	"element-11": 4,
+	"element-7": 2,
+	"element-6": 2,
+	"element-10": 3,
+	"element-2": 2,
+	"element-3": 2,
+	"element-equal": 5,
+	"element-1": 4,
+	"slider-horizontal-2": 3,
+	"slider-horizontal": 3,
+	"element-plus": 5
+},
+	number: number
+};
+
+class KeeniconComponent {
+    name;
+    class;
+    type = 'duotone';
+    pathsNumber = 0;
+    constructor() {
+    }
+    ngOnInit() {
+        if (this.type === 'duotone') {
+            // @ts-ignore
+            this.pathsNumber = icons[this.type + '-paths'][this.name] ?? 0;
+        }
+    }
+    get styleDisplay() {
+        return 'contents';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: KeeniconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: KeeniconComponent, selector: "lib-keenicon", inputs: { name: "name", class: "class", type: "type" }, host: { properties: { "style.display": "this.styleDisplay" } }, ngImport: i0, template: "<span *ngIf=\"type === 'duotone'\" class=\"ki-{{ type }} ki-{{ name }}{{ class ? ' ' + class : '' }}\">\r\n  <span *ngFor=\"let i of [].constructor(pathsNumber); let idx = index\" class=\"path{{ idx + 1 }}\"></span>\r\n</span>\r\n<span *ngIf=\"type !== 'duotone'\" class=\"ki-{{ type }} ki-{{ name }}{{ class ? ' ' + class : '' }}\"></span>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: KeeniconComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-keenicon', template: "<span *ngIf=\"type === 'duotone'\" class=\"ki-{{ type }} ki-{{ name }}{{ class ? ' ' + class : '' }}\">\r\n  <span *ngFor=\"let i of [].constructor(pathsNumber); let idx = index\" class=\"path{{ idx + 1 }}\"></span>\r\n</span>\r\n<span *ngIf=\"type !== 'duotone'\" class=\"ki-{{ type }} ki-{{ name }}{{ class ? ' ' + class : '' }}\"></span>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { name: [{
+                type: Input
+            }], class: [{
+                type: Input
+            }], type: [{
+                type: Input
+            }], styleDisplay: [{
+                type: HostBinding,
+                args: ['style.display']
+            }] } });
+
+class HeaderComponent {
+    layout;
+    router;
+    unsubscribe = [];
+    // Public props
+    currentLayoutType;
+    appHeaderDisplay;
+    appHeaderDefaultFixedDesktop;
+    appHeaderDefaultFixedMobile;
+    appHeaderDefaultContainer;
+    headerContainerCssClass = '';
+    appHeaderDefaultContainerClass = '';
+    appHeaderDefaultStacked;
+    // view
+    appSidebarDefaultCollapseDesktopEnabled;
+    appSidebarDisplay;
+    appHeaderDefaultContent = '';
+    appHeaderDefaulMenuDisplay;
+    appPageTitleDisplay;
+    constructor(layout, router) {
+        this.layout = layout;
+        this.router = router;
+        this.routingChanges();
+    }
+    updateProps(config) {
+        this.appHeaderDisplay = this.layout.getProp('app.header.display', config);
+        // view
+        this.appSidebarDefaultCollapseDesktopEnabled = this.layout.getProp('app.sidebar.default.collapse.desktop.enabled', config);
+        this.appSidebarDisplay = this.layout.getProp('app.sidebar.display', config);
+        this.appHeaderDefaultContent = this.layout.getProp('app.header.default.content', config);
+        this.appHeaderDefaulMenuDisplay = this.layout.getProp('app.header.default.menu.display', config);
+        this.appPageTitleDisplay = this.layout.getProp('app.pageTitle.display', config);
+        // body attrs and container css classes
+        this.appHeaderDefaultFixedDesktop = this.layout.getProp('app.header.default.fixed.desktop', config);
+        if (this.appHeaderDefaultFixedDesktop) {
+            document.body.setAttribute('data-kt-app-header-fixed', 'true');
+        }
+        this.appHeaderDefaultFixedMobile = this.layout.getProp('app.header.default.fixed.mobile', config);
+        if (this.appHeaderDefaultFixedMobile) {
+            document.body.setAttribute('data-kt-app-header-fixed-mobile', 'true');
+        }
+        this.appHeaderDefaultContainer = this.layout.getProp('appHeaderDefaultContainer', config);
+        this.headerContainerCssClass =
+            this.appHeaderDefaultContainer === 'fixed'
+                ? 'container-xxl'
+                : 'container-fluid';
+        this.appHeaderDefaultContainerClass = this.layout.getProp('app.header.default.containerClass', config);
+        if (this.appHeaderDefaultContainerClass) {
+            this.headerContainerCssClass += ` ${this.appHeaderDefaultContainerClass}`;
+        }
+        this.appHeaderDefaultStacked = this.layout.getProp('app.header.default.stacked', config);
+        if (this.appHeaderDefaultStacked) {
+            document.body.setAttribute('data-kt-app-header-stacked', 'true');
+        }
+        // Primary header
+        // Secondary header
+    }
+    ngOnInit() {
+        const subscr = this.layout.layoutConfigSubject
+            .asObservable()
+            .subscribe((config) => {
+            this.updateProps(config);
+        });
+        this.unsubscribe.push(subscr);
+        const layoutSubscr = this.layout.currentLayoutTypeSubject
+            .asObservable()
+            .subscribe((layout) => {
+            this.currentLayoutType = layout;
+        });
+        this.unsubscribe.push(layoutSubscr);
+    }
+    routingChanges() {
+        const routerSubscription = this.router.events.subscribe((event) => {
+            if (event instanceof NavigationEnd || event instanceof NavigationCancel) {
+                MenuComponent.reinitialization();
+            }
+        });
+        this.unsubscribe.push(routerSubscription);
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HeaderComponent, deps: [{ token: i1.LayoutService }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: HeaderComponent, selector: "lib-header", ngImport: i0, template: "<!--begin::Header container-->\r\n<div class=\"app-container header-style\" id=\"kt_app_header_container\" [ngClass]=\"headerContainerCssClass\">\r\n  <ng-container *ngIf=\"appSidebarDefaultCollapseDesktopEnabled\">\r\n    <div class=\"app-sidebar-collapse-d-flex align-items-center me-3\">\r\n      <!--begin::sidebar toggle-->\r\n      <div class=\"btn btn-icon w-auto px-0 btn-color-muted btn-active-icon-primary\" data-kt-toggle=\"true\"\r\n        data-kt-toggle-target=\"body\" data-kt-toggle-mode=\"on\" data-kt-toggle-name=\"app-sidebar-collapse\">\r\n        <lib-keenicon name=\"double-right\" class=\"fs-1\"></lib-keenicon>\r\n      </div>\r\n      <!--end::sidebar toggle-->\r\n    </div>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"appSidebarDisplay\">\r\n    <!--begin::sidebar mobile toggle-->\r\n    <div class=\"d-flex align-items-center d-lg-none ms-n2 me-2\" title=\"Show sidebar menu\">\r\n      <div class=\"btn btn-icon btn-active-color-primary w-35px h-35px\" id=\"kt_app_sidebar_mobile_toggle\">\r\n        <lib-keenicon name=\"abstract-14\" class=\"fs-1\"></lib-keenicon>\r\n      </div>\r\n    </div>\r\n    <!--end::sidebar mobile toggle-->\r\n    <!--begin::Mobile logo-->\r\n    <div class=\"d-flex align-items-center flex-grow-1 flex-lg-grow-0\">\r\n      <a routerLink=\"/dashboard\" class=\"d-lg-none\">\r\n        <img alt=\"Logo\" src=\"./assets/media/logos/default-small.svg\" class=\"h-30px\" />\r\n      </a>\r\n    </div>\r\n    <!--end::Mobile logo-->\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"!appSidebarDisplay\">\r\n    <!--begin::Logo-->\r\n    <div class=\"d-flex align-items-center flex-grow-1 flex-lg-grow-0 me-lg-15\">\r\n      <a routerLink=\"/dashboard\">\r\n        <ng-container *ngIf=\"currentLayoutType === 'dark-header'\">\r\n          <img alt=\"Logo\" src=\"./assets/media/logos/default-dark.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default\" />\r\n        </ng-container>\r\n        <ng-container *ngIf=\"currentLayoutType !== 'dark-header'\">\r\n          <img alt=\"Logo\" src=\"./assets/media/logos/default.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default theme-light-show\" />\r\n          <img alt=\"Logo\" src=\"./assets/media/logos/default-dark.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default theme-dark-show\" />\r\n        </ng-container>\r\n      </a>\r\n    </div>\r\n    <!--end::Logo-->\r\n  </ng-container>\r\n\r\n  <!--begin::Header wrapper-->\r\n  <div class=\"d-flex align-items-stretch justify-content-between flex-lg-grow-1\" id=\"kt_app_header_wrapper\">\r\n    <ng-container *ngIf=\"appHeaderDefaultContent === 'menu' && appHeaderDefaulMenuDisplay\">\r\n      <!--begin::Menu wrapper-->\r\n      <div class=\"\r\n    app-header-menu\r\n    app-header-mobile-drawer\r\n    align-items-stretch\r\n\" data-kt-drawer=\"true\" data-kt-drawer-name=\"app-header-menu\" data-kt-drawer-activate=\"{default: true, lg: false}\"\r\n        data-kt-drawer-overlay=\"true\" data-kt-drawer-width=\"225px\" data-kt-drawer-direction=\"end\"\r\n        data-kt-drawer-toggle=\"#kt_app_header_menu_toggle\" data-kt-swapper=\"true\"\r\n        data-kt-swapper-mode=\"{default: 'append', lg: 'prepend'}\"\r\n        data-kt-swapper-parent=\"{default: '#kt_app_body', lg: '#kt_app_header_wrapper'}\">\r\n        <!--begin::Menu-->\r\n        <lib-header-menu\r\n        appPageTitleDirection = ''\r\n        [appPageTitleDescription] = true\r\n        class=\"\r\n        menu\r\n        menu-rounded\r\n        menu-column\r\n        menu-lg-row\r\n        my-5\r\n        my-lg-0\r\n        align-items-stretch\r\n        fw-semibold\r\n        px-2 px-lg-0\r\n    \" id=\"kt_app_header_menu\" data-kt-menu=\"true\"></lib-header-menu>\r\n        <!--end::Menu-->\r\n      </div>\r\n      <!--end::Menu wrapper-->\r\n    </ng-container>\r\n    <!-- <ng-container *ngIf=\"appHeaderDefaultContent === 'page-title' && appPageTitleDisplay\">\r\n      <app-page-title #ktPageTitle class=\"page-title d-flex\"></app-page-title>\r\n    </ng-container> -->\r\n    <lib-navbar class=\"app-navbar flex-shrink-0\" [appHeaderDefaulMenuDisplay]=\"appHeaderDefaulMenuDisplay\"\r\n      [isRtl]=\"false\"></lib-navbar>\r\n  </div>\r\n  <!--end::Header wrapper-->\r\n</div>\r\n<!--end::Header container-->\r\n", styles: [".header-style{background-color:#fff}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: HeaderMenuComponent, selector: "lib-header-menu", inputs: ["appPageTitleDirection", "appPageTitleDescription"] }, { kind: "component", type: NavbarComponent, selector: "lib-navbar", inputs: ["appHeaderDefaulMenuDisplay", "isRtl"] }, { kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HeaderComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-header', template: "<!--begin::Header container-->\r\n<div class=\"app-container header-style\" id=\"kt_app_header_container\" [ngClass]=\"headerContainerCssClass\">\r\n  <ng-container *ngIf=\"appSidebarDefaultCollapseDesktopEnabled\">\r\n    <div class=\"app-sidebar-collapse-d-flex align-items-center me-3\">\r\n      <!--begin::sidebar toggle-->\r\n      <div class=\"btn btn-icon w-auto px-0 btn-color-muted btn-active-icon-primary\" data-kt-toggle=\"true\"\r\n        data-kt-toggle-target=\"body\" data-kt-toggle-mode=\"on\" data-kt-toggle-name=\"app-sidebar-collapse\">\r\n        <lib-keenicon name=\"double-right\" class=\"fs-1\"></lib-keenicon>\r\n      </div>\r\n      <!--end::sidebar toggle-->\r\n    </div>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"appSidebarDisplay\">\r\n    <!--begin::sidebar mobile toggle-->\r\n    <div class=\"d-flex align-items-center d-lg-none ms-n2 me-2\" title=\"Show sidebar menu\">\r\n      <div class=\"btn btn-icon btn-active-color-primary w-35px h-35px\" id=\"kt_app_sidebar_mobile_toggle\">\r\n        <lib-keenicon name=\"abstract-14\" class=\"fs-1\"></lib-keenicon>\r\n      </div>\r\n    </div>\r\n    <!--end::sidebar mobile toggle-->\r\n    <!--begin::Mobile logo-->\r\n    <div class=\"d-flex align-items-center flex-grow-1 flex-lg-grow-0\">\r\n      <a routerLink=\"/dashboard\" class=\"d-lg-none\">\r\n        <img alt=\"Logo\" src=\"./assets/media/logos/default-small.svg\" class=\"h-30px\" />\r\n      </a>\r\n    </div>\r\n    <!--end::Mobile logo-->\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"!appSidebarDisplay\">\r\n    <!--begin::Logo-->\r\n    <div class=\"d-flex align-items-center flex-grow-1 flex-lg-grow-0 me-lg-15\">\r\n      <a routerLink=\"/dashboard\">\r\n        <ng-container *ngIf=\"currentLayoutType === 'dark-header'\">\r\n          <img alt=\"Logo\" src=\"./assets/media/logos/default-dark.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default\" />\r\n        </ng-container>\r\n        <ng-container *ngIf=\"currentLayoutType !== 'dark-header'\">\r\n          <img alt=\"Logo\" src=\"./assets/media/logos/default.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default theme-light-show\" />\r\n          <img alt=\"Logo\" src=\"./assets/media/logos/default-dark.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default theme-dark-show\" />\r\n        </ng-container>\r\n      </a>\r\n    </div>\r\n    <!--end::Logo-->\r\n  </ng-container>\r\n\r\n  <!--begin::Header wrapper-->\r\n  <div class=\"d-flex align-items-stretch justify-content-between flex-lg-grow-1\" id=\"kt_app_header_wrapper\">\r\n    <ng-container *ngIf=\"appHeaderDefaultContent === 'menu' && appHeaderDefaulMenuDisplay\">\r\n      <!--begin::Menu wrapper-->\r\n      <div class=\"\r\n    app-header-menu\r\n    app-header-mobile-drawer\r\n    align-items-stretch\r\n\" data-kt-drawer=\"true\" data-kt-drawer-name=\"app-header-menu\" data-kt-drawer-activate=\"{default: true, lg: false}\"\r\n        data-kt-drawer-overlay=\"true\" data-kt-drawer-width=\"225px\" data-kt-drawer-direction=\"end\"\r\n        data-kt-drawer-toggle=\"#kt_app_header_menu_toggle\" data-kt-swapper=\"true\"\r\n        data-kt-swapper-mode=\"{default: 'append', lg: 'prepend'}\"\r\n        data-kt-swapper-parent=\"{default: '#kt_app_body', lg: '#kt_app_header_wrapper'}\">\r\n        <!--begin::Menu-->\r\n        <lib-header-menu\r\n        appPageTitleDirection = ''\r\n        [appPageTitleDescription] = true\r\n        class=\"\r\n        menu\r\n        menu-rounded\r\n        menu-column\r\n        menu-lg-row\r\n        my-5\r\n        my-lg-0\r\n        align-items-stretch\r\n        fw-semibold\r\n        px-2 px-lg-0\r\n    \" id=\"kt_app_header_menu\" data-kt-menu=\"true\"></lib-header-menu>\r\n        <!--end::Menu-->\r\n      </div>\r\n      <!--end::Menu wrapper-->\r\n    </ng-container>\r\n    <!-- <ng-container *ngIf=\"appHeaderDefaultContent === 'page-title' && appPageTitleDisplay\">\r\n      <app-page-title #ktPageTitle class=\"page-title d-flex\"></app-page-title>\r\n    </ng-container> -->\r\n    <lib-navbar class=\"app-navbar flex-shrink-0\" [appHeaderDefaulMenuDisplay]=\"appHeaderDefaulMenuDisplay\"\r\n      [isRtl]=\"false\"></lib-navbar>\r\n  </div>\r\n  <!--end::Header wrapper-->\r\n</div>\r\n<!--end::Header container-->\r\n", styles: [".header-style{background-color:#fff}\n"] }]
+        }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }] });
+
+// import { DrawerComponent } from '../../../kt/components';
+class ContentComponent {
+    router;
+    contentContainerCSSClass = '';
+    appContentContiner;
+    appContentContainerClass = '';
+    unsubscribe = [];
+    constructor(router) {
+        this.router = router;
+    }
+    ngOnInit() {
+        this.routingChanges();
+    }
+    routingChanges() {
+        const routerSubscription = this.router.events.subscribe((event) => {
+            if (event instanceof NavigationEnd || event instanceof NavigationCancel) {
+                // DrawerComponent.hideAll();
+            }
+        });
+        this.unsubscribe.push(routerSubscription);
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ContentComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ContentComponent, selector: "lib-content", inputs: { contentContainerCSSClass: "contentContainerCSSClass", appContentContiner: "appContentContiner", appContentContainerClass: "appContentContainerClass" }, ngImport: i0, template: "<ng-container *ngIf=\"appContentContiner\">\r\n  <!--begin::Content container-->\r\n  <div id=\"kt_app_content_container\" class=\"app-container\"\r\n    [ngClass]=\"appContentContainerClass + ' ' + contentContainerCSSClass\"\r\n    [ngClass]=\"{'container-xxl': appContentContiner === 'fixed', 'container-fluid': appContentContiner === 'fluid'}\">\r\n    <router-outlet></router-outlet>\r\n  </div>\r\n  <!--end::Content container-->\r\n</ng-container>\r\n<ng-container *ngIf=\"!appContentContiner\">\r\n  <router-outlet></router-outlet>\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ContentComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-content', template: "<ng-container *ngIf=\"appContentContiner\">\r\n  <!--begin::Content container-->\r\n  <div id=\"kt_app_content_container\" class=\"app-container\"\r\n    [ngClass]=\"appContentContainerClass + ' ' + contentContainerCSSClass\"\r\n    [ngClass]=\"{'container-xxl': appContentContiner === 'fixed', 'container-fluid': appContentContiner === 'fluid'}\">\r\n    <router-outlet></router-outlet>\r\n  </div>\r\n  <!--end::Content container-->\r\n</ng-container>\r\n<ng-container *ngIf=\"!appContentContiner\">\r\n  <router-outlet></router-outlet>\r\n</ng-container>\r\n" }]
+        }], ctorParameters: () => [{ type: i1$1.Router }], propDecorators: { contentContainerCSSClass: [{
+                type: Input
+            }], appContentContiner: [{
+                type: Input
+            }], appContentContainerClass: [{
+                type: Input
+            }] } });
+
+class ScriptsInitComponent {
+    layout;
+    pageInfo;
+    router;
+    titleService;
+    unsubscribe = [];
+    constructor(layout, pageInfo, router, titleService) {
+        this.layout = layout;
+        this.pageInfo = pageInfo;
+        this.router = router;
+        this.titleService = titleService;
+        const initPageInfo = () => {
+            setTimeout(() => {
+                // this.pageInfo.calculateTitle();
+                // this.pageInfo.calculateBreadcrumbs();
+                this.pageInfo.title.asObservable().subscribe((title) => {
+                    this.titleService.setTitle(title + ' - TangoEye');
+                });
+            }, 10);
+        };
+        initPageInfo();
+        // subscribe to router events
+        this.router.events
+            .pipe(filter((event) => event instanceof ResolveEnd))
+            .subscribe(initPageInfo);
+    }
+    ngOnInit() {
+        this.pluginsInitialization();
+        const layoutUpdateSubscription = this.layout.layoutConfigSubject
+            .asObservable()
+            .subscribe(() => {
+            this.pluginsReInitialization();
+        });
+        this.unsubscribe.push(layoutUpdateSubscription);
+    }
+    pluginsInitialization() {
+        setTimeout(() => {
+            ToggleComponent.bootstrap();
+            ScrollTopComponent.bootstrap();
+            DrawerComponent.bootstrap();
+            StickyComponent.bootstrap();
+            MenuComponent$1.bootstrap();
+            ScrollComponent.bootstrap();
+        }, 200);
+    }
+    pluginsReInitialization() {
+        setTimeout(() => {
+            ToggleComponent.reinitialization();
+            ScrollTopComponent.reinitialization();
+            DrawerComponent.reinitialization();
+            StickyComponent.bootstrap();
+            MenuComponent$1.reinitialization();
+            ScrollComponent.reinitialization();
+        }, 100);
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ScriptsInitComponent, deps: [{ token: i1$2.LayoutService }, { token: i1$2.PageInfoService }, { token: i1$1.Router }, { token: i3.Title }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ScriptsInitComponent, selector: "lib-scripts-init", ngImport: i0, template: "" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ScriptsInitComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-scripts-init', template: "" }]
+        }], ctorParameters: () => [{ type: i1$2.LayoutService }, { type: i1$2.PageInfoService }, { type: i1$1.Router }, { type: i3.Title }] });
+
+class PageTitleComponent {
+    pageInfo;
+    cd;
+    unsubscribe = [];
+    appPageTitleDirection = '';
+    appPageTitleBreadcrumb;
+    appPageTitleDescription;
+    title$;
+    description$;
+    bc$;
+    constructor(pageInfo, cd) {
+        this.pageInfo = pageInfo;
+        this.cd = cd;
+    }
+    ngOnInit() {
+        this.title$ = this.pageInfo.title.asObservable();
+        this.description$ = this.pageInfo.description.asObservable();
+        this.bc$ = this.pageInfo.breadcrumbs.asObservable();
+        this.title$.subscribe((e) => {
+            this.cd.detectChanges();
+        });
+        this.description$.subscribe((e) => {
+            this.cd.detectChanges();
+        });
+        this.bc$.subscribe((e) => {
+            this.cd.detectChanges();
+        });
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PageTitleComponent, deps: [{ token: i1.PageInfoService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: PageTitleComponent, selector: "lib-page-title", inputs: { appPageTitleDirection: "appPageTitleDirection", appPageTitleBreadcrumb: "appPageTitleBreadcrumb", appPageTitleDescription: "appPageTitleDescription" }, ngImport: i0, template: "<ng-container *ngIf=\"title$ | async as title\">\r\n\r\n  <ng-container *ngIf=\"appPageTitleBreadcrumb\">\r\n    <ng-container *ngIf=\"bc$ | async as _bc\">\r\n      <!-- <ng-container *ngIf=\"_bc.length > 0\"> -->\r\n        <ng-container *ngIf=\"appPageTitleDirection === 'row'\">\r\n          <span class=\"h-20px border-gray-300 border-start mx-4\"></span>\r\n        </ng-container>\r\n        <!--begin::Breadcrumb-->\r\n\r\n        <ul class=\"breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0\"\r\n          [ngClass]=\"{'pt-1': appPageTitleDirection === 'column'}\">\r\n          <li *ngFor=\"let bc of _bc\" class=\"breadcrumb-item\"\r\n            [ngClass]=\"!bc.isSeparator && bc.isActive ? 'text-gray-900' : ''\"\r\n            [ngClass]=\"!bc.isSeparator && !bc.isActive ? 'text-muted' : ''\">\r\n            <ng-container *ngIf=\"!bc.isSeparator\">\r\n              <a class=\"inactive-bc text-hover-primary\" [routerLink]=\"bc.path\">\r\n                {{ bc.title }}\r\n              </a>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"bc.isSeparator\">\r\n              <img src=\"/assets/tango/layout/bc-seperator.svg\" alt=\"\">\r\n            </ng-container>\r\n          </li>\r\n          <li class=\"breadcrumb-item active-bc\">{{ title }}</li>\r\n        </ul>\r\n        <!--end::Breadcrumb-->\r\n\r\n      <!-- </ng-container> -->\r\n    </ng-container>\r\n  </ng-container>\r\n</ng-container>\r\n", styles: [".active-bc{color:#00a3ff}.inactive-bc{color:#98a2b3}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PageTitleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-page-title', template: "<ng-container *ngIf=\"title$ | async as title\">\r\n\r\n  <ng-container *ngIf=\"appPageTitleBreadcrumb\">\r\n    <ng-container *ngIf=\"bc$ | async as _bc\">\r\n      <!-- <ng-container *ngIf=\"_bc.length > 0\"> -->\r\n        <ng-container *ngIf=\"appPageTitleDirection === 'row'\">\r\n          <span class=\"h-20px border-gray-300 border-start mx-4\"></span>\r\n        </ng-container>\r\n        <!--begin::Breadcrumb-->\r\n\r\n        <ul class=\"breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0\"\r\n          [ngClass]=\"{'pt-1': appPageTitleDirection === 'column'}\">\r\n          <li *ngFor=\"let bc of _bc\" class=\"breadcrumb-item\"\r\n            [ngClass]=\"!bc.isSeparator && bc.isActive ? 'text-gray-900' : ''\"\r\n            [ngClass]=\"!bc.isSeparator && !bc.isActive ? 'text-muted' : ''\">\r\n            <ng-container *ngIf=\"!bc.isSeparator\">\r\n              <a class=\"inactive-bc text-hover-primary\" [routerLink]=\"bc.path\">\r\n                {{ bc.title }}\r\n              </a>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"bc.isSeparator\">\r\n              <img src=\"/assets/tango/layout/bc-seperator.svg\" alt=\"\">\r\n            </ng-container>\r\n          </li>\r\n          <li class=\"breadcrumb-item active-bc\">{{ title }}</li>\r\n        </ul>\r\n        <!--end::Breadcrumb-->\r\n\r\n      <!-- </ng-container> -->\r\n    </ng-container>\r\n  </ng-container>\r\n</ng-container>\r\n", styles: [".active-bc{color:#00a3ff}.inactive-bc{color:#98a2b3}\n"] }]
+        }], ctorParameters: () => [{ type: i1.PageInfoService }, { type: i0.ChangeDetectorRef }], propDecorators: { appPageTitleDirection: [{
+                type: Input
+            }], appPageTitleBreadcrumb: [{
+                type: Input
+            }], appPageTitleDescription: [{
+                type: Input
+            }] } });
+
+class AccountingComponent {
+    constructor() { }
+    ngOnInit() {
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AccountingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: AccountingComponent, selector: "lib-accounting", ngImport: i0, template: "<!--begin::Input group-->\r\n<div class=\"d-flex align-items-center flex-shrink-0\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 text-gray-700 fw-bold pe-3 d-none d-md-block\">Actions:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Actions-->\r\n  <div class=\"d-flex flex-shrink-0\">\r\n    <!--begin::Button-->\r\n    <div data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" data-bs-trigger=\"hover\" title=\"Add a team member\">\r\n      <a href=\"#\" class=\"btn btn-sm btn-icon btn-active-color-success\">\r\n        <lib-keenicon name=\"plus-square\" class=\"fs-2x\"></lib-keenicon>\r\n      </a>\r\n    </div>\r\n    <!--end::Button-->\r\n\r\n    <!--begin::Button-->\r\n    <div data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" data-bs-trigger=\"hover\" title=\"Create new account\">\r\n      <a href=\"#\" class=\"btn btn-sm btn-icon btn-active-color-success\">\r\n        <lib-keenicon name=\"gen037.svg\" class=\"fs-2x\"></lib-keenicon>\r\n      </a>\r\n    </div>\r\n    <!--end::Button-->\r\n\r\n    <!--begin::Button-->\r\n    <div data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" data-bs-trigger=\"hover\" title=\"Invite friends\">\r\n      <a href=\"#\" class=\"btn btn-sm btn-icon btn-active-color-success\">\r\n        <lib-keenicon name=\"dots-square\" class=\"fs-2x\"></lib-keenicon>\r\n      </a>\r\n    </div>\r\n    <!--end::Button-->\r\n  </div>\r\n  <!--end::Actions-->\r\n</div>\r\n<!--end::Input group-->\r\n\r\n<!--begin::Input group-->\r\n<div class=\"d-flex align-items-center flex-shrink-0\">\r\n  <!--begin::Desktop separartor-->\r\n  <div class=\"bullet bg-secondary h-35px w-1px mx-5\"></div>\r\n  <!--end::Desktop separartor-->\r\n\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 text-gray-700 fw-bold pe-4 ps-1 d-none d-md-block\">Progress:</span>\r\n  <!--end::Label-->\r\n\r\n  <div class=\"progress w-100px w-xl-150px w-xxl-300px h-25px bg-light-success\">\r\n    <div class=\"progress-bar rounded bg-success fs-7 fw-bold\" role=\"progressbar\" style=\"width: 72%;\" aria-valuenow=\"72\"\r\n      aria-valuemin=\"0\" aria-valuemax=\"100\">72%</div>\r\n  </div>\r\n</div>\r\n<!--end::Input group-->\r\n<!--end::Toolbar start-->\r\n\r\n<!--begin::Toolbar end-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Input group-->\r\n  <div class=\"me-3\">\r\n    <!--begin::Select-->\r\n    <select class=\"form-select form-select-sm form-select-solid\" data-control=\"select2\" data-placeholder=\"Latest\"\r\n      data-hide-search=\"true\">\r\n      <option value=\"\"></option>\r\n      <option value=\"1\" selected>Today 16 Feb</option>\r\n      <option value=\"2\">In Progress</option>\r\n      <option value=\"3\">Done</option>\r\n    </select>\r\n    <!--end::Select-->\r\n  </div>\r\n  <!--end::Input group--->\r\n\r\n  <!--begin::Input group--->\r\n  <div class=\"m-0\">\r\n    <!--begin::Select-->\r\n    <select class=\"form-select form-select-sm form-select-solid w-md-125px\" data-control=\"select2\"\r\n      data-placeholder=\"Filters\" data-hide-search=\"true\">\r\n      <option value=\"\"></option>\r\n      <option value=\"1\" selected>Filters</option>\r\n      <option value=\"2\">In Progress</option>\r\n      <option value=\"3\">Done</option>\r\n    </select>\r\n    <!--end::Content-->\r\n  </div>\r\n  <!--end::Input group--->\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AccountingComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-accounting', template: "<!--begin::Input group-->\r\n<div class=\"d-flex align-items-center flex-shrink-0\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 text-gray-700 fw-bold pe-3 d-none d-md-block\">Actions:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Actions-->\r\n  <div class=\"d-flex flex-shrink-0\">\r\n    <!--begin::Button-->\r\n    <div data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" data-bs-trigger=\"hover\" title=\"Add a team member\">\r\n      <a href=\"#\" class=\"btn btn-sm btn-icon btn-active-color-success\">\r\n        <lib-keenicon name=\"plus-square\" class=\"fs-2x\"></lib-keenicon>\r\n      </a>\r\n    </div>\r\n    <!--end::Button-->\r\n\r\n    <!--begin::Button-->\r\n    <div data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" data-bs-trigger=\"hover\" title=\"Create new account\">\r\n      <a href=\"#\" class=\"btn btn-sm btn-icon btn-active-color-success\">\r\n        <lib-keenicon name=\"gen037.svg\" class=\"fs-2x\"></lib-keenicon>\r\n      </a>\r\n    </div>\r\n    <!--end::Button-->\r\n\r\n    <!--begin::Button-->\r\n    <div data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" data-bs-trigger=\"hover\" title=\"Invite friends\">\r\n      <a href=\"#\" class=\"btn btn-sm btn-icon btn-active-color-success\">\r\n        <lib-keenicon name=\"dots-square\" class=\"fs-2x\"></lib-keenicon>\r\n      </a>\r\n    </div>\r\n    <!--end::Button-->\r\n  </div>\r\n  <!--end::Actions-->\r\n</div>\r\n<!--end::Input group-->\r\n\r\n<!--begin::Input group-->\r\n<div class=\"d-flex align-items-center flex-shrink-0\">\r\n  <!--begin::Desktop separartor-->\r\n  <div class=\"bullet bg-secondary h-35px w-1px mx-5\"></div>\r\n  <!--end::Desktop separartor-->\r\n\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 text-gray-700 fw-bold pe-4 ps-1 d-none d-md-block\">Progress:</span>\r\n  <!--end::Label-->\r\n\r\n  <div class=\"progress w-100px w-xl-150px w-xxl-300px h-25px bg-light-success\">\r\n    <div class=\"progress-bar rounded bg-success fs-7 fw-bold\" role=\"progressbar\" style=\"width: 72%;\" aria-valuenow=\"72\"\r\n      aria-valuemin=\"0\" aria-valuemax=\"100\">72%</div>\r\n  </div>\r\n</div>\r\n<!--end::Input group-->\r\n<!--end::Toolbar start-->\r\n\r\n<!--begin::Toolbar end-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Input group-->\r\n  <div class=\"me-3\">\r\n    <!--begin::Select-->\r\n    <select class=\"form-select form-select-sm form-select-solid\" data-control=\"select2\" data-placeholder=\"Latest\"\r\n      data-hide-search=\"true\">\r\n      <option value=\"\"></option>\r\n      <option value=\"1\" selected>Today 16 Feb</option>\r\n      <option value=\"2\">In Progress</option>\r\n      <option value=\"3\">Done</option>\r\n    </select>\r\n    <!--end::Select-->\r\n  </div>\r\n  <!--end::Input group--->\r\n\r\n  <!--begin::Input group--->\r\n  <div class=\"m-0\">\r\n    <!--begin::Select-->\r\n    <select class=\"form-select form-select-sm form-select-solid w-md-125px\" data-control=\"select2\"\r\n      data-placeholder=\"Filters\" data-hide-search=\"true\">\r\n      <option value=\"\"></option>\r\n      <option value=\"1\" selected>Filters</option>\r\n      <option value=\"2\">In Progress</option>\r\n      <option value=\"3\">Done</option>\r\n    </select>\r\n    <!--end::Content-->\r\n  </div>\r\n  <!--end::Input group--->\r\n</div>\r\n" }]
+        }], ctorParameters: () => [] });
+
+class ClassicComponent {
+    layout;
+    unsubscribe = [];
+    appToolbarPrimaryButton;
+    appToolbarPrimaryButtonLabel = '';
+    appToolbarPrimaryButtonUrl = '';
+    appToolbarPrimaryButtonModal = '';
+    appToolbarSecondaryButton;
+    appToolbarFixedDesktop;
+    appToolbarSecondaryButtonLabel = '';
+    appToolbarSecondaryButtonUrl = '';
+    appToolbarSecondaryButtonModal = '';
+    appToolbarFilterButton;
+    appToolbarDaterangepickerButton;
+    secondaryButtonClass = '';
+    filterButtonClass = '';
+    daterangepickerButtonClass = '';
+    constructor(layout) {
+        this.layout = layout;
+    }
+    ngOnInit() {
+        this.updateProps();
+        const subscr = this.layout.layoutConfigSubject
+            .asObservable()
+            .subscribe(() => {
+            this.updateProps();
+        });
+        this.unsubscribe.push(subscr);
+    }
+    updateProps() {
+        this.appToolbarPrimaryButton = this.layout.getProp('app.toolbar.primaryButton');
+        this.appToolbarPrimaryButtonLabel = this.layout.getProp('app.toolbar.primaryButtonLabel');
+        this.appToolbarPrimaryButtonUrl = this.layout.getProp('app.toolbar.primaryButtonUrl');
+        this.appToolbarPrimaryButtonModal = this.layout.getProp('app.toolbar.primaryButtonModal');
+        this.appToolbarSecondaryButton = this.layout.getProp('app.toolbar.secondaryButton');
+        this.secondaryButtonClass = this.appToolbarFixedDesktop
+            ? 'btn-light'
+            : 'bg-body btn-color-gray-700 btn-active-color-primary';
+        this.appToolbarFixedDesktop = this.layout.getProp('appToolbarFixedDesktop');
+        this.appToolbarSecondaryButtonLabel = this.layout.getProp('appToolbarSecondaryButtonLabel');
+        this.appToolbarSecondaryButtonUrl = this.layout.getProp('appToolbarSecondaryButtonUrl');
+        this.appToolbarSecondaryButtonModal = this.layout.getProp('appToolbarSecondaryButtonModal');
+        this.appToolbarFilterButton = this.layout.getProp('appToolbarFilterButton');
+        this.appToolbarDaterangepickerButton = this.layout.getProp('appToolbarDaterangepickerButton');
+        this.filterButtonClass = this.appToolbarFixedDesktop
+            ? 'btn-light'
+            : 'bg-body btn-color-gray-600 btn-active-color-primary';
+        this.daterangepickerButtonClass = this.appToolbarFixedDesktop
+            ? 'btn-light'
+            : 'bg-body btn-color-gray-700 btn-active-color-primary';
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ClassicComponent, deps: [{ token: i1.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ClassicComponent, selector: "lib-classic", ngImport: i0, template: "<ng-container *ngIf=\"appToolbarFilterButton\">\r\n  <!--begin::Filter menu-->\r\n  <div class=\"m-0\">\r\n    <!--begin::Menu toggle-->\r\n    <a href=\"#\" class=\"btn btn-sm btn-flex fw-bold\" [ngClass]=\"daterangepickerButtonClass\" data-kt-menu-trigger=\"click\"\r\n      data-kt-menu-placement=\"bottom-end\">\r\n      <lib-keenicon name=\"filter\" class=\"fs-6 text-muted me-1\"></lib-keenicon>\r\n      Filter\r\n    </a>\r\n    <!--end::Menu toggle-->\r\n\r\n    <!-- <lib-dropdown-menu1></lib-dropdown-menu1> -->\r\n  </div>\r\n  <!--end::Filter menu-->\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"appToolbarDaterangepickerButton\">\r\n  <div data-kt-daterangepicker=\"true\" data-kt-daterangepicker-opens=\"left\"\r\n    class=\"btn btn-sm fw-bold  d-flex align-items-center px-4\" [ngClass]=\"daterangepickerButtonClass\">\r\n    <!--begin::Display range-->\r\n    <div class=\"text-gray-600 fw-bold\">\r\n      Loading date range...\r\n    </div>\r\n    <!--end::Display range-->\r\n    <lib-keenicon name=\"calendar-8\" class=\"fs-1 ms-2 me-0\"></lib-keenicon>\r\n  </div>\r\n</ng-container>\r\n\r\n<!--begin::Secondary button-->\r\n<a href=\"javascript:;\" class=\"btn btn-sm btn-flex btn-light fw-bold\">\r\n  Filter\r\n</a>\r\n<!--end::Secondary button-->\r\n\r\n<!--begin::Primary button--> \r\n<a href=\"javascript:;\" class=\"btn btn-sm fw-bold btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#kt_modal_create_app\">Create</a>\r\n<!--end::Primary button-->\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ClassicComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-classic', template: "<ng-container *ngIf=\"appToolbarFilterButton\">\r\n  <!--begin::Filter menu-->\r\n  <div class=\"m-0\">\r\n    <!--begin::Menu toggle-->\r\n    <a href=\"#\" class=\"btn btn-sm btn-flex fw-bold\" [ngClass]=\"daterangepickerButtonClass\" data-kt-menu-trigger=\"click\"\r\n      data-kt-menu-placement=\"bottom-end\">\r\n      <lib-keenicon name=\"filter\" class=\"fs-6 text-muted me-1\"></lib-keenicon>\r\n      Filter\r\n    </a>\r\n    <!--end::Menu toggle-->\r\n\r\n    <!-- <lib-dropdown-menu1></lib-dropdown-menu1> -->\r\n  </div>\r\n  <!--end::Filter menu-->\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"appToolbarDaterangepickerButton\">\r\n  <div data-kt-daterangepicker=\"true\" data-kt-daterangepicker-opens=\"left\"\r\n    class=\"btn btn-sm fw-bold  d-flex align-items-center px-4\" [ngClass]=\"daterangepickerButtonClass\">\r\n    <!--begin::Display range-->\r\n    <div class=\"text-gray-600 fw-bold\">\r\n      Loading date range...\r\n    </div>\r\n    <!--end::Display range-->\r\n    <lib-keenicon name=\"calendar-8\" class=\"fs-1 ms-2 me-0\"></lib-keenicon>\r\n  </div>\r\n</ng-container>\r\n\r\n<!--begin::Secondary button-->\r\n<a href=\"javascript:;\" class=\"btn btn-sm btn-flex btn-light fw-bold\">\r\n  Filter\r\n</a>\r\n<!--end::Secondary button-->\r\n\r\n<!--begin::Primary button--> \r\n<a href=\"javascript:;\" class=\"btn btn-sm fw-bold btn-primary\" data-bs-toggle=\"modal\" data-bs-target=\"#kt_modal_create_app\">Create</a>\r\n<!--end::Primary button-->\r\n" }]
+        }], ctorParameters: () => [{ type: i1.LayoutService }] });
+
+class ExtendedComponent {
+    constructor() { }
+    ngOnInit() { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ExtendedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ExtendedComponent, selector: "lib-extended", ngImport: i0, template: "<!--begin::Label-->\r\n<span class=\"fs-7 fw-bold text-gray-700 pe-4 d-none d-md-block\">Team:</span>\r\n<!--end::Label-->\r\n\r\n<!--begin::Users-->\r\n<div class=\"symbol-group symbol-hover flex-shrink-0 me-2\">\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <div class=\"symbol-label fw-bold bg-warning text-inverse-warning\">A</div>\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <img src=\"./assets/media/avatars/300-1.jpg\" alt=\"\" />\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <img src=\"./assets/media/avatars/300-2.jpg\" alt=\"\" />\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <div class=\"symbol-label fw-bold bg-primary text-inverse-primary\">S</div>\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <img src=\"./assets/media/avatars/300-5.jpg\" alt=\"\" />\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <div class=\"symbol-label fw-bold bg-danger text-inverse-danger\">P</div>\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <img src=\"./assets/media/avatars/300-20.jpg\" alt=\"\" />\r\n  </div>\r\n  <!--end::User-->\r\n</div>\r\n<!--end::Users-->\r\n\r\n<!--begin::Button-->\r\n<div data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" data-bs-trigger=\"hover\" title=\"Invite a team member\">\r\n  <a href=\"#\" class=\"btn btn-sm btn-icon\">\r\n    <lib-keenicon name=\"plus-square\" class=\"fs-2hx text-success\"></lib-keenicon>\r\n  </a>\r\n</div>\r\n<!--end::Button-->\r\n<!--end::Toolbar start-->\r\n\r\n<!--begin::Toolbar end-->\r\n<div class=\"d-flex align-items-center overflow-auto\">\r\n  <!--begin::Search-->\r\n  <div class=\"position-relative my-1\">\r\n    <lib-keenicon name=\"magnifier\" class=\"fs-3 text-gray500 position-absolute top-50 translate-middle ps-10\"></lib-keenicon>\r\n    <input type=\"text\" class=\"form-control form-control-sm form-control-solid w-150px ps-10\" name=\"Search Team\" value=\"\"\r\n      placeholder=\"Search Team\" />\r\n  </div>\r\n  <!--end::Search-->\r\n\r\n  <!--begin::Separartor-->\r\n  <div class=\"bullet bg-secondary h-35px w-1px mx-6\"></div>\r\n  <!--end::Separartor-->\r\n\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 fw-bold text-gray-700 flex-shrink-0 pe-4 d-none d-md-block\">Sort By:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Select-->\r\n  <select class=\"form-select form-select-sm w-125px form-select-solid me-6\" data-control=\"select2\"\r\n    data-placeholder=\"Latest\" data-hide-search=\"true\">\r\n    <option value=\"\"></option>\r\n    <option value=\"1\" selected>Latest</option>\r\n    <option value=\"2\">In Progress</option>\r\n    <option value=\"3\">Done</option>\r\n  </select>\r\n  <!--end::Select-->\r\n\r\n  <!--begin::Actions-->\r\n  <div class=\"d-flex align-items-center\">\r\n    <button type=\"button\" class=\"btn btn-sm btn-icon btn-light-primary me-3\" data-bs-toggle=\"tooltip\"\r\n      data-bs-placement=\"top\" title=\"Enable grid view\">\r\n      <lib-keenicon name=\"element-11\" class=\"fs-3 text-primary\"></lib-keenicon>\r\n    </button>\r\n\r\n    <button type=\"button\" class=\"btn btn-sm btn-icon btn-light\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\r\n      title=\"Enable row view\">\r\n      <lib-keenicon name=\"row-horizontal\" class=\"fs-3 text-gray400\"></lib-keenicon>\r\n    </button>\r\n  </div>\r\n  <!--end::Actions-->\r\n", styles: [""], dependencies: [{ kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ExtendedComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-extended', template: "<!--begin::Label-->\r\n<span class=\"fs-7 fw-bold text-gray-700 pe-4 d-none d-md-block\">Team:</span>\r\n<!--end::Label-->\r\n\r\n<!--begin::Users-->\r\n<div class=\"symbol-group symbol-hover flex-shrink-0 me-2\">\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <div class=\"symbol-label fw-bold bg-warning text-inverse-warning\">A</div>\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <img src=\"./assets/media/avatars/300-1.jpg\" alt=\"\" />\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <img src=\"./assets/media/avatars/300-2.jpg\" alt=\"\" />\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <div class=\"symbol-label fw-bold bg-primary text-inverse-primary\">S</div>\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <img src=\"./assets/media/avatars/300-5.jpg\" alt=\"\" />\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <div class=\"symbol-label fw-bold bg-danger text-inverse-danger\">P</div>\r\n  </div>\r\n  <!--end::User-->\r\n\r\n  <!--begin::User-->\r\n  <div class=\"symbol symbol-circle symbol-35px\">\r\n    <img src=\"./assets/media/avatars/300-20.jpg\" alt=\"\" />\r\n  </div>\r\n  <!--end::User-->\r\n</div>\r\n<!--end::Users-->\r\n\r\n<!--begin::Button-->\r\n<div data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" data-bs-trigger=\"hover\" title=\"Invite a team member\">\r\n  <a href=\"#\" class=\"btn btn-sm btn-icon\">\r\n    <lib-keenicon name=\"plus-square\" class=\"fs-2hx text-success\"></lib-keenicon>\r\n  </a>\r\n</div>\r\n<!--end::Button-->\r\n<!--end::Toolbar start-->\r\n\r\n<!--begin::Toolbar end-->\r\n<div class=\"d-flex align-items-center overflow-auto\">\r\n  <!--begin::Search-->\r\n  <div class=\"position-relative my-1\">\r\n    <lib-keenicon name=\"magnifier\" class=\"fs-3 text-gray500 position-absolute top-50 translate-middle ps-10\"></lib-keenicon>\r\n    <input type=\"text\" class=\"form-control form-control-sm form-control-solid w-150px ps-10\" name=\"Search Team\" value=\"\"\r\n      placeholder=\"Search Team\" />\r\n  </div>\r\n  <!--end::Search-->\r\n\r\n  <!--begin::Separartor-->\r\n  <div class=\"bullet bg-secondary h-35px w-1px mx-6\"></div>\r\n  <!--end::Separartor-->\r\n\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 fw-bold text-gray-700 flex-shrink-0 pe-4 d-none d-md-block\">Sort By:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Select-->\r\n  <select class=\"form-select form-select-sm w-125px form-select-solid me-6\" data-control=\"select2\"\r\n    data-placeholder=\"Latest\" data-hide-search=\"true\">\r\n    <option value=\"\"></option>\r\n    <option value=\"1\" selected>Latest</option>\r\n    <option value=\"2\">In Progress</option>\r\n    <option value=\"3\">Done</option>\r\n  </select>\r\n  <!--end::Select-->\r\n\r\n  <!--begin::Actions-->\r\n  <div class=\"d-flex align-items-center\">\r\n    <button type=\"button\" class=\"btn btn-sm btn-icon btn-light-primary me-3\" data-bs-toggle=\"tooltip\"\r\n      data-bs-placement=\"top\" title=\"Enable grid view\">\r\n      <lib-keenicon name=\"element-11\" class=\"fs-3 text-primary\"></lib-keenicon>\r\n    </button>\r\n\r\n    <button type=\"button\" class=\"btn btn-sm btn-icon btn-light\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\r\n      title=\"Enable row view\">\r\n      <lib-keenicon name=\"row-horizontal\" class=\"fs-3 text-gray400\"></lib-keenicon>\r\n    </button>\r\n  </div>\r\n  <!--end::Actions-->\r\n" }]
+        }], ctorParameters: () => [] });
+
+class ReportsComponent {
+    appPageTitleDisplay;
+    constructor() { }
+    ngOnInit() { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ReportsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ReportsComponent, selector: "lib-reports", inputs: { appPageTitleDisplay: "appPageTitleDisplay" }, ngImport: i0, template: "<!--begin::Wrapper-->\r\n<div class=\"d-flex align-items-center flex-shrink-0\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 fw-bold text-gray-700 flex-shrink-0 pe-4 d-none d-md-block\">Filter By:</span>\r\n  <!--end::Label-->\r\n\r\n  <div class=\"flex-shrink-0 \">\r\n    <ul class=\"nav\">\r\n      <li class=\"nav-item\">\r\n        <a class=\"nav-link btn btn-sm btn-color-muted btn-active-color-primary btn-active-light active fw-semibold fs-7 px-4 me-1\"\r\n          data-bs-toggle=\"tab\" href=\"#\">Today</a>\r\n      </li>\r\n\r\n      <li class=\"nav-item\">\r\n        <a class=\"nav-link btn btn-sm btn-color-muted btn-active-color-primary btn-active-light fw-semibold fs-7 px-4 me-1\"\r\n          data-bs-toggle=\"tab\" href=\"\">Week</a>\r\n      </li>\r\n\r\n      <li class=\"nav-item\">\r\n        <a class=\"nav-link btn btn-sm btn-color-muted btn-active-color-primary btn-active-light fw-semibold fs-7 px-4\"\r\n          data-bs-toggle=\"tab\" href=\"#\">Day</a>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n<!--end::Wrapper-->\r\n\r\n<!--begin::Separartor-->\r\n<div class=\"bullet bg-secondary h-35px w-1px mx-5\"></div>\r\n<!--end::Separartor-->\r\n\r\n<!--begin::Wrapper-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 fw-bold text-gray-700 flex-shrink-0 pe-4 d-none d-md-block\">Sort By:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Select-->\r\n  <select class=\"form-select form-select-sm w-md-125px form-select-solid\" data-control=\"select2\"\r\n    data-placeholder=\"Latest\" data-hide-search=\"true\">\r\n    <option value=\"\"></option>\r\n    <option value=\"1\" selected>Latest</option>\r\n    <option value=\"2\">In Progress</option>\r\n    <option value=\"3\">Done</option>\r\n  </select>\r\n  <!--end::Select-->\r\n\r\n  <!--begin::Actions-->\r\n  <div class=\"d-flex align-items-center ms-3\">\r\n    <button type=\"button\" class=\"btn btn-sm btn-icon btn-light-primary me-3\" data-bs-toggle=\"tooltip\"\r\n      data-bs-placement=\"top\" title=\"Enable grid view\">\r\n      <lib-keenicon name=\"element-11\" class=\"fs-2 text-primary\"></lib-keenicon>\r\n    </button>\r\n\r\n    <button type=\"button\" class=\"btn btn-sm btn-icon btn-light\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\r\n      title=\"Enable row view\">\r\n      <lib-keenicon name=\"abstract-14\" class=\"fs-2 text-gray400\"></lib-keenicon>\r\n    </button>\r\n  </div>\r\n  <!--end::Actions-->\r\n</div>\r\n<!--end::Wrapper-->\r\n", styles: [""], dependencies: [{ kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ReportsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-reports', template: "<!--begin::Wrapper-->\r\n<div class=\"d-flex align-items-center flex-shrink-0\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 fw-bold text-gray-700 flex-shrink-0 pe-4 d-none d-md-block\">Filter By:</span>\r\n  <!--end::Label-->\r\n\r\n  <div class=\"flex-shrink-0 \">\r\n    <ul class=\"nav\">\r\n      <li class=\"nav-item\">\r\n        <a class=\"nav-link btn btn-sm btn-color-muted btn-active-color-primary btn-active-light active fw-semibold fs-7 px-4 me-1\"\r\n          data-bs-toggle=\"tab\" href=\"#\">Today</a>\r\n      </li>\r\n\r\n      <li class=\"nav-item\">\r\n        <a class=\"nav-link btn btn-sm btn-color-muted btn-active-color-primary btn-active-light fw-semibold fs-7 px-4 me-1\"\r\n          data-bs-toggle=\"tab\" href=\"\">Week</a>\r\n      </li>\r\n\r\n      <li class=\"nav-item\">\r\n        <a class=\"nav-link btn btn-sm btn-color-muted btn-active-color-primary btn-active-light fw-semibold fs-7 px-4\"\r\n          data-bs-toggle=\"tab\" href=\"#\">Day</a>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n<!--end::Wrapper-->\r\n\r\n<!--begin::Separartor-->\r\n<div class=\"bullet bg-secondary h-35px w-1px mx-5\"></div>\r\n<!--end::Separartor-->\r\n\r\n<!--begin::Wrapper-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 fw-bold text-gray-700 flex-shrink-0 pe-4 d-none d-md-block\">Sort By:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Select-->\r\n  <select class=\"form-select form-select-sm w-md-125px form-select-solid\" data-control=\"select2\"\r\n    data-placeholder=\"Latest\" data-hide-search=\"true\">\r\n    <option value=\"\"></option>\r\n    <option value=\"1\" selected>Latest</option>\r\n    <option value=\"2\">In Progress</option>\r\n    <option value=\"3\">Done</option>\r\n  </select>\r\n  <!--end::Select-->\r\n\r\n  <!--begin::Actions-->\r\n  <div class=\"d-flex align-items-center ms-3\">\r\n    <button type=\"button\" class=\"btn btn-sm btn-icon btn-light-primary me-3\" data-bs-toggle=\"tooltip\"\r\n      data-bs-placement=\"top\" title=\"Enable grid view\">\r\n      <lib-keenicon name=\"element-11\" class=\"fs-2 text-primary\"></lib-keenicon>\r\n    </button>\r\n\r\n    <button type=\"button\" class=\"btn btn-sm btn-icon btn-light\" data-bs-toggle=\"tooltip\" data-bs-placement=\"top\"\r\n      title=\"Enable row view\">\r\n      <lib-keenicon name=\"abstract-14\" class=\"fs-2 text-gray400\"></lib-keenicon>\r\n    </button>\r\n  </div>\r\n  <!--end::Actions-->\r\n</div>\r\n<!--end::Wrapper-->\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { appPageTitleDisplay: [{
+                type: Input
+            }] } });
+
+class SaasComponent {
+    appPageTitleDisplay;
+    constructor() { }
+    ngOnInit() { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SaasComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: SaasComponent, selector: "lib-saas", inputs: { appPageTitleDisplay: "appPageTitleDisplay" }, ngImport: i0, template: "<!--begin::Action wrapper-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 fw-bold text-gray-700 pe-4 text-nowrap d-none d-md-block\">Sort By:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Select-->\r\n  <select class=\"form-select form-select-sm form-select-solid w-100px w-xxl-125px\" data-control=\"select2\"\r\n    data-placeholder=\"Latest\" data-hide-search=\"true\">\r\n    <option value=\"\"></option>\r\n    <option value=\"1\" selected>Latest</option>\r\n    <option value=\"2\">In Progress</option>\r\n    <option value=\"3\">Done</option>\r\n  </select>\r\n  <!--end::Select-->\r\n</div>\r\n<!--end::Action wrapper-->\r\n\r\n<!--begin::Action wrapper-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Separartor-->\r\n  <div class=\"bullet bg-secondary h-35px w-1px mx-5\"></div>\r\n  <!--end::Separartor-->\r\n\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 text-gray-700 fw-bold\">Impact Level:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::NoUiSlider-->\r\n  <div class=\"d-flex align-items-center ps-4\">\r\n    <div id=\"kt_app_toolbar_slider\" class=\"noUi-target noUi-target-success w-75px w-xxl-150px noUi-sm\"></div>\r\n\r\n    <span id=\"kt_app_toolbar_slider_value\"\r\n      class=\"d-flex flex-center bg-light-success rounded-circle w-35px h-35px ms-4 fs-7 fw-bold text-success\"\r\n      data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Set impact level\">\r\n    </span>\r\n  </div>\r\n  <!--end::NoUiSlider-->\r\n\r\n  <!--begin::Separartor-->\r\n  <div class=\"bullet bg-secondary h-35px w-1px mx-5\"></div>\r\n  <!--end::Separartor-->\r\n</div>\r\n<!--end::Action wrapper-->\r\n\r\n<!--begin::Action wrapper-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 text-gray-700 fw-bold pe-3 d-none d-md-block\">Quick Tools:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Actions-->\r\n  <div class=\"d-flex\">\r\n    <!--begin::Action-->\r\n    <a href=\"#\" class=\"btn btn-sm btn-icon btn-icon-muted btn-active-icon-success\" data-bs-toggle=\"tooltip\"\r\n      data-bs-trigger=\"hover\" data-bs-placement=\"top\" title=\"Add new page\">\r\n      <lib-keenicon name=\"files\" class=\"fs-2x\"></lib-keenicon>\r\n    </a>\r\n    <!--end::Action-->\r\n\r\n    <!--begin::Action-->\r\n    <a href=\"#\" class=\"btn btn-sm btn-icon btn-icon-muted btn-active-icon-success\" data-bs-toggle=\"tooltip\"\r\n      data-bs-trigger=\"hover\" data-bs-placement=\"top\" title=\"Add new category\">\r\n      <lib-keenicon name=\"add-files\" class=\"fs-2x\"></lib-keenicon>\r\n    </a>\r\n    <!--end::Action-->\r\n\r\n    <!--begin::Action-->\r\n    <a href=\"#\" class=\"btn btn-sm btn-icon btn-icon-muted btn-active-icon-success\" data-bs-toggle=\"tooltip\"\r\n      data-bs-trigger=\"hover\" data-bs-placement=\"top\" title=\"Add new section\">\r\n      <lib-keenicon name=\"search-list\" class=\"fs-2x\"></lib-keenicon>\r\n    </a>\r\n    <!--end::Action-->\r\n  </div>\r\n  <!--end::Actions-->\r\n</div>\r\n<!--end::Action wrapper-->\r\n", styles: [""], dependencies: [{ kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SaasComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-saas', template: "<!--begin::Action wrapper-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 fw-bold text-gray-700 pe-4 text-nowrap d-none d-md-block\">Sort By:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Select-->\r\n  <select class=\"form-select form-select-sm form-select-solid w-100px w-xxl-125px\" data-control=\"select2\"\r\n    data-placeholder=\"Latest\" data-hide-search=\"true\">\r\n    <option value=\"\"></option>\r\n    <option value=\"1\" selected>Latest</option>\r\n    <option value=\"2\">In Progress</option>\r\n    <option value=\"3\">Done</option>\r\n  </select>\r\n  <!--end::Select-->\r\n</div>\r\n<!--end::Action wrapper-->\r\n\r\n<!--begin::Action wrapper-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Separartor-->\r\n  <div class=\"bullet bg-secondary h-35px w-1px mx-5\"></div>\r\n  <!--end::Separartor-->\r\n\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 text-gray-700 fw-bold\">Impact Level:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::NoUiSlider-->\r\n  <div class=\"d-flex align-items-center ps-4\">\r\n    <div id=\"kt_app_toolbar_slider\" class=\"noUi-target noUi-target-success w-75px w-xxl-150px noUi-sm\"></div>\r\n\r\n    <span id=\"kt_app_toolbar_slider_value\"\r\n      class=\"d-flex flex-center bg-light-success rounded-circle w-35px h-35px ms-4 fs-7 fw-bold text-success\"\r\n      data-bs-toggle=\"tooltip\" data-bs-placement=\"top\" title=\"Set impact level\">\r\n    </span>\r\n  </div>\r\n  <!--end::NoUiSlider-->\r\n\r\n  <!--begin::Separartor-->\r\n  <div class=\"bullet bg-secondary h-35px w-1px mx-5\"></div>\r\n  <!--end::Separartor-->\r\n</div>\r\n<!--end::Action wrapper-->\r\n\r\n<!--begin::Action wrapper-->\r\n<div class=\"d-flex align-items-center\">\r\n  <!--begin::Label-->\r\n  <span class=\"fs-7 text-gray-700 fw-bold pe-3 d-none d-md-block\">Quick Tools:</span>\r\n  <!--end::Label-->\r\n\r\n  <!--begin::Actions-->\r\n  <div class=\"d-flex\">\r\n    <!--begin::Action-->\r\n    <a href=\"#\" class=\"btn btn-sm btn-icon btn-icon-muted btn-active-icon-success\" data-bs-toggle=\"tooltip\"\r\n      data-bs-trigger=\"hover\" data-bs-placement=\"top\" title=\"Add new page\">\r\n      <lib-keenicon name=\"files\" class=\"fs-2x\"></lib-keenicon>\r\n    </a>\r\n    <!--end::Action-->\r\n\r\n    <!--begin::Action-->\r\n    <a href=\"#\" class=\"btn btn-sm btn-icon btn-icon-muted btn-active-icon-success\" data-bs-toggle=\"tooltip\"\r\n      data-bs-trigger=\"hover\" data-bs-placement=\"top\" title=\"Add new category\">\r\n      <lib-keenicon name=\"add-files\" class=\"fs-2x\"></lib-keenicon>\r\n    </a>\r\n    <!--end::Action-->\r\n\r\n    <!--begin::Action-->\r\n    <a href=\"#\" class=\"btn btn-sm btn-icon btn-icon-muted btn-active-icon-success\" data-bs-toggle=\"tooltip\"\r\n      data-bs-trigger=\"hover\" data-bs-placement=\"top\" title=\"Add new section\">\r\n      <lib-keenicon name=\"search-list\" class=\"fs-2x\"></lib-keenicon>\r\n    </a>\r\n    <!--end::Action-->\r\n  </div>\r\n  <!--end::Actions-->\r\n</div>\r\n<!--end::Action wrapper-->\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { appPageTitleDisplay: [{
+                type: Input
+            }] } });
+
+class ToolbarComponent {
+    layout;
+    unsubscribe = [];
+    // Public props
+    currentLayoutType;
+    appToolbarLayout;
+    // toolbar
+    appToolbarDisplay;
+    appToolbarContainer;
+    appToolbarContainerCSSClass = '';
+    appToolbarFixedDesktop;
+    appToolbarFixedMobile;
+    appPageTitleDisplay;
+    // page title
+    appPageTitleDirection = '';
+    appPageTitleCSSClass = '';
+    appPageTitleBreadcrumb;
+    appPageTitleDescription;
+    constructor(layout) {
+        this.layout = layout;
+    }
+    ngOnInit() {
+        const subscr = this.layout.layoutConfigSubject
+            .asObservable()
+            .subscribe((config) => {
+            this.updateProps(config);
+        });
+        this.unsubscribe.push(subscr);
+    }
+    updateProps(config) {
+        this.appToolbarDisplay = this.layout.getProp('app.toolbar.display', config);
+        if (!this.appToolbarDisplay) {
+            return;
+        }
+        this.appPageTitleDisplay = this.layout.getProp('app.pageTitle.display', config);
+        this.appToolbarContainer = this.layout.getProp('app.toolbar.container', config);
+        this.appToolbarContainerCSSClass =
+            this.appToolbarContainer === 'fixed'
+                ? 'container-xxl'
+                : 'container-fluid';
+        const containerClass = this.layout.getProp('app.toolbar.containerClass', config);
+        if (containerClass) {
+            this.appToolbarContainerCSSClass += ` ${containerClass}`;
+        }
+        this.appToolbarFixedDesktop = this.layout.getProp('app.toolbar.fixed.desktop', config);
+        if (this.appToolbarFixedDesktop) {
+            document.body.setAttribute('data-kt-app-toolbar-fixed', 'true');
+        }
+        this.appToolbarFixedMobile = this.layout.getProp('app.toolbar.fixed.mobile', config);
+        if (this.appToolbarFixedMobile) {
+            document.body.setAttribute('data-kt-app-toolbar-fixed-mobile', 'true');
+        }
+        // toolbar
+        this.appPageTitleDirection = this.layout.getProp('app.pageTitle.direction', config);
+        this.appPageTitleCSSClass = this.layout.getProp('app.pageTitle.class', config);
+        this.appPageTitleBreadcrumb = this.layout.getProp('app.pageTitle.breadCrumb', config);
+        this.appPageTitleDescription = this.layout.getProp('app.pageTitle.description', config);
+        document.body.setAttribute('data-kt-app-toolbar-enabled', 'true');
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    showPageTitle() {
+        const viewsWithPageTitles = ['classic', 'reports', 'saas'];
+        return (this.appPageTitleDisplay &&
+            viewsWithPageTitles.some((t) => t === this.appToolbarLayout));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ToolbarComponent, selector: "lib-toolbar", inputs: { currentLayoutType: "currentLayoutType", appToolbarLayout: "appToolbarLayout" }, ngImport: i0, template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n  <ng-container *ngIf=\"showPageTitle()\">\r\n    <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n      [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n      [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n    </lib-page-title>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"appToolbarLayout === 'classic'\">\r\n    <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"appToolbarLayout === 'accounting'\">\r\n    <lib-accounting class=\"d-flex align-items-center me-5\"></lib-accounting>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"appToolbarLayout === 'extended'\">\r\n    <lib-extended class=\"d-flex align-items-center flex-shrink-0 me-5\"></lib-extended>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"appToolbarLayout === 'reports'\">\r\n    <lib-reports class=\"d-flex align-items-center overflow-auto\" [appPageTitleDisplay]=\"appPageTitleDisplay\">\r\n    </lib-reports>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"appToolbarLayout === 'saas'\">\r\n    <lib-saas class=\"d-flex align-items-center gap-2\" [appPageTitleDisplay]=\"appPageTitleDisplay\"></lib-saas>\r\n  </ng-container>\r\n</div>\r\n<!--end::Toolbar container-->\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: PageTitleComponent, selector: "lib-page-title", inputs: ["appPageTitleDirection", "appPageTitleBreadcrumb", "appPageTitleDescription"] }, { kind: "component", type: AccountingComponent, selector: "lib-accounting" }, { kind: "component", type: ClassicComponent, selector: "lib-classic" }, { kind: "component", type: ExtendedComponent, selector: "lib-extended" }, { kind: "component", type: ReportsComponent, selector: "lib-reports", inputs: ["appPageTitleDisplay"] }, { kind: "component", type: SaasComponent, selector: "lib-saas", inputs: ["appPageTitleDisplay"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-toolbar', template: "<!--begin::Toolbar container-->\r\n<div id=\"kt_app_toolbar_container\" class=\"app-container\" [ngClass]=\"appToolbarContainerCSSClass\">\r\n  <ng-container *ngIf=\"showPageTitle()\">\r\n    <lib-page-title [appPageTitleDirection]=\"appPageTitleDirection\" [appPageTitleBreadcrumb]=\"appPageTitleBreadcrumb\"\r\n      [appPageTitleDescription]=\"appPageTitleDescription\" class=\"page-title d-flex flex-wrap me-3\"\r\n      [ngClass]=\"{'flex-column justify-content-center': appPageTitleDirection === 'column', 'align-items-center': appPageTitleDirection !== 'column', appPageTitleCSSClass}\">\r\n    </lib-page-title>\r\n  </ng-container>\r\n\r\n  <ng-container *ngIf=\"appToolbarLayout === 'classic'\">\r\n    <lib-classic class=\"d-flex align-items-center gap-2 gap-lg-3\"></lib-classic>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"appToolbarLayout === 'accounting'\">\r\n    <lib-accounting class=\"d-flex align-items-center me-5\"></lib-accounting>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"appToolbarLayout === 'extended'\">\r\n    <lib-extended class=\"d-flex align-items-center flex-shrink-0 me-5\"></lib-extended>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"appToolbarLayout === 'reports'\">\r\n    <lib-reports class=\"d-flex align-items-center overflow-auto\" [appPageTitleDisplay]=\"appPageTitleDisplay\">\r\n    </lib-reports>\r\n  </ng-container>\r\n  <ng-container *ngIf=\"appToolbarLayout === 'saas'\">\r\n    <lib-saas class=\"d-flex align-items-center gap-2\" [appPageTitleDisplay]=\"appPageTitleDisplay\"></lib-saas>\r\n  </ng-container>\r\n</div>\r\n<!--end::Toolbar container-->\r\n" }]
+        }], ctorParameters: () => [{ type: i1.LayoutService }], propDecorators: { currentLayoutType: [{
+                type: Input
+            }], appToolbarLayout: [{
+                type: Input
+            }] } });
+
+class SidebarLogoComponent {
+    layout;
+    unsubscribe = [];
+    toggleButtonClass = '';
+    toggleEnabled;
+    toggleType = '';
+    toggleState = '';
+    currentLayoutType;
+    toggleAttr;
+    constructor(layout) {
+        this.layout = layout;
+    }
+    ngOnInit() {
+        this.toggleAttr = `app-sidebar-${this.toggleType}`;
+        const layoutSubscr = this.layout.currentLayoutTypeSubject
+            .asObservable()
+            .subscribe((layout) => {
+            this.currentLayoutType = layout;
+        });
+        this.unsubscribe.push(layoutSubscr);
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarLogoComponent, deps: [{ token: i1.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: SidebarLogoComponent, selector: "lib-sidebar-logo", inputs: { toggleButtonClass: "toggleButtonClass", toggleEnabled: "toggleEnabled", toggleType: "toggleType", toggleState: "toggleState" }, ngImport: i0, template: "<!--begin::Logo image-->\r\n<a routerLink=\"/dashboard\">\r\n  <ng-container *ngIf=\"currentLayoutType === 'dark-sidebar'\">\r\n    <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo_text.svg\" class=\"h-40px app-sidebar-logo-default\" />\r\n  </ng-container>\r\n  <ng-container *ngIf=\"currentLayoutType !== 'dark-sidebar'\">\r\n    <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo_text.svg\" class=\"h-40px app-sidebar-logo-default theme-light-show\" />\r\n    <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo_text.svg\"\r\n      class=\"h-40px app-sidebar-logo-default theme-dark-show\" />\r\n  </ng-container>\r\n\r\n  <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.svg\" class=\"h-38px app-sidebar-logo-minimize\" />\r\n</a>\r\n<!--end::Logo image-->\r\n\r\n\r\n<ng-container *ngIf=\"toggleEnabled\">\r\n  <!--begin::Sidebar toggle-->\r\n  <div id=\"kt_app_sidebar_toggle\"\r\n    class=\"app-sidebar-toggle btn btn-icon btn-shadow btn-sm btn-color-muted btn-active-color-primary body-bg h-30px w-30px position-absolute top-50 start-100 translate-middle rotate d-none\"\r\n    [ngClass]=\"toggleButtonClass\" data-kt-toggle=\"true\" [attr.data-kt-toggle-state]=\"toggleState\"\r\n    data-kt-toggle-target=\"body\" [attr.data-kt-toggle-name]=\"toggleAttr\">\r\n    <lib-keenicon name=\"double-left\" class=\"fs-2 rotate-180\"></lib-keenicon>\r\n  </div>\r\n  <!--end::Sidebar toggle-->\r\n</ng-container>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarLogoComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-sidebar-logo', template: "<!--begin::Logo image-->\r\n<a routerLink=\"/dashboard\">\r\n  <ng-container *ngIf=\"currentLayoutType === 'dark-sidebar'\">\r\n    <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo_text.svg\" class=\"h-40px app-sidebar-logo-default\" />\r\n  </ng-container>\r\n  <ng-container *ngIf=\"currentLayoutType !== 'dark-sidebar'\">\r\n    <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo_text.svg\" class=\"h-40px app-sidebar-logo-default theme-light-show\" />\r\n    <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo_text.svg\"\r\n      class=\"h-40px app-sidebar-logo-default theme-dark-show\" />\r\n  </ng-container>\r\n\r\n  <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.svg\" class=\"h-38px app-sidebar-logo-minimize\" />\r\n</a>\r\n<!--end::Logo image-->\r\n\r\n\r\n<ng-container *ngIf=\"toggleEnabled\">\r\n  <!--begin::Sidebar toggle-->\r\n  <div id=\"kt_app_sidebar_toggle\"\r\n    class=\"app-sidebar-toggle btn btn-icon btn-shadow btn-sm btn-color-muted btn-active-color-primary body-bg h-30px w-30px position-absolute top-50 start-100 translate-middle rotate d-none\"\r\n    [ngClass]=\"toggleButtonClass\" data-kt-toggle=\"true\" [attr.data-kt-toggle-state]=\"toggleState\"\r\n    data-kt-toggle-target=\"body\" [attr.data-kt-toggle-name]=\"toggleAttr\">\r\n    <lib-keenicon name=\"double-left\" class=\"fs-2 rotate-180\"></lib-keenicon>\r\n  </div>\r\n  <!--end::Sidebar toggle-->\r\n</ng-container>\r\n" }]
+        }], ctorParameters: () => [{ type: i1.LayoutService }], propDecorators: { toggleButtonClass: [{
+                type: Input
+            }], toggleEnabled: [{
+                type: Input
+            }], toggleType: [{
+                type: Input
+            }], toggleState: [{
+                type: Input
+            }] } });
+
+class SidebarMenuComponent {
+    constructor() { }
+    ngOnInit() {
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: SidebarMenuComponent, selector: "lib-sidebar-menu", ngImport: i0, template: "<!--begin::Menu wrapper-->\r\n<div id=\"kt_app_sidebar_menu_scroll\" class=\"scroll-y my-5 mx-3\" data-kt-scroll=\"true\" data-kt-scroll-activate=\"true\"\r\n  data-kt-scroll-height=\"auto\" data-kt-scroll-dependencies=\"#kt_app_sidebar_logo, #kt_app_sidebar_footer\"\r\n  data-kt-scroll-wrappers=\"#kt_app_sidebar_menu\" data-kt-scroll-offset=\"5px\" data-kt-scroll-save-state=\"true\">\r\n  <!--begin::Menu-->\r\n  <div class=\"menu menu-column menu-rounded menu-sub-indention fw-semibold fs-6\" id=\"#kt_app_sidebar_menu\"\r\n    data-kt-menu=\"true\" data-kt-menu-expand=\"false\">\r\n    <!-- Birds Eye -->\r\n    <div class=\"menu-item\">\r\n      <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/birds_eye.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\">Birds Eye</span>\r\n      </a>\r\n    </div>\r\n\r\n    <!-- Tango Traffic -->\r\n    <div class=\"menu-item\">\r\n      <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_traffic.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\">Tango Traffic</span>\r\n      </a>\r\n    </div>\r\n\r\n    <!-- Tango Zone -->\r\n    <div class=\"menu-item\">\r\n      <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_zone.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\">Tango Zone</span>\r\n      </a>\r\n    </div>\r\n\r\n    <!-- Tango Revop -->\r\n    <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_revop.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">Tango Revop\r\n        </span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Home\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Tagging\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Pending Action\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Customer Profile\r\n            </span>\r\n          </a>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Control Center -->\r\n    <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/control_center.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">Control Center\r\n        </span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Live & Playback\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Screen Manager\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Store Explore\r\n            </span>\r\n          </a>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Tango SOP -->\r\n    <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_sop.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">Tango SOP\r\n        </span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Dashboard\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Create & Manage\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Flag\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Reports\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/crafted/account/settings\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Incidents\r\n            </span>\r\n          </a>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n        <!-- Manage -->\r\n        <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n          <span class=\"menu-link\">\r\n            <span style=\"width: 0px;\" class=\"menu-icon\">\r\n              <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\r\n            </span>\r\n            <span class=\"menu-title\" data-link=\"/manage\">Manage\r\n            </span>\r\n            <span class=\"menu-arrow\"></span>\r\n          </span>\r\n          <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/brands.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Brands\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/overview\">\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/overview.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Overview\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Stores\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users\">\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Users\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Tickets\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Reports\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/audit\" >\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/audit.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Audit\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/settings.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Settings\r\n                </span>\r\n            </a>\r\n            </div>\r\n          </div>\r\n        </div>\r\n  </div>\r\n  <!--end::Menu-->\r\n</div>\r\n<!--end::Menu wrapper-->", styles: [""], dependencies: [{ kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarMenuComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-sidebar-menu', template: "<!--begin::Menu wrapper-->\r\n<div id=\"kt_app_sidebar_menu_scroll\" class=\"scroll-y my-5 mx-3\" data-kt-scroll=\"true\" data-kt-scroll-activate=\"true\"\r\n  data-kt-scroll-height=\"auto\" data-kt-scroll-dependencies=\"#kt_app_sidebar_logo, #kt_app_sidebar_footer\"\r\n  data-kt-scroll-wrappers=\"#kt_app_sidebar_menu\" data-kt-scroll-offset=\"5px\" data-kt-scroll-save-state=\"true\">\r\n  <!--begin::Menu-->\r\n  <div class=\"menu menu-column menu-rounded menu-sub-indention fw-semibold fs-6\" id=\"#kt_app_sidebar_menu\"\r\n    data-kt-menu=\"true\" data-kt-menu-expand=\"false\">\r\n    <!-- Birds Eye -->\r\n    <div class=\"menu-item\">\r\n      <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/birds_eye.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\">Birds Eye</span>\r\n      </a>\r\n    </div>\r\n\r\n    <!-- Tango Traffic -->\r\n    <div class=\"menu-item\">\r\n      <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_traffic.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\">Tango Traffic</span>\r\n      </a>\r\n    </div>\r\n\r\n    <!-- Tango Zone -->\r\n    <div class=\"menu-item\">\r\n      <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_zone.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\">Tango Zone</span>\r\n      </a>\r\n    </div>\r\n\r\n    <!-- Tango Revop -->\r\n    <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_revop.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">Tango Revop\r\n        </span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Home\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Tagging\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Pending Action\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Customer Profile\r\n            </span>\r\n          </a>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Control Center -->\r\n    <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/control_center.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">Control Center\r\n        </span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Live & Playback\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Screen Manager\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Store Explore\r\n            </span>\r\n          </a>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <!-- Tango SOP -->\r\n    <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link\">\r\n        <span class=\"menu-icon\">\r\n          <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tango_sop.svg\" alt=\"\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">Tango SOP\r\n        </span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Dashboard\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Create & Manage\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Flag\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Reports\r\n            </span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/crafted/account/settings\">\r\n            <span class=\"menu-bullet\">\r\n              <span class=\"bullet bullet-dot\"></span>\r\n            </span>\r\n            <span class=\"menu-title\">Incidents\r\n            </span>\r\n          </a>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n        <!-- Manage -->\r\n        <div class=\"menu-item menu-accordion\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n          <span class=\"menu-link\">\r\n            <span style=\"width: 0px;\" class=\"menu-icon\">\r\n              <!-- <lib-keenicon name=\"profile-circle\" class=\"fs-2\"></lib-keenicon> -->\r\n            </span>\r\n            <span class=\"menu-title\" data-link=\"/manage\">Manage\r\n            </span>\r\n            <span class=\"menu-arrow\"></span>\r\n          </span>\r\n          <div class=\"menu-sub menu-sub-accordion\" routerLinkActive=\"menu-active-bg\" >\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/brands\">\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/brands.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Brands\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/overview\">\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/overview.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Overview\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/stores\">\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/stores.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Stores\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/users\">\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/users.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Users\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/tickets\" >\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/tickets.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Tickets\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/reports\" >\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/reports.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Reports\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/audit\" >\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/audit.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Audit\r\n                </span>\r\n              </a>\r\n            </div>\r\n            <div class=\"menu-item\">\r\n              <a class=\"menu-link without-sub\" routerLinkActive=\"active\" routerLink=\"/manage/settings\" >\r\n                <span class=\"menu-bullet\">\r\n                  <img class=\"fs-2\" src=\"./assets/tango/sidemenu-icons/settings.svg\" alt=\"\">\r\n                </span>\r\n                <span class=\"menu-title\">Settings\r\n                </span>\r\n            </a>\r\n            </div>\r\n          </div>\r\n        </div>\r\n  </div>\r\n  <!--end::Menu-->\r\n</div>\r\n<!--end::Menu wrapper-->" }]
+        }], ctorParameters: () => [] });
+
+class SidebarComponent {
+    layout;
+    unsubscribe = [];
+    // public props
+    appSidebarDisplay;
+    appSidebarDefaultFixedDesktop;
+    appSidebarDefaultMinimizeDesktopEnabled;
+    appSidebarDefaultMinimizeDesktopDefault;
+    appSidebarDefaultMinimizeDesktopHoverable;
+    appSidebarDefaultMinimizeMobileEnabled;
+    appSidebarDefaultMinimizeMobileDefault;
+    appSidebarDefaultMinimizeMobileHoverable;
+    appSidebarDefaultCollapseDesktopEnabled;
+    appSidebarDefaultCollapseDesktopDefault;
+    appSidebarDefaultCollapseMobileEnabled;
+    appSidebarDefaultCollapseMobileDefault;
+    appSidebarDefaultPushHeader;
+    appSidebarDefaultPushToolbar;
+    appSidebarDefaultPushFooter;
+    appSidebarDefaultStacked;
+    // logo
+    appSidebarDefaultMinimizeDefault;
+    toggleButtonClass;
+    toggleEnabled;
+    toggleType;
+    toggleState;
+    constructor(layout) {
+        this.layout = layout;
+    }
+    ngOnInit() {
+        const subscr = this.layout.layoutConfigSubject
+            .asObservable()
+            .subscribe((config) => {
+            this.updateProps(config);
+        });
+        this.unsubscribe.push(subscr);
+    }
+    updateProps(config) {
+        this.appSidebarDisplay = this.layout.getProp('app.sidebar.display', config);
+        if (!this.appSidebarDisplay) {
+            return;
+        }
+        this.appSidebarDefaultFixedDesktop = this.layout.getProp('app.sidebar.default.fixed.desktop', config);
+        this.appSidebarDefaultMinimizeDesktopEnabled = this.layout.getProp('app.sidebar.default.minimize.desktop.enabled', config);
+        if (this.appSidebarDefaultMinimizeDesktopEnabled) {
+            this.appSidebarDefaultMinimizeDesktopDefault = this.layout.getProp('app.sidebar.default.minimize.desktop.default', config);
+            // if (this.appSidebarDefaultMinimizeDesktopDefault) {
+            document.body.setAttribute('data-kt-app-sidebar-minimize', 'on');
+            // }
+            this.appSidebarDefaultMinimizeDesktopHoverable = this.layout.getProp('app.sidebar.default.minimize.desktop.hoverable', config);
+            if (this.appSidebarDefaultMinimizeDesktopHoverable) {
+                document.body.setAttribute('data-kt-app-sidebar-hoverable', 'true');
+            }
+        }
+        this.appSidebarDefaultMinimizeMobileEnabled = this.layout.getProp('app.sidebar.default.minimize.mobile.enabled', config);
+        if (this.appSidebarDefaultMinimizeMobileEnabled) {
+            this.appSidebarDefaultMinimizeMobileDefault = this.layout.getProp('app.sidebar.default.minimize.mobile.default', config);
+            // if (this.appSidebarDefaultMinimizeMobileDefault) {
+            document.body.setAttribute('data-kt-app-sidebar-minimize-mobile', 'on');
+            // }
+            this.appSidebarDefaultMinimizeMobileHoverable = this.layout.getProp('app.sidebar.default.minimize.mobile.hoverable', config);
+            if (this.appSidebarDefaultMinimizeMobileHoverable) {
+                document.body.setAttribute('data-kt-app-sidebar-hoverable-mobile', 'true');
+            }
+        }
+        this.appSidebarDefaultCollapseDesktopEnabled = this.layout.getProp('app.sidebar.default.collapse.desktop.enabled', config);
+        if (this.appSidebarDefaultCollapseDesktopEnabled) {
+            this.appSidebarDefaultCollapseDesktopDefault = this.layout.getProp('app.sidebar.default.collapse.desktop.default', config);
+            if (this.appSidebarDefaultCollapseDesktopDefault) {
+                document.body.setAttribute('data-kt-app-sidebar-collapse', 'on');
+            }
+        }
+        this.appSidebarDefaultCollapseMobileEnabled = this.layout.getProp('app.sidebar.default.collapse.mobile.enabled', config);
+        if (this.appSidebarDefaultCollapseMobileEnabled) {
+            this.appSidebarDefaultCollapseMobileDefault = this.layout.getProp('app.sidebar.default.collapse.mobile.default', config);
+            if (this.appSidebarDefaultCollapseMobileDefault) {
+                document.body.setAttribute('data-kt-app-sidebar-collapse-mobile', 'on');
+            }
+        }
+        if (this.layout.getProp('app.sidebar.default.push')) {
+            this.appSidebarDefaultPushHeader = this.layout.getProp('app.sidebar.default.push.header', config);
+            if (this.appSidebarDefaultPushHeader) {
+                document.body.setAttribute('data-kt-app-sidebar-push-header', 'true');
+            }
+            this.appSidebarDefaultPushToolbar = this.layout.getProp('app.sidebar.default.push.toolbar', config);
+            if (this.appSidebarDefaultPushToolbar) {
+                document.body.setAttribute('data-kt-app-sidebar-push-toolbar', 'true');
+            }
+            this.appSidebarDefaultPushFooter = this.layout.getProp('app.sidebar.default.push.footer', config);
+            if (this.appSidebarDefaultPushFooter) {
+                document.body.setAttribute('data-kt-app-sidebar-push-footer', 'true');
+            }
+        }
+        this.appSidebarDefaultStacked = this.layout.getProp('app.sidebar.default.stacked', config);
+        if (this.appSidebarDefaultStacked) {
+            document.body.setAttribute('app-sidebar-stacked', 'true');
+        }
+        // Logo
+        this.appSidebarDefaultMinimizeDefault = this.layout.getProp('app.sidebar.default.minimize.desktop.default', config);
+        this.toggleButtonClass = this.appSidebarDefaultMinimizeDefault
+            ? 'active'
+            : '';
+        this.toggleEnabled =
+            this.appSidebarDefaultMinimizeDesktopEnabled ||
+                this.appSidebarDefaultCollapseDesktopEnabled;
+        if (this.appSidebarDefaultMinimizeDesktopEnabled) {
+            this.toggleType = 'minimize';
+            this.toggleState = 'active';
+        }
+        if (this.appSidebarDefaultCollapseDesktopEnabled) {
+            this.toggleType = 'collapse';
+            this.toggleState = '';
+        }
+        document.body.setAttribute('data-kt-app-sidebar-enabled', 'true');
+        document.body.setAttribute('data-kt-app-sidebar-fixed', this.appSidebarDefaultFixedDesktop.toString());
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarComponent, deps: [{ token: i1.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: SidebarComponent, selector: "lib-sidebar", ngImport: i0, template: "<!--begin::Logo-->\r\n<lib-sidebar-logo class=\"app-sidebar-logo px-6\" id=\"kt_app_sidebar_logo\"\r\n  [toggleButtonClass]=\"toggleButtonClass\" [toggleEnabled]=\"toggleEnabled\" [toggleType]=\"toggleType\"\r\n  [toggleState]=\"toggleState\">\r\n</lib-sidebar-logo>\r\n<!--end::Logo-->\r\n\r\n<!--begin::sidebar menu-->\r\n<lib-sidebar-menu class=\"app-sidebar-menu overflow-hidden flex-column-fluid\">\r\n</lib-sidebar-menu>\r\n<!--end::sidebar menu-->\r\n\r\n<!--begin::Footer-->\r\n<!-- <lib-sidebar-footer class=\"app-sidebar-footer flex-column-auto pt-2 pb-6 px-6\" id=\"kt_app_sidebar_footer\">\r\n</lib-sidebar-footer> -->\r\n<!--end::Footer-->\r\n", styles: [""], dependencies: [{ kind: "component", type: SidebarLogoComponent, selector: "lib-sidebar-logo", inputs: ["toggleButtonClass", "toggleEnabled", "toggleType", "toggleState"] }, { kind: "component", type: SidebarMenuComponent, selector: "lib-sidebar-menu" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-sidebar', template: "<!--begin::Logo-->\r\n<lib-sidebar-logo class=\"app-sidebar-logo px-6\" id=\"kt_app_sidebar_logo\"\r\n  [toggleButtonClass]=\"toggleButtonClass\" [toggleEnabled]=\"toggleEnabled\" [toggleType]=\"toggleType\"\r\n  [toggleState]=\"toggleState\">\r\n</lib-sidebar-logo>\r\n<!--end::Logo-->\r\n\r\n<!--begin::sidebar menu-->\r\n<lib-sidebar-menu class=\"app-sidebar-menu overflow-hidden flex-column-fluid\">\r\n</lib-sidebar-menu>\r\n<!--end::sidebar menu-->\r\n\r\n<!--begin::Footer-->\r\n<!-- <lib-sidebar-footer class=\"app-sidebar-footer flex-column-auto pt-2 pb-6 px-6\" id=\"kt_app_sidebar_footer\">\r\n</lib-sidebar-footer> -->\r\n<!--end::Footer-->\r\n" }]
+        }], ctorParameters: () => [{ type: i1.LayoutService }] });
+
+class LayoutScrollTopComponent {
+    router;
+    class = 'kt_scrolltop';
+    id = 'scrolltop';
+    dataKtScrolltop = 'true';
+    unsubscribe = [];
+    constructor(router) {
+        this.router = router;
+    }
+    ngOnInit() {
+        this.routingChanges();
+    }
+    routingChanges() {
+        const routerSubscription = this.router.events.subscribe((event) => {
+            if (event instanceof NavigationEnd || event instanceof NavigationCancel) {
+                this.pluginsReinitialization();
+                this.updateHeaderSticky();
+                setTimeout(() => {
+                    this.scrollTop();
+                }, 0);
+            }
+        });
+        this.unsubscribe.push(routerSubscription);
+    }
+    updateHeaderSticky() {
+        const stickyHeader = document.body.querySelectorAll(`[data-kt-sticky-name="header"]`);
+        if (stickyHeader && stickyHeader.length > 0) {
+            const sticky = StickyComponent$1.getInstance(stickyHeader[0]);
+            if (sticky) {
+                sticky.update();
+            }
+        }
+    }
+    scrollTop() {
+        ScrollTopComponent$1.goTop();
+    }
+    pluginsReinitialization() {
+        setTimeout(() => {
+            // ScrollTopComponent.reinitialization()
+            MenuComponent.reinitialization();
+            StickyComponent$1.reInitialization();
+            setTimeout(() => {
+                ToggleComponent$1.reinitialization();
+                DrawerComponent$1.reinitialization();
+                // ScrollComponent.reinitialization()
+            }, 70);
+        }, 140);
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutScrollTopComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: LayoutScrollTopComponent, selector: "lib-scroll-top", host: { properties: { "class": "this.class", "id": "this.id", "attr.data-kt-scrolltop": "this.dataKtScrolltop" } }, ngImport: i0, template: "<lib-keenicon name=\"arrow-up\" class=\"\"></lib-keenicon>\r\n", dependencies: [{ kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutScrollTopComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-scroll-top', template: "<lib-keenicon name=\"arrow-up\" class=\"\"></lib-keenicon>\r\n" }]
+        }], ctorParameters: () => [{ type: i1$1.Router }], propDecorators: { class: [{
+                type: HostBinding,
+                args: ['class']
+            }], id: [{
+                type: HostBinding,
+                args: ['id']
+            }], dataKtScrolltop: [{
+                type: HostBinding,
+                args: ['attr.data-kt-scrolltop']
+            }] } });
+
+class LayoutComponent {
+    initService;
+    layout;
+    router;
+    activatedRoute;
+    unsubscribe = [];
+    // Public variables
+    // page
+    pageContainerCSSClasses;
+    // header
+    appHeaderDefaultClass = '';
+    appHeaderDisplay;
+    appHeaderDefaultStickyEnabled;
+    appHeaderDefaultStickyAttributes = {};
+    appHeaderDefaultMinimizeEnabled;
+    appHeaderDefaultMinimizeAttributes = {};
+    // toolbar
+    appToolbarDisplay;
+    appToolbarLayout;
+    appToolbarCSSClass = '';
+    appToolbarSwapEnabled;
+    appToolbarSwapAttributes = {};
+    appToolbarStickyEnabled;
+    appToolbarStickyAttributes = {};
+    appToolbarMinimizeEnabled;
+    appToolbarMinimizeAttributes = {};
+    // content
+    appContentContiner;
+    appContentContainerClass;
+    contentCSSClasses;
+    contentContainerCSSClass;
+    // sidebar
+    appSidebarDefaultClass;
+    appSidebarDefaultDrawerEnabled;
+    appSidebarDefaultDrawerAttributes = {};
+    appSidebarDisplay;
+    appSidebarDefaultStickyEnabled;
+    appSidebarDefaultStickyAttributes = {};
+    ktSidebar;
+    /// sidebar panel
+    appSidebarPanelDisplay;
+    // footer
+    appFooterDisplay;
+    appFooterCSSClass = '';
+    appFooterContainer = '';
+    appFooterContainerCSSClass = '';
+    appFooterFixedDesktop;
+    appFooterFixedMobile;
+    // scrolltop
+    scrolltopDisplay;
+    ktAside;
+    ktHeaderMobile;
+    ktHeader;
+    constructor(initService, layout, router, activatedRoute) {
+        this.initService = initService;
+        this.layout = layout;
+        this.router = router;
+        this.activatedRoute = activatedRoute;
+        // define layout type and load layout
+        this.router.events.subscribe((event) => {
+            if (event instanceof NavigationEnd) {
+                const currentLayoutType = this.layout.currentLayoutTypeSubject.value;
+                const nextLayoutType = this.activatedRoute?.firstChild?.snapshot.data.layout ||
+                    this.layout.getBaseLayoutTypeFromLocalStorage();
+                if (currentLayoutType !== nextLayoutType || !currentLayoutType) {
+                    this.layout.currentLayoutTypeSubject.next(nextLayoutType);
+                    this.initService.reInitProps(nextLayoutType);
+                }
+            }
+        });
+    }
+    ngOnInit() {
+        const subscr = this.layout.layoutConfigSubject
+            .asObservable()
+            .subscribe((config) => {
+            this.updateProps(config);
+        });
+        this.unsubscribe.push(subscr);
+    }
+    updateProps(config) {
+        this.scrolltopDisplay = this.layout.getProp('scrolltop.display', config);
+        this.pageContainerCSSClasses =
+            this.layout.getStringCSSClasses('pageContainer');
+        this.appHeaderDefaultClass = this.layout.getProp('app.header.default.class', config);
+        this.appHeaderDisplay = this.layout.getProp('app.header.display', config);
+        this.appFooterDisplay = this.layout.getProp('app.footer.display', config);
+        this.appSidebarDisplay = this.layout.getProp('app.sidebar.display', config);
+        this.appSidebarPanelDisplay = this.layout.getProp('app.sidebar-panel.display', config);
+        this.appToolbarDisplay = this.layout.getProp('app.toolbar.display', config);
+        this.contentCSSClasses = this.layout.getStringCSSClasses('content');
+        this.contentContainerCSSClass =
+            this.layout.getStringCSSClasses('contentContainer');
+        this.appContentContiner = this.layout.getProp('app.content.container', config);
+        this.appContentContainerClass = this.layout.getProp('app.content.containerClass', config);
+        // footer
+        if (this.appFooterDisplay) {
+            this.updateFooter(config);
+        }
+        // sidebar
+        if (this.appSidebarDisplay) {
+            this.updateSidebar(config);
+        }
+        // header
+        if (this.appHeaderDisplay) {
+            this.updateHeader(config);
+        }
+        // toolbar
+        if (this.appToolbarDisplay) {
+            this.updateToolbar(config);
+        }
+    }
+    updateSidebar(config) {
+        this.appSidebarDefaultClass = this.layout.getProp('app.sidebar.default.class', config);
+        this.appSidebarDefaultDrawerEnabled = this.layout.getProp('app.sidebar.default.drawer.enabled', config);
+        if (this.appSidebarDefaultDrawerEnabled) {
+            this.appSidebarDefaultDrawerAttributes = this.layout.getProp('app.sidebar.default.drawer.attributes', config);
+        }
+        this.appSidebarDefaultStickyEnabled = this.layout.getProp('app.sidebar.default.sticky.enabled', config);
+        if (this.appSidebarDefaultStickyEnabled) {
+            this.appSidebarDefaultStickyAttributes = this.layout.getProp('app.sidebar.default.sticky.attributes', config);
+        }
+        setTimeout(() => {
+            const sidebarElement = document.getElementById('kt_app_sidebar');
+            // sidebar
+            if (this.appSidebarDisplay && sidebarElement) {
+                const sidebarAttributes = sidebarElement
+                    .getAttributeNames()
+                    .filter((t) => t.indexOf('data-') > -1);
+                sidebarAttributes.forEach((attr) => sidebarElement.removeAttribute(attr));
+                if (this.appSidebarDefaultDrawerEnabled) {
+                    for (const key in this.appSidebarDefaultDrawerAttributes) {
+                        if (this.appSidebarDefaultDrawerAttributes.hasOwnProperty(key)) {
+                            sidebarElement.setAttribute(key, this.appSidebarDefaultDrawerAttributes[key]);
+                        }
+                    }
+                }
+                if (this.appSidebarDefaultStickyEnabled) {
+                    for (const key in this.appSidebarDefaultStickyAttributes) {
+                        if (this.appSidebarDefaultStickyAttributes.hasOwnProperty(key)) {
+                            sidebarElement.setAttribute(key, this.appSidebarDefaultStickyAttributes[key]);
+                        }
+                    }
+                }
+            }
+        }, 0);
+    }
+    updateHeader(config) {
+        this.appHeaderDefaultStickyEnabled = this.layout.getProp('app.header.default.sticky.enabled', config);
+        if (this.appHeaderDefaultStickyEnabled) {
+            this.appHeaderDefaultStickyAttributes = this.layout.getProp('app.header.default.sticky.attributes', config);
+        }
+        this.appHeaderDefaultMinimizeEnabled = this.layout.getProp('app.header.default.minimize.enabled', config);
+        if (this.appHeaderDefaultMinimizeEnabled) {
+            this.appHeaderDefaultMinimizeAttributes = this.layout.getProp('app.header.default.minimize.attributes', config);
+        }
+        setTimeout(() => {
+            const headerElement = document.getElementById('kt_app_header');
+            // header
+            if (this.appHeaderDisplay && headerElement) {
+                const headerAttributes = headerElement
+                    .getAttributeNames()
+                    .filter((t) => t.indexOf('data-') > -1);
+                headerAttributes.forEach((attr) => headerElement.removeAttribute(attr));
+                if (this.appHeaderDefaultStickyEnabled) {
+                    for (const key in this.appHeaderDefaultStickyAttributes) {
+                        if (this.appHeaderDefaultStickyAttributes.hasOwnProperty(key)) {
+                            headerElement.setAttribute(key, this.appHeaderDefaultStickyAttributes[key]);
+                        }
+                    }
+                }
+                if (this.appHeaderDefaultMinimizeEnabled) {
+                    for (const key in this.appHeaderDefaultMinimizeAttributes) {
+                        if (this.appHeaderDefaultMinimizeAttributes.hasOwnProperty(key)) {
+                            headerElement.setAttribute(key, this.appHeaderDefaultMinimizeAttributes[key]);
+                        }
+                    }
+                }
+            }
+        }, 0);
+    }
+    updateFooter(config) {
+        this.appFooterCSSClass = this.layout.getProp('app.footer.class', config);
+        this.appFooterContainer = this.layout.getProp('app.footer.container', config);
+        this.appFooterContainerCSSClass = this.layout.getProp('app.footer.containerClass', config);
+        if (this.appFooterContainer === 'fixed') {
+            this.appFooterContainerCSSClass += ' container-xxl';
+        }
+        else {
+            if (this.appFooterContainer === 'fluid') {
+                this.appFooterContainerCSSClass += ' container-fluid';
+            }
+        }
+        this.appFooterFixedDesktop = this.layout.getProp('app.footer.fixed.desktop', config);
+        if (this.appFooterFixedDesktop) {
+            document.body.setAttribute('data-kt-app-footer-fixed', 'true');
+        }
+        this.appFooterFixedMobile = this.layout.getProp('app.footer.fixed.mobile');
+        if (this.appFooterFixedMobile) {
+            document.body.setAttribute('data-kt-app-footer-fixed-mobile', 'true');
+        }
+    }
+    updateToolbar(config) {
+        this.appToolbarLayout = this.layout.getProp('app.toolbar.layout', config);
+        this.appToolbarSwapEnabled = this.layout.getProp('app.toolbar.swap.enabled', config);
+        if (this.appToolbarSwapEnabled) {
+            this.appToolbarSwapAttributes = this.layout.getProp('app.toolbar.swap.attributes', config);
+        }
+        this.appToolbarStickyEnabled = this.layout.getProp('app.toolbar.sticky.enabled', config);
+        if (this.appToolbarStickyEnabled) {
+            this.appToolbarStickyAttributes = this.layout.getProp('app.toolbar.sticky.attributes', config);
+        }
+        this.appToolbarCSSClass =
+            this.layout.getProp('app.toolbar.class', config) || '';
+        this.appToolbarMinimizeEnabled = this.layout.getProp('app.toolbar.minimize.enabled', config);
+        if (this.appToolbarMinimizeEnabled) {
+            this.appToolbarMinimizeAttributes = this.layout.getProp('app.toolbar.minimize.attributes', config);
+            this.appToolbarCSSClass += ' app-toolbar-minimize';
+        }
+        setTimeout(() => {
+            const toolbarElement = document.getElementById('kt_app_toolbar');
+            // toolbar
+            if (this.appToolbarDisplay && toolbarElement) {
+                const toolbarAttributes = toolbarElement
+                    .getAttributeNames()
+                    .filter((t) => t.indexOf('data-') > -1);
+                toolbarAttributes.forEach((attr) => toolbarElement.removeAttribute(attr));
+                if (this.appToolbarSwapEnabled) {
+                    for (const key in this.appToolbarSwapAttributes) {
+                        if (this.appToolbarSwapAttributes.hasOwnProperty(key)) {
+                            toolbarElement.setAttribute(key, this.appToolbarSwapAttributes[key]);
+                        }
+                    }
+                }
+                if (this.appToolbarStickyEnabled) {
+                    for (const key in this.appToolbarStickyAttributes) {
+                        if (this.appToolbarStickyAttributes.hasOwnProperty(key)) {
+                            toolbarElement.setAttribute(key, this.appToolbarStickyAttributes[key]);
+                        }
+                    }
+                }
+                if (this.appToolbarMinimizeEnabled) {
+                    for (const key in this.appToolbarMinimizeAttributes) {
+                        if (this.appToolbarMinimizeAttributes.hasOwnProperty(key)) {
+                            toolbarElement.setAttribute(key, this.appToolbarMinimizeAttributes[key]);
+                        }
+                    }
+                }
+            }
+        }, 0);
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutComponent, deps: [{ token: i1.LayoutInitService }, { token: i1.LayoutService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: LayoutComponent, selector: "lib-layout", viewQueries: [{ propertyName: "ktSidebar", first: true, predicate: ["ktSidebar"], descendants: true, static: true }, { propertyName: "ktAside", first: true, predicate: ["ktAside"], descendants: true, static: true }, { propertyName: "ktHeaderMobile", first: true, predicate: ["ktHeaderMobile"], descendants: true, static: true }, { propertyName: "ktHeader", first: true, predicate: ["ktHeader"], descendants: true, static: true }], ngImport: i0, template: "<!--begin::App-->\r\n<div class=\"d-flex flex-column flex-root app-root\" id=\"kt_app_root\">\r\n  <!--begin::Page-->\r\n  <div class=\"app-page flex-column flex-column-fluid\" id=\"kt_app_page\">\r\n    <ng-container *ngIf=\"appHeaderDisplay\">\r\n      <!--begin::Header-->\r\n      <lib-header [ngClass]=\"appHeaderDefaultClass\" id=\"kt_app_header\" class=\"app-header\" data-kt-sticky=\"true\" data-kt-sticky-activate=\"{default: true, lg: true}\" data-kt-sticky-name=\"app-header-minimize\" data-kt-sticky-offset=\"{default: '200px', lg: '0'}\" data-kt-sticky-animation=\"false\">\r\n      </lib-header>\r\n      <!--end::Header-->\r\n    </ng-container>\r\n\r\n    <!--begin::Wrapper-->\r\n    <div class=\"app-wrapper flex-column flex-row-fluid\" id=\"kt_app_wrapper\">\r\n\r\n      <ng-container *ngIf=\"appSidebarDisplay\">\r\n        <!--begin::sidebar-->\r\n        <lib-sidebar #ktSidebar id=\"kt_app_sidebar\" class=\"app-sidebar flex-column\" [ngClass]=\"appSidebarDefaultClass\">\r\n        </lib-sidebar>\r\n        <!--end::sidebar-->\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"appSidebarPanelDisplay\">\r\n        <!-- TODO: app sidebar panel -->\r\n      </ng-container>\r\n      <!--begin::Main-->\r\n      <div class=\"app-main flex-column flex-row-fluid\" id=\"kt_app_main\">\r\n        <!--begin::Content wrapper-->\r\n        <div class=\"d-flex flex-column flex-column-fluid\">\r\n          <ng-container *ngIf=\"appToolbarDisplay\">\r\n            <lib-toolbar class=\"app-toolbar\" [ngClass]=\"appToolbarCSSClass\" id=\"kt_app_toolbar\"\r\n              [appToolbarLayout]=\"appToolbarLayout\"></lib-toolbar>\r\n          </ng-container>\r\n          <lib-content id=\" kt_app_content\" class=\"app-content\" [ngClass]=\"contentCSSClasses\"\r\n            [contentContainerCSSClass]=\"contentContainerCSSClass\" [appContentContiner]=\"appContentContiner\"\r\n            [appContentContainerClass]=\"appContentContainerClass\">\r\n          </lib-content>\r\n        </div>\r\n        <!--end::Content wrapper-->\r\n        <!-- <ng-container *ngIf=\"appFooterDisplay\">\r\n          <lib-footer class=\"app-footer\" [ngClass]=\"appFooterCSSClass\" id=\"kt_app_footer\"\r\n            [appFooterContainerCSSClass]=\"appFooterContainerCSSClass\"></lib-footer>\r\n        </ng-container> -->\r\n      </div>\r\n      <!--end:::Main-->\r\n    </div>\r\n    <!--end::Wrapper-->\r\n\r\n  </div>\r\n  <!--end::Page-->\r\n</div>\r\n<!--end::App-->\r\n\r\n<lib-scripts-init></lib-scripts-init>\r\n<ng-container>\r\n  <lib-scroll-top id=\"kt_scrolltop\" class=\"scrolltop\" data-kt-scrolltop=\"true\"></lib-scroll-top>\r\n</ng-container>\r\n<!-- begin:: Drawers -->\r\n<!-- <lib-activity-drawer></lib-activity-drawer> -->\r\n<!-- <lib-messenger-drawer></lib-messenger-drawer> -->\r\n<!-- end:: Drawers -->\r\n\r\n<!-- end:: Engage -->\r\n<!-- <lib-engages></lib-engages> -->\r\n<!-- end:: Engage -->\r\n\r\n<!-- begin:: Modals -->\r\n<!-- <lib-main-modal></lib-main-modal> -->\r\n<!-- <lib-invite-users-modal></lib-invite-users-modal> -->\r\n<!-- <lib-upgrade-plan-modal></lib-upgrade-plan-modal> -->\r\n<!-- end:: Modals -->\r\n", styles: [":host{height:100%;margin:0}:host .flex-root{height:100%}.page-loaded app-layout{opacity:1;transition:opacity 1s ease-in-out}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: HeaderComponent, selector: "lib-header" }, { kind: "component", type: ContentComponent, selector: "lib-content", inputs: ["contentContainerCSSClass", "appContentContiner", "appContentContainerClass"] }, { kind: "component", type: ScriptsInitComponent, selector: "lib-scripts-init" }, { kind: "component", type: ToolbarComponent, selector: "lib-toolbar", inputs: ["currentLayoutType", "appToolbarLayout"] }, { kind: "component", type: SidebarComponent, selector: "lib-sidebar" }, { kind: "component", type: LayoutScrollTopComponent, selector: "lib-scroll-top" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-layout', template: "<!--begin::App-->\r\n<div class=\"d-flex flex-column flex-root app-root\" id=\"kt_app_root\">\r\n  <!--begin::Page-->\r\n  <div class=\"app-page flex-column flex-column-fluid\" id=\"kt_app_page\">\r\n    <ng-container *ngIf=\"appHeaderDisplay\">\r\n      <!--begin::Header-->\r\n      <lib-header [ngClass]=\"appHeaderDefaultClass\" id=\"kt_app_header\" class=\"app-header\" data-kt-sticky=\"true\" data-kt-sticky-activate=\"{default: true, lg: true}\" data-kt-sticky-name=\"app-header-minimize\" data-kt-sticky-offset=\"{default: '200px', lg: '0'}\" data-kt-sticky-animation=\"false\">\r\n      </lib-header>\r\n      <!--end::Header-->\r\n    </ng-container>\r\n\r\n    <!--begin::Wrapper-->\r\n    <div class=\"app-wrapper flex-column flex-row-fluid\" id=\"kt_app_wrapper\">\r\n\r\n      <ng-container *ngIf=\"appSidebarDisplay\">\r\n        <!--begin::sidebar-->\r\n        <lib-sidebar #ktSidebar id=\"kt_app_sidebar\" class=\"app-sidebar flex-column\" [ngClass]=\"appSidebarDefaultClass\">\r\n        </lib-sidebar>\r\n        <!--end::sidebar-->\r\n      </ng-container>\r\n\r\n      <ng-container *ngIf=\"appSidebarPanelDisplay\">\r\n        <!-- TODO: app sidebar panel -->\r\n      </ng-container>\r\n      <!--begin::Main-->\r\n      <div class=\"app-main flex-column flex-row-fluid\" id=\"kt_app_main\">\r\n        <!--begin::Content wrapper-->\r\n        <div class=\"d-flex flex-column flex-column-fluid\">\r\n          <ng-container *ngIf=\"appToolbarDisplay\">\r\n            <lib-toolbar class=\"app-toolbar\" [ngClass]=\"appToolbarCSSClass\" id=\"kt_app_toolbar\"\r\n              [appToolbarLayout]=\"appToolbarLayout\"></lib-toolbar>\r\n          </ng-container>\r\n          <lib-content id=\" kt_app_content\" class=\"app-content\" [ngClass]=\"contentCSSClasses\"\r\n            [contentContainerCSSClass]=\"contentContainerCSSClass\" [appContentContiner]=\"appContentContiner\"\r\n            [appContentContainerClass]=\"appContentContainerClass\">\r\n          </lib-content>\r\n        </div>\r\n        <!--end::Content wrapper-->\r\n        <!-- <ng-container *ngIf=\"appFooterDisplay\">\r\n          <lib-footer class=\"app-footer\" [ngClass]=\"appFooterCSSClass\" id=\"kt_app_footer\"\r\n            [appFooterContainerCSSClass]=\"appFooterContainerCSSClass\"></lib-footer>\r\n        </ng-container> -->\r\n      </div>\r\n      <!--end:::Main-->\r\n    </div>\r\n    <!--end::Wrapper-->\r\n\r\n  </div>\r\n  <!--end::Page-->\r\n</div>\r\n<!--end::App-->\r\n\r\n<lib-scripts-init></lib-scripts-init>\r\n<ng-container>\r\n  <lib-scroll-top id=\"kt_scrolltop\" class=\"scrolltop\" data-kt-scrolltop=\"true\"></lib-scroll-top>\r\n</ng-container>\r\n<!-- begin:: Drawers -->\r\n<!-- <lib-activity-drawer></lib-activity-drawer> -->\r\n<!-- <lib-messenger-drawer></lib-messenger-drawer> -->\r\n<!-- end:: Drawers -->\r\n\r\n<!-- end:: Engage -->\r\n<!-- <lib-engages></lib-engages> -->\r\n<!-- end:: Engage -->\r\n\r\n<!-- begin:: Modals -->\r\n<!-- <lib-main-modal></lib-main-modal> -->\r\n<!-- <lib-invite-users-modal></lib-invite-users-modal> -->\r\n<!-- <lib-upgrade-plan-modal></lib-upgrade-plan-modal> -->\r\n<!-- end:: Modals -->\r\n", styles: [":host{height:100%;margin:0}:host .flex-root{height:100%}.page-loaded app-layout{opacity:1;transition:opacity 1s ease-in-out}\n"] }]
+        }], ctorParameters: () => [{ type: i1.LayoutInitService }, { type: i1.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }], propDecorators: { ktSidebar: [{
+                type: ViewChild,
+                args: ['ktSidebar', { static: true }]
+            }], ktAside: [{
+                type: ViewChild,
+                args: ['ktAside', { static: true }]
+            }], ktHeaderMobile: [{
+                type: ViewChild,
+                args: ['ktHeaderMobile', { static: true }]
+            }], ktHeader: [{
+                type: ViewChild,
+                args: ['ktHeader', { static: true }]
+            }] } });
+
+class FooterComponent {
+    appFooterContainerCSSClass = '';
+    currentDateStr = new Date().getFullYear().toString();
+    constructor() { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: FooterComponent, selector: "lib-footer", inputs: { appFooterContainerCSSClass: "appFooterContainerCSSClass" }, ngImport: i0, template: "<ng-container *ngIf=\"appFooterContainerCSSClass\">\r\n  <!--begin::Footer container-->\r\n  <div class=\"app-container\" [ngClass]=\"appFooterContainerCSSClass\">\r\n    <ng-container *ngTemplateOutlet=\"footerView\"></ng-container>\r\n  </div>\r\n  <!--end::Footer container-->\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"!appFooterContainerCSSClass\">\r\n  <ng-container *ngTemplateOutlet=\"footerView\"></ng-container>\r\n</ng-container>\r\n\r\n<ng-template #footerView>\r\n  <!--begin::Copyright-->\r\n  <div class=\"text-gray-900 order-2 order-md-1\">\r\n    <span class=\"text-muted fw-semibold me-1\">{{currentDateStr}}&copy;</span>\r\n    <a href=\"https://keenthemes.com/\" target=\"_blank\" class=\"text-gray-800 text-hover-primary\">Keenthemes</a>\r\n  </div>\r\n  <!--end::Copyright-->\r\n\r\n  <!--begin::Menu-->\r\n  <ul class=\"menu menu-gray-600 menu-hover-primary fw-semibold order-1\">\r\n    <li class=\"menu-item\"><a href=\"https://keenthemes.com/\" target=\"_blank\" class=\"menu-link px-2\">About</a></li>\r\n\r\n    <li class=\"menu-item\"><a href=\"https://devs.keenthemes.com/\" target=\"_blank\" class=\"menu-link px-2\">Support</a></li>\r\n\r\n    <li class=\"menu-item\"><a href=\"https://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469\"\r\n        target=\"_blank\" class=\"menu-link px-2\">Purchase</a></li>\r\n  </ul>\r\n  <!--end::Menu-->\r\n\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-footer', template: "<ng-container *ngIf=\"appFooterContainerCSSClass\">\r\n  <!--begin::Footer container-->\r\n  <div class=\"app-container\" [ngClass]=\"appFooterContainerCSSClass\">\r\n    <ng-container *ngTemplateOutlet=\"footerView\"></ng-container>\r\n  </div>\r\n  <!--end::Footer container-->\r\n</ng-container>\r\n\r\n<ng-container *ngIf=\"!appFooterContainerCSSClass\">\r\n  <ng-container *ngTemplateOutlet=\"footerView\"></ng-container>\r\n</ng-container>\r\n\r\n<ng-template #footerView>\r\n  <!--begin::Copyright-->\r\n  <div class=\"text-gray-900 order-2 order-md-1\">\r\n    <span class=\"text-muted fw-semibold me-1\">{{currentDateStr}}&copy;</span>\r\n    <a href=\"https://keenthemes.com/\" target=\"_blank\" class=\"text-gray-800 text-hover-primary\">Keenthemes</a>\r\n  </div>\r\n  <!--end::Copyright-->\r\n\r\n  <!--begin::Menu-->\r\n  <ul class=\"menu menu-gray-600 menu-hover-primary fw-semibold order-1\">\r\n    <li class=\"menu-item\"><a href=\"https://keenthemes.com/\" target=\"_blank\" class=\"menu-link px-2\">About</a></li>\r\n\r\n    <li class=\"menu-item\"><a href=\"https://devs.keenthemes.com/\" target=\"_blank\" class=\"menu-link px-2\">Support</a></li>\r\n\r\n    <li class=\"menu-item\"><a href=\"https://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469\"\r\n        target=\"_blank\" class=\"menu-link px-2\">Purchase</a></li>\r\n  </ul>\r\n  <!--end::Menu-->\r\n\r\n</ng-template>\r\n" }]
+        }], ctorParameters: () => [], propDecorators: { appFooterContainerCSSClass: [{
+                type: Input
+            }] } });
+
+class SidebarFooterComponent {
+    constructor() { }
+    ngOnInit() { }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: SidebarFooterComponent, selector: "lib-sidebar-footer", ngImport: i0, template: "<a target=\"_blank\" \r\n  class=\"btn btn-flex flex-center btn-custom btn-primary overflow-hidden text-nowrap px-0 h-40px w-100\"\r\n  data-bs-toggle=\"tooltip\" data-bs-trigger=\"hover\" data-bs-dismiss-=\"click\" title=\"Metronic Docs & Components\">\r\n\r\n  <span class=\"btn-label\">\r\n    Docs & Components\r\n  </span>\r\n  <lib-keenicon name=\"document\" class=\"fs-2 m-0\"></lib-keenicon>\r\n</a>\r\n", styles: [""], dependencies: [{ kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarFooterComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-sidebar-footer', template: "<a target=\"_blank\" \r\n  class=\"btn btn-flex flex-center btn-custom btn-primary overflow-hidden text-nowrap px-0 h-40px w-100\"\r\n  data-bs-toggle=\"tooltip\" data-bs-trigger=\"hover\" data-bs-dismiss-=\"click\" title=\"Metronic Docs & Components\">\r\n\r\n  <span class=\"btn-label\">\r\n    Docs & Components\r\n  </span>\r\n  <lib-keenicon name=\"document\" class=\"fs-2 m-0\"></lib-keenicon>\r\n</a>\r\n" }]
+        }], ctorParameters: () => [] });
+
+const BODY_CLASSES = ['bgi-size-cover', 'bgi-position-center', 'bgi-no-repeat'];
+class ErrorsComponent {
+    router;
+    class = 'd-flex flex-column flex-root';
+    constructor(router) {
+        this.router = router;
+    }
+    ngOnInit() {
+        BODY_CLASSES.forEach((c) => document.body.classList.add(c));
+    }
+    ngOnDestroy() {
+        BODY_CLASSES.forEach((c) => document.body.classList.remove(c));
+    }
+    routeToDashboard() {
+        this.router.navigate(['dashboard']);
+        setTimeout(() => {
+            ToggleComponent$1.bootstrap();
+            ScrollTopComponent$1.bootstrap();
+            DrawerComponent$1.bootstrap();
+            StickyComponent$1.bootstrap();
+            MenuComponent.bootstrap();
+            ScrollComponent$1.bootstrap();
+        }, 200);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ErrorsComponent, selector: "lib-errors", host: { properties: { "class": "this.class" } }, ngImport: i0, template: "<!--begin::Authentication - -->\r\n<div class=\"d-flex flex-column flex-center flex-column-fluid\">\r\n  <!--begin::Content-->\r\n  <div class=\"d-flex flex-column flex-center text-center p-10\">\r\n    <!--begin::Wrapper-->\r\n    <div class=\"card card-flush  w-lg-650px py-5\">\r\n      <div class=\"card-body py-15 py-lg-20\">\r\n        <router-outlet></router-outlet>\r\n      </div>\r\n    </div>\r\n    <!--end::Wrapper-->\r\n  </div>\r\n  <!--end::Content-->\r\n</div>\r\n<!--end::Authentication - -->\r\n", styles: [":host{height:100%;margin:0}\n"], dependencies: [{ kind: "directive", type: i1$1.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-errors', template: "<!--begin::Authentication - -->\r\n<div class=\"d-flex flex-column flex-center flex-column-fluid\">\r\n  <!--begin::Content-->\r\n  <div class=\"d-flex flex-column flex-center text-center p-10\">\r\n    <!--begin::Wrapper-->\r\n    <div class=\"card card-flush  w-lg-650px py-5\">\r\n      <div class=\"card-body py-15 py-lg-20\">\r\n        <router-outlet></router-outlet>\r\n      </div>\r\n    </div>\r\n    <!--end::Wrapper-->\r\n  </div>\r\n  <!--end::Content-->\r\n</div>\r\n<!--end::Authentication - -->\r\n", styles: [":host{height:100%;margin:0}\n"] }]
+        }], ctorParameters: () => [{ type: i1$1.Router }], propDecorators: { class: [{
+                type: HostBinding,
+                args: ['class']
+            }] } });
+
+class Error404Component {
+    router;
+    modeService;
+    unsubscribe = [];
+    constructor(router, modeService) {
+        this.router = router;
+        this.modeService = modeService;
+    }
+    ngOnInit() {
+        const subscr = this.modeService.mode.asObservable().subscribe((mode) => {
+            document.body.style.backgroundImage =
+                mode === 'dark'
+                    ? 'url(./assets/media/auth/bg1-dark.jpg)'
+                    : 'url(./assets/media/auth/bg1.jpg)';
+        });
+        this.unsubscribe.push(subscr);
+    }
+    routeToDashboard() {
+        this.router.navigate(['dashboard']);
+        setTimeout(() => {
+            ToggleComponent$1.reinitialization();
+            ScrollTopComponent$1.reinitialization();
+            DrawerComponent$1.reinitialization();
+            StickyComponent$1.bootstrap();
+            MenuComponent.reinitialization();
+            ScrollComponent$1.reinitialization();
+        }, 200);
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+        document.body.style.backgroundImage = 'none';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: Error404Component, deps: [{ token: i1$1.Router }, { token: i1.ThemeModeService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: Error404Component, selector: "lib-error404", ngImport: i0, template: "<!--begin::Title-->\r\n<h1 class=\"fw-bolder fs-2hx text-gray-900 mb-4\">\r\n  Oops!\r\n</h1>\r\n<!--end::Title-->\r\n\r\n<!--begin::Text-->\r\n<div class=\"fw-semibold fs-6 text-gray-500 mb-7\">\r\n  We can't find that page.\r\n</div>\r\n<!--end::Text-->\r\n\r\n<!--begin::Illustration-->\r\n<div class=\"mb-3\">\r\n  <img src=\"./assets/media/auth/404-error.png\" class=\"mw-100 mh-300px theme-light-show\" alt=\"\" />\r\n  <img src=\"./assets/media/auth/404-error-dark.png\" class=\"mw-100 mh-300px theme-dark-show\" alt=\"\" />\r\n</div>\r\n<!--end::Illustration-->\r\n\r\n<!--begin::Link-->\r\n<div class=\"mb-0\">\r\n  <a (click)=\"routeToDashboard()\" class=\"btn btn-sm btn-primary\">Return Home</a>\r\n</div>\r\n<!--end::Link-->\r\n", styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: Error404Component, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-error404', template: "<!--begin::Title-->\r\n<h1 class=\"fw-bolder fs-2hx text-gray-900 mb-4\">\r\n  Oops!\r\n</h1>\r\n<!--end::Title-->\r\n\r\n<!--begin::Text-->\r\n<div class=\"fw-semibold fs-6 text-gray-500 mb-7\">\r\n  We can't find that page.\r\n</div>\r\n<!--end::Text-->\r\n\r\n<!--begin::Illustration-->\r\n<div class=\"mb-3\">\r\n  <img src=\"./assets/media/auth/404-error.png\" class=\"mw-100 mh-300px theme-light-show\" alt=\"\" />\r\n  <img src=\"./assets/media/auth/404-error-dark.png\" class=\"mw-100 mh-300px theme-dark-show\" alt=\"\" />\r\n</div>\r\n<!--end::Illustration-->\r\n\r\n<!--begin::Link-->\r\n<div class=\"mb-0\">\r\n  <a (click)=\"routeToDashboard()\" class=\"btn btn-sm btn-primary\">Return Home</a>\r\n</div>\r\n<!--end::Link-->\r\n" }]
+        }], ctorParameters: () => [{ type: i1$1.Router }, { type: i1.ThemeModeService }] });
+
+class Error500Component {
+    router;
+    modeService;
+    unsubscribe = [];
+    constructor(router, modeService) {
+        this.router = router;
+        this.modeService = modeService;
+    }
+    ngOnInit() {
+        const subscr = this.modeService.mode.asObservable().subscribe((mode) => {
+            document.body.style.backgroundImage =
+                mode === 'dark'
+                    ? 'url(./assets/media/auth/bg7-dark.jpg)'
+                    : 'url(./assets/media/auth/bg7.jpg)';
+        });
+        this.unsubscribe.push(subscr);
+    }
+    routeToDashboard() {
+        this.router.navigate(['dashboard']);
+        setTimeout(() => {
+            ToggleComponent$1.reinitialization();
+            ScrollTopComponent$1.reinitialization();
+            DrawerComponent$1.reinitialization();
+            StickyComponent$1.bootstrap();
+            MenuComponent.reinitialization();
+            ScrollComponent$1.reinitialization();
+        }, 200);
+    }
+    ngOnDestroy() {
+        this.unsubscribe.forEach((sb) => sb.unsubscribe());
+        document.body.style.backgroundImage = 'none';
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: Error500Component, deps: [{ token: i1$1.Router }, { token: i1.ThemeModeService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: Error500Component, selector: "lib-error500", ngImport: i0, template: "<!--begin::Title-->\r\n<h1 class=\"fw-bolder fs-2qx text-gray-900 mb-4\">\r\n  System Error\r\n</h1>\r\n<!--end::Title-->\r\n\r\n<!--begin::Text-->\r\n<div class=\"fw-semibold fs-6 text-gray-500 mb-7\">\r\n  Something went wrong! Please try again later.\r\n</div>\r\n<!--end::Text-->\r\n\r\n<!--begin::Illustration-->\r\n<div class=\"mb-11\">\r\n  <img src=\"./assets/media/auth/500-error.png\" class=\"mw-100 mh-300px theme-light-show\" alt=\"\" />\r\n  <img src=\"./assets/media/auth/500-error-dark.png\" class=\"mw-100 mh-300px theme-dark-show\" alt=\"\" />\r\n</div>\r\n<!--end::Illustration-->\r\n\r\n<!--begin::Link-->\r\n<div class=\"mb-0\">\r\n  <a (click)=\"routeToDashboard()\" class=\"btn btn-sm btn-primary\">Return Home</a>\r\n</div>\r\n<!--end::Link-->\r\n", styles: [""] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: Error500Component, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-error500', template: "<!--begin::Title-->\r\n<h1 class=\"fw-bolder fs-2qx text-gray-900 mb-4\">\r\n  System Error\r\n</h1>\r\n<!--end::Title-->\r\n\r\n<!--begin::Text-->\r\n<div class=\"fw-semibold fs-6 text-gray-500 mb-7\">\r\n  Something went wrong! Please try again later.\r\n</div>\r\n<!--end::Text-->\r\n\r\n<!--begin::Illustration-->\r\n<div class=\"mb-11\">\r\n  <img src=\"./assets/media/auth/500-error.png\" class=\"mw-100 mh-300px theme-light-show\" alt=\"\" />\r\n  <img src=\"./assets/media/auth/500-error-dark.png\" class=\"mw-100 mh-300px theme-dark-show\" alt=\"\" />\r\n</div>\r\n<!--end::Illustration-->\r\n\r\n<!--begin::Link-->\r\n<div class=\"mb-0\">\r\n  <a (click)=\"routeToDashboard()\" class=\"btn btn-sm btn-primary\">Return Home</a>\r\n</div>\r\n<!--end::Link-->\r\n" }]
+        }], ctorParameters: () => [{ type: i1$1.Router }, { type: i1.ThemeModeService }] });
+
+class TranslationModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TranslationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: TranslationModule, imports: [CommonModule, TranslateModule], exports: [TranslateModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TranslationModule, imports: [CommonModule, TranslateModule, TranslateModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TranslationModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [CommonModule, TranslateModule],
+                    exports: [TranslateModule],
+                }]
+        }] });
+
+// Localization is based on '@ngx-translate/core';
+// Please be familiar with official documentations first => https://github.com/ngx-translate/core
+const LOCALIZATION_LOCAL_STORAGE_KEY = 'language';
+class TranslationService {
+    translate;
+    // Private properties
+    langIds = [];
+    constructor(translate) {
+        this.translate = translate;
+        // add new langIds to the list
+        this.translate.addLangs(['en']);
+        // this language will be used as a fallback when a translation isn't found in the current language
+        this.translate.setDefaultLang('en');
+    }
+    loadTranslations(...args) {
+        const locales = [...args];
+        locales.forEach((locale) => {
+            // use setTranslation() with the third argument set to true
+            // to append translations instead of replacing them
+            this.translate.setTranslation(locale.lang, locale.data, true);
+            this.langIds.push(locale.lang);
+        });
+        // add new languages to the list
+        this.translate.addLangs(this.langIds);
+        this.translate.use(this.getSelectedLanguage());
+    }
+    setLanguage(lang) {
+        if (lang) {
+            this.translate.use(this.translate.getDefaultLang());
+            this.translate.use(lang);
+            localStorage.setItem(LOCALIZATION_LOCAL_STORAGE_KEY, lang);
+        }
+    }
+    /**
+     * Returns selected language
+     */
+    getSelectedLanguage() {
+        return (localStorage.getItem(LOCALIZATION_LOCAL_STORAGE_KEY) ||
+            this.translate.getDefaultLang());
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TranslationService, deps: [{ token: i1$3.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TranslationService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TranslationService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root',
+                }]
+        }], ctorParameters: () => [{ type: i1$3.TranslateService }] });
+
+// USA
+const locale$5 = {
+    lang: 'en',
+    data: {
+        TRANSLATOR: {
+            SELECT: 'Select your language',
+        },
+        MENU: {
+            NEW: 'new',
+            ACTIONS: 'Actions',
+            CREATE_POST: 'Create New Post',
+            PAGES: 'Pages',
+            FEATURES: 'Features',
+            APPS: 'Apps',
+            DASHBOARD: 'Dashboard',
+        },
+        AUTH: {
+            GENERAL: {
+                OR: 'Or',
+                SUBMIT_BUTTON: 'Submit',
+                NO_ACCOUNT: 'Don\'t have an account?',
+                SIGNUP_BUTTON: 'Sign Up',
+                FORGOT_BUTTON: 'Forgot Password',
+                BACK_BUTTON: 'Back',
+                PRIVACY: 'Privacy',
+                LEGAL: 'Legal',
+                CONTACT: 'Contact',
+            },
+            LOGIN: {
+                TITLE: 'Login Account',
+                BUTTON: 'Sign In',
+            },
+            FORGOT: {
+                TITLE: 'Forgotten Password?',
+                DESC: 'Enter your email to reset your password',
+                SUCCESS: 'Your account has been successfully reset.'
+            },
+            REGISTER: {
+                TITLE: 'Sign Up',
+                DESC: 'Enter your details to create your account',
+                SUCCESS: 'Your account has been successfuly registered.'
+            },
+            INPUT: {
+                EMAIL: 'Email',
+                FULLNAME: 'Fullname',
+                PASSWORD: 'Password',
+                CONFIRM_PASSWORD: 'Confirm Password',
+                USERNAME: 'Username'
+            },
+            VALIDATION: {
+                INVALID: '{{name}} is not valid',
+                REQUIRED: '{{name}} is required',
+                MIN_LENGTH: '{{name}} minimum length is {{min}}',
+                AGREEMENT_REQUIRED: 'Accepting terms & conditions are required',
+                NOT_FOUND: 'The requested {{name}} is not found',
+                INVALID_LOGIN: 'The login detail is incorrect',
+                REQUIRED_FIELD: 'Required field',
+                MIN_LENGTH_FIELD: 'Minimum field length:',
+                MAX_LENGTH_FIELD: 'Maximum field length:',
+                INVALID_FIELD: 'Field is not valid',
+            }
+        },
+        ECOMMERCE: {
+            COMMON: {
+                SELECTED_RECORDS_COUNT: 'Selected records count: ',
+                ALL: 'All',
+                SUSPENDED: 'Suspended',
+                ACTIVE: 'Active',
+                FILTER: 'Filter',
+                BY_STATUS: 'by Status',
+                BY_TYPE: 'by Type',
+                BUSINESS: 'Business',
+                INDIVIDUAL: 'Individual',
+                SEARCH: 'Search',
+                IN_ALL_FIELDS: 'in all fields'
+            },
+            ECOMMERCE: 'eCommerce',
+            CUSTOMERS: {
+                CUSTOMERS: 'Customers',
+                CUSTOMERS_LIST: 'Customers list',
+                NEW_CUSTOMER: 'New Customer',
+                DELETE_CUSTOMER_SIMPLE: {
+                    TITLE: 'Customer Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete this customer?',
+                    WAIT_DESCRIPTION: 'Customer is deleting...',
+                    MESSAGE: 'Customer has been deleted'
+                },
+                DELETE_CUSTOMER_MULTY: {
+                    TITLE: 'Customers Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete selected customers?',
+                    WAIT_DESCRIPTION: 'Customers are deleting...',
+                    MESSAGE: 'Selected customers have been deleted'
+                },
+                UPDATE_STATUS: {
+                    TITLE: 'Status has been updated for selected customers',
+                    MESSAGE: 'Selected customers status have successfully been updated'
+                },
+                EDIT: {
+                    UPDATE_MESSAGE: 'Customer has been updated',
+                    ADD_MESSAGE: 'Customer has been created'
+                }
+            }
+        }
+    }
+};
+
+var en = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    locale: locale$5
+});
+
+// China
+const locale$4 = {
+    lang: 'zh',
+    data: {
+        TRANSLATOR: {
+            SELECT: '选择你的语言',
+        },
+        MENU: {
+            NEW: '新',
+            ACTIONS: '行动',
+            CREATE_POST: '创建新帖子',
+            PAGES: 'Pages',
+            FEATURES: '特征',
+            APPS: '应用',
+            DASHBOARD: '仪表板',
+        },
+        AUTH: {
+            GENERAL: {
+                OR: '要么',
+                SUBMIT_BUTTON: '提交',
+                NO_ACCOUNT: '没有账号？',
+                SIGNUP_BUTTON: '注册',
+                FORGOT_BUTTON: '忘记密码',
+                BACK_BUTTON: '背部',
+                PRIVACY: '隐私',
+                LEGAL: '法律',
+                CONTACT: '联系',
+            },
+            LOGIN: {
+                TITLE: '创建帐号',
+                BUTTON: '签到',
+            },
+            FORGOT: {
+                TITLE: 'Forgotten Password?',
+                DESC: 'Enter your email to reset your password',
+                SUCCESS: 'Your account has been successfully reset.',
+            },
+            REGISTER: {
+                TITLE: 'Sign Up',
+                DESC: 'Enter your details to create your account',
+                SUCCESS: 'Your account has been successfuly registered.',
+            },
+            INPUT: {
+                EMAIL: 'Email',
+                FULLNAME: 'Fullname',
+                PASSWORD: 'Password',
+                CONFIRM_PASSWORD: 'Confirm Password',
+                USERNAME: '用戶名',
+            },
+            VALIDATION: {
+                INVALID: '{{name}} is not valid',
+                REQUIRED: '{{name}} is required',
+                MIN_LENGTH: '{{name}} minimum length is {{min}}',
+                AGREEMENT_REQUIRED: 'Accepting terms & conditions are required',
+                NOT_FOUND: 'The requested {{name}} is not found',
+                INVALID_LOGIN: 'The login detail is incorrect',
+                REQUIRED_FIELD: 'Required field',
+                MIN_LENGTH_FIELD: 'Minimum field length:',
+                MAX_LENGTH_FIELD: 'Maximum field length:',
+                INVALID_FIELD: 'Field is not valid',
+            },
+        },
+        ECOMMERCE: {
+            COMMON: {
+                SELECTED_RECORDS_COUNT: 'Selected records count: ',
+                ALL: 'All',
+                SUSPENDED: 'Suspended',
+                ACTIVE: 'Active',
+                FILTER: 'Filter',
+                BY_STATUS: 'by Status',
+                BY_TYPE: 'by Type',
+                BUSINESS: 'Business',
+                INDIVIDUAL: 'Individual',
+                SEARCH: 'Search',
+                IN_ALL_FIELDS: 'in all fields',
+            },
+            ECOMMERCE: 'eCommerce',
+            CUSTOMERS: {
+                CUSTOMERS: '顾客',
+                CUSTOMERS_LIST: '客户名单',
+                NEW_CUSTOMER: 'New Customer',
+                DELETE_CUSTOMER_SIMPLE: {
+                    TITLE: 'Customer Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete this customer?',
+                    WAIT_DESCRIPTION: 'Customer is deleting...',
+                    MESSAGE: 'Customer has been deleted',
+                },
+                DELETE_CUSTOMER_MULTY: {
+                    TITLE: 'Customers Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete selected customers?',
+                    WAIT_DESCRIPTION: 'Customers are deleting...',
+                    MESSAGE: 'Selected customers have been deleted',
+                },
+                UPDATE_STATUS: {
+                    TITLE: 'Status has been updated for selected customers',
+                    MESSAGE: 'Selected customers status have successfully been updated',
+                },
+                EDIT: {
+                    UPDATE_MESSAGE: 'Customer has been updated',
+                    ADD_MESSAGE: 'Customer has been created',
+                },
+            },
+        },
+    },
+};
+
+var ch = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    locale: locale$4
+});
+
+// Germany
+const locale$3 = {
+    lang: 'de',
+    data: {
+        TRANSLATOR: {
+            SELECT: 'Wähle deine Sprache',
+        },
+        MENU: {
+            NEW: 'Neu',
+            ACTIONS: 'Aktionen',
+            CREATE_POST: 'Erstellen Sie einen neuen Beitrag',
+            PAGES: 'Pages',
+            FEATURES: 'Eigenschaften',
+            APPS: 'Apps',
+            DASHBOARD: 'Instrumententafel'
+        },
+        AUTH: {
+            GENERAL: {
+                OR: 'Oder',
+                SUBMIT_BUTTON: 'einreichen',
+                NO_ACCOUNT: 'Hast du kein Konto?',
+                SIGNUP_BUTTON: 'Anmelden',
+                FORGOT_BUTTON: 'Passwort vergessen',
+                BACK_BUTTON: 'Zurück',
+                PRIVACY: 'Privatsphäre',
+                LEGAL: 'Legal',
+                CONTACT: 'Kontakt',
+            },
+            LOGIN: {
+                TITLE: 'Create Account',
+                BUTTON: 'Sign In',
+            },
+            FORGOT: {
+                TITLE: 'Forgotten Password?',
+                DESC: 'Enter your email to reset your password',
+                SUCCESS: 'Your account has been successfully reset.'
+            },
+            REGISTER: {
+                TITLE: 'Sign Up',
+                DESC: 'Enter your details to create your account',
+                SUCCESS: 'Your account has been successfuly registered.'
+            },
+            INPUT: {
+                EMAIL: 'Email',
+                FULLNAME: 'Fullname',
+                PASSWORD: 'Password',
+                CONFIRM_PASSWORD: 'Confirm Password',
+                USERNAME: 'Nutzername'
+            },
+            VALIDATION: {
+                INVALID: '{{name}} is not valid',
+                REQUIRED: '{{name}} is required',
+                MIN_LENGTH: '{{name}} minimum length is {{min}}',
+                AGREEMENT_REQUIRED: 'Accepting terms & conditions are required',
+                NOT_FOUND: 'The requested {{name}} is not found',
+                INVALID_LOGIN: 'The login detail is incorrect',
+                REQUIRED_FIELD: 'Required field',
+                MIN_LENGTH_FIELD: 'Minimum field length:',
+                MAX_LENGTH_FIELD: 'Maximum field length:',
+                INVALID_FIELD: 'Field is not valid',
+            }
+        },
+        ECOMMERCE: {
+            COMMON: {
+                SELECTED_RECORDS_COUNT: 'Selected records count: ',
+                ALL: 'All',
+                SUSPENDED: 'Suspended',
+                ACTIVE: 'Active',
+                FILTER: 'Filter',
+                BY_STATUS: 'by Status',
+                BY_TYPE: 'by Type',
+                BUSINESS: 'Business',
+                INDIVIDUAL: 'Individual',
+                SEARCH: 'Search',
+                IN_ALL_FIELDS: 'in all fields'
+            },
+            ECOMMERCE: 'eCommerce',
+            CUSTOMERS: {
+                CUSTOMERS: 'Customers',
+                CUSTOMERS_LIST: 'Customers list',
+                NEW_CUSTOMER: 'New Customer',
+                DELETE_CUSTOMER_SIMPLE: {
+                    TITLE: 'Customer Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete this customer?',
+                    WAIT_DESCRIPTION: 'Customer is deleting...',
+                    MESSAGE: 'Customer has been deleted'
+                },
+                DELETE_CUSTOMER_MULTY: {
+                    TITLE: 'Customers Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete selected customers?',
+                    WAIT_DESCRIPTION: 'Customers are deleting...',
+                    MESSAGE: 'Selected customers have been deleted'
+                },
+                UPDATE_STATUS: {
+                    TITLE: 'Status has been updated for selected customers',
+                    MESSAGE: 'Selected customers status have successfully been updated'
+                },
+                EDIT: {
+                    UPDATE_MESSAGE: 'Customer has been updated',
+                    ADD_MESSAGE: 'Customer has been created'
+                }
+            }
+        }
+    }
+};
+
+var de = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    locale: locale$3
+});
+
+// Spain
+const locale$2 = {
+    lang: 'es',
+    data: {
+        TRANSLATOR: {
+            SELECT: 'Elige tu idioma',
+        },
+        MENU: {
+            NEW: 'nuevo',
+            ACTIONS: 'Comportamiento',
+            CREATE_POST: 'Crear nueva publicación',
+            PAGES: 'Pages',
+            FEATURES: 'Caracteristicas',
+            APPS: 'Aplicaciones',
+            DASHBOARD: 'Tablero'
+        },
+        AUTH: {
+            GENERAL: {
+                OR: 'O',
+                SUBMIT_BUTTON: 'Enviar',
+                NO_ACCOUNT: 'No tienes una cuenta?',
+                SIGNUP_BUTTON: 'Regístrate',
+                FORGOT_BUTTON: 'Se te olvidó tu contraseña',
+                BACK_BUTTON: 'Espalda',
+                PRIVACY: 'Intimidad',
+                LEGAL: 'Legal',
+                CONTACT: 'Contacto',
+            },
+            LOGIN: {
+                TITLE: 'Crear una cuenta',
+                BUTTON: 'Registrarse',
+            },
+            FORGOT: {
+                TITLE: 'Contraseña olvidada?',
+                DESC: 'Ingrese su correo electrónico para restablecer su contraseña',
+                SUCCESS: 'Your account has been successfully reset.'
+            },
+            REGISTER: {
+                TITLE: 'Sign Up',
+                DESC: 'Enter your details to create your account',
+                SUCCESS: 'Your account has been successfuly registered.'
+            },
+            INPUT: {
+                EMAIL: 'Email',
+                FULLNAME: 'Fullname',
+                PASSWORD: 'Password',
+                CONFIRM_PASSWORD: 'Confirm Password',
+                USERNAME: 'Usuario'
+            },
+            VALIDATION: {
+                INVALID: '{{name}} is not valid',
+                REQUIRED: '{{name}} is required',
+                MIN_LENGTH: '{{name}} minimum length is {{min}}',
+                AGREEMENT_REQUIRED: 'Accepting terms & conditions are required',
+                NOT_FOUND: 'The requested {{name}} is not found',
+                INVALID_LOGIN: 'The login detail is incorrect',
+                REQUIRED_FIELD: 'Required field',
+                MIN_LENGTH_FIELD: 'Minimum field length:',
+                MAX_LENGTH_FIELD: 'Maximum field length:',
+                INVALID_FIELD: 'Field is not valid',
+            }
+        },
+        ECOMMERCE: {
+            COMMON: {
+                SELECTED_RECORDS_COUNT: 'Selected records count: ',
+                ALL: 'All',
+                SUSPENDED: 'Suspended',
+                ACTIVE: 'Active',
+                FILTER: 'Filter',
+                BY_STATUS: 'by Status',
+                BY_TYPE: 'by Type',
+                BUSINESS: 'Business',
+                INDIVIDUAL: 'Individual',
+                SEARCH: 'Search',
+                IN_ALL_FIELDS: 'in all fields'
+            },
+            ECOMMERCE: 'eCommerce',
+            CUSTOMERS: {
+                CUSTOMERS: 'Customers',
+                CUSTOMERS_LIST: 'Customers list',
+                NEW_CUSTOMER: 'New Customer',
+                DELETE_CUSTOMER_SIMPLE: {
+                    TITLE: 'Customer Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete this customer?',
+                    WAIT_DESCRIPTION: 'Customer is deleting...',
+                    MESSAGE: 'Customer has been deleted'
+                },
+                DELETE_CUSTOMER_MULTY: {
+                    TITLE: 'Customers Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete selected customers?',
+                    WAIT_DESCRIPTION: 'Customers are deleting...',
+                    MESSAGE: 'Selected customers have been deleted'
+                },
+                UPDATE_STATUS: {
+                    TITLE: 'Status has been updated for selected customers',
+                    MESSAGE: 'Selected customers status have successfully been updated'
+                },
+                EDIT: {
+                    UPDATE_MESSAGE: 'Customer has been updated',
+                    ADD_MESSAGE: 'Customer has been created'
+                }
+            }
+        }
+    }
+};
+
+var es = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    locale: locale$2
+});
+
+// France
+const locale$1 = {
+    lang: 'fr',
+    data: {
+        TRANSLATOR: {
+            SELECT: 'choisissez votre langue',
+        },
+        MENU: {
+            NEW: 'Nouveau',
+            ACTIONS: 'Actes',
+            CREATE_POST: 'Créer un nouveau Post',
+            PAGES: 'Pages',
+            FEATURES: 'Fonctionnalités',
+            APPS: 'Applications',
+            DASHBOARD: 'Tableau de Bord',
+        },
+        AUTH: {
+            GENERAL: {
+                OR: 'Ou',
+                SUBMIT_BUTTON: 'Soumettre',
+                NO_ACCOUNT: 'Ne pas avoir de compte?',
+                SIGNUP_BUTTON: 'Registre',
+                FORGOT_BUTTON: 'Mot de passe oublié',
+                BACK_BUTTON: 'Back',
+                PRIVACY: 'Privacy',
+                LEGAL: 'Legal',
+                CONTACT: 'Contact',
+            },
+            LOGIN: {
+                TITLE: 'Créer un compte',
+                BUTTON: 'Sign In',
+            },
+            FORGOT: {
+                TITLE: 'Forgotten Password?',
+                DESC: 'Enter your email to reset your password',
+                SUCCESS: 'Your account has been successfully reset.'
+            },
+            REGISTER: {
+                TITLE: 'Sign Up',
+                DESC: 'Enter your details to create your account',
+                SUCCESS: 'Your account has been successfuly registered.'
+            },
+            INPUT: {
+                EMAIL: 'Email',
+                FULLNAME: 'Fullname',
+                PASSWORD: 'Mot de passe',
+                CONFIRM_PASSWORD: 'Confirm Password',
+                USERNAME: 'Nom d\'utilisateur'
+            },
+            VALIDATION: {
+                INVALID: '{{name}} n\'est pas valide',
+                REQUIRED: '{{name}} est requis',
+                MIN_LENGTH: '{{name}} minimum length is {{min}}',
+                AGREEMENT_REQUIRED: 'Accepting terms & conditions are required',
+                NOT_FOUND: 'The requested {{name}} is not found',
+                INVALID_LOGIN: 'The login detail is incorrect',
+                REQUIRED_FIELD: 'Required field',
+                MIN_LENGTH_FIELD: 'Minimum field length:',
+                MAX_LENGTH_FIELD: 'Maximum field length:',
+                INVALID_FIELD: 'Field is not valid',
+            }
+        },
+        ECOMMERCE: {
+            COMMON: {
+                SELECTED_RECORDS_COUNT: 'Nombre d\'enregistrements sélectionnés: ',
+                ALL: 'All',
+                SUSPENDED: 'Suspended',
+                ACTIVE: 'Active',
+                FILTER: 'Filter',
+                BY_STATUS: 'by Status',
+                BY_TYPE: 'by Type',
+                BUSINESS: 'Business',
+                INDIVIDUAL: 'Individual',
+                SEARCH: 'Search',
+                IN_ALL_FIELDS: 'in all fields'
+            },
+            ECOMMERCE: 'éCommerce',
+            CUSTOMERS: {
+                CUSTOMERS: 'Les clients',
+                CUSTOMERS_LIST: 'Liste des clients',
+                NEW_CUSTOMER: 'Nouveau client',
+                DELETE_CUSTOMER_SIMPLE: {
+                    TITLE: 'Suppression du client',
+                    DESCRIPTION: 'Êtes-vous sûr de supprimer définitivement ce client?',
+                    WAIT_DESCRIPTION: 'Le client est en train de supprimer ...',
+                    MESSAGE: 'Le client a été supprimé'
+                },
+                DELETE_CUSTOMER_MULTY: {
+                    TITLE: 'Supprimer les clients',
+                    DESCRIPTION: 'Êtes-vous sûr de supprimer définitivement les clients sélectionnés?',
+                    WAIT_DESCRIPTION: 'Les clients suppriment ...',
+                    MESSAGE: 'Les clients sélectionnés ont été supprimés'
+                },
+                UPDATE_STATUS: {
+                    TITLE: 'Le statut a été mis à jour pour les clients sélectionnés',
+                    MESSAGE: 'Le statut des clients sélectionnés a été mis à jour avec succès'
+                },
+                EDIT: {
+                    UPDATE_MESSAGE: 'Le client a été mis à jour',
+                    ADD_MESSAGE: 'Le client a été créé'
+                }
+            }
+        }
+    }
+};
+
+var fr = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    locale: locale$1
+});
+
+// Japan
+const locale = {
+    lang: 'ja',
+    data: {
+        TRANSLATOR: {
+            SELECT: 'あなたが使う言語を選んでください',
+        },
+        MENU: {
+            NEW: '新しい',
+            ACTIONS: '行動',
+            CREATE_POST: '新しい投稿を作成',
+            PAGES: 'Pages',
+            FEATURES: '特徴',
+            APPS: 'アプリ',
+            DASHBOARD: 'ダッシュボード',
+        },
+        AUTH: {
+            GENERAL: {
+                OR: 'または',
+                SUBMIT_BUTTON: '提出する',
+                NO_ACCOUNT: 'アカウントを持っていない？',
+                SIGNUP_BUTTON: 'サインアップ',
+                FORGOT_BUTTON: 'パスワードをお忘れですか',
+                BACK_BUTTON: 'バック',
+                PRIVACY: 'プライバシー',
+                LEGAL: '法的',
+                CONTACT: '接触',
+            },
+            LOGIN: {
+                TITLE: 'Create Account',
+                BUTTON: 'Sign In',
+            },
+            FORGOT: {
+                TITLE: 'Forgotten Password?',
+                DESC: 'Enter your email to reset your password',
+                SUCCESS: 'Your account has been successfully reset.',
+            },
+            REGISTER: {
+                TITLE: 'Sign Up',
+                DESC: 'Enter your details to create your account',
+                SUCCESS: 'Your account has been successfuly registered.',
+            },
+            INPUT: {
+                EMAIL: 'Email',
+                FULLNAME: 'Fullname',
+                PASSWORD: 'Password',
+                CONFIRM_PASSWORD: 'Confirm Password',
+                USERNAME: 'ユーザー名',
+            },
+            VALIDATION: {
+                INVALID: '{{name}} is not valid',
+                REQUIRED: '{{name}} is required',
+                MIN_LENGTH: '{{name}} minimum length is {{min}}',
+                AGREEMENT_REQUIRED: 'Accepting terms & conditions are required',
+                NOT_FOUND: 'The requested {{name}} is not found',
+                INVALID_LOGIN: 'The login detail is incorrect',
+                REQUIRED_FIELD: 'Required field',
+                MIN_LENGTH_FIELD: 'Minimum field length:',
+                MAX_LENGTH_FIELD: 'Maximum field length:',
+                INVALID_FIELD: 'Field is not valid',
+            },
+        },
+        ECOMMERCE: {
+            COMMON: {
+                SELECTED_RECORDS_COUNT: 'Selected records count: ',
+                ALL: 'All',
+                SUSPENDED: 'Suspended',
+                ACTIVE: 'Active',
+                FILTER: 'Filter',
+                BY_STATUS: 'by Status',
+                BY_TYPE: 'by Type',
+                BUSINESS: 'Business',
+                INDIVIDUAL: 'Individual',
+                SEARCH: 'Search',
+                IN_ALL_FIELDS: 'in all fields',
+            },
+            ECOMMERCE: 'eCommerce',
+            CUSTOMERS: {
+                CUSTOMERS: 'Customers',
+                CUSTOMERS_LIST: 'Customers list',
+                NEW_CUSTOMER: 'New Customer',
+                DELETE_CUSTOMER_SIMPLE: {
+                    TITLE: 'Customer Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete this customer?',
+                    WAIT_DESCRIPTION: 'Customer is deleting...',
+                    MESSAGE: 'Customer has been deleted',
+                },
+                DELETE_CUSTOMER_MULTY: {
+                    TITLE: 'Customers Delete',
+                    DESCRIPTION: 'Are you sure to permanently delete selected customers?',
+                    WAIT_DESCRIPTION: 'Customers are deleting...',
+                    MESSAGE: 'Selected customers have been deleted',
+                },
+                UPDATE_STATUS: {
+                    TITLE: 'Status has been updated for selected customers',
+                    MESSAGE: 'Selected customers status have successfully been updated',
+                },
+                EDIT: {
+                    UPDATE_MESSAGE: 'Customer has been updated',
+                    ADD_MESSAGE: 'Customer has been created',
+                },
+            },
+        },
+    },
+};
+
+var jp = /*#__PURE__*/Object.freeze({
+    __proto__: null,
+    locale: locale
+});
+
+const Routing = [
+    {
+        path: 'manage',
+        loadChildren: () => import('./tango-app-ui-shared-manage-wrapper.module-B6GJQNQZ.mjs').then((m) => m.ManageWrapperModule),
+    },
+    {
+        path: 'manage/stores/:id',
+        loadChildren: () => import('./tango-app-ui-shared-store-wrapper.module-UYYC9an_.mjs').then((m) => m.StoreWrapperModule),
+    },
+    {
+        path: 'profile',
+        loadChildren: () => import('./tango-app-ui-shared-profile-wrapper.module-CTJBnU9I.mjs').then((m) => m.ProfileWrapperModule),
+    },
+    {
+        path: '',
+        redirectTo: '/manage',
+        pathMatch: 'full',
+    },
+    {
+        path: '**',
+        redirectTo: 'error/404',
+    },
+];
+
+const routes$1 = [
+    {
+        path: '',
+        component: LayoutComponent,
+        children: Routing,
+    },
+];
+class LayoutModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: LayoutModule, declarations: [LayoutComponent,
+            HeaderComponent,
+            ContentComponent,
+            FooterComponent,
+            ScriptsInitComponent,
+            ToolbarComponent,
+            PageTitleComponent,
+            HeaderMenuComponent,
+            // EngagesComponent,
+            SidebarComponent,
+            SidebarLogoComponent,
+            SidebarMenuComponent,
+            SidebarFooterComponent,
+            NavbarComponent,
+            AccountingComponent,
+            ClassicComponent,
+            ExtendedComponent,
+            ReportsComponent,
+            SaasComponent,
+            KeeniconComponent,
+            LayoutScrollTopComponent], imports: [CommonModule, i1$1.RouterModule, TranslationModule,
+            InlineSVGModule,
+            NgbDropdownModule,
+            NgbProgressbarModule,
+            // ExtrasModule,
+            // ModalsModule,
+            // DrawersModule,
+            // EngagesModule,
+            // DropdownMenusModule,
+            NgbTooltipModule,
+            TranslateModule], exports: [RouterModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutModule, imports: [CommonModule,
+            RouterModule.forChild(routes$1),
+            TranslationModule,
+            InlineSVGModule,
+            NgbDropdownModule,
+            NgbProgressbarModule,
+            // ExtrasModule,
+            // ModalsModule,
+            // DrawersModule,
+            // EngagesModule,
+            // DropdownMenusModule,
+            NgbTooltipModule,
+            TranslateModule, RouterModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        LayoutComponent,
+                        HeaderComponent,
+                        ContentComponent,
+                        FooterComponent,
+                        ScriptsInitComponent,
+                        ToolbarComponent,
+                        PageTitleComponent,
+                        HeaderMenuComponent,
+                        // EngagesComponent,
+                        SidebarComponent,
+                        SidebarLogoComponent,
+                        SidebarMenuComponent,
+                        SidebarFooterComponent,
+                        NavbarComponent,
+                        AccountingComponent,
+                        ClassicComponent,
+                        ExtendedComponent,
+                        ReportsComponent,
+                        SaasComponent,
+                        KeeniconComponent,
+                        LayoutScrollTopComponent
+                    ],
+                    imports: [
+                        CommonModule,
+                        RouterModule.forChild(routes$1),
+                        TranslationModule,
+                        InlineSVGModule,
+                        NgbDropdownModule,
+                        NgbProgressbarModule,
+                        // ExtrasModule,
+                        // ModalsModule,
+                        // DrawersModule,
+                        // EngagesModule,
+                        // DropdownMenusModule,
+                        NgbTooltipModule,
+                        TranslateModule,
+                        // ThemeModeModule,
+                    ],
+                    exports: [RouterModule],
+                }]
+        }] });
+
+const routes = [
+    {
+        path: '',
+        component: ErrorsComponent,
+        children: [
+            {
+                path: '404',
+                component: Error404Component,
+            },
+            {
+                path: '500',
+                component: Error500Component,
+            },
+            { path: '', redirectTo: '404', pathMatch: 'full' },
+            { path: '**', redirectTo: '404', pathMatch: 'full' },
+        ],
+    },
+];
+class ErrorsRoutingModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: ErrorsRoutingModule, imports: [i1$1.RouterModule], exports: [RouterModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsRoutingModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    imports: [RouterModule.forChild(routes)],
+                    exports: [RouterModule],
+                }]
+        }] });
+
+class ErrorsModule {
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: ErrorsModule, declarations: [ErrorsComponent,
+            Error404Component,
+            Error500Component], imports: [CommonModule,
+            ErrorsRoutingModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsModule, imports: [CommonModule,
+            ErrorsRoutingModule] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: [
+                        ErrorsComponent,
+                        Error404Component,
+                        Error500Component
+                    ],
+                    imports: [
+                        CommonModule,
+                        ErrorsRoutingModule
+                    ]
+                }]
+        }] });
+
+class AuthService {
+    router;
+    constructor(router) {
+        this.router = router;
+    }
+    logout() {
+        this.router.navigate(['/auth/login'], {
+            queryParams: {},
+        });
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthService, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }], ctorParameters: () => [{ type: i1$1.Router }] });
+
+class AuthGuard {
+    authService;
+    constructor(authService) {
+        this.authService = authService;
+    }
+    canActivate(route, state) {
+        const currentUser = localStorage.getItem('isLoggedIn');
+        if (currentUser === 'true') {
+            // logged in so return true
+            return true;
+        }
+        // not logged in so redirect to login page with the return url
+        this.authService.logout();
+        return false;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthGuard, deps: [{ token: AuthService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthGuard, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthGuard, decorators: [{
+            type: Injectable,
+            args: [{ providedIn: 'root' }]
+        }], ctorParameters: () => [{ type: AuthService }] });
+
+class GlobalStateService {
+    userData = new BehaviorSubject(null);
+    environment = new BehaviorSubject(null);
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: GlobalStateService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: GlobalStateService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: GlobalStateService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class HttpAuthInterceptor {
+    constructor() { }
+    intercept(request, next) {
+        request = request.clone({
+            setHeaders: {
+                Authorization: `Bearer 7762ffb2-58be-47ab-be39-99e776bfe78a`
+            }
+        });
+        return next.handle(request);
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HttpAuthInterceptor, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HttpAuthInterceptor });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HttpAuthInterceptor, decorators: [{
+            type: Injectable
+        }], ctorParameters: () => [] });
+
+/*
+ * Public API Surface of tango-app-shared
+ */
+// Components
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { AccountingComponent, AuthGuard, AuthService, ClassicComponent, ContentComponent, Error404Component, Error500Component, ErrorsComponent, ErrorsModule, ExtendedComponent, FooterComponent, GlobalStateService, HeaderComponent, HeaderMenuComponent, HttpAuthInterceptor, LayoutComponent, LayoutModule, LayoutScrollTopComponent, NavbarComponent, PageTitleComponent, ReportsComponent, SaasComponent, ScriptsInitComponent, SidebarComponent, SidebarFooterComponent, SidebarLogoComponent, SidebarMenuComponent, ToolbarComponent, TranslationModule, TranslationService, ch as chLang, de as deLang, en as enLang, es as esLang, fr as frLang, jp as jpLang };
+//# sourceMappingURL=tango-app-ui-shared.mjs.map