npm - tango-app-ui-shared - Versions diffs - 3.0.23-dev → 3.0.25-dev - Mend

tango-app-ui-shared 3.0.23-dev → 3.0.25-dev

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (71) hide show

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

@@ -2,19 +2,17 @@ import * as i0 from '@angular/core';
 import { Component, Input, HostBinding, Injectable, HostListener, EventEmitter, ChangeDetectionStrategy, Output, ViewChild, NgModule, Pipe } from '@angular/core';
 import * as i1$1 from '@angular/router';
 import { NavigationEnd, NavigationCancel, ResolveEnd, RouterModule } from '@angular/router';
-import * as i1 from 'tango-app-ui-metronics';
-import { MenuComponent, ToggleComponent, ScrollTopComponent, DrawerComponent, StickyComponent, ScrollComponent } from 'tango-app-ui-metronics';
+import * as i1 from 'tango-app-ui-global';
+import { MenuComponent, ToggleComponent, ScrollTopComponent, DrawerComponent, StickyComponent, ScrollComponent } from 'tango-app-ui-global';
 import * as i2 from '@angular/common';
 import { CommonModule, DatePipe } from '@angular/common';
 import { filter } from 'rxjs/operators';
 import * as i3 from '@angular/platform-browser';
-import * as i1$2 from 'tango-app-ui-global';
-import { ToggleComponent as ToggleComponent$1, ScrollTopComponent as ScrollTopComponent$1, DrawerComponent as DrawerComponent$1, StickyComponent as StickyComponent$1, MenuComponent as MenuComponent$1, ScrollComponent as ScrollComponent$1 } from 'tango-app-ui-global';
 import dayjs from 'dayjs';
 import 'dayjs/locale/en';
 import utc from 'dayjs/plugin/utc';
 import timezone from 'dayjs/plugin/timezone';
-import { throwError, map, catchError, BehaviorSubject } from 'rxjs';
+import { throwError, map, catchError } from 'rxjs';
 import * as i3$1 from '@angular/common/http';
 import * as i4 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
@@ -22,7 +20,7 @@ import * as i5 from 'ngx-daterangepicker-material';
 import { NgxDaterangepickerMd } from 'ngx-daterangepicker-material';
 import * as i3$2 from 'ngx-pagination';
 import { NgxPaginationModule } from 'ngx-pagination';
-import * as i1$3 from '@ngx-translate/core';
+import * as i1$2 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';
@@ -53,10 +51,10 @@ class HeaderMenuComponent {
     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 mt-2\" [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" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", 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.3.2", 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 mt-2\" [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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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 mt-2\" [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: [{
@@ -74,10 +72,10 @@ class NavbarComponent {
     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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: NavbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: [{
@@ -1330,10 +1328,10 @@ class KeeniconComponent {
     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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: KeeniconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: [{
@@ -1429,10 +1427,10 @@ class HeaderComponent {
     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  class=\"d-lg-none\">\r\n        <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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 >\r\n        <ng-container *ngIf=\"currentLayoutType === 'dark-header'\">\r\n          <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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/tango/sidemenu-icons/tango_logo.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default theme-light-show\" />\r\n          <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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 header-border\" 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}.header-border{border-bottom:1px solid #EAECF0}\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: 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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", 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.3.2", 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  class=\"d-lg-none\">\r\n        <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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 >\r\n        <ng-container *ngIf=\"currentLayoutType === 'dark-header'\">\r\n          <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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/tango/sidemenu-icons/tango_logo.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default theme-light-show\" />\r\n          <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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 header-border\" 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}.header-border{border-bottom:1px solid #EAECF0}\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: 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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  class=\"d-lg-none\">\r\n        <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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 >\r\n        <ng-container *ngIf=\"currentLayoutType === 'dark-header'\">\r\n          <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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/tango/sidemenu-icons/tango_logo.svg\"\r\n            class=\"h-20px h-lg-30px app-sidebar-logo-default theme-light-show\" />\r\n          <img alt=\"Logo\" src=\"./assets/tango/sidemenu-icons/tango_logo.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 header-border\" 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}.header-border{border-bottom:1px solid #EAECF0}\n"] }]
         }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }] });
@@ -1461,10 +1459,10 @@ class ContentComponent {
     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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ContentComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: [{
@@ -1533,10 +1531,10 @@ class ScriptsInitComponent {
     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.LayoutService }, { token: i1.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: "" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ScriptsInitComponent, deps: [{ token: i1.LayoutService }, { token: i1.PageInfoService }, { token: i1$1.Router }, { token: i3.Title }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: ScriptsInitComponent, selector: "lib-scripts-init", ngImport: i0, template: "" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ScriptsInitComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ScriptsInitComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-scripts-init', template: "" }]
         }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1.PageInfoService }, { type: i1$1.Router }, { type: i3.Title }] });
@@ -1572,10 +1570,10 @@ class PageTitleComponent {
     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:var(--Primary-600, #00A3FF);font-family:Inter;font-size:16px;font-weight:500;line-height:24px}.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" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", 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.3.2", 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:var(--Primary-600, #00A3FF);font-family:Inter;font-size:16px;font-weight:500;line-height:24px}.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", "info", "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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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:var(--Primary-600, #00A3FF);font-family:Inter;font-size:16px;font-weight:500;line-height:24px}.inactive-bc{color:#98a2b3}\n"] }]
         }], ctorParameters: () => [{ type: i1.PageInfoService }, { type: i0.ChangeDetectorRef }], propDecorators: { appPageTitleDirection: [{
@@ -1630,15 +1628,15 @@ class AuthService {
         return this.http.get(`${this.storeApiUrl}/get-stores?clientId=${id}`, {})
             .pipe(map((response) => response), catchError(this.handleError));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthService, deps: [{ token: i1$1.Router }, { token: i1$2.GlobalStateService }, { token: i3$1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AuthService, deps: [{ token: i1$1.Router }, { token: i1.GlobalStateService }, { token: i3$1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AuthService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AuthService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: () => [{ type: i1$1.Router }, { type: i1$2.GlobalStateService }, { type: i3$1.HttpClient }] });
+        }], ctorParameters: () => [{ type: i1$1.Router }, { type: i1.GlobalStateService }, { type: i3$1.HttpClient }] });
 dayjs.extend(utc);
 dayjs.extend(timezone);
@@ -1926,13 +1924,13 @@ class ClassicComponent {
         }
         this.selectedFilters.date = this.selectedDateRange;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ClassicComponent, deps: [{ token: i1$2.LayoutService }, { token: i1$2.GlobalStateService }, { token: AuthService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ClassicComponent, selector: "lib-classic", host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"py-3 dropdown1 cursor-pointer\" *ngFor=\"let item of dataObject; let i = index\">\r\n    <div class=\"dropdown form-select\" (click)=\"Dropdown('Clients',i,$event)\">\r\n        <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ?\r\n            selectedValuesArray[i]?.length + ' ' + 'Clients'.split(' ').pop() : 'Clients' }}</span>\r\n    </div>\r\n    <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n        <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n            <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n                [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n                (change)=\"toggleCheckbox('Select All', i)\">\r\n            <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n                Select All\r\n            </label>\r\n        </div>\r\n\r\n        <div class=\"border border-gray mt-3\"></div>\r\n        <div class=\"mt-3 d-flex align-items-center mx-2\">\r\n            <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n                    <path\r\n                        d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\"\r\n                        stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                </svg>\r\n            </span>\r\n            <input type=\"text\" [(ngModel)]=\"searchValue\" (input)=\"searchData($event,i)\"\r\n                class=\"form-control searchinput ps-14 py-2  mt-2\" placeholder=\"Search\" autocomplete=\"off\" />\r\n        </div>\r\n        <div *ngFor=\"let issue of item.Issues\" class=\"form-check d-flex align-items-center py-3 px-5\">\r\n            <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"issue.clientName\" id=\"option{{issue.clientId}}\"\r\n                [checked]=\"selectedValuesArray[i]?.includes(issue.clientId)\" (change)=\"toggleCheckbox(issue.clientId,i)\">\r\n            <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{issue.clientId}}\">\r\n                {{ issue.clientName }}\r\n            </label>\r\n        </div>\r\n        <div class=\"mt-5 d-flex justify-content-center\">\r\n            <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n        </div>\r\n    </div>\r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n\r\n<!-- <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd \r\n    [singleDatePicker]=\"true\"\r\n    [drops]=\"'down'\"\r\n    [opens]=\"'right'\"\r\n    [alwaysShowCalendars]=\"false\"\r\n    [keepCalendarOpeningWithRange]=\"true\"\r\n    [showCancel]=\"true\"\r\n    autocomplete=\"off\"\r\n    [(ngModel)]=\"selectedDate\"\r\n    [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n    (selected)=\"onDateSelect($event)\"\r\n    name=\"daterange\" /> -->\r\n\r\n<div class=\"btn btn-primary\" (click)=\"Apply()\">Apply</div>", styles: [".dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:250px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.btn-primary{line-height:18px!important}\n"], dependencies: [{ 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: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ClassicComponent, deps: [{ token: i1.LayoutService }, { token: i1.GlobalStateService }, { token: AuthService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: ClassicComponent, selector: "lib-classic", host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"py-3 dropdown1 cursor-pointer\" *ngFor=\"let item of dataObject; let i = index\">\r\n    <div class=\"dropdown form-select\" (click)=\"Dropdown('Clients',i,$event)\">\r\n        <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ?\r\n            selectedValuesArray[i]?.length + ' ' + 'Clients'.split(' ').pop() : 'Clients' }}</span>\r\n    </div>\r\n    <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n        <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n            <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n                [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n                (change)=\"toggleCheckbox('Select All', i)\">\r\n            <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n                Select All\r\n            </label>\r\n        </div>\r\n\r\n        <div class=\"border border-gray mt-3\"></div>\r\n        <div class=\"mt-3 d-flex align-items-center mx-2\">\r\n            <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n                    <path\r\n                        d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\"\r\n                        stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                </svg>\r\n            </span>\r\n            <input type=\"text\" [(ngModel)]=\"searchValue\" (input)=\"searchData($event,i)\"\r\n                class=\"form-control searchinput ps-14 py-2  mt-2\" placeholder=\"Search\" autocomplete=\"off\" />\r\n        </div>\r\n        <div *ngFor=\"let issue of item.Issues\" class=\"form-check d-flex align-items-center py-3 px-5\">\r\n            <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"issue.clientName\" id=\"option{{issue.clientId}}\"\r\n                [checked]=\"selectedValuesArray[i]?.includes(issue.clientId)\" (change)=\"toggleCheckbox(issue.clientId,i)\">\r\n            <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{issue.clientId}}\">\r\n                {{ issue.clientName }}\r\n            </label>\r\n        </div>\r\n        <div class=\"mt-5 d-flex justify-content-center\">\r\n            <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n        </div>\r\n    </div>\r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n\r\n<!-- <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd \r\n    [singleDatePicker]=\"true\"\r\n    [drops]=\"'down'\"\r\n    [opens]=\"'right'\"\r\n    [alwaysShowCalendars]=\"false\"\r\n    [keepCalendarOpeningWithRange]=\"true\"\r\n    [showCancel]=\"true\"\r\n    autocomplete=\"off\"\r\n    [(ngModel)]=\"selectedDate\"\r\n    [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n    (selected)=\"onDateSelect($event)\"\r\n    name=\"daterange\" /> -->\r\n\r\n<div class=\"btn btn-primary\" (click)=\"Apply()\">Apply</div>", styles: [".dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:250px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.btn-primary{line-height:18px!important}\n"], dependencies: [{ 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: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ClassicComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ClassicComponent, decorators: [{
             type: Component,
             args: [{ selector: "lib-classic", template: "<div class=\"py-3 dropdown1 cursor-pointer\" *ngFor=\"let item of dataObject; let i = index\">\r\n    <div class=\"dropdown form-select\" (click)=\"Dropdown('Clients',i,$event)\">\r\n        <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ?\r\n            selectedValuesArray[i]?.length + ' ' + 'Clients'.split(' ').pop() : 'Clients' }}</span>\r\n    </div>\r\n    <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n        <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n            <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n                [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n                (change)=\"toggleCheckbox('Select All', i)\">\r\n            <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n                Select All\r\n            </label>\r\n        </div>\r\n\r\n        <div class=\"border border-gray mt-3\"></div>\r\n        <div class=\"mt-3 d-flex align-items-center mx-2\">\r\n            <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n                <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n                    <path\r\n                        d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\"\r\n                        stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n                </svg>\r\n            </span>\r\n            <input type=\"text\" [(ngModel)]=\"searchValue\" (input)=\"searchData($event,i)\"\r\n                class=\"form-control searchinput ps-14 py-2  mt-2\" placeholder=\"Search\" autocomplete=\"off\" />\r\n        </div>\r\n        <div *ngFor=\"let issue of item.Issues\" class=\"form-check d-flex align-items-center py-3 px-5\">\r\n            <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"issue.clientName\" id=\"option{{issue.clientId}}\"\r\n                [checked]=\"selectedValuesArray[i]?.includes(issue.clientId)\" (change)=\"toggleCheckbox(issue.clientId,i)\">\r\n            <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{issue.clientId}}\">\r\n                {{ issue.clientName }}\r\n            </label>\r\n        </div>\r\n        <div class=\"mt-5 d-flex justify-content-center\">\r\n            <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n        </div>\r\n    </div>\r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n\r\n<!-- <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd \r\n    [singleDatePicker]=\"true\"\r\n    [drops]=\"'down'\"\r\n    [opens]=\"'right'\"\r\n    [alwaysShowCalendars]=\"false\"\r\n    [keepCalendarOpeningWithRange]=\"true\"\r\n    [showCancel]=\"true\"\r\n    autocomplete=\"off\"\r\n    [(ngModel)]=\"selectedDate\"\r\n    [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n    (selected)=\"onDateSelect($event)\"\r\n    name=\"daterange\" /> -->\r\n\r\n<div class=\"btn btn-primary\" (click)=\"Apply()\">Apply</div>", styles: [".dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:250px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.btn-primary{line-height:18px!important}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.LayoutService }, { type: i1$2.GlobalStateService }, { type: AuthService }, { type: i0.ChangeDetectorRef }], propDecorators: { onClick: [{
+        }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1.GlobalStateService }, { type: AuthService }, { type: i0.ChangeDetectorRef }], propDecorators: { onClick: [{
                 type: HostListener,
                 args: ["document:click", ["$event"]]
             }] } });
@@ -2041,10 +2039,10 @@ class CustomSelectComponent {
     checkIfAllSelected() {
         return this.filteredValues.every((item) => item.isSelected);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CustomSelectComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: CustomSelectComponent, selector: "lib-select", inputs: { items: "items", searchField: "searchField", multi: "multi", idField: "idField", selectedValues: "selectedValues", disabled: "disabled", label: "label" }, outputs: { selected: "selected" }, host: { listeners: { "document:click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"outer-container\">\r\n    <div [ngClass]=\"disabled ? 'disable-input':''\"  (click)=\"openDropdown($event)\"  class=\"form-select\">\r\n    <ng-container *ngIf=\"multi\" >\r\n    {{selectedValues?.length}} {{label}} Selected    \r\n    </ng-container>\r\n    <ng-container *ngIf=\"!multi\" >\r\n        {{selectedValues?.[0]?.[searchField]}}\r\n    </ng-container>\r\n    </div>\r\n    <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n        <div class=\"w-100 input-wrapper\">\r\n        <input [(ngModel)]=\"searchValue\" placeholder=\"Search\"  (input)=\"onInput($event)\" type=\"text\">  \r\n        <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n            <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n          </svg>  \r\n        </div>\r\n        <ul>\r\n            <li *ngIf=\"multi\">\r\n                <div   class=\"form-check\">\r\n                    <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n                        id=\"selectAll\">\r\n                    <label class=\"form-check-label\" for=\"selectAll\">\r\n                        Select All\r\n                    </label>\r\n                </div>\r\n            </li>\r\n            <li *ngFor=\"let item of filteredValues\" >\r\n                <div [ngClass]=\"multi  ? '': 'ps-0'\" class=\"form-check\">\r\n                    <input [ngClass]=\"multi  ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n                        [id]=\"item[idField]\">\r\n                    <label class=\"form-check-label\" [for]=\"item[idField]\">\r\n                        {{item[searchField]}}\r\n                    </label>\r\n                </div>\r\n            </li>\r\n        </ul>  \r\n    </div>  \r\n    \r\n</div>\r\n    ", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:45px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:scroll;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul li{list-style:none;padding:10px 16px}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}\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: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: CustomSelectComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: CustomSelectComponent, selector: "lib-select", inputs: { items: "items", searchField: "searchField", multi: "multi", idField: "idField", selectedValues: "selectedValues", disabled: "disabled", label: "label" }, outputs: { selected: "selected" }, host: { listeners: { "document:click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"outer-container\">\r\n    <div [ngClass]=\"disabled ? 'disable-input':''\"  (click)=\"openDropdown($event)\"  class=\"form-select\">\r\n    <ng-container *ngIf=\"multi\" >\r\n    {{selectedValues?.length}} {{label}} Selected    \r\n    </ng-container>\r\n    <ng-container *ngIf=\"!multi\" >\r\n        {{selectedValues?.[0]?.[searchField]}}\r\n    </ng-container>\r\n    </div>\r\n    <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n        <div class=\"w-100 input-wrapper\">\r\n        <input [(ngModel)]=\"searchValue\" placeholder=\"Search\"  (input)=\"onInput($event)\" type=\"text\">  \r\n        <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n            <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n          </svg>  \r\n        </div>\r\n        <ul>\r\n            <li *ngIf=\"multi\">\r\n                <div   class=\"form-check\">\r\n                    <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n                        id=\"selectAll\">\r\n                    <label class=\"form-check-label\" for=\"selectAll\">\r\n                        Select All\r\n                    </label>\r\n                </div>\r\n            </li>\r\n            <li *ngFor=\"let item of filteredValues\" >\r\n                <div [ngClass]=\"multi  ? '': 'ps-0'\" class=\"form-check\">\r\n                    <input [ngClass]=\"multi  ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n                        [id]=\"item[idField]\">\r\n                    <label class=\"form-check-label\" [for]=\"item[idField]\">\r\n                        {{item[searchField]}}\r\n                    </label>\r\n                </div>\r\n            </li>\r\n        </ul>  \r\n    </div>  \r\n    \r\n</div>\r\n    ", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:45px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:scroll;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul li{list-style:none;padding:10px 16px}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}\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: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CustomSelectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: CustomSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"outer-container\">\r\n    <div [ngClass]=\"disabled ? 'disable-input':''\"  (click)=\"openDropdown($event)\"  class=\"form-select\">\r\n    <ng-container *ngIf=\"multi\" >\r\n    {{selectedValues?.length}} {{label}} Selected    \r\n    </ng-container>\r\n    <ng-container *ngIf=\"!multi\" >\r\n        {{selectedValues?.[0]?.[searchField]}}\r\n    </ng-container>\r\n    </div>\r\n    <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n        <div class=\"w-100 input-wrapper\">\r\n        <input [(ngModel)]=\"searchValue\" placeholder=\"Search\"  (input)=\"onInput($event)\" type=\"text\">  \r\n        <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n            <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n          </svg>  \r\n        </div>\r\n        <ul>\r\n            <li *ngIf=\"multi\">\r\n                <div   class=\"form-check\">\r\n                    <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n                        id=\"selectAll\">\r\n                    <label class=\"form-check-label\" for=\"selectAll\">\r\n                        Select All\r\n                    </label>\r\n                </div>\r\n            </li>\r\n            <li *ngFor=\"let item of filteredValues\" >\r\n                <div [ngClass]=\"multi  ? '': 'ps-0'\" class=\"form-check\">\r\n                    <input [ngClass]=\"multi  ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n                        [id]=\"item[idField]\">\r\n                    <label class=\"form-check-label\" [for]=\"item[idField]\">\r\n                        {{item[searchField]}}\r\n                    </label>\r\n                </div>\r\n            </li>\r\n        </ul>  \r\n    </div>  \r\n    \r\n</div>\r\n    ", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:45px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:scroll;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul li{list-style:none;padding:10px 16px}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { onClick: [{
@@ -2134,13 +2132,13 @@ class ClientSettingsComponent {
         localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
         this.cd.detectChanges();
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ClientSettingsComponent, deps: [{ token: AuthService }, { token: i1$2.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: ClientSettingsComponent, selector: "lib-client-settings", ngImport: i0, template: "    <div class=\"wrapper\" >\r\n        <lib-select [items]=\"clientList\" [multi]=\"false\" [searchField]=\"'clientName'\" [disabled]=\"false\" [idField]=\"'clientId'\"\r\n            (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n    </div>\r\n", styles: [".wrapper{min-width:200px}\n"], dependencies: [{ kind: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ClientSettingsComponent, deps: [{ token: AuthService }, { token: i1.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: ClientSettingsComponent, selector: "lib-client-settings", ngImport: i0, template: "    <div class=\"wrapper\" >\r\n        <lib-select [items]=\"clientList\" [multi]=\"false\" [searchField]=\"'clientName'\" [disabled]=\"false\" [idField]=\"'clientId'\"\r\n            (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n    </div>\r\n", styles: [".wrapper{min-width:200px}\n"], dependencies: [{ kind: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ClientSettingsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ClientSettingsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-client-settings', template: "    <div class=\"wrapper\" >\r\n        <lib-select [items]=\"clientList\" [multi]=\"false\" [searchField]=\"'clientName'\" [disabled]=\"false\" [idField]=\"'clientId'\"\r\n            (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n    </div>\r\n", styles: [".wrapper{min-width:200px}\n"] }]
-        }], ctorParameters: () => [{ type: AuthService }, { type: i1$2.GlobalStateService }, { type: i0.ChangeDetectorRef }] });
+        }], ctorParameters: () => [{ type: AuthService }, { type: i1.GlobalStateService }, { type: i0.ChangeDetectorRef }] });
 class DatepickerComponent {
     layout;
@@ -2223,13 +2221,13 @@ class DatepickerComponent {
         this.gs.dataRangeValue.next(this.selectedFilters);
         localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DatepickerComponent, deps: [{ token: i1.LayoutService }, { token: i1$2.GlobalStateService }, { token: AuthService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DatepickerComponent, selector: "lib-datepicker", ngImport: i0, template: "<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}\n"], dependencies: [{ kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: DatepickerComponent, deps: [{ token: i1.LayoutService }, { token: i1.GlobalStateService }, { token: AuthService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: DatepickerComponent, selector: "lib-datepicker", ngImport: i0, template: "<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}\n"], dependencies: [{ kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DatepickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: DatepickerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-datepicker', template: "<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}\n"] }]
-        }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$2.GlobalStateService }, { type: AuthService }, { type: i0.ChangeDetectorRef }] });
+        }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1.GlobalStateService }, { type: AuthService }, { type: i0.ChangeDetectorRef }] });
 class DateSingleSelectComponent {
     auth;
@@ -2348,13 +2346,13 @@ class DateSingleSelectComponent {
         this.gs.dataRangeValue.next(this.selectedFilters);
         localStorage.setItem("header-filters", JSON.stringify(this.selectedFilters));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DateSingleSelectComponent, deps: [{ token: AuthService }, { token: i1$2.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: DateSingleSelectComponent, selector: "lib-date-single-select", ngImport: i0, template: "<div class=\"wrapper mx-2\" >\r\n    <lib-select [items]=\"clientList\" [multi]=\"false\" [searchField]=\"'clientName'\" [disabled]=\"false\" [idField]=\"'clientId'\"\r\n        (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n\r\n        \r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\r\n", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"], dependencies: [{ kind: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: DateSingleSelectComponent, deps: [{ token: AuthService }, { token: i1.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: DateSingleSelectComponent, selector: "lib-date-single-select", ngImport: i0, template: "<div class=\"wrapper mx-2\" >\r\n    <lib-select [items]=\"clientList\" [multi]=\"false\" [searchField]=\"'clientName'\" [disabled]=\"false\" [idField]=\"'clientId'\"\r\n        (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n\r\n        \r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\r\n", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"], dependencies: [{ kind: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: DateSingleSelectComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: DateSingleSelectComponent, decorators: [{
             type: Component,
             args: [{ selector: "lib-date-single-select", template: "<div class=\"wrapper mx-2\" >\r\n    <lib-select [items]=\"clientList\" [multi]=\"false\" [searchField]=\"'clientName'\" [disabled]=\"false\" [idField]=\"'clientId'\"\r\n        (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n\r\n        \r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\r\n", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"] }]
-        }], ctorParameters: () => [{ type: AuthService }, { type: i1$2.GlobalStateService }, { type: i0.ChangeDetectorRef }] });
+        }], ctorParameters: () => [{ type: AuthService }, { type: i1.GlobalStateService }, { type: i0.ChangeDetectorRef }] });
 class SingleStoreComponent {
     auth;
@@ -2460,13 +2458,13 @@ class SingleStoreComponent {
         this.gs.dataRangeValue.next(this.selectedFilters);
         localStorage.setItem('header-filters', JSON.stringify(this.selectedFilters));
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SingleStoreComponent, deps: [{ token: AuthService }, { token: i1$2.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: SingleStoreComponent, selector: "lib-single-store", ngImport: i0, template: "<div class=\"wrapper mx-2\" >\r\n    <lib-select [items]=\"storeList\" [multi]=\"false\" [searchField]=\"'storeName'\" [disabled]=\"false\" [idField]=\"'storeId'\"\r\n        (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n\r\n        \r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\r\n", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"], dependencies: [{ kind: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: SingleStoreComponent, deps: [{ token: AuthService }, { token: i1.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: SingleStoreComponent, selector: "lib-single-store", ngImport: i0, template: "<div class=\"wrapper mx-2\" >\r\n    <lib-select [items]=\"storeList\" [multi]=\"false\" [searchField]=\"'storeName'\" [disabled]=\"false\" [idField]=\"'storeId'\"\r\n        (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n\r\n        \r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\r\n", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"], dependencies: [{ kind: "component", type: CustomSelectComponent, selector: "lib-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.DaterangepickerDirective, selector: "input[ngxDaterangepickerMd]", inputs: ["minDate", "maxDate", "autoApply", "alwaysShowCalendars", "showCustomRangeLabel", "linkedCalendars", "dateLimit", "singleDatePicker", "showWeekNumbers", "showISOWeekNumbers", "showDropdowns", "isInvalidDate", "isCustomDate", "isTooltipDate", "showClearButton", "customRangeDirection", "ranges", "opens", "drops", "firstMonthDayClass", "lastMonthDayClass", "emptyWeekRowClass", "emptyWeekColumnClass", "firstDayOfNextMonthClass", "lastDayOfPreviousMonthClass", "keepCalendarOpeningWithRange", "showRangeLabelOnInput", "showCancel", "lockStartDate", "timePicker", "timePicker24Hour", "timePickerIncrement", "timePickerSeconds", "closeOnAutoApply", "endKeyHolder", "startKey", "locale", "endKey"], outputs: ["change", "rangeClicked", "datesUpdated", "startDateChanged", "endDateChanged", "clearClicked"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SingleStoreComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: SingleStoreComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-single-store', template: "<div class=\"wrapper mx-2\" >\r\n    <lib-select [items]=\"storeList\" [multi]=\"false\" [searchField]=\"'storeName'\" [disabled]=\"false\" [idField]=\"'storeId'\"\r\n        (selected)=\"onClientSelect($event)\" [selectedValues]=\"[selectedClient]\"></lib-select>\r\n\r\n        \r\n</div>\r\n<div class=\"d-flex align-items-center position-relative my-1\">\r\n    <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n        <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n            <path\r\n                d=\"M13.3333 1.66663V4.99996M6.66667 1.66663V4.99996M2.5 8.33329H17.5M4.16667 3.33329H15.8333C16.7538 3.33329 17.5 4.07948 17.5 4.99996V16.6666C17.5 17.5871 16.7538 18.3333 15.8333 18.3333H4.16667C3.24619 18.3333 2.5 17.5871 2.5 16.6666V4.99996C2.5 4.07948 3.24619 3.33329 4.16667 3.33329Z\"\r\n                stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n        </svg>\r\n    </span>\r\n    <input class=\"fx-date-range form-control ps-14\" type=\"text\" matInput ngxDaterangepickerMd [drops]=\"'down'\"\r\n        [opens]=\"'right'\" [ranges]=\"ranges\" [showCustomRangeLabel]=\"true\" [alwaysShowCalendars]=\"false\"\r\n        [keepCalendarOpeningWithRange]=\"true\" [showCancel]=\"true\" autocomplete=\"off\" [(ngModel)]=\"selectedDateRange\"\r\n        [locale]=\"{ format: 'DD-MM-YYYY', firstDay: 1, monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'] }\"\r\n        (datesUpdated)=\"datechange($event)\" name=\"daterange\" />\r\n</div>\r\n\r\n<div class=\"btn btn-primary ms-2\" (click)=\"Apply()\">Apply</div>\r\n", styles: [".daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}.form-control{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}::ng-deep .applyBtn{display:none!important}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .daterangepicker-input+.ngx-daterangepicker-material .applyBtn{display:none}:host::ng-deep .md-drppicker.drops-down-right.ltr.double.show-ranges.shown{top:65px!important;left:-470px!important;height:400px!important}:host::ng-deep .md-drppicker .btn{border-radius:8px!important;border:1px solid var(--Primary-600, #00A3FF)!important;background:var(--Primary-600, #00A3FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--White, #FFF)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}:host::ng-deep .md-drppicker .ranges ul li button{padding:12px 16px;width:160px;color:var(--Gray-700, #344054);font-size:14px;font-weight:400;line-height:20px;background:none;border:none;text-align:left;cursor:pointer}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important;border-radius:20px!important;color:var(--White, #FFF)!important;text-align:center!important;font-size:14px!important;font-weight:500!important;line-height:20px}:host::ng-deep .md-drppicker.ltr .ranges{float:left;margin-top:10px!important}:host::ng-deep .md-drppicker td.in-range{background:var(--Primary-50, #EAF8FF)}:host::ng-deep .md-drppicker .ranges ul li button.active{background:var(--Primary-50, #EAF8FF)!important;border-radius:8px!important;color:var(--Primary-700, #009BF3);font-size:14px!important;font-weight:500!important;line-height:20px!important}:host::ng-deep table th,:host::ng-deep table td{width:40px!important;height:40px!important;padding:10px 8px!important}:host::ng-deep .md-drppicker td.available.prev,:host::ng-deep .md-drppicker th.available.prev{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep .md-drppicker td.available.next,:host::ng-deep .md-drppicker th.available.next{background-image:url(data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgMy43IDYiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDMuNyA2IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGQ9Ik0zLjcsMC43TDEuNCwzbDIuMywyLjNMMyw2TDAsM2wzLTNMMy43LDAuN3oiLz4NCjwvZz4NCjwvc3ZnPg0K)!important;background-repeat:no-repeat!important;background-size:.5em!important;background-position:center!important}:host::ng-deep table th{border-bottom:0px solid var(--Gray-200, #EAECF0)!important;background:transparent!important;color:var(--Gray-700, #344054)!important;text-align:center;font-size:16px!important;font-weight:500!important;line-height:24px}:host::ng-deep .md-drppicker td.available.invalid-date{text-decoration:line-through;pointer-events:none;color:#a9a9a9}:host::ng-deep .md-drppicker td.available.today:not(.invalid-date){text-decoration:unset;pointer-events:unset;color:unset}:host::ng-deep .md-drppicker .btn.btn-default{border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize;margin-right:10px!important}.wrapper{min-width:200px}.btn-primary{line-height:18px!important}\n"] }]
-        }], ctorParameters: () => [{ type: AuthService }, { type: i1$2.GlobalStateService }, { type: i0.ChangeDetectorRef }] });
+        }], ctorParameters: () => [{ type: AuthService }, { type: i1.GlobalStateService }, { type: i0.ChangeDetectorRef }] });
 class ToolbarComponent {
     layout;
@@ -2592,13 +2590,13 @@ class ToolbarComponent {
         this.singleStore = singleStore;
         this.singleSelectdatepicker = singleSelectdatepicker;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1$2.LayoutService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i1$2.PageInfoService }], 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=\"multiSelect\">\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=\"singleSelect\">\r\n    <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n   </ng-container>\r\n\r\n   <ng-container *ngIf=\"datepicker\">\r\n    <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n   </ng-container>\r\n   <ng-container *ngIf=\"singleSelectdatepicker\">\r\n    <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n   </ng-container>\r\n   <ng-container *ngIf=\"singleStore\">\r\n    <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\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: ClassicComponent, selector: "lib-classic" }, { kind: "component", type: ClientSettingsComponent, selector: "lib-client-settings" }, { kind: "component", type: DatepickerComponent, selector: "lib-datepicker" }, { kind: "component", type: DateSingleSelectComponent, selector: "lib-date-single-select" }, { kind: "component", type: SingleStoreComponent, selector: "lib-single-store" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1.LayoutService }, { token: i1$1.Router }, { token: i1$1.ActivatedRoute }, { token: i1.PageInfoService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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=\"multiSelect\">\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=\"singleSelect\">\r\n    <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n   </ng-container>\r\n\r\n   <ng-container *ngIf=\"datepicker\">\r\n    <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n   </ng-container>\r\n   <ng-container *ngIf=\"singleSelectdatepicker\">\r\n    <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n   </ng-container>\r\n   <ng-container *ngIf=\"singleStore\">\r\n    <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\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: ClassicComponent, selector: "lib-classic" }, { kind: "component", type: ClientSettingsComponent, selector: "lib-client-settings" }, { kind: "component", type: DatepickerComponent, selector: "lib-datepicker" }, { kind: "component", type: DateSingleSelectComponent, selector: "lib-date-single-select" }, { kind: "component", type: SingleStoreComponent, selector: "lib-single-store" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToolbarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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=\"multiSelect\">\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=\"singleSelect\">\r\n    <lib-client-settings class=\"d-flex align-items-center me-5\"></lib-client-settings>\r\n   </ng-container>\r\n\r\n   <ng-container *ngIf=\"datepicker\">\r\n    <lib-datepicker class=\"d-flex align-items-center me-5\"></lib-datepicker>\r\n   </ng-container>\r\n   <ng-container *ngIf=\"singleSelectdatepicker\">\r\n    <lib-date-single-select class=\"d-flex align-items-center me-5\"></lib-date-single-select>\r\n   </ng-container>\r\n   <ng-container *ngIf=\"singleStore\">\r\n    <lib-single-store class=\"d-flex align-items-center me-5\"></lib-single-store>\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$2.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i1$2.PageInfoService }], propDecorators: { currentLayoutType: [{
+        }], ctorParameters: () => [{ type: i1.LayoutService }, { type: i1$1.Router }, { type: i1$1.ActivatedRoute }, { type: i1.PageInfoService }], propDecorators: { currentLayoutType: [{
                 type: Input
             }], appToolbarLayout: [{
                 type: Input
@@ -2628,13 +2626,13 @@ class SidebarLogoComponent {
     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$2.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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: SidebarLogoComponent, deps: [{ token: i1.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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", "info", "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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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$2.LayoutService }], propDecorators: { toggleButtonClass: [{
+        }], ctorParameters: () => [{ type: i1.LayoutService }], propDecorators: { toggleButtonClass: [{
                 type: Input
             }], toggleEnabled: [{
                 type: Input
@@ -2648,10 +2646,10 @@ 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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: SidebarMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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", "info", "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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: () => [] });
@@ -2695,17 +2693,18 @@ class SidebarFooterComponent {
         this.auth.logout().subscribe((res) => {
             this.router.navigate(["/auth/login"]);
         });
+        localStorage.clear();
     }
     ngOnDestroy() {
         this.unsubscribe.forEach((sb) => sb.unsubscribe());
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarFooterComponent, deps: [{ token: AuthService }, { token: i1$1.Router }, { token: i1$2.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: SidebarFooterComponent, selector: "lib-sidebar-footer", inputs: { toggleButtonClass: "toggleButtonClass", toggleEnabled: "toggleEnabled", toggleType: "toggleType", toggleState: "toggleState" }, ngImport: i0, template: "<div id=\"kt_app_sidebar_menu_scroll\"  class=\"\" 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  <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    <div class=\"menu-item menu-accordion w-100 px-3\" id=\"#kt_app_sidebar_menu\"\r\n     [ngClass]=\"{'active': isSubMenuActive}\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link without-sub\">\r\n        <span class=\"menu-icon\">\r\n          <img src=\"./assets/tango/Icons/Avatar.svg\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">{{userValue.userName | titlecase}}<br>{{userValue.email | titlecase}}</span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion w-100\"  [ngClass]=\"{'menu-sub-top': isSubMenuActive}\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item px-3 border-profile-first\">\r\n          <a class=\"menu-link without-sub\" routerLink=\"profile\" routerLinkActive=\"active\" >\r\n            <span class=\"menu-bullet\">\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path d=\"M11.8574 3.83162C11.8574 5.94799 10.0668 7.66324 7.85742 7.66324C5.64805 7.66324 3.85742 5.94799 3.85742 3.83162C3.85742 1.71525 5.64805 0 7.85742 0C10.0668 0 11.8574 1.71525 11.8574 3.83162Z\" fill=\"#98A2B3\"/>\r\n              <path d=\"M6.36786 9.38452C2.85 9.38452 0 11.9226 0 15.0554C0 15.577 0.475 16.0001 1.06071 16.0001H14.9393C15.525 16.0001 16 15.577 16 15.0554C16 11.9226 13.15 9.38452 9.63214 9.38452H6.36786Z\" fill=\"#667085\"/>\r\n              </svg>\r\n              </span>\r\n            <span class=\"menu-title\">Profile</span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item px-3\" style=\"border-radius: 0px;\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n                <path opacity=\"0.3\" d=\"M14.2222 11.5556V8C14.2222 4.56356 11.4364 1.77778 8 1.77778C4.56356 1.77778 1.77778 4.56356 1.77778 8V11.5556H14.2222ZM16 11.5556H0V8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8V11.5556Z\" fill=\"#D0D5DD\"/>\r\n                <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M1.77778 9.77759H2.66667C3.64851 9.77759 4.44444 10.5735 4.44444 11.5554V14.222C4.44444 15.2039 3.64851 15.9998 2.66667 15.9998H1.77778C0.795938 15.9998 0 15.2039 0 14.222V11.5554C0 10.5735 0.795938 9.77759 1.77778 9.77759ZM13.3333 9.77759H14.2222C15.2041 9.77759 16 10.5735 16 11.5554V14.222C16 15.2039 15.2041 15.9998 14.2222 15.9998H13.3333C12.3515 15.9998 11.5556 15.2039 11.5556 14.222V11.5554C11.5556 10.5735 12.3515 9.77759 13.3333 9.77759Z\" fill=\"#667085\"/>\r\n                </svg>\r\n            </span>\r\n            <span class=\"menu-title\">Support</span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item px-3\" style=\"border-radius: 0px;\">\r\n          <a class=\"menu-link without-sub\" (click)=\"logout()\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n                <path d=\"M5 13H2.33333C1.97971 13 1.64057 12.8595 1.39052 12.6095C1.14048 12.3594 1 12.0203 1 11.6667V2.33333C1 1.97971 1.14048 1.64057 1.39052 1.39052C1.64057 1.14048 1.97971 1 2.33333 1H5\" stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                <path d=\"M9.66667 10.3332L13 6.99984M13 6.99984L9.66667 3.6665M13 6.99984H5\" stroke=\"#D0D5DD\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                </svg>\r\n            </span>\r\n            <span class=\"menu-title\">Logout</span>\r\n          </a>\r\n        </div>\r\n        \r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n", styles: [".menu{background:var(--Gray-700, #344054)}.menu .menu-item{position:relative;background:var(--Gray-700, #344054)}.menu .border-profile-first{border-top-left-radius:8px;border-top-right-radius:8px}.menu .menu-sub{position:absolute;top:100;bottom:calc(100% + 5px);left:0}.menu .menu-sub-top{bottom:auto;top:calc(100% + 5px)}.menu-sub-indention .menu-sub{margin-left:0rem!important}.custom-scroll{max-height:300px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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"] }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: SidebarFooterComponent, deps: [{ token: AuthService }, { token: i1$1.Router }, { token: i1.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: SidebarFooterComponent, selector: "lib-sidebar-footer", inputs: { toggleButtonClass: "toggleButtonClass", toggleEnabled: "toggleEnabled", toggleType: "toggleType", toggleState: "toggleState" }, ngImport: i0, template: "<div id=\"kt_app_sidebar_menu_scroll\"  class=\"\" 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  <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    <div class=\"menu-item menu-accordion w-100 px-3\" id=\"#kt_app_sidebar_menu\"\r\n     [ngClass]=\"{'active': isSubMenuActive}\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link without-sub\">\r\n        <span class=\"menu-icon\">\r\n          <img src=\"./assets/tango/Icons/Avatar.svg\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">{{userValue.userName | titlecase}}<br>{{userValue.email | titlecase}}</span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion w-100\"  [ngClass]=\"{'menu-sub-top': isSubMenuActive}\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item px-3 border-profile-first\">\r\n          <a class=\"menu-link without-sub\" routerLink=\"profile\" routerLinkActive=\"active\" >\r\n            <span class=\"menu-bullet\">\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path d=\"M11.8574 3.83162C11.8574 5.94799 10.0668 7.66324 7.85742 7.66324C5.64805 7.66324 3.85742 5.94799 3.85742 3.83162C3.85742 1.71525 5.64805 0 7.85742 0C10.0668 0 11.8574 1.71525 11.8574 3.83162Z\" fill=\"#98A2B3\"/>\r\n              <path d=\"M6.36786 9.38452C2.85 9.38452 0 11.9226 0 15.0554C0 15.577 0.475 16.0001 1.06071 16.0001H14.9393C15.525 16.0001 16 15.577 16 15.0554C16 11.9226 13.15 9.38452 9.63214 9.38452H6.36786Z\" fill=\"#667085\"/>\r\n              </svg>\r\n              </span>\r\n            <span class=\"menu-title\">Profile</span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item px-3\" style=\"border-radius: 0px;\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n                <path opacity=\"0.3\" d=\"M14.2222 11.5556V8C14.2222 4.56356 11.4364 1.77778 8 1.77778C4.56356 1.77778 1.77778 4.56356 1.77778 8V11.5556H14.2222ZM16 11.5556H0V8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8V11.5556Z\" fill=\"#D0D5DD\"/>\r\n                <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M1.77778 9.77759H2.66667C3.64851 9.77759 4.44444 10.5735 4.44444 11.5554V14.222C4.44444 15.2039 3.64851 15.9998 2.66667 15.9998H1.77778C0.795938 15.9998 0 15.2039 0 14.222V11.5554C0 10.5735 0.795938 9.77759 1.77778 9.77759ZM13.3333 9.77759H14.2222C15.2041 9.77759 16 10.5735 16 11.5554V14.222C16 15.2039 15.2041 15.9998 14.2222 15.9998H13.3333C12.3515 15.9998 11.5556 15.2039 11.5556 14.222V11.5554C11.5556 10.5735 12.3515 9.77759 13.3333 9.77759Z\" fill=\"#667085\"/>\r\n                </svg>\r\n            </span>\r\n            <span class=\"menu-title\">Support</span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item px-3\" style=\"border-radius: 0px;\">\r\n          <a class=\"menu-link without-sub\" (click)=\"logout()\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n                <path d=\"M5 13H2.33333C1.97971 13 1.64057 12.8595 1.39052 12.6095C1.14048 12.3594 1 12.0203 1 11.6667V2.33333C1 1.97971 1.14048 1.64057 1.39052 1.39052C1.64057 1.14048 1.97971 1 2.33333 1H5\" stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                <path d=\"M9.66667 10.3332L13 6.99984M13 6.99984L9.66667 3.6665M13 6.99984H5\" stroke=\"#D0D5DD\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                </svg>\r\n            </span>\r\n            <span class=\"menu-title\">Logout</span>\r\n          </a>\r\n        </div>\r\n        \r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n", styles: [".menu{background:var(--Gray-700, #344054)}.menu .menu-item{position:relative;background:var(--Gray-700, #344054)}.menu .border-profile-first{border-top-left-radius:8px;border-top-right-radius:8px}.menu .menu-sub{position:absolute;top:100;bottom:calc(100% + 5px);left:0}.menu .menu-sub-top{bottom:auto;top:calc(100% + 5px)}.menu-sub-indention .menu-sub{margin-left:0rem!important}.custom-scroll{max-height:300px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1$1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: SidebarFooterComponent, decorators: [{
             type: Component,
             args: [{ selector: "lib-sidebar-footer", template: "<div id=\"kt_app_sidebar_menu_scroll\"  class=\"\" 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  <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    <div class=\"menu-item menu-accordion w-100 px-3\" id=\"#kt_app_sidebar_menu\"\r\n     [ngClass]=\"{'active': isSubMenuActive}\" data-kt-menu-trigger=\"click\" routerLinkActive=\"here show\">\r\n      <span class=\"menu-link without-sub\">\r\n        <span class=\"menu-icon\">\r\n          <img src=\"./assets/tango/Icons/Avatar.svg\">\r\n        </span>\r\n        <span class=\"menu-title\" data-link=\"/crafted/account\">{{userValue.userName | titlecase}}<br>{{userValue.email | titlecase}}</span>\r\n        <span class=\"menu-arrow\"></span>\r\n      </span>\r\n      <div class=\"menu-sub menu-sub-accordion w-100\"  [ngClass]=\"{'menu-sub-top': isSubMenuActive}\" routerLinkActive=\"menu-active-bg\">\r\n        <div class=\"menu-item px-3 border-profile-first\">\r\n          <a class=\"menu-link without-sub\" routerLink=\"profile\" routerLinkActive=\"active\" >\r\n            <span class=\"menu-bullet\">\r\n            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n              <path d=\"M11.8574 3.83162C11.8574 5.94799 10.0668 7.66324 7.85742 7.66324C5.64805 7.66324 3.85742 5.94799 3.85742 3.83162C3.85742 1.71525 5.64805 0 7.85742 0C10.0668 0 11.8574 1.71525 11.8574 3.83162Z\" fill=\"#98A2B3\"/>\r\n              <path d=\"M6.36786 9.38452C2.85 9.38452 0 11.9226 0 15.0554C0 15.577 0.475 16.0001 1.06071 16.0001H14.9393C15.525 16.0001 16 15.577 16 15.0554C16 11.9226 13.15 9.38452 9.63214 9.38452H6.36786Z\" fill=\"#667085\"/>\r\n              </svg>\r\n              </span>\r\n            <span class=\"menu-title\">Profile</span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item px-3\" style=\"border-radius: 0px;\">\r\n          <a class=\"menu-link without-sub\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n                <path opacity=\"0.3\" d=\"M14.2222 11.5556V8C14.2222 4.56356 11.4364 1.77778 8 1.77778C4.56356 1.77778 1.77778 4.56356 1.77778 8V11.5556H14.2222ZM16 11.5556H0V8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8V11.5556Z\" fill=\"#D0D5DD\"/>\r\n                <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M1.77778 9.77759H2.66667C3.64851 9.77759 4.44444 10.5735 4.44444 11.5554V14.222C4.44444 15.2039 3.64851 15.9998 2.66667 15.9998H1.77778C0.795938 15.9998 0 15.2039 0 14.222V11.5554C0 10.5735 0.795938 9.77759 1.77778 9.77759ZM13.3333 9.77759H14.2222C15.2041 9.77759 16 10.5735 16 11.5554V14.222C16 15.2039 15.2041 15.9998 14.2222 15.9998H13.3333C12.3515 15.9998 11.5556 15.2039 11.5556 14.222V11.5554C11.5556 10.5735 12.3515 9.77759 13.3333 9.77759Z\" fill=\"#667085\"/>\r\n                </svg>\r\n            </span>\r\n            <span class=\"menu-title\">Support</span>\r\n          </a>\r\n        </div>\r\n        <div class=\"menu-item px-3\" style=\"border-radius: 0px;\">\r\n          <a class=\"menu-link without-sub\" (click)=\"logout()\" routerLinkActive=\"active\">\r\n            <span class=\"menu-bullet\">\r\n              <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"14\" height=\"14\" viewBox=\"0 0 14 14\" fill=\"none\">\r\n                <path d=\"M5 13H2.33333C1.97971 13 1.64057 12.8595 1.39052 12.6095C1.14048 12.3594 1 12.0203 1 11.6667V2.33333C1 1.97971 1.14048 1.64057 1.39052 1.39052C1.64057 1.14048 1.97971 1 2.33333 1H5\" stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                <path d=\"M9.66667 10.3332L13 6.99984M13 6.99984L9.66667 3.6665M13 6.99984H5\" stroke=\"#D0D5DD\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                </svg>\r\n            </span>\r\n            <span class=\"menu-title\">Logout</span>\r\n          </a>\r\n        </div>\r\n        \r\n      </div>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n", styles: [".menu{background:var(--Gray-700, #344054)}.menu .menu-item{position:relative;background:var(--Gray-700, #344054)}.menu .border-profile-first{border-top-left-radius:8px;border-top-right-radius:8px}.menu .menu-sub{position:absolute;top:100;bottom:calc(100% + 5px);left:0}.menu .menu-sub-top{bottom:auto;top:calc(100% + 5px)}.menu-sub-indention .menu-sub{margin-left:0rem!important}.custom-scroll{max-height:300px}\n"] }]
-        }], ctorParameters: () => [{ type: AuthService }, { type: i1$1.Router }, { type: i1$2.LayoutService }], propDecorators: { toggleButtonClass: [{
+        }], ctorParameters: () => [{ type: AuthService }, { type: i1$1.Router }, { type: i1.LayoutService }], propDecorators: { toggleButtonClass: [{
                 type: Input
             }], toggleEnabled: [{
                 type: Input
@@ -2834,13 +2833,13 @@ class SidebarComponent {
     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$2.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\" id=\"kt_app_sidebar_footer\">\r\n</lib-sidebar-footer>\r\n<!--end::Footer-->\r\n", styles: [".app-sidebar-footer{background:var(--Gray-700, #344054)}\n"], dependencies: [{ kind: "component", type: SidebarLogoComponent, selector: "lib-sidebar-logo", inputs: ["toggleButtonClass", "toggleEnabled", "toggleType", "toggleState"] }, { kind: "component", type: SidebarMenuComponent, selector: "lib-sidebar-menu" }, { kind: "component", type: SidebarFooterComponent, selector: "lib-sidebar-footer", inputs: ["toggleButtonClass", "toggleEnabled", "toggleType", "toggleState"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: SidebarComponent, deps: [{ token: i1.LayoutService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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\" id=\"kt_app_sidebar_footer\">\r\n</lib-sidebar-footer>\r\n<!--end::Footer-->\r\n", styles: [".app-sidebar-footer{background:var(--Gray-700, #344054)}\n"], dependencies: [{ kind: "component", type: SidebarLogoComponent, selector: "lib-sidebar-logo", inputs: ["toggleButtonClass", "toggleEnabled", "toggleType", "toggleState"] }, { kind: "component", type: SidebarMenuComponent, selector: "lib-sidebar-menu" }, { kind: "component", type: SidebarFooterComponent, selector: "lib-sidebar-footer", inputs: ["toggleButtonClass", "toggleEnabled", "toggleType", "toggleState"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: SidebarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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\" id=\"kt_app_sidebar_footer\">\r\n</lib-sidebar-footer>\r\n<!--end::Footer-->\r\n", styles: [".app-sidebar-footer{background:var(--Gray-700, #344054)}\n"] }]
-        }], ctorParameters: () => [{ type: i1$2.LayoutService }] });
+        }], ctorParameters: () => [{ type: i1.LayoutService }] });
 class LayoutScrollTopComponent {
     router;
@@ -2893,10 +2892,10 @@ class LayoutScrollTopComponent {
     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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: LayoutScrollTopComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: [{
@@ -3163,10 +3162,10 @@ class LayoutComponent {
     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 content flex-column flex-row-fluid\" id=\"kt_app_main\">\r\n        <!--begin::Content wrapper-->\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        <div class=\"d-flex flex-column flex-column-fluid mt-15\">\r\n        \r\n          <lib-content id=\" kt_app_content\" class=\"app-content mt-15\" [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" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", 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.3.2", 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 content flex-column flex-row-fluid\" id=\"kt_app_main\">\r\n        <!--begin::Content wrapper-->\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        <div class=\"d-flex flex-column flex-column-fluid mt-15\">\r\n        \r\n          <lib-content id=\" kt_app_content\" class=\"app-content mt-15\" [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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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 content flex-column flex-row-fluid\" id=\"kt_app_main\">\r\n        <!--begin::Content wrapper-->\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        <div class=\"d-flex flex-column flex-column-fluid mt-15\">\r\n        \r\n          <lib-content id=\" kt_app_content\" class=\"app-content mt-15\" [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: [{
@@ -3187,10 +3186,10 @@ 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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: FooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: [{
@@ -3201,10 +3200,10 @@ 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: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AccountingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: () => [] });
@@ -3212,10 +3211,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
 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: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ExtendedComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: () => [] });
@@ -3224,10 +3223,10 @@ 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: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ReportsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: [{
@@ -3238,10 +3237,10 @@ 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: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "component", type: KeeniconComponent, selector: "lib-keenicon", inputs: ["name", "class", "type"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: SaasComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: [{
@@ -3264,18 +3263,18 @@ class ErrorsComponent {
     routeToDashboard() {
         this.router.navigate(['dashboard']);
         setTimeout(() => {
-            ToggleComponent$1.bootstrap();
-            ScrollTopComponent$1.bootstrap();
-            DrawerComponent$1.bootstrap();
-            StickyComponent$1.bootstrap();
-            MenuComponent$1.bootstrap();
-            ScrollComponent$1.bootstrap();
+            ToggleComponent.bootstrap();
+            ScrollTopComponent.bootstrap();
+            DrawerComponent.bootstrap();
+            StickyComponent.bootstrap();
+            MenuComponent.bootstrap();
+            ScrollComponent.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"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ErrorsComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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: [{
@@ -3315,10 +3314,10 @@ class Error404Component {
         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: [""] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", 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.3.2", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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 }] });
@@ -3355,10 +3354,10 @@ class Error500Component {
         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: [""] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", 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.3.2", 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: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", 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 }] });
@@ -3380,10 +3379,10 @@ class PaginationComponent {
         this.itemsPerPage = this.pageSize;
         this.pageSizeChange.emit(this.pageSize);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: PaginationComponent, selector: "lib-pagination", inputs: { collection: "collection", itemsPerPage: "itemsPerPage", currentPage: "currentPage", totalItems: "totalItems", directionLinks: "directionLinks", pageSize: "pageSize", paginationSizes: "paginationSizes" }, outputs: { pageChange: "pageChange", pageSizeChange: "pageSizeChange" }, ngImport: i0, template: "\r\n<div class=\"row\">\r\n    <div class=\"col-md-3\"></div>\r\n    <div class=\"col-md-3 mt-4 text-end pe-0\"><span class=\"sub-title\">\r\n        <span class=\"me-3\">Displaying</span>\r\n        <select class=\"border-val \" [(ngModel)]=\"pageSize\" (change)=\"onPageSizeChange()\">\r\n            <option value=\"{{ size }}\" *ngFor=\"let size of paginationSizes\">\r\n                {{ size }}\r\n            </option>>\r\n        </select>\r\n        <span class=\"ms-3\">out of {{totalItems}} items</span>\r\n    </span></div>\r\n    <div class=\"col-md-4 text-start ps-0\">\r\n    <ul>\r\n        <li\r\n            *ngFor=\"let item of collection | paginate: { itemsPerPage: itemsPerPage, currentPage: currentPage, totalItems: totalItems }\">\r\n        </li>\r\n    </ul>\r\n    <pagination-controls \r\n        (pageChange)=\"onPageChange($event);currentPage=$event;\" \r\n        [directionLinks]=\"directionLinks\"\r\n        [maxSize]=\"7\"\r\n        [responsive]=\"true\">\r\n    </pagination-controls>\r\n    </div>\r\n    <div class=\"col-md-2\"></div>\r\n</div>\r\n", styles: ["::ng-deep .ngx-pagination .current{padding:12px!important;background:#eaf8ff!important;cursor:default;color:#00a3ff!important;width:50px;height:45px;border-radius:8px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-600, #00A3FF)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px}::ng-deep .ngx-pagination{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px}::ng-deep .ngx-pagination a{padding:.1875rem 1rem!important}*{font-family:Inter!important}.border-val{padding:10px 14px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url('data:image/svg+xml;utf8,<svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\"><path d=\"M10 12l-6-6h12l-6 6z\" fill=\"%23777\"/></svg>');background-repeat:no-repeat;background-position-x:calc(100% - 12px);background-position-y:50%;padding-right:20px}.sub-title{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:500!important;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$2.PaginationControlsComponent, selector: "pagination-controls", inputs: ["id", "maxSize", "directionLinks", "autoHide", "responsive", "previousLabel", "nextLabel", "screenReaderPaginationLabel", "screenReaderPageLabel", "screenReaderCurrentLabel"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "pipe", type: i3$2.PaginatePipe, name: "paginate" }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: PaginationComponent, selector: "lib-pagination", inputs: { collection: "collection", itemsPerPage: "itemsPerPage", currentPage: "currentPage", totalItems: "totalItems", directionLinks: "directionLinks", pageSize: "pageSize", paginationSizes: "paginationSizes" }, outputs: { pageChange: "pageChange", pageSizeChange: "pageSizeChange" }, ngImport: i0, template: "\r\n<div class=\"row\">\r\n    <div class=\"col-md-3\"></div>\r\n    <div class=\"col-md-3 mt-4 text-end pe-0\"><span class=\"sub-title\">\r\n        <span class=\"me-3\">Displaying</span>\r\n        <select class=\"border-val \" [(ngModel)]=\"pageSize\" (change)=\"onPageSizeChange()\">\r\n            <option value=\"{{ size }}\" *ngFor=\"let size of paginationSizes\">\r\n                {{ size }}\r\n            </option>>\r\n        </select>\r\n        <span class=\"ms-3\">out of {{totalItems}} items</span>\r\n    </span></div>\r\n    <div class=\"col-md-4 text-start ps-0\">\r\n    <ul>\r\n        <li\r\n            *ngFor=\"let item of collection | paginate: { itemsPerPage: itemsPerPage, currentPage: currentPage, totalItems: totalItems }\">\r\n        </li>\r\n    </ul>\r\n    <pagination-controls \r\n        (pageChange)=\"onPageChange($event);currentPage=$event;\" \r\n        [directionLinks]=\"directionLinks\"\r\n        [maxSize]=\"7\"\r\n        [responsive]=\"true\">\r\n    </pagination-controls>\r\n    </div>\r\n    <div class=\"col-md-2\"></div>\r\n</div>\r\n", styles: ["::ng-deep .ngx-pagination .current{padding:12px!important;background:#eaf8ff!important;cursor:default;color:#00a3ff!important;width:50px;height:45px;border-radius:8px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-600, #00A3FF)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px}::ng-deep .ngx-pagination{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px}::ng-deep .ngx-pagination a{padding:.1875rem 1rem!important}*{font-family:Inter!important}.border-val{padding:10px 14px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url('data:image/svg+xml;utf8,<svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\"><path d=\"M10 12l-6-6h12l-6 6z\" fill=\"%23777\"/></svg>');background-repeat:no-repeat;background-position-x:calc(100% - 12px);background-position-y:50%;padding-right:20px}.sub-title{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:500!important;line-height:20px}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i4.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$2.PaginationControlsComponent, selector: "pagination-controls", inputs: ["id", "maxSize", "directionLinks", "autoHide", "responsive", "previousLabel", "nextLabel", "screenReaderPaginationLabel", "screenReaderPageLabel", "screenReaderCurrentLabel"], outputs: ["pageChange", "pageBoundsCorrection"] }, { kind: "pipe", type: i3$2.PaginatePipe, name: "paginate" }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: PaginationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: PaginationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-pagination', template: "\r\n<div class=\"row\">\r\n    <div class=\"col-md-3\"></div>\r\n    <div class=\"col-md-3 mt-4 text-end pe-0\"><span class=\"sub-title\">\r\n        <span class=\"me-3\">Displaying</span>\r\n        <select class=\"border-val \" [(ngModel)]=\"pageSize\" (change)=\"onPageSizeChange()\">\r\n            <option value=\"{{ size }}\" *ngFor=\"let size of paginationSizes\">\r\n                {{ size }}\r\n            </option>>\r\n        </select>\r\n        <span class=\"ms-3\">out of {{totalItems}} items</span>\r\n    </span></div>\r\n    <div class=\"col-md-4 text-start ps-0\">\r\n    <ul>\r\n        <li\r\n            *ngFor=\"let item of collection | paginate: { itemsPerPage: itemsPerPage, currentPage: currentPage, totalItems: totalItems }\">\r\n        </li>\r\n    </ul>\r\n    <pagination-controls \r\n        (pageChange)=\"onPageChange($event);currentPage=$event;\" \r\n        [directionLinks]=\"directionLinks\"\r\n        [maxSize]=\"7\"\r\n        [responsive]=\"true\">\r\n    </pagination-controls>\r\n    </div>\r\n    <div class=\"col-md-2\"></div>\r\n</div>\r\n", styles: ["::ng-deep .ngx-pagination .current{padding:12px!important;background:#eaf8ff!important;cursor:default;color:#00a3ff!important;width:50px;height:45px;border-radius:8px;background:var(--Primary-50, #EAF8FF);color:var(--Primary-600, #00A3FF)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px}::ng-deep .ngx-pagination{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px}::ng-deep .ngx-pagination a{padding:.1875rem 1rem!important}*{font-family:Inter!important}.border-val{padding:10px 14px!important;border-radius:8px!important;border:1px solid var(--Gray-300, #D0D5DD)!important;background:var(--White, #FFF)!important;box-shadow:0 1px 2px #1018280d!important}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url('data:image/svg+xml;utf8,<svg fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 20 20\"><path d=\"M10 12l-6-6h12l-6 6z\" fill=\"%23777\"/></svg>');background-repeat:no-repeat;background-position-x:calc(100% - 12px);background-position-y:50%;padding-right:20px}.sub-title{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:500!important;line-height:20px}\n"] }]
         }], propDecorators: { collection: [{
@@ -3536,10 +3535,10 @@ class FiltersComponent {
         });
         this.appliedFilters.emit(this.responseArray);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FiltersComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.8", type: FiltersComponent, selector: "lib-filters", inputs: { dataObject: "dataObject" }, outputs: { appliedFilters: "appliedFilters" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"position-relative\">\r\n                   \r\n    <button type=\"button\" (click)=\"opendropdown($event)\"\r\n    class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n      class=\"pl-3\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n        <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n            stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n    </svg>\r\n    <span class=\"ms-2\">Filter</span> </button>\r\n    <div class=\"card p-5 dropdown1 position-absolute\" *ngIf=\"Opendropdown\">\r\n        <span class=\"dropdown-title\">Filter Options</span>\r\n        <div class=\"w-100 border border-gray mt-3\"></div>\r\n        <div class=\"py-3\" *ngFor=\"let item of dataObject; let i = index\">\r\n            <div *ngIf=\"item.type !== 'single'\">\r\n                <div class=\"dropdown form-select position-relative d-flex justify-content-between\" (click)=\"Dropdown(item.Description,i,$event)\">\r\n                    <!-- <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ? selectedValuesArray[i]?.length + ' ' + item.Description.split(' ').pop() + ' Selected' : item.Description }}</span> -->\r\n                     <span>{{item.Description}}</span> <span *ngIf=\"selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined && selectedValuesArray[i]?.length !== 0\" class=\"badge badge-light-default\">{{selectedValuesArray[i]?.length}}</span>\r\n                </div>\r\n                <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute w-100\">\r\n                    <div class=\"form-check d-flex align-items-center py-3 pt-3 ps-0\">\r\n                        <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"  [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n                          (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n                        <label class=\"form-check-label px-2\" for=\"selectall{{i}}\">\r\n                            Select All\r\n                        </label>\r\n                    </div>\r\n         \r\n                    <div class=\"border border-gray mt-3 \"></div>\r\n         \r\n                    <div class=\"mt-3 d-flex align-items-center\">\r\n                        <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n                                <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                </svg>\r\n                                </span>\r\n                                <input type=\"text\" [(ngModel)]=\"dataObject[i].selectedValue\" (input)=\"searchData($event,i)\" [id]=\"i\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n                                     placeholder=\"Search\" autocomplete=\"off\" />\r\n                    </div>\r\n         \r\n                    <div *ngFor=\"let issue of item.Issues;let j=index\"  class=\"form-check d-flex align-items-center py-3 pt-3 ps-0 mt-2\">\r\n                        <input class=\"form-check-input\" type=\"checkbox\" [value]=\"issue.text\" id=\"option{{issue.text}}\" [checked]=\"issue.checked\"\r\n                         (change)=\"toggleCheckbox($event,issue.text,i,j)\">\r\n                        <label class=\"form-check-label px-2\" for=\"option{{issue.text}}\">\r\n                            {{ issue.text }}\r\n                        </label>\r\n                    </div>\r\n                    <div class=\"mt-5 d-flex justify-content-center\">\r\n                        <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div *ngIf=\"item.type === 'single'\" class=\"position-relative w-100\">\r\n                <button type=\"button\" (click)=\"openDropdown($event,i)\"\r\n                class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\"> {{selectedValuesArray[i]?.text ? selectedValuesArray[i]?.text : item.Description}}\r\n                <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                    <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg></span>\r\n                </button>\r\n                <div *ngIf=\"item.isOpen\" class=\"card py-1 w-100 dropdown-single position-absolute z-1 top-50px end-0\">\r\n                        <ul *ngFor=\"let item of item.Issues; let j = index\" class=\"list-unstyled\">\r\n                        <li [ngClass]=\"selectedValuesArray[i]?.text == item.text ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem($event,i,j)\">{{item.text}}</li>\r\n                        </ul>\r\n                </div>\r\n              </div>\r\n        </div>\r\n        <div role=\"group\" class=\"d-flex justify-content-between\">\r\n            <button class=\"btn btn-outline w-100 me-2\" (click)=\"Reset()\"> Reset </button>\r\n            <button class=\"btn btn-primary w-100 ms-2\" (click)=\"Apply()\">Apply</button>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{width:90%!important;z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:200px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}.dropdown1 .items:hover,.dropdown1 .tems.focus,.dropdown1 .items.active,.dropdown1 .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}\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: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: FiltersComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.2", type: FiltersComponent, selector: "lib-filters", inputs: { dataObject: "dataObject" }, outputs: { appliedFilters: "appliedFilters" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"position-relative\">\r\n                   \r\n    <button type=\"button\" (click)=\"opendropdown($event)\"\r\n    class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n      class=\"pl-3\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n        <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n            stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n    </svg>\r\n    <span class=\"ms-2\">Filter</span> </button>\r\n    <div class=\"card p-5 dropdown1 position-absolute\" *ngIf=\"Opendropdown\">\r\n        <span class=\"dropdown-title\">Filter Options</span>\r\n        <div class=\"w-100 border border-gray mt-3\"></div>\r\n        <div class=\"py-3\" *ngFor=\"let item of dataObject; let i = index\">\r\n            <div *ngIf=\"item.type !== 'single'\">\r\n                <div class=\"dropdown form-select position-relative d-flex justify-content-between\" (click)=\"Dropdown(item.Description,i,$event)\">\r\n                    <!-- <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ? selectedValuesArray[i]?.length + ' ' + item.Description.split(' ').pop() + ' Selected' : item.Description }}</span> -->\r\n                     <span>{{item.Description}}</span> <span *ngIf=\"selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined && selectedValuesArray[i]?.length !== 0\" class=\"badge badge-light-default\">{{selectedValuesArray[i]?.length}}</span>\r\n                </div>\r\n                <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute w-100\">\r\n                    <div class=\"form-check d-flex align-items-center py-3 pt-3 ps-0\">\r\n                        <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"  [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n                          (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n                        <label class=\"form-check-label px-2\" for=\"selectall{{i}}\">\r\n                            Select All\r\n                        </label>\r\n                    </div>\r\n         \r\n                    <div class=\"border border-gray mt-3 \"></div>\r\n         \r\n                    <div class=\"mt-3 d-flex align-items-center\">\r\n                        <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n                                <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                </svg>\r\n                                </span>\r\n                                <input type=\"text\" [(ngModel)]=\"dataObject[i].selectedValue\" (input)=\"searchData($event,i)\" [id]=\"i\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n                                     placeholder=\"Search\" autocomplete=\"off\" />\r\n                    </div>\r\n         \r\n                    <div *ngFor=\"let issue of item.Issues;let j=index\"  class=\"form-check d-flex align-items-center py-3 pt-3 ps-0 mt-2\">\r\n                        <input class=\"form-check-input\" type=\"checkbox\" [value]=\"issue.text\" id=\"option{{issue.text}}\" [checked]=\"issue.checked\"\r\n                         (change)=\"toggleCheckbox($event,issue.text,i,j)\">\r\n                        <label class=\"form-check-label px-2\" for=\"option{{issue.text}}\">\r\n                            {{ issue.text }}\r\n                        </label>\r\n                    </div>\r\n                    <div class=\"mt-5 d-flex justify-content-center\">\r\n                        <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div *ngIf=\"item.type === 'single'\" class=\"position-relative w-100\">\r\n                <button type=\"button\" (click)=\"openDropdown($event,i)\"\r\n                class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\"> {{selectedValuesArray[i]?.text ? selectedValuesArray[i]?.text : item.Description}}\r\n                <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                    <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg></span>\r\n                </button>\r\n                <div *ngIf=\"item.isOpen\" class=\"card py-1 w-100 dropdown-single position-absolute z-1 top-50px end-0\">\r\n                        <ul *ngFor=\"let item of item.Issues; let j = index\" class=\"list-unstyled\">\r\n                        <li [ngClass]=\"selectedValuesArray[i]?.text == item.text ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem($event,i,j)\">{{item.text}}</li>\r\n                        </ul>\r\n                </div>\r\n              </div>\r\n        </div>\r\n        <div role=\"group\" class=\"d-flex justify-content-between\">\r\n            <button class=\"btn btn-outline w-100 me-2\" (click)=\"Reset()\"> Reset </button>\r\n            <button class=\"btn btn-primary w-100 ms-2\" (click)=\"Apply()\">Apply</button>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{width:90%!important;z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:200px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}.dropdown1 .items:hover,.dropdown1 .tems.focus,.dropdown1 .items.active,.dropdown1 .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}\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: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: FiltersComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: FiltersComponent, decorators: [{
             type: Component,
             args: [{ selector: 'lib-filters', template: "<div class=\"position-relative\">\r\n                   \r\n    <button type=\"button\" (click)=\"opendropdown($event)\"\r\n    class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n      class=\"pl-3\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n        <path d=\"M5 10H15M2.5 5H17.5M7.5 15H12.5\" stroke=\"#344054\" stroke-width=\"2\"\r\n            stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n    </svg>\r\n    <span class=\"ms-2\">Filter</span> </button>\r\n    <div class=\"card p-5 dropdown1 position-absolute\" *ngIf=\"Opendropdown\">\r\n        <span class=\"dropdown-title\">Filter Options</span>\r\n        <div class=\"w-100 border border-gray mt-3\"></div>\r\n        <div class=\"py-3\" *ngFor=\"let item of dataObject; let i = index\">\r\n            <div *ngIf=\"item.type !== 'single'\">\r\n                <div class=\"dropdown form-select position-relative d-flex justify-content-between\" (click)=\"Dropdown(item.Description,i,$event)\">\r\n                    <!-- <span class=\"\">{{ selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined ? selectedValuesArray[i]?.length + ' ' + item.Description.split(' ').pop() + ' Selected' : item.Description }}</span> -->\r\n                     <span>{{item.Description}}</span> <span *ngIf=\"selectedValuesArray[i]?.length !== null && selectedValuesArray[i]?.length !== undefined && selectedValuesArray[i]?.length !== 0\" class=\"badge badge-light-default\">{{selectedValuesArray[i]?.length}}</span>\r\n                </div>\r\n                <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute w-100\">\r\n                    <div class=\"form-check d-flex align-items-center py-3 pt-3 ps-0\">\r\n                        <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"  [checked]=\"selectedValuesArray[i]?.length === item.Issues.length\"\r\n                          (change)=\"toggleCheckbox($event,'Select All', i,0)\">\r\n                        <label class=\"form-check-label px-2\" for=\"selectall{{i}}\">\r\n                            Select All\r\n                        </label>\r\n                    </div>\r\n         \r\n                    <div class=\"border border-gray mt-3 \"></div>\r\n         \r\n                    <div class=\"mt-3 d-flex align-items-center\">\r\n                        <span class=\"svg-icon svg-icon-1 position-absolute ms-3 mt-2\">\r\n                            <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n                                <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                                </svg>\r\n                                </span>\r\n                                <input type=\"text\" [(ngModel)]=\"dataObject[i].selectedValue\" (input)=\"searchData($event,i)\" [id]=\"i\" class=\"form-control searchinput ps-14 py-2 me-2 mt-2\"\r\n                                     placeholder=\"Search\" autocomplete=\"off\" />\r\n                    </div>\r\n         \r\n                    <div *ngFor=\"let issue of item.Issues;let j=index\"  class=\"form-check d-flex align-items-center py-3 pt-3 ps-0 mt-2\">\r\n                        <input class=\"form-check-input\" type=\"checkbox\" [value]=\"issue.text\" id=\"option{{issue.text}}\" [checked]=\"issue.checked\"\r\n                         (change)=\"toggleCheckbox($event,issue.text,i,j)\">\r\n                        <label class=\"form-check-label px-2\" for=\"option{{issue.text}}\">\r\n                            {{ issue.text }}\r\n                        </label>\r\n                    </div>\r\n                    <div class=\"mt-5 d-flex justify-content-center\">\r\n                        <span class=\"form-check-label\" *ngIf=\"noFilter\"> No filters available</span>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div *ngIf=\"item.type === 'single'\" class=\"position-relative w-100\">\r\n                <button type=\"button\" (click)=\"openDropdown($event,i)\"\r\n                class=\"btn btn-default w-100 btn-outline btn-outline-default rounded-3 text-nowrap border-val d-flex justify-content-between\"> {{selectedValuesArray[i]?.text ? selectedValuesArray[i]?.text : item.Description}}\r\n                <span><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n                    <path d=\"M5 7.5L10 12.5L15 7.5\" stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n                    </svg></span>\r\n                </button>\r\n                <div *ngIf=\"item.isOpen\" class=\"card py-1 w-100 dropdown-single position-absolute z-1 top-50px end-0\">\r\n                        <ul *ngFor=\"let item of item.Issues; let j = index\" class=\"list-unstyled\">\r\n                        <li [ngClass]=\"selectedValuesArray[i]?.text == item.text ? 'active' : ''\" class=\"camera px-5 items fw-semibold cursor-pointer py-2\" (click)=\"selectItem($event,i,j)\">{{item.text}}</li>\r\n                        </ul>\r\n                </div>\r\n              </div>\r\n        </div>\r\n        <div role=\"group\" class=\"d-flex justify-content-between\">\r\n            <button class=\"btn btn-outline w-100 me-2\" (click)=\"Reset()\"> Reset </button>\r\n            <button class=\"btn btn-primary w-100 ms-2\" (click)=\"Apply()\">Apply</button>\r\n        </div>\r\n    </div>\r\n</div>", styles: [".dropdown1{position:absolute;top:70px;min-width:270px!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{width:90%!important;z-index:1;padding:10px;background-color:#fff;border-radius:8px;box-shadow:0 8px 16px #0003;height:200px;overflow:auto}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px;text-transform:capitalize}.dropdown1 .items:hover,.dropdown1 .tems.focus,.dropdown1 .items.active,.dropdown1 .camera.focus-visible{background:var(--Gray-50, #F9FAFB)}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1$1.Router }], propDecorators: { dataObject: [{
@@ -3552,11 +3551,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
             }] } });
 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] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: TranslationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: TranslationModule, imports: [CommonModule, TranslateModule], exports: [TranslateModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: TranslationModule, imports: [CommonModule, TranslateModule, TranslateModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TranslationModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: TranslationModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CommonModule, TranslateModule],
@@ -3604,15 +3603,15 @@ class TranslationService {
         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' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: TranslationService, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: TranslationService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: TranslationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: TranslationService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root',
                 }]
-        }], ctorParameters: () => [{ type: i1$3.TranslateService }] });
+        }], ctorParameters: () => [{ type: i1$2.TranslateService }] });
 // USA
 const locale$5 = {
@@ -4283,23 +4282,23 @@ var jp = /*#__PURE__*/Object.freeze({
 const Routing = [
     {
         path: 'manage',
-        loadChildren: () => import('./tango-app-ui-shared-manage-wrapper.module-B6GJQNQZ.mjs').then((m) => m.ManageWrapperModule),
+        loadChildren: () => import('./tango-app-ui-shared-manage-wrapper.module-DlmN8vDY.mjs').then((m) => m.ManageWrapperModule),
     },
     {
         path: 'manage/stores/edge-app',
-        loadChildren: () => import('./tango-app-ui-shared-edge-wrapper.module-DM8Er_Bd.mjs').then((m) => m.TangoEdgeAppWrapperModule),
+        loadChildren: () => import('./tango-app-ui-shared-edge-wrapper.module-C5NCXNfg.mjs').then((m) => m.TangoEdgeAppWrapperModule),
     },
     {
         path: 'manage/stores/:id',
-        loadChildren: () => import('./tango-app-ui-shared-store-wrapper.module-UYYC9an_.mjs').then((m) => m.StoreWrapperModule),
+        loadChildren: () => import('./tango-app-ui-shared-store-wrapper.module-B6_Q91IL.mjs').then((m) => m.StoreWrapperModule),
     },
     {
         path: 'profile',
-        loadChildren: () => import('./tango-app-ui-shared-profile-wrapper.module-CTJBnU9I.mjs').then((m) => m.ProfileWrapperModule),
+        loadChildren: () => import('./tango-app-ui-shared-profile-wrapper.module-CKirbe7B.mjs').then((m) => m.ProfileWrapperModule),
     },
     {
         path: 'tickets',
-        loadChildren: () => import('./tango-app-ui-shared-ticket-wrapper.module-BLrWsK0B.mjs').then((m) => m.TicketWrapperModule),
+        loadChildren: () => import('./tango-app-ui-shared-ticket-wrapper.module-CYRnDM_A.mjs').then((m) => m.TicketWrapperModule),
     },
     {
         path: '',
@@ -4321,10 +4320,10 @@ class CustomDateFormatPipe {
         }
         return null;
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CustomDateFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
-    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: CustomDateFormatPipe, name: "customDateFormat" });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: CustomDateFormatPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+    static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: CustomDateFormatPipe, name: "customDateFormat" });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CustomDateFormatPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: CustomDateFormatPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'customDateFormat'
@@ -4332,15 +4331,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
         }] });
 class CommonSharedModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CommonSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.0.8", ngImport: i0, type: CommonSharedModule, declarations: [PaginationComponent, FiltersComponent, CustomSelectComponent, CustomDateFormatPipe], imports: [CommonModule,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: CommonSharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: CommonSharedModule, declarations: [PaginationComponent, FiltersComponent, CustomSelectComponent, CustomDateFormatPipe], imports: [CommonModule,
             FormsModule,
             NgxPaginationModule], exports: [PaginationComponent, FiltersComponent, CustomSelectComponent, CustomDateFormatPipe] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CommonSharedModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: CommonSharedModule, imports: [CommonModule,
             FormsModule,
             NgxPaginationModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: CommonSharedModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: CommonSharedModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [PaginationComponent, FiltersComponent, CustomSelectComponent, CustomDateFormatPipe],
@@ -4361,8 +4360,8 @@ const routes$1 = [
     },
 ];
 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,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: LayoutModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: LayoutModule, declarations: [LayoutComponent,
             HeaderComponent,
             ContentComponent,
             FooterComponent,
@@ -4400,7 +4399,7 @@ class LayoutModule {
             // ThemeModeModule,
             CommonSharedModule,
             FormsModule, i5.NgxDaterangepickerMd], exports: [RouterModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutModule, imports: [CommonModule,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: LayoutModule, imports: [CommonModule,
             RouterModule.forChild(routes$1),
             TranslationModule,
             InlineSVGModule,
@@ -4418,7 +4417,7 @@ class LayoutModule {
             FormsModule,
             NgxDaterangepickerMd.forRoot(), RouterModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: LayoutModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: LayoutModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -4490,11 +4489,11 @@ const routes = [
     },
 ];
 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] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ErrorsRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", ngImport: i0, type: ErrorsRoutingModule, imports: [i1$1.RouterModule], exports: [RouterModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ErrorsRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsRoutingModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ErrorsRoutingModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [RouterModule.forChild(routes)],
@@ -4503,15 +4502,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
         }] });
 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,
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ErrorsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.2", 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,
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ErrorsModule, imports: [CommonModule,
             ErrorsRoutingModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ErrorsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ErrorsModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -4541,29 +4540,14 @@ class AuthGuard {
         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' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AuthGuard, deps: [{ token: AuthService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AuthGuard, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: AuthGuard, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: AuthGuard, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: AuthService }] });
-class GlobalStateService {
-    userData = new BehaviorSubject(null);
-    environment = new BehaviorSubject(null);
-    dataRangeValue = new BehaviorSubject(null);
-    selectedClient = 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 ToastService {
     constructor() { }
     getSuccessToast(message) {
@@ -4617,10 +4601,10 @@ class ToastService {
             }
         });
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToastService, providedIn: 'root' });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ToastService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ToastService, providedIn: 'root' });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: ToastService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: ToastService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -4647,12 +4631,12 @@ class HttpAuthInterceptor {
         });
         return next.handle(request);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HttpAuthInterceptor, deps: [{ token: i1$2.GlobalStateService }], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HttpAuthInterceptor });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: HttpAuthInterceptor, deps: [{ token: i1.GlobalStateService }], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: HttpAuthInterceptor });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImport: i0, type: HttpAuthInterceptor, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.2", ngImport: i0, type: HttpAuthInterceptor, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: i1$2.GlobalStateService }] });
+        }], ctorParameters: () => [{ type: i1.GlobalStateService }] });
 /*
  * Public API Surface of tango-app-shared
@@ -4663,5 +4647,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.8", ngImpor
  * Generated bundle index. Do not edit.
  */
-export { AccountingComponent, AuthGuard, AuthService, ClassicComponent, ClientSettingsComponent, CommonSharedModule, ContentComponent, CustomDateFormatPipe, CustomSelectComponent, Error404Component, Error500Component, ErrorsComponent, ErrorsModule, ExtendedComponent, FiltersComponent, FooterComponent, GlobalStateService, HeaderComponent, HeaderMenuComponent, HttpAuthInterceptor, LayoutComponent, LayoutModule, LayoutScrollTopComponent, NavbarComponent, PageTitleComponent, PaginationComponent, ReportsComponent, SaasComponent, ScriptsInitComponent, SidebarComponent, SidebarFooterComponent, SidebarLogoComponent, SidebarMenuComponent, ToastService, ToolbarComponent, TranslationModule, TranslationService, ch as chLang, de as deLang, en as enLang, es as esLang, fr as frLang, jp as jpLang };
+export { AccountingComponent, AuthGuard, AuthService, ClassicComponent, ClientSettingsComponent, CommonSharedModule, ContentComponent, CustomDateFormatPipe, CustomSelectComponent, Error404Component, Error500Component, ErrorsComponent, ErrorsModule, ExtendedComponent, FiltersComponent, FooterComponent, HeaderComponent, HeaderMenuComponent, HttpAuthInterceptor, LayoutComponent, LayoutModule, LayoutScrollTopComponent, NavbarComponent, PageTitleComponent, PaginationComponent, ReportsComponent, SaasComponent, ScriptsInitComponent, SidebarComponent, SidebarFooterComponent, SidebarLogoComponent, SidebarMenuComponent, ToastService, 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