@propmix/profet-common-header 3.0.11-unstable.1 → 3.0.12-unstable

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 (9) hide show
  1. package/esm2020/lib/common-header.module.mjs +9 -5
  2. package/esm2020/lib/header/header.component.mjs +36 -8
  3. package/fesm2015/propmix-profet-common-header.mjs +42 -9
  4. package/fesm2015/propmix-profet-common-header.mjs.map +1 -1
  5. package/fesm2020/propmix-profet-common-header.mjs +41 -9
  6. package/fesm2020/propmix-profet-common-header.mjs.map +1 -1
  7. package/lib/common-header.module.d.ts +2 -1
  8. package/lib/header/header.component.d.ts +5 -1
  9. package/package.json +1 -1
package/fesm2015/propmix-profet-common-header.mjs CHANGED
@@ -14,6 +14,8 @@ import * as i8 from '@angular/material/form-field';
14
14
  import { MatFormFieldModule } from '@angular/material/form-field';
15
15
  import * as i3 from '@angular/material/icon';
16
16
  import { MatIconModule } from '@angular/material/icon';
17
+ import * as i12 from '@angular/material/input';
18
+ import { MatInputModule } from '@angular/material/input';
17
19
  import { MatListModule } from '@angular/material/list';
18
20
  import * as i6 from '@angular/material/menu';
19
21
  import { MatMenuModule } from '@angular/material/menu';
@@ -419,6 +421,8 @@ class HeaderComponent {
419
421
  this.appConfig = AppConfig.appConfig;
420
422
  this.companyList = [];
421
423
  this.menuList = [];
424
+ this.filteredOptions = [];
425
+ this.searchControl = new FormControl('');
422
426
  }
423
427
  ngOnInit() {
424
428
  return __awaiter(this, void 0, void 0, function* () {
@@ -532,6 +536,15 @@ class HeaderComponent {
532
536
  this.companyList = v;
533
537
  this.selectCurrentCompany();
534
538
  this.patchCurrentCompanyInfo();
539
+ this.filteredOptions = this.companyList;
540
+ this.searchControl.valueChanges.subscribe((searchTerm) => {
541
+ if (searchTerm) {
542
+ this.filteredOptions = this.companyList.filter((opt) => opt.name.toLowerCase().includes(searchTerm.toLowerCase()));
543
+ }
544
+ else {
545
+ this.filteredOptions = this.companyList;
546
+ }
547
+ });
535
548
  }
536
549
  });
537
550
  }
@@ -554,15 +567,17 @@ class HeaderComponent {
554
567
  }
555
568
  }
556
569
  onLogoutClick() {
557
- console.log('logout start execution');
558
570
  signOut({ global: true, oauth: { redirectUrl: this._headerSer.headerConfig.signOutUrl } })
559
571
  .then((data) => {
560
- console.log('catch block executed => ', data);
561
572
  window.open(this._headerSer.headerConfig.signOutUrl, '_self');
562
573
  })
563
574
  .catch((err) => {
564
- console.log('catch block => ', err);
565
- window.open(this._headerSer.headerConfig.signOutUrl, '_self');
575
+ console.log(err);
576
+ signOut({ global: true, oauth: { redirectUrl: this._headerSer.headerConfig.signOutUrl } })
577
+ .then(() => {
578
+ window.open(this._headerSer.headerConfig.signOutUrl, '_self');
579
+ })
580
+ .catch((error) => console.log(error));
566
581
  });
567
582
  }
568
583
  updateLastAccessedAppInfo() {
@@ -574,6 +589,18 @@ class HeaderComponent {
574
589
  }
575
590
  });
576
591
  }
592
+ onOpened(opened) {
593
+ if (opened) {
594
+ setTimeout(() => {
595
+ var _a, _b;
596
+ (_b = (_a = this.searchInput) === null || _a === void 0 ? void 0 : _a.nativeElement) === null || _b === void 0 ? void 0 : _b.focus();
597
+ }, 100); // Wait for panel to render
598
+ }
599
+ else {
600
+ // Clear the search input when panel closes
601
+ this.searchControl.setValue('');
602
+ }
603
+ }
577
604
  switchCompany(info) {
578
605
  var _a;
579
606
  let company = info.value;
@@ -635,15 +662,18 @@ class HeaderComponent {
635
662
  }
636
663
  }
637
664
  HeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
638
- HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: HeaderComponent, selector: "lib-header", inputs: { INACTIVITY_LIMIT: "INACTIVITY_LIMIT" }, host: { listeners: { "document:mousemove": "resetTimer()", "document:keydown": "resetTimer()", "document:click": "resetTimer()", "document:touchstart": "resetTimer()", "document:touchmove": "resetTimer()", "document:scroll": "resetTimer()", "window:focus": "resetTimer()" } }, viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["sidenav"], descendants: true }], ngImport: i0, template: "<mat-sidenav-container class=\"app-menu-sidenav-container\">\n <mat-sidenav cdkMenuBar #sidenav mode=\"over\" class=\"sidenavDrawer\">\n <div class=\"drawerHeadLogo\"><img [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.profetLogo)\"></div>\n <div class=\"app-menu-content-section\">\n <ng-container *ngFor=\"let appType of menuList\">\n <div class=\"appList\">\n <img *ngIf=\"appConfig[appType.key]?.appLogoUri\"\n [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[appType.key]?.appLogoUri)\">\n </div>\n <div class=\"subHeadListItems\">\n <div *ngFor=\"let item of appType.value\" class=\"menu-item\" (click)=\"menuSelection(item)\"\n [ngClass]=\"{'active-menu': item | activeRoute : _router.url:_headerSer.headerConfig.appType}\">\n <mat-icon class=\"menuIconList\" *ngIf=\"item.icon\">{{ item.icon }}</mat-icon>\n <span>{{ item.menuName }}</span>\n </div>\n </div>\n </ng-container>\n </div>\n </mat-sidenav>\n\n</mat-sidenav-container>\n<mat-toolbar cdkMenuBar color=\"primary\" class=\"header-wrapper common_header shadow-sm\">\n <!-- Main nav button and navigation links -->\n <button mat-icon-button color=\"theme-white\" (click)=\"sidenav.toggle()\"\n class=\"pmx-button pmx-menu-button orders-menu icon-btn ms-0 me-3\" aria-label=\"main menu\" tabindex=\"0\"\n matTooltip=\"Main menu\" matTooltipPosition=\"below\"\n matTooltipClass=\"poc-header-tooltip\"><mat-icon>menu</mat-icon></button>\n <a class=\"navbar-brand me-auto\" href=\"#\">\n <img [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[_headerSer.headerConfig.appType]?.appLogoUri)\"\n alt=\"App Logo\" class=\"app-logo\">\n </a>\n\n <ng-content></ng-content>\n\n <mat-form-field appearance=\"outline\" class=\"switchCompanyField\">\n <mat-label>Company</mat-label>\n <mat-select [formControl]=\"companyControl\" (selectionChange)=\"switchCompany($event)\">\n <mat-option *ngFor=\"let opt of companyList\" [value]=\"opt\">\n {{opt.name}}\n </mat-option>\n </mat-select>\n </mat-form-field>\n\n\n <!-- Profile button and profile dropdown links -->\n <button class=\"pmx-button pmx-menu-button profile-button\" mat-button [matMenuTriggerFor]=\"menu\" color=\"primary\"\n matTooltipPosition=\"below\">\n <div class=\"profile-inner\">\n <!-- <div class=\"brand-logo align-self-center\" *ngIf=\"activeCompany?.logo\"\n [ngClass]=\"activeCompany?.logo ? 'branded-logo-true' : 'branded-logo-false'\"\n [ngStyle]=\"{'background-image': 'url(' + activeCompany?.logo + ')'}\"></div> -->\n <div class=\"avatar\">\n <img *ngIf=\"userImageLink;else defaultAvatar\" [src]=\"userImageLink\" class=\"avatar-image\" alt=\"Avatar\">\n <ng-template #defaultAvatar><img\n [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.defaultUserImage)\"\n class=\"avatar-default\" alt=\"profile pic\"></ng-template>\n </div>\n </div>\n </button>\n <mat-menu #menu=\"matMenu\" class=\"accounts_drpmenu pmx-menu-group header-dropdown-profile\" xPosition=\"before\">\n <div class=\"popover-content show-menu\">\n <div class=\"popover-header\">\n <div class=\"popover-user-top\">\n <div class=\"avatar-wrapper\">\n <img *ngIf=\"userImageLink;else defaultLargeAvatar\" [src]=\"userImageLink\" class=\"avatar-icon\"\n alt=\"Avatar\">\n <ng-template #defaultLargeAvatar>\n <div [ngStyle]=\"{'background-image': 'url(' + imageDataUrls.defaultUserImage + ')'}\"\n class=\"avatar-icon default-avatar\" alt=\"Avatar icon\">&nbsp;</div>\n </ng-template>\n </div>\n <div class=\"user-data\">\n <h3 class=\"profile-name\"><span *ngIf=\"userAuthData\">{{ userAuthData?.firstName }} {{\n userAuthData?.lastName }}</span></h3>\n <button mat-button color=\"accent\" class=\"pmx-button btn btn-small view-profile ms-0\"\n (click)=\"profile()\">View Profile</button>\n </div>\n </div>\n </div>\n <div class=\"popover-body\">\n <!-- <div class=\"popover-content-title\">\n <p>Overview</p>\n </div> -->\n\n <div *ngIf=\"userAuthData?.email\">\n <p mat-menu-item class=\"list-text list-text-email mt-3 mb-3\">\n <mat-icon class=\"list-icon\">mail</mat-icon><span class=\"pmx-lower-case pmx-text-wrap me-auto\">{{\n userAuthData?.email }}</span>\n </p>\n </div>\n <ng-container *ngIf=\"userAuthData?.contactPhone\">\n <p mat-menu-item class=\"list-text mb-3\">\n <mat-icon class=\"list-icon\">call</mat-icon><span class=\"title-case me-auto\">{{\n userAuthData?.contactPhone }}</span>\n </p>\n </ng-container>\n\n <hr />\n <ul cdkMenu class=\"list-group last-group my-1\">\n <li cdkMenuItem class=\"list-item py-2\">\n <button mat-menu-item class=\"pmx-button list-button btn-logout\" (click)=\"onLogoutClick()\">\n <mat-icon>power_settings_new</mat-icon>\n <span class=\"list-text\">Logout</span>\n </button>\n </li>\n </ul>\n </div>\n </div>\n </mat-menu>\n</mat-toolbar>", styles: [":root{--contentfont: 13.12px !important;--labelfont: .75rem !important}.pmx-text-truncate{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pmx-text-wrap{overflow-wrap:break-word;word-break:break-word}.pmx-lower-case{text-transform:lowercase}.mat-mdc-button:not(:disabled){color:var(--mdc-text-button-label-text-color)}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color: #24a148;--mat-text-button-state-layer-color: #24a148;--mat-text-button-ripple-color: rgba(255, 64, 129, .1)}.header-user-name{text-align:end;color:#000}.header-user-name span{font-size:12px;color:#9e9e9ede}.avatarLogo{max-width:30px}mat-toolbar.mat-toolbar.common_header.mat-primary.mat-toolbar-single-row{position:fixed;left:0;top:0;background-color:#fff;height:56px}button.switchButton,button.menuHamberger{padding:8px!important}.sidenavPanel{padding:20px 25px;height:100vh;position:relative}ul.navbarList{padding-left:0;list-style:none;margin-top:40px}ul.navbarList li{color:#666;font-weight:400;margin-bottom:25px;width:170px;cursor:pointer}.active{color:#4177d6!important}ul.navbarList li img{width:23px;margin-right:15px}.accounts_drpmenu{margin-top:.7em}.xsShowUsername{display:none;padding:0 16px;height:48px;line-height:48px}.vr{width:2px;background-color:#f5f5f5;opacity:1;margin:0 .5rem 0 1rem}.vr-blury{background-image:linear-gradient(180deg,transparent,#666,transparent);width:1px;opacity:.25}.navbar-brand .app-logo{height:20px;width:auto}.pmx-button mat-icon.mat-icon,.pmx-button mat-icon.mat-primary,.pmx-button mat-icon.mat-accent,.pmx-button mat-icon.mat-warn{color:var(--mat-icon-color)}.pmx-button mat-icon.mat-icon{font-size:24px!important;line-height:1.5;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .3s ease}.pmx-button.mdc-button--raised mat-icon.mat-icon{width:24px;height:24px;display:contents}.pmx-button.mat-mdc-button-base mat-icon.mat-icon{z-index:1}.pmx-button mat-icon.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}.pmx-button mat-icon.mdc-button span.button-text{display:inline-flex;padding:0 1rem;text-transform:uppercase;font-size:.875rem;line-height:1.5}.pmx-button mat-icon.mdc-button span.upper-case{text-transform:uppercase}.pmx-button.mdc-button,.pmx-button.mdc-icon-button,.pmx-button.mdc-button--outlined,.pmx-button.mdc-button .mat-mdc-button-touch-target,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{height:40px!important;font-size:.75rem!important;letter-spacing:.2px;padding:0 .5rem;line-height:normal}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--outlined,.pmx-button.icon-btn.mdc-button--raised,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{width:40px;border-radius:5px}.pmx-button.btn-small.mdc-button,.pmx-button.btn-small.mdc-icon-button,.pmx-button.btn-small.mdc-button--outlined{height:28px!important;padding:0 1rem}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--raised{color:#254d93}.pmx-header .icon-button-shadow{box-shadow:0 1px 3px #0003,0 0 #00000024,0 1px 3px #0000001f}.pmx-button.icon-btn.mdc-button--raised.btn-switch-apps.menu-opened,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps.menu-opened{background-color:#254d93;color:#fff;font-variation-settings:\"FILL\" 0,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24}.pmx-button.mdc-icon-button.pmx-menu-button:hover,.pmx-button.mat-mdc-outlined-button.btn-switch-apps:hover,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps:hover{background-color:#e5f3fb}.pmx-button.icon-app{width:20px}.pmx-button.mat-mdc-outlined-button,.pmx-button.mat-mdc-outlined-button:not(:disabled){background-color:#fff;overflow:hidden}.pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{padding:0;border-color:#bfdff7!important}.btn-group-clicked .pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{border-color:#bfdff7!important}.pmx-button.profile-button .profile-inner{border:0 solid transparent!important;display:flex;align-items:center;overflow:clip}.pmx-button.profile-button .avatar{width:38px;height:38px;box-sizing:border-box;border-radius:50%;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-content:center;align-items:center;flex-wrap:wrap}.pmx-button.profile-button .avatar{background-color:#9cd7a8}.pmx-button.profile-button .avatar img.avatar-image,.pmx-button.profile-button .avatar img.avatar-default{width:100%;height:auto}.branded-group-false{margin-left:.65rem}.branded-group-false .pmx-button.pmx-menu-button.profile-button.branded-button-false{width:40px;border-radius:20px!important}.branded-group-true{margin-left:.65rem;border-radius:20px;border:1px solid #bfdff7}.btn-group-clicked.branded-group-true{background-color:#99ccf2}.branded-group-true .pmx-button.profile-button .profile-inner{border:0 solid #c4c9d2!important}.branded-group-true .pmx-button.pmx-menu-button.profile-button.branded-button-true{border-radius:20px}.branded-group-true .pmx-button.profile-button.branded-button-true .profile-inner .branded-logo-true{border-radius:5px;display:block;position:relative;height:38px;background-size:100%;background-position:center;background-repeat:no-repeat;min-width:100px;margin-right:1rem}.pmx-menu-group.mat-mdc-menu-panel{margin-top:1rem}.header-dropdown-apps.mat-mdc-menu-panel .mat-mdc-menu-content,.header-dropdown-profile.mat-mdc-menu-panel .mat-mdc-menu-content{padding:0!important}.header-dropdown-apps{width:400px!important}.header-dropdown-apps.mat-mdc-menu-panel .list-button{padding:.5rem 2rem}.header-dropdown-apps.mdc-menu-surface--open,.header-dropdown-profile.mdc-menu-surface--open{position:absolute;z-index:1;top:0;right:0;margin:0;padding:0;border:1px solid #e5e5e5;border-radius:6px;background:#fff;animation:popover .2s ease-in-out}.header-dropdown-apps.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:400px!important;width:400px!important;overflow:visible}::ng-deep .header-dropdown-profile.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:408px!important;width:408px!important;overflow:visible;margin-top:1rem}.popover-content:after,.popover-content:before{font-size:1.4em;display:block;width:0;height:0;content:\"\";pointer-events:none;position:absolute;top:-.45em}.popover-content:before{border-right:10px solid transparent;border-bottom:10px solid #999;border-left:10px solid transparent;right:.97em}.popover-content:after{border-right:12px solid transparent;border-bottom:12px solid #d5e3fa;border-left:12px solid transparent;right:.9em}.popover-content-title{display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 1rem;min-height:40px}.popover-content-title p{margin:0;font-size:.75rem!important;color:#777}.popover-content .popover-user-top:after{clear:both;content:\"\";display:table}.popover-content .popover-user-top{display:flex;flex-flow:row;justify-content:flex-start;align-items:center}.popover-content .popover-user-top .avatar-wrapper{flex:0 4 auto;border-radius:100%;overflow-clip-margin:content-box;overflow:clip;background-color:#fff;padding:2px}.drop-shadow{filter:drop-shadow(0px 0px 3px rgba(0,0,0,.5))}.popover-content .popover-user-top .user-data{flex:1 0 auto;margin-left:1rem}.popover-content .popover-user-top .avatar-wrapper .avatar-icon{background-repeat:no-repeat;background-size:100%;background-position:center;width:64px;height:64px;background-color:#72c885}.avatar-icon.default-avatar{background-size:100%}.popover-content .popover-user-top .user-data h3.profile-name{font-size:1rem;text-overflow:ellipsis;margin-bottom:.5rem;line-height:normal;font-weight:600;color:#254d93}.btn.view-profile{background:#fafafa}.popover-content ul.list-group{padding:0 0 8px;margin:0;display:flex;list-style:none}.popover-content ul.list-group.last-group,.popover-content ul.list-group.last-group .list-item{background-color:transparent}.popover-content ul.list-group li.list-item{align-items:center;border:none;padding:0;width:100%;display:flex;flex-direction:row;flex-wrap:wrap;order:1}.popover-content ul.list-group li.list-item .list-button{padding:.5rem 1rem;min-height:40px}.popover-content ul.list-group li.list-item span.mat-mdc-menu-item-text,.popover-content ul.list-group li.list-item span.mdc-list-item__primary-text,.popover-content ul.list-group li.list-item .list-button>span{display:flex;align-items:center}.popover-content ul.list-group li.list-item.list-company .list-button>span{width:100%;overflow:hidden}.popover-content ul.list-group li.list-item .list-button .hover-label.tooltip-label{opacity:0}.popover-content ul.list-group li.list-item.list-app .list-button:hover>span .hover-label.tooltip-label,.popover-content ul.list-group li.list-item.list-company .list-button:hover>span .hover-label.tooltip-label{opacity:0;display:inline-flex;color:#fff;background-color:#616161;font-size:11px;border-radius:4px;padding:0 .5rem;transition:opacity .3s ease-out}.popover-content ul.list-group li.list-item .list-button:hover{background:rgba(0,0,0,.04)}.popover-content ul.list-group li.list-item.company-active,.popover-content ul.list-group li.list-item.app-active{cursor:not-allowed;pointer-events:none;order:0}.popover-content ul.list-group li.list-item.company-active .active-label,.popover-content ul.list-group li.list-item.app-active .active-label{background-color:#93c47d;color:#212121;padding:0 .5rem;border-radius:50px;font-size:.75rem;margin-left:.5rem}.popover-content ul.list-group.list-apps-group{display:flex}.popover-content ul.list-group.list-overview li.list-item{cursor:not-allowed;pointer-events:none}::ng-deep .popover-content ul.list-group li.list-item button.list-button .list-text{font-size:15px}.popover-content .popover-body p.list-text{padding:.5rem 1rem;margin:0;min-height:auto;cursor:default}::ng-deep .popover-content .popover-body p.list-text .mat-mdc-menu-item-text{font-size:15px;font-weight:500}.popover-content ul.list-group li.list-item .list-button .mat-icon,.popover-content ul.list-group li.list-item p.list-text mat-icon.list-icon,.popover-content ul.list-group li.list-item .list-button .list-icon,.popover-content ul.list-group li.list-item p.list-text .list-icon,.popover-content .popover-body p.list-text .list-icon{color:#2db051;font-variation-settings:\"FILL\" 0,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24;font-size:24px!important}.popover-content ul.list-group li.list-item.list-active.company-active button.list-button .mat-icon{color:#2db051;font-variation-settings:\"FILL\" 1,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24}.popover-content ul.list-group li.list-item p.list-text span.mdc-list-item__primary-text{width:100%;display:flex}.popover-content ul.list-group li.list-item span.title-case,.popover-content ul.list-group li.list-item span.lower-case,.popover-content ul.list-group li.list-item span.pmx-lower-case{font-size:.8rem;color:#212121;font-weight:500;display:block;line-height:normal}small{color:#9e9e9e}.popover-content ul.list-group li.list-item span.text-label{font-size:12px;color:#979797;font-weight:400;display:block;line-height:normal}.popover-content ul.list-group li.list-item .list-text span.mat-mdc-menu-item-text{font-size:.875rem;color:#0a152f;font-weight:500;line-height:normal}.popover-content ul.list-group li.list-item .list-text.list-text-email span.mat-mdc-menu-item-text{width:calc(100% - 40px);display:inline-flex}.popover-content ul.list-group li.list-item .list-text.list-text-email span.pmx-text-wrap{overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:none;hyphens:none;width:100%}.popover-content ul.list-group li.list-item span.upper-case{text-transform:uppercase}.popover-content ul.list-group li.list-item span.app-status,.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{font-size:13px;color:#0a152f;font-weight:400;display:block;line-height:normal;margin:0}.popover-content ul.list-group li.list-item.app-active .list-text,.popover-content ul.list-group li.list-item.company-active .list-text{color:#4b85ea}.popover-content ul.list-group li.list-item.app-active span.app-status,.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status,.popover-content ul.list-group li.list-item.company-active span.app-status,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status{color:#24a53f}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{display:flex;flex-direction:row;justify-content:flex-start}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{transition:all .3s ease-out;margin-left:auto;flex:1;justify-content:flex-end}.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{background-color:#408dd7;color:#f5f5f5}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip .mat-mdc-chip-action-label{font-size:.75rem}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip{height:24px}.popover-content ul.list-group li.list-item img.logo-thumb{width:24px;height:auto;margin-right:1rem}.popover-content ul.list-group li.list-item .list-button.btn-logout{display:flex;align-items:center;color:#616161}.popover-content ul.list-group li.list-item.app-active .list-button .app-icon-wrapper{background-color:#fff;border-color:#4b85ea;border-width:3px}.popover-content ul.list-group li.list-item.company-active .list-text .mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24;color:var(--themelightblue)}.popover-content ul.list-group li.list-item .list-button.btn-logout .list-text{color:#616161}.popover-content ul.list-group li.list-item.app-active button,.popover-content ul.list-group li.list-item.company-active button{cursor:not-allowed;pointer-events:none}.popover-content hr{background-color:#c4c9d2;margin:0;width:100%;border:0;border-top:1px solid #c4c9d2;opacity:1}.popover-content ul.apps-grid{width:100%;white-space:nowrap;overflow:auto}.popover-content ul.apps-grid li.list-item,.popover-content ul.apps-grid li.list-item img.logo-thumb{display:flex;justify-content:flex-start;flex-wrap:nowrap;align-content:center;align-items:center;flex-direction:row}.popover-header{background-color:#d5e3fa;border-bottom:1px solid #d8d8d8;padding:.975rem 1rem;margin-bottom:0;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;flex-wrap:wrap}.popover-header .mat-icon{font-size:1.5rem!important;font-variation-settings:\"FILL\" 1,\"wght\" 500,\"GRAD\" 0,\"opsz\" 24;color:#254d93}.header-dropdown-profile .popover-header{padding:1.125rem 1rem}.popover-header h3.popover-title{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;margin-bottom:0;line-height:normal;font-weight:500;color:#254d93}.popover-body{max-height:420px;overflow:auto;padding:0}.app-icon-wrapper{margin:0 1rem 0 0;max-width:48px;max-height:48px;width:48px;height:48px;overflow:hidden;background-size:70%;background-repeat:no-repeat;background-position:center;border:1px solid #c4c9d2;border-radius:8px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;flex-wrap:wrap}.app-icon-wrapper img.app-icon{width:100%;height:auto;overflow:hidden;padding:.5rem}h4.app-name{font-size:.65rem;margin:.5rem 0 0;line-height:normal;color:#254d93;font-weight:400;text-transform:uppercase}.popover-body ul.enabled-apps{display:flex;flex-flow:column wrap;justify-content:space-evenly;align-items:center;align-content:flex-start;border-bottom:1px solid #E9E9E9;margin:0;padding:0 1rem;list-style:none}.popover-body ul.enabled-apps li.enabled-app{flex-grow:1;flex:0 1 auto;text-align:center;font-size:.8125rem;padding:10px;list-style:none}.pmx-button.mdc-icon-button[color=theme-white],.pmx-button.icon-btn.mdc-button--raised[color=theme-white]{color:#254d93}.pmx-button.icon-btn.orders-menu[color=theme-white]{border:1px solid #fafafa!important}:host(.mat-accent){--mat-slider-ripple-color: #24a148;--mat-slider-hover-state-layer-color: rgba(255, 64, 129, .05);--mat-slider-focus-state-layer-color: rgba(255, 64, 129, .2);--mdc-slider-handle-color: #24a148;--mdc-slider-focus-handle-color: #24a148;--mdc-slider-hover-handle-color: #24a148;--mdc-slider-active-track-color: #24a148;--mdc-slider-inactive-track-color: #24a148;--mdc-slider-with-tick-marks-inactive-container-color: #24a148;--mdc-slider-with-tick-marks-active-container-color: #51bc6b}:host ::ng-deep .app-menu-sidenav-container{z-index:999}:host ::ng-deep .mat-drawer-backdrop.mat-drawer-shown{position:fixed;background:rgba(63,81,181,.25)}.mat-drawer-backdrop{position:fixed!important}.sidenavDrawer{position:fixed!important;left:0;width:250px;padding:0}.mdc-list-group__subheader{background-color:#eef4ff;padding:5px 20px;margin-bottom:5px!important;font-size:14px!important;font-weight:500!important}.menusubItems{padding-left:2rem!important}.switchCompanyField{min-width:175px!important;margin-left:13px}.profile-button{margin-left:10px}.brand-logo{width:100px;height:38px;background-repeat:no-repeat;background-size:contain;background-origin:content-box;padding:7px}.menuIconList{font-size:20px!important;height:20px;width:20px;margin-right:.5rem;position:relative;color:#747474;font-weight:300}.subHeadListItems{padding:0 15px}.subHeadListItems .menu-item{display:flex;flex-direction:row;align-items:center;color:#000;padding:.7rem .5rem;border-radius:3px;transition:all .3s;font-size:var(--contentfont)}.subHeadListItems .menu-item:hover:not(.no-select){cursor:pointer;background-color:#f5f5f5}.subHeadInnerItem{margin-bottom:0!important}.drawerHeadLogo{width:100%;padding:10px 20px;margin-bottom:20px;margin-top:15px}.drawerHeadLogo img{width:130px}.app-menu-content-section{overflow-y:auto;height:calc(100vh - 80px);padding-bottom:25px}.active-menu{background-color:var(--themelightblue)!important;color:#fff!important;font-weight:500}.active-menu .menuIconList{color:#fff}.appList{padding:11px 15px;background-color:#eef4ff;margin:20px 0 10px;height:35px;display:flex}.appList img{object-fit:contain}::ng-deep .header-dropdown-profile .mat-mdc-menu-content{margin:0;padding:0;list-style-type:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i5.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "component", type: i9.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i10.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i11.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: ActiveRoutePipe, name: "activeRoute" }] });
665
+ HeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: HeaderComponent, selector: "lib-header", inputs: { INACTIVITY_LIMIT: "INACTIVITY_LIMIT" }, host: { listeners: { "document:mousemove": "resetTimer()", "document:keydown": "resetTimer()", "document:click": "resetTimer()", "document:touchstart": "resetTimer()", "document:touchmove": "resetTimer()", "document:scroll": "resetTimer()", "window:focus": "resetTimer()" } }, viewQueries: [{ propertyName: "sidenav", first: true, predicate: ["sidenav"], descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<mat-sidenav-container class=\"app-menu-sidenav-container\">\n <mat-sidenav cdkMenuBar #sidenav mode=\"over\" class=\"sidenavDrawer\">\n <div class=\"drawerHeadLogo\"><img [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.profetLogo)\"></div>\n <div class=\"app-menu-content-section\">\n <ng-container *ngFor=\"let appType of menuList\">\n <div class=\"appList\">\n <img *ngIf=\"appConfig[appType.key]?.appLogoUri\"\n [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[appType.key]?.appLogoUri)\">\n </div>\n <div class=\"subHeadListItems\">\n <div *ngFor=\"let item of appType.value\" class=\"menu-item\" (click)=\"menuSelection(item)\"\n [ngClass]=\"{'active-menu': item | activeRoute : _router.url:_headerSer.headerConfig.appType}\">\n <mat-icon class=\"menuIconList\" *ngIf=\"item.icon\">{{ item.icon }}</mat-icon>\n <span>{{ item.menuName }}</span>\n </div>\n </div>\n </ng-container>\n </div>\n </mat-sidenav>\n\n</mat-sidenav-container>\n<mat-toolbar cdkMenuBar color=\"primary\" class=\"header-wrapper common_header shadow-sm\">\n <!-- Main nav button and navigation links -->\n <button mat-icon-button color=\"theme-white\" (click)=\"sidenav.toggle()\"\n class=\"pmx-button pmx-menu-button orders-menu icon-btn ms-0 me-3\" aria-label=\"main menu\" tabindex=\"0\"\n matTooltip=\"Main menu\" matTooltipPosition=\"below\"\n matTooltipClass=\"poc-header-tooltip\"><mat-icon>menu</mat-icon></button>\n <a class=\"navbar-brand me-auto\" href=\"#\">\n <img [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[_headerSer.headerConfig.appType]?.appLogoUri)\"\n alt=\"App Logo\" class=\"app-logo\">\n </a>\n\n <ng-content></ng-content>\n\n <mat-form-field appearance=\"outline\" class=\"switchCompanyField\">\n <mat-label>Company</mat-label>\n <mat-select [formControl]=\"companyControl\" (selectionChange)=\"switchCompany($event)\"\n (openedChange)=\"onOpened($event)\">\n <div class=\"options-search mat-select-search-container\">\n <mat-form-field appearance=\"outline\">\n <input #searchInput matInput placeholder=\"Search\" [formControl]=\"searchControl\"\n (keydown)=\"$event.stopPropagation()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n </div>\n <mat-option *ngFor=\"let opt of filteredOptions\" [value]=\"opt\">\n {{opt.name}}\n </mat-option>\n </mat-select>\n </mat-form-field>\n\n\n <!-- Profile button and profile dropdown links -->\n <button class=\"pmx-button pmx-menu-button profile-button\" mat-button [matMenuTriggerFor]=\"menu\" color=\"primary\"\n matTooltipPosition=\"below\">\n <div class=\"profile-inner\">\n <!-- <div class=\"brand-logo align-self-center\" *ngIf=\"activeCompany?.logo\"\n [ngClass]=\"activeCompany?.logo ? 'branded-logo-true' : 'branded-logo-false'\"\n [ngStyle]=\"{'background-image': 'url(' + activeCompany?.logo + ')'}\"></div> -->\n <div class=\"avatar\">\n <img *ngIf=\"userImageLink;else defaultAvatar\" [src]=\"userImageLink\" class=\"avatar-image\" alt=\"Avatar\">\n <ng-template #defaultAvatar><img\n [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.defaultUserImage)\"\n class=\"avatar-default\" alt=\"profile pic\"></ng-template>\n </div>\n </div>\n </button>\n <mat-menu #menu=\"matMenu\" class=\"accounts_drpmenu pmx-menu-group header-dropdown-profile\" xPosition=\"before\">\n <div class=\"popover-content show-menu\">\n <div class=\"popover-header\">\n <div class=\"popover-user-top\">\n <div class=\"avatar-wrapper\">\n <img *ngIf=\"userImageLink;else defaultLargeAvatar\" [src]=\"userImageLink\" class=\"avatar-icon\"\n alt=\"Avatar\">\n <ng-template #defaultLargeAvatar>\n <div [ngStyle]=\"{'background-image': 'url(' + imageDataUrls.defaultUserImage + ')'}\"\n class=\"avatar-icon default-avatar\" alt=\"Avatar icon\">&nbsp;</div>\n </ng-template>\n </div>\n <div class=\"user-data\">\n <h3 class=\"profile-name\"><span *ngIf=\"userAuthData\">{{ userAuthData?.firstName }} {{\n userAuthData?.lastName }}</span></h3>\n <button mat-button color=\"accent\" class=\"pmx-button btn btn-small view-profile ms-0\"\n (click)=\"profile()\">View Profile</button>\n </div>\n </div>\n </div>\n <div class=\"popover-body\">\n <!-- <div class=\"popover-content-title\">\n <p>Overview</p>\n </div> -->\n\n <div *ngIf=\"userAuthData?.email\">\n <p mat-menu-item class=\"list-text list-text-email mt-3 mb-3\">\n <mat-icon class=\"list-icon\">mail</mat-icon><span class=\"pmx-lower-case pmx-text-wrap me-auto\">{{\n userAuthData?.email }}</span>\n </p>\n </div>\n <ng-container *ngIf=\"userAuthData?.contactPhone\">\n <p mat-menu-item class=\"list-text mb-3\">\n <mat-icon class=\"list-icon\">call</mat-icon><span class=\"title-case me-auto\">{{\n userAuthData?.contactPhone }}</span>\n </p>\n </ng-container>\n\n <hr />\n <ul cdkMenu class=\"list-group last-group my-1\">\n <li cdkMenuItem class=\"list-item py-2\">\n <button mat-menu-item class=\"pmx-button list-button btn-logout\" (click)=\"onLogoutClick()\">\n <mat-icon>power_settings_new</mat-icon>\n <span class=\"list-text\">Logout</span>\n </button>\n </li>\n </ul>\n </div>\n </div>\n </mat-menu>\n</mat-toolbar>", styles: [":root{--contentfont: 13.12px !important;--labelfont: .75rem !important}.pmx-text-truncate{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pmx-text-wrap{overflow-wrap:break-word;word-break:break-word}.pmx-lower-case{text-transform:lowercase}.mat-mdc-button:not(:disabled){color:var(--mdc-text-button-label-text-color)}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color: #24a148;--mat-text-button-state-layer-color: #24a148;--mat-text-button-ripple-color: rgba(255, 64, 129, .1)}.header-user-name{text-align:end;color:#000}.header-user-name span{font-size:12px;color:#9e9e9ede}.avatarLogo{max-width:30px}mat-toolbar.mat-toolbar.common_header.mat-primary.mat-toolbar-single-row{position:fixed;left:0;top:0;background-color:#fff;height:56px}button.switchButton,button.menuHamberger{padding:8px!important}.sidenavPanel{padding:20px 25px;height:100vh;position:relative}ul.navbarList{padding-left:0;list-style:none;margin-top:40px}ul.navbarList li{color:#666;font-weight:400;margin-bottom:25px;width:170px;cursor:pointer}.active{color:#4177d6!important}ul.navbarList li img{width:23px;margin-right:15px}.accounts_drpmenu{margin-top:.7em}.xsShowUsername{display:none;padding:0 16px;height:48px;line-height:48px}.vr{width:2px;background-color:#f5f5f5;opacity:1;margin:0 .5rem 0 1rem}.vr-blury{background-image:linear-gradient(180deg,transparent,#666,transparent);width:1px;opacity:.25}.navbar-brand .app-logo{height:20px;width:auto}.pmx-button mat-icon.mat-icon,.pmx-button mat-icon.mat-primary,.pmx-button mat-icon.mat-accent,.pmx-button mat-icon.mat-warn{color:var(--mat-icon-color)}.pmx-button mat-icon.mat-icon{font-size:24px!important;line-height:1.5;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .3s ease}.pmx-button.mdc-button--raised mat-icon.mat-icon{width:24px;height:24px;display:contents}.pmx-button.mat-mdc-button-base mat-icon.mat-icon{z-index:1}.pmx-button mat-icon.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}.pmx-button mat-icon.mdc-button span.button-text{display:inline-flex;padding:0 1rem;text-transform:uppercase;font-size:.875rem;line-height:1.5}.pmx-button mat-icon.mdc-button span.upper-case{text-transform:uppercase}.pmx-button.mdc-button,.pmx-button.mdc-icon-button,.pmx-button.mdc-button--outlined,.pmx-button.mdc-button .mat-mdc-button-touch-target,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{height:40px!important;font-size:.75rem!important;letter-spacing:.2px;padding:0 .5rem;line-height:normal}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--outlined,.pmx-button.icon-btn.mdc-button--raised,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{width:40px;border-radius:5px}.pmx-button.btn-small.mdc-button,.pmx-button.btn-small.mdc-icon-button,.pmx-button.btn-small.mdc-button--outlined{height:28px!important;padding:0 1rem}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--raised{color:#254d93}.pmx-header .icon-button-shadow{box-shadow:0 1px 3px #0003,0 0 #00000024,0 1px 3px #0000001f}.pmx-button.icon-btn.mdc-button--raised.btn-switch-apps.menu-opened,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps.menu-opened{background-color:#254d93;color:#fff;font-variation-settings:\"FILL\" 0,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24}.pmx-button.mdc-icon-button.pmx-menu-button:hover,.pmx-button.mat-mdc-outlined-button.btn-switch-apps:hover,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps:hover{background-color:#e5f3fb}.pmx-button.icon-app{width:20px}.pmx-button.mat-mdc-outlined-button,.pmx-button.mat-mdc-outlined-button:not(:disabled){background-color:#fff;overflow:hidden}.pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{padding:0;border-color:#bfdff7!important}.btn-group-clicked .pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{border-color:#bfdff7!important}.pmx-button.profile-button .profile-inner{border:0 solid transparent!important;display:flex;align-items:center;overflow:clip}.pmx-button.profile-button .avatar{width:38px;height:38px;box-sizing:border-box;border-radius:50%;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-content:center;align-items:center;flex-wrap:wrap}.pmx-button.profile-button .avatar{background-color:#9cd7a8}.pmx-button.profile-button .avatar img.avatar-image,.pmx-button.profile-button .avatar img.avatar-default{width:100%;height:auto}.branded-group-false{margin-left:.65rem}.branded-group-false .pmx-button.pmx-menu-button.profile-button.branded-button-false{width:40px;border-radius:20px!important}.branded-group-true{margin-left:.65rem;border-radius:20px;border:1px solid #bfdff7}.btn-group-clicked.branded-group-true{background-color:#99ccf2}.branded-group-true .pmx-button.profile-button .profile-inner{border:0 solid #c4c9d2!important}.branded-group-true .pmx-button.pmx-menu-button.profile-button.branded-button-true{border-radius:20px}.branded-group-true .pmx-button.profile-button.branded-button-true .profile-inner .branded-logo-true{border-radius:5px;display:block;position:relative;height:38px;background-size:100%;background-position:center;background-repeat:no-repeat;min-width:100px;margin-right:1rem}.pmx-menu-group.mat-mdc-menu-panel{margin-top:1rem}.header-dropdown-apps.mat-mdc-menu-panel .mat-mdc-menu-content,.header-dropdown-profile.mat-mdc-menu-panel .mat-mdc-menu-content{padding:0!important}.header-dropdown-apps{width:400px!important}.header-dropdown-apps.mat-mdc-menu-panel .list-button{padding:.5rem 2rem}.header-dropdown-apps.mdc-menu-surface--open,.header-dropdown-profile.mdc-menu-surface--open{position:absolute;z-index:1;top:0;right:0;margin:0;padding:0;border:1px solid #e5e5e5;border-radius:6px;background:#fff;animation:popover .2s ease-in-out}.header-dropdown-apps.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:400px!important;width:400px!important;overflow:visible}::ng-deep .header-dropdown-profile.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:408px!important;width:408px!important;overflow:visible;margin-top:1rem}.popover-content:after,.popover-content:before{font-size:1.4em;display:block;width:0;height:0;content:\"\";pointer-events:none;position:absolute;top:-.45em}.popover-content:before{border-right:10px solid transparent;border-bottom:10px solid #999;border-left:10px solid transparent;right:.97em}.popover-content:after{border-right:12px solid transparent;border-bottom:12px solid #d5e3fa;border-left:12px solid transparent;right:.9em}.popover-content-title{display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 1rem;min-height:40px}.popover-content-title p{margin:0;font-size:.75rem!important;color:#777}.popover-content .popover-user-top:after{clear:both;content:\"\";display:table}.popover-content .popover-user-top{display:flex;flex-flow:row;justify-content:flex-start;align-items:center}.popover-content .popover-user-top .avatar-wrapper{flex:0 4 auto;border-radius:100%;overflow-clip-margin:content-box;overflow:clip;background-color:#fff;padding:2px}.drop-shadow{filter:drop-shadow(0px 0px 3px rgba(0,0,0,.5))}.popover-content .popover-user-top .user-data{flex:1 0 auto;margin-left:1rem}.popover-content .popover-user-top .avatar-wrapper .avatar-icon{background-repeat:no-repeat;background-size:100%;background-position:center;width:64px;height:64px;background-color:#72c885}.avatar-icon.default-avatar{background-size:100%}.popover-content .popover-user-top .user-data h3.profile-name{font-size:1rem;text-overflow:ellipsis;margin-bottom:.5rem;line-height:normal;font-weight:600;color:#254d93}.btn.view-profile{background:#fafafa}.popover-content ul.list-group{padding:0 0 8px;margin:0;display:flex;list-style:none}.popover-content ul.list-group.last-group,.popover-content ul.list-group.last-group .list-item{background-color:transparent}.popover-content ul.list-group li.list-item{align-items:center;border:none;padding:0;width:100%;display:flex;flex-direction:row;flex-wrap:wrap;order:1}.popover-content ul.list-group li.list-item .list-button{padding:.5rem 1rem;min-height:40px}.popover-content ul.list-group li.list-item span.mat-mdc-menu-item-text,.popover-content ul.list-group li.list-item span.mdc-list-item__primary-text,.popover-content ul.list-group li.list-item .list-button>span{display:flex;align-items:center}.popover-content ul.list-group li.list-item.list-company .list-button>span{width:100%;overflow:hidden}.popover-content ul.list-group li.list-item .list-button .hover-label.tooltip-label{opacity:0}.popover-content ul.list-group li.list-item.list-app .list-button:hover>span .hover-label.tooltip-label,.popover-content ul.list-group li.list-item.list-company .list-button:hover>span .hover-label.tooltip-label{opacity:0;display:inline-flex;color:#fff;background-color:#616161;font-size:11px;border-radius:4px;padding:0 .5rem;transition:opacity .3s ease-out}.popover-content ul.list-group li.list-item .list-button:hover{background:rgba(0,0,0,.04)}.popover-content ul.list-group li.list-item.company-active,.popover-content ul.list-group li.list-item.app-active{cursor:not-allowed;pointer-events:none;order:0}.popover-content ul.list-group li.list-item.company-active .active-label,.popover-content ul.list-group li.list-item.app-active .active-label{background-color:#93c47d;color:#212121;padding:0 .5rem;border-radius:50px;font-size:.75rem;margin-left:.5rem}.popover-content ul.list-group.list-apps-group{display:flex}.popover-content ul.list-group.list-overview li.list-item{cursor:not-allowed;pointer-events:none}::ng-deep .popover-content ul.list-group li.list-item button.list-button .list-text{font-size:15px}.popover-content .popover-body p.list-text{padding:.5rem 1rem;margin:0;min-height:auto;cursor:default}::ng-deep .popover-content .popover-body p.list-text .mat-mdc-menu-item-text{font-size:15px;font-weight:500}.popover-content ul.list-group li.list-item .list-button .mat-icon,.popover-content ul.list-group li.list-item p.list-text mat-icon.list-icon,.popover-content ul.list-group li.list-item .list-button .list-icon,.popover-content ul.list-group li.list-item p.list-text .list-icon,.popover-content .popover-body p.list-text .list-icon{color:#2db051;font-variation-settings:\"FILL\" 0,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24;font-size:24px!important}.popover-content ul.list-group li.list-item.list-active.company-active button.list-button .mat-icon{color:#2db051;font-variation-settings:\"FILL\" 1,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24}.popover-content ul.list-group li.list-item p.list-text span.mdc-list-item__primary-text{width:100%;display:flex}.popover-content ul.list-group li.list-item span.title-case,.popover-content ul.list-group li.list-item span.lower-case,.popover-content ul.list-group li.list-item span.pmx-lower-case{font-size:.8rem;color:#212121;font-weight:500;display:block;line-height:normal}small{color:#9e9e9e}.popover-content ul.list-group li.list-item span.text-label{font-size:12px;color:#979797;font-weight:400;display:block;line-height:normal}.popover-content ul.list-group li.list-item .list-text span.mat-mdc-menu-item-text{font-size:.875rem;color:#0a152f;font-weight:500;line-height:normal}.popover-content ul.list-group li.list-item .list-text.list-text-email span.mat-mdc-menu-item-text{width:calc(100% - 40px);display:inline-flex}.popover-content ul.list-group li.list-item .list-text.list-text-email span.pmx-text-wrap{overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:none;hyphens:none;width:100%}.popover-content ul.list-group li.list-item span.upper-case{text-transform:uppercase}.popover-content ul.list-group li.list-item span.app-status,.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{font-size:13px;color:#0a152f;font-weight:400;display:block;line-height:normal;margin:0}.popover-content ul.list-group li.list-item.app-active .list-text,.popover-content ul.list-group li.list-item.company-active .list-text{color:#4b85ea}.popover-content ul.list-group li.list-item.app-active span.app-status,.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status,.popover-content ul.list-group li.list-item.company-active span.app-status,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status{color:#24a53f}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{display:flex;flex-direction:row;justify-content:flex-start}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{transition:all .3s ease-out;margin-left:auto;flex:1;justify-content:flex-end}.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{background-color:#408dd7;color:#f5f5f5}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip .mat-mdc-chip-action-label{font-size:.75rem}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip{height:24px}.popover-content ul.list-group li.list-item img.logo-thumb{width:24px;height:auto;margin-right:1rem}.popover-content ul.list-group li.list-item .list-button.btn-logout{display:flex;align-items:center;color:#616161}.popover-content ul.list-group li.list-item.app-active .list-button .app-icon-wrapper{background-color:#fff;border-color:#4b85ea;border-width:3px}.popover-content ul.list-group li.list-item.company-active .list-text .mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24;color:var(--themelightblue)}.popover-content ul.list-group li.list-item .list-button.btn-logout .list-text{color:#616161}.popover-content ul.list-group li.list-item.app-active button,.popover-content ul.list-group li.list-item.company-active button{cursor:not-allowed;pointer-events:none}.popover-content hr{background-color:#c4c9d2;margin:0;width:100%;border:0;border-top:1px solid #c4c9d2;opacity:1}.popover-content ul.apps-grid{width:100%;white-space:nowrap;overflow:auto}.popover-content ul.apps-grid li.list-item,.popover-content ul.apps-grid li.list-item img.logo-thumb{display:flex;justify-content:flex-start;flex-wrap:nowrap;align-content:center;align-items:center;flex-direction:row}.popover-header{background-color:#d5e3fa;border-bottom:1px solid #d8d8d8;padding:.975rem 1rem;margin-bottom:0;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;flex-wrap:wrap}.popover-header .mat-icon{font-size:1.5rem!important;font-variation-settings:\"FILL\" 1,\"wght\" 500,\"GRAD\" 0,\"opsz\" 24;color:#254d93}.header-dropdown-profile .popover-header{padding:1.125rem 1rem}.popover-header h3.popover-title{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;margin-bottom:0;line-height:normal;font-weight:500;color:#254d93}.popover-body{max-height:420px;overflow:auto;padding:0}.app-icon-wrapper{margin:0 1rem 0 0;max-width:48px;max-height:48px;width:48px;height:48px;overflow:hidden;background-size:70%;background-repeat:no-repeat;background-position:center;border:1px solid #c4c9d2;border-radius:8px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;flex-wrap:wrap}.app-icon-wrapper img.app-icon{width:100%;height:auto;overflow:hidden;padding:.5rem}h4.app-name{font-size:.65rem;margin:.5rem 0 0;line-height:normal;color:#254d93;font-weight:400;text-transform:uppercase}.popover-body ul.enabled-apps{display:flex;flex-flow:column wrap;justify-content:space-evenly;align-items:center;align-content:flex-start;border-bottom:1px solid #E9E9E9;margin:0;padding:0 1rem;list-style:none}.popover-body ul.enabled-apps li.enabled-app{flex-grow:1;flex:0 1 auto;text-align:center;font-size:.8125rem;padding:10px;list-style:none}.pmx-button.mdc-icon-button[color=theme-white],.pmx-button.icon-btn.mdc-button--raised[color=theme-white]{color:#254d93}.pmx-button.icon-btn.orders-menu[color=theme-white]{border:1px solid #fafafa!important}:host(.mat-accent){--mat-slider-ripple-color: #24a148;--mat-slider-hover-state-layer-color: rgba(255, 64, 129, .05);--mat-slider-focus-state-layer-color: rgba(255, 64, 129, .2);--mdc-slider-handle-color: #24a148;--mdc-slider-focus-handle-color: #24a148;--mdc-slider-hover-handle-color: #24a148;--mdc-slider-active-track-color: #24a148;--mdc-slider-inactive-track-color: #24a148;--mdc-slider-with-tick-marks-inactive-container-color: #24a148;--mdc-slider-with-tick-marks-active-container-color: #51bc6b}:host ::ng-deep .app-menu-sidenav-container{z-index:999}:host ::ng-deep .mat-drawer-backdrop.mat-drawer-shown{position:fixed;background:rgba(63,81,181,.25)}.mat-drawer-backdrop{position:fixed!important}.sidenavDrawer{position:fixed!important;left:0;width:250px;padding:0}.mdc-list-group__subheader{background-color:#eef4ff;padding:5px 20px;margin-bottom:5px!important;font-size:14px!important;font-weight:500!important}.menusubItems{padding-left:2rem!important}.switchCompanyField{min-width:175px!important;margin-left:13px}.profile-button{margin-left:10px}.brand-logo{width:100px;height:38px;background-repeat:no-repeat;background-size:contain;background-origin:content-box;padding:7px}.menuIconList{font-size:20px!important;height:20px;width:20px;margin-right:.5rem;position:relative;color:#747474;font-weight:300}.subHeadListItems{padding:0 15px}.subHeadListItems .menu-item{display:flex;flex-direction:row;align-items:center;color:#000;padding:.7rem .5rem;border-radius:3px;transition:all .3s;font-size:var(--contentfont)}.subHeadListItems .menu-item:hover:not(.no-select){cursor:pointer;background-color:#f5f5f5}.subHeadInnerItem{margin-bottom:0!important}.drawerHeadLogo{width:100%;padding:10px 20px;margin-bottom:20px;margin-top:15px}.drawerHeadLogo img{width:130px}.app-menu-content-section{overflow-y:auto;height:calc(100vh - 80px);padding-bottom:25px}.active-menu{background-color:var(--themelightblue)!important;color:#fff!important;font-weight:500}.active-menu .menuIconList{color:#fff}.appList{padding:11px 15px;background-color:#eef4ff;margin:20px 0 10px;height:35px;display:flex}.appList img{object-fit:contain}::ng-deep .header-dropdown-profile .mat-mdc-menu-content{margin:0;padding:0;list-style-type:none}.options-search ::ng-deep .mat-mdc-form-field-icon-suffix>.mat-icon{font-size:21px!important;color:gray;padding:0!important}::ng-deep .mat-select-panel{position:relative}::ng-deep .mat-select-search-container{position:sticky;top:0;z-index:1;background:white;padding:8px 12px;border-bottom:1px solid #ddd}::ng-deep div.mat-mdc-select-panel{padding-top:0!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2$1.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatSidenav, selector: "mat-sidenav", inputs: ["fixedInViewport", "fixedTopGap", "fixedBottomGap"], exportAs: ["matSidenav"] }, { kind: "component", type: i5.MatSidenavContainer, selector: "mat-sidenav-container", exportAs: ["matSidenavContainer"] }, { kind: "component", type: i6.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i6.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i6.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "directive", type: i7.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "directive", type: i8.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "component", type: i9.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator"], exportAs: ["matSelect"] }, { kind: "component", type: i10.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i11.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: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i11.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i12.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "pipe", type: ActiveRoutePipe, name: "activeRoute" }] });
639
666
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: HeaderComponent, decorators: [{
640
667
  type: Component,
641
- args: [{ selector: 'lib-header', template: "<mat-sidenav-container class=\"app-menu-sidenav-container\">\n <mat-sidenav cdkMenuBar #sidenav mode=\"over\" class=\"sidenavDrawer\">\n <div class=\"drawerHeadLogo\"><img [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.profetLogo)\"></div>\n <div class=\"app-menu-content-section\">\n <ng-container *ngFor=\"let appType of menuList\">\n <div class=\"appList\">\n <img *ngIf=\"appConfig[appType.key]?.appLogoUri\"\n [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[appType.key]?.appLogoUri)\">\n </div>\n <div class=\"subHeadListItems\">\n <div *ngFor=\"let item of appType.value\" class=\"menu-item\" (click)=\"menuSelection(item)\"\n [ngClass]=\"{'active-menu': item | activeRoute : _router.url:_headerSer.headerConfig.appType}\">\n <mat-icon class=\"menuIconList\" *ngIf=\"item.icon\">{{ item.icon }}</mat-icon>\n <span>{{ item.menuName }}</span>\n </div>\n </div>\n </ng-container>\n </div>\n </mat-sidenav>\n\n</mat-sidenav-container>\n<mat-toolbar cdkMenuBar color=\"primary\" class=\"header-wrapper common_header shadow-sm\">\n <!-- Main nav button and navigation links -->\n <button mat-icon-button color=\"theme-white\" (click)=\"sidenav.toggle()\"\n class=\"pmx-button pmx-menu-button orders-menu icon-btn ms-0 me-3\" aria-label=\"main menu\" tabindex=\"0\"\n matTooltip=\"Main menu\" matTooltipPosition=\"below\"\n matTooltipClass=\"poc-header-tooltip\"><mat-icon>menu</mat-icon></button>\n <a class=\"navbar-brand me-auto\" href=\"#\">\n <img [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[_headerSer.headerConfig.appType]?.appLogoUri)\"\n alt=\"App Logo\" class=\"app-logo\">\n </a>\n\n <ng-content></ng-content>\n\n <mat-form-field appearance=\"outline\" class=\"switchCompanyField\">\n <mat-label>Company</mat-label>\n <mat-select [formControl]=\"companyControl\" (selectionChange)=\"switchCompany($event)\">\n <mat-option *ngFor=\"let opt of companyList\" [value]=\"opt\">\n {{opt.name}}\n </mat-option>\n </mat-select>\n </mat-form-field>\n\n\n <!-- Profile button and profile dropdown links -->\n <button class=\"pmx-button pmx-menu-button profile-button\" mat-button [matMenuTriggerFor]=\"menu\" color=\"primary\"\n matTooltipPosition=\"below\">\n <div class=\"profile-inner\">\n <!-- <div class=\"brand-logo align-self-center\" *ngIf=\"activeCompany?.logo\"\n [ngClass]=\"activeCompany?.logo ? 'branded-logo-true' : 'branded-logo-false'\"\n [ngStyle]=\"{'background-image': 'url(' + activeCompany?.logo + ')'}\"></div> -->\n <div class=\"avatar\">\n <img *ngIf=\"userImageLink;else defaultAvatar\" [src]=\"userImageLink\" class=\"avatar-image\" alt=\"Avatar\">\n <ng-template #defaultAvatar><img\n [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.defaultUserImage)\"\n class=\"avatar-default\" alt=\"profile pic\"></ng-template>\n </div>\n </div>\n </button>\n <mat-menu #menu=\"matMenu\" class=\"accounts_drpmenu pmx-menu-group header-dropdown-profile\" xPosition=\"before\">\n <div class=\"popover-content show-menu\">\n <div class=\"popover-header\">\n <div class=\"popover-user-top\">\n <div class=\"avatar-wrapper\">\n <img *ngIf=\"userImageLink;else defaultLargeAvatar\" [src]=\"userImageLink\" class=\"avatar-icon\"\n alt=\"Avatar\">\n <ng-template #defaultLargeAvatar>\n <div [ngStyle]=\"{'background-image': 'url(' + imageDataUrls.defaultUserImage + ')'}\"\n class=\"avatar-icon default-avatar\" alt=\"Avatar icon\">&nbsp;</div>\n </ng-template>\n </div>\n <div class=\"user-data\">\n <h3 class=\"profile-name\"><span *ngIf=\"userAuthData\">{{ userAuthData?.firstName }} {{\n userAuthData?.lastName }}</span></h3>\n <button mat-button color=\"accent\" class=\"pmx-button btn btn-small view-profile ms-0\"\n (click)=\"profile()\">View Profile</button>\n </div>\n </div>\n </div>\n <div class=\"popover-body\">\n <!-- <div class=\"popover-content-title\">\n <p>Overview</p>\n </div> -->\n\n <div *ngIf=\"userAuthData?.email\">\n <p mat-menu-item class=\"list-text list-text-email mt-3 mb-3\">\n <mat-icon class=\"list-icon\">mail</mat-icon><span class=\"pmx-lower-case pmx-text-wrap me-auto\">{{\n userAuthData?.email }}</span>\n </p>\n </div>\n <ng-container *ngIf=\"userAuthData?.contactPhone\">\n <p mat-menu-item class=\"list-text mb-3\">\n <mat-icon class=\"list-icon\">call</mat-icon><span class=\"title-case me-auto\">{{\n userAuthData?.contactPhone }}</span>\n </p>\n </ng-container>\n\n <hr />\n <ul cdkMenu class=\"list-group last-group my-1\">\n <li cdkMenuItem class=\"list-item py-2\">\n <button mat-menu-item class=\"pmx-button list-button btn-logout\" (click)=\"onLogoutClick()\">\n <mat-icon>power_settings_new</mat-icon>\n <span class=\"list-text\">Logout</span>\n </button>\n </li>\n </ul>\n </div>\n </div>\n </mat-menu>\n</mat-toolbar>", styles: [":root{--contentfont: 13.12px !important;--labelfont: .75rem !important}.pmx-text-truncate{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pmx-text-wrap{overflow-wrap:break-word;word-break:break-word}.pmx-lower-case{text-transform:lowercase}.mat-mdc-button:not(:disabled){color:var(--mdc-text-button-label-text-color)}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color: #24a148;--mat-text-button-state-layer-color: #24a148;--mat-text-button-ripple-color: rgba(255, 64, 129, .1)}.header-user-name{text-align:end;color:#000}.header-user-name span{font-size:12px;color:#9e9e9ede}.avatarLogo{max-width:30px}mat-toolbar.mat-toolbar.common_header.mat-primary.mat-toolbar-single-row{position:fixed;left:0;top:0;background-color:#fff;height:56px}button.switchButton,button.menuHamberger{padding:8px!important}.sidenavPanel{padding:20px 25px;height:100vh;position:relative}ul.navbarList{padding-left:0;list-style:none;margin-top:40px}ul.navbarList li{color:#666;font-weight:400;margin-bottom:25px;width:170px;cursor:pointer}.active{color:#4177d6!important}ul.navbarList li img{width:23px;margin-right:15px}.accounts_drpmenu{margin-top:.7em}.xsShowUsername{display:none;padding:0 16px;height:48px;line-height:48px}.vr{width:2px;background-color:#f5f5f5;opacity:1;margin:0 .5rem 0 1rem}.vr-blury{background-image:linear-gradient(180deg,transparent,#666,transparent);width:1px;opacity:.25}.navbar-brand .app-logo{height:20px;width:auto}.pmx-button mat-icon.mat-icon,.pmx-button mat-icon.mat-primary,.pmx-button mat-icon.mat-accent,.pmx-button mat-icon.mat-warn{color:var(--mat-icon-color)}.pmx-button mat-icon.mat-icon{font-size:24px!important;line-height:1.5;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .3s ease}.pmx-button.mdc-button--raised mat-icon.mat-icon{width:24px;height:24px;display:contents}.pmx-button.mat-mdc-button-base mat-icon.mat-icon{z-index:1}.pmx-button mat-icon.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}.pmx-button mat-icon.mdc-button span.button-text{display:inline-flex;padding:0 1rem;text-transform:uppercase;font-size:.875rem;line-height:1.5}.pmx-button mat-icon.mdc-button span.upper-case{text-transform:uppercase}.pmx-button.mdc-button,.pmx-button.mdc-icon-button,.pmx-button.mdc-button--outlined,.pmx-button.mdc-button .mat-mdc-button-touch-target,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{height:40px!important;font-size:.75rem!important;letter-spacing:.2px;padding:0 .5rem;line-height:normal}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--outlined,.pmx-button.icon-btn.mdc-button--raised,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{width:40px;border-radius:5px}.pmx-button.btn-small.mdc-button,.pmx-button.btn-small.mdc-icon-button,.pmx-button.btn-small.mdc-button--outlined{height:28px!important;padding:0 1rem}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--raised{color:#254d93}.pmx-header .icon-button-shadow{box-shadow:0 1px 3px #0003,0 0 #00000024,0 1px 3px #0000001f}.pmx-button.icon-btn.mdc-button--raised.btn-switch-apps.menu-opened,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps.menu-opened{background-color:#254d93;color:#fff;font-variation-settings:\"FILL\" 0,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24}.pmx-button.mdc-icon-button.pmx-menu-button:hover,.pmx-button.mat-mdc-outlined-button.btn-switch-apps:hover,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps:hover{background-color:#e5f3fb}.pmx-button.icon-app{width:20px}.pmx-button.mat-mdc-outlined-button,.pmx-button.mat-mdc-outlined-button:not(:disabled){background-color:#fff;overflow:hidden}.pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{padding:0;border-color:#bfdff7!important}.btn-group-clicked .pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{border-color:#bfdff7!important}.pmx-button.profile-button .profile-inner{border:0 solid transparent!important;display:flex;align-items:center;overflow:clip}.pmx-button.profile-button .avatar{width:38px;height:38px;box-sizing:border-box;border-radius:50%;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-content:center;align-items:center;flex-wrap:wrap}.pmx-button.profile-button .avatar{background-color:#9cd7a8}.pmx-button.profile-button .avatar img.avatar-image,.pmx-button.profile-button .avatar img.avatar-default{width:100%;height:auto}.branded-group-false{margin-left:.65rem}.branded-group-false .pmx-button.pmx-menu-button.profile-button.branded-button-false{width:40px;border-radius:20px!important}.branded-group-true{margin-left:.65rem;border-radius:20px;border:1px solid #bfdff7}.btn-group-clicked.branded-group-true{background-color:#99ccf2}.branded-group-true .pmx-button.profile-button .profile-inner{border:0 solid #c4c9d2!important}.branded-group-true .pmx-button.pmx-menu-button.profile-button.branded-button-true{border-radius:20px}.branded-group-true .pmx-button.profile-button.branded-button-true .profile-inner .branded-logo-true{border-radius:5px;display:block;position:relative;height:38px;background-size:100%;background-position:center;background-repeat:no-repeat;min-width:100px;margin-right:1rem}.pmx-menu-group.mat-mdc-menu-panel{margin-top:1rem}.header-dropdown-apps.mat-mdc-menu-panel .mat-mdc-menu-content,.header-dropdown-profile.mat-mdc-menu-panel .mat-mdc-menu-content{padding:0!important}.header-dropdown-apps{width:400px!important}.header-dropdown-apps.mat-mdc-menu-panel .list-button{padding:.5rem 2rem}.header-dropdown-apps.mdc-menu-surface--open,.header-dropdown-profile.mdc-menu-surface--open{position:absolute;z-index:1;top:0;right:0;margin:0;padding:0;border:1px solid #e5e5e5;border-radius:6px;background:#fff;animation:popover .2s ease-in-out}.header-dropdown-apps.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:400px!important;width:400px!important;overflow:visible}::ng-deep .header-dropdown-profile.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:408px!important;width:408px!important;overflow:visible;margin-top:1rem}.popover-content:after,.popover-content:before{font-size:1.4em;display:block;width:0;height:0;content:\"\";pointer-events:none;position:absolute;top:-.45em}.popover-content:before{border-right:10px solid transparent;border-bottom:10px solid #999;border-left:10px solid transparent;right:.97em}.popover-content:after{border-right:12px solid transparent;border-bottom:12px solid #d5e3fa;border-left:12px solid transparent;right:.9em}.popover-content-title{display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 1rem;min-height:40px}.popover-content-title p{margin:0;font-size:.75rem!important;color:#777}.popover-content .popover-user-top:after{clear:both;content:\"\";display:table}.popover-content .popover-user-top{display:flex;flex-flow:row;justify-content:flex-start;align-items:center}.popover-content .popover-user-top .avatar-wrapper{flex:0 4 auto;border-radius:100%;overflow-clip-margin:content-box;overflow:clip;background-color:#fff;padding:2px}.drop-shadow{filter:drop-shadow(0px 0px 3px rgba(0,0,0,.5))}.popover-content .popover-user-top .user-data{flex:1 0 auto;margin-left:1rem}.popover-content .popover-user-top .avatar-wrapper .avatar-icon{background-repeat:no-repeat;background-size:100%;background-position:center;width:64px;height:64px;background-color:#72c885}.avatar-icon.default-avatar{background-size:100%}.popover-content .popover-user-top .user-data h3.profile-name{font-size:1rem;text-overflow:ellipsis;margin-bottom:.5rem;line-height:normal;font-weight:600;color:#254d93}.btn.view-profile{background:#fafafa}.popover-content ul.list-group{padding:0 0 8px;margin:0;display:flex;list-style:none}.popover-content ul.list-group.last-group,.popover-content ul.list-group.last-group .list-item{background-color:transparent}.popover-content ul.list-group li.list-item{align-items:center;border:none;padding:0;width:100%;display:flex;flex-direction:row;flex-wrap:wrap;order:1}.popover-content ul.list-group li.list-item .list-button{padding:.5rem 1rem;min-height:40px}.popover-content ul.list-group li.list-item span.mat-mdc-menu-item-text,.popover-content ul.list-group li.list-item span.mdc-list-item__primary-text,.popover-content ul.list-group li.list-item .list-button>span{display:flex;align-items:center}.popover-content ul.list-group li.list-item.list-company .list-button>span{width:100%;overflow:hidden}.popover-content ul.list-group li.list-item .list-button .hover-label.tooltip-label{opacity:0}.popover-content ul.list-group li.list-item.list-app .list-button:hover>span .hover-label.tooltip-label,.popover-content ul.list-group li.list-item.list-company .list-button:hover>span .hover-label.tooltip-label{opacity:0;display:inline-flex;color:#fff;background-color:#616161;font-size:11px;border-radius:4px;padding:0 .5rem;transition:opacity .3s ease-out}.popover-content ul.list-group li.list-item .list-button:hover{background:rgba(0,0,0,.04)}.popover-content ul.list-group li.list-item.company-active,.popover-content ul.list-group li.list-item.app-active{cursor:not-allowed;pointer-events:none;order:0}.popover-content ul.list-group li.list-item.company-active .active-label,.popover-content ul.list-group li.list-item.app-active .active-label{background-color:#93c47d;color:#212121;padding:0 .5rem;border-radius:50px;font-size:.75rem;margin-left:.5rem}.popover-content ul.list-group.list-apps-group{display:flex}.popover-content ul.list-group.list-overview li.list-item{cursor:not-allowed;pointer-events:none}::ng-deep .popover-content ul.list-group li.list-item button.list-button .list-text{font-size:15px}.popover-content .popover-body p.list-text{padding:.5rem 1rem;margin:0;min-height:auto;cursor:default}::ng-deep .popover-content .popover-body p.list-text .mat-mdc-menu-item-text{font-size:15px;font-weight:500}.popover-content ul.list-group li.list-item .list-button .mat-icon,.popover-content ul.list-group li.list-item p.list-text mat-icon.list-icon,.popover-content ul.list-group li.list-item .list-button .list-icon,.popover-content ul.list-group li.list-item p.list-text .list-icon,.popover-content .popover-body p.list-text .list-icon{color:#2db051;font-variation-settings:\"FILL\" 0,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24;font-size:24px!important}.popover-content ul.list-group li.list-item.list-active.company-active button.list-button .mat-icon{color:#2db051;font-variation-settings:\"FILL\" 1,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24}.popover-content ul.list-group li.list-item p.list-text span.mdc-list-item__primary-text{width:100%;display:flex}.popover-content ul.list-group li.list-item span.title-case,.popover-content ul.list-group li.list-item span.lower-case,.popover-content ul.list-group li.list-item span.pmx-lower-case{font-size:.8rem;color:#212121;font-weight:500;display:block;line-height:normal}small{color:#9e9e9e}.popover-content ul.list-group li.list-item span.text-label{font-size:12px;color:#979797;font-weight:400;display:block;line-height:normal}.popover-content ul.list-group li.list-item .list-text span.mat-mdc-menu-item-text{font-size:.875rem;color:#0a152f;font-weight:500;line-height:normal}.popover-content ul.list-group li.list-item .list-text.list-text-email span.mat-mdc-menu-item-text{width:calc(100% - 40px);display:inline-flex}.popover-content ul.list-group li.list-item .list-text.list-text-email span.pmx-text-wrap{overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:none;hyphens:none;width:100%}.popover-content ul.list-group li.list-item span.upper-case{text-transform:uppercase}.popover-content ul.list-group li.list-item span.app-status,.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{font-size:13px;color:#0a152f;font-weight:400;display:block;line-height:normal;margin:0}.popover-content ul.list-group li.list-item.app-active .list-text,.popover-content ul.list-group li.list-item.company-active .list-text{color:#4b85ea}.popover-content ul.list-group li.list-item.app-active span.app-status,.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status,.popover-content ul.list-group li.list-item.company-active span.app-status,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status{color:#24a53f}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{display:flex;flex-direction:row;justify-content:flex-start}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{transition:all .3s ease-out;margin-left:auto;flex:1;justify-content:flex-end}.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{background-color:#408dd7;color:#f5f5f5}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip .mat-mdc-chip-action-label{font-size:.75rem}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip{height:24px}.popover-content ul.list-group li.list-item img.logo-thumb{width:24px;height:auto;margin-right:1rem}.popover-content ul.list-group li.list-item .list-button.btn-logout{display:flex;align-items:center;color:#616161}.popover-content ul.list-group li.list-item.app-active .list-button .app-icon-wrapper{background-color:#fff;border-color:#4b85ea;border-width:3px}.popover-content ul.list-group li.list-item.company-active .list-text .mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24;color:var(--themelightblue)}.popover-content ul.list-group li.list-item .list-button.btn-logout .list-text{color:#616161}.popover-content ul.list-group li.list-item.app-active button,.popover-content ul.list-group li.list-item.company-active button{cursor:not-allowed;pointer-events:none}.popover-content hr{background-color:#c4c9d2;margin:0;width:100%;border:0;border-top:1px solid #c4c9d2;opacity:1}.popover-content ul.apps-grid{width:100%;white-space:nowrap;overflow:auto}.popover-content ul.apps-grid li.list-item,.popover-content ul.apps-grid li.list-item img.logo-thumb{display:flex;justify-content:flex-start;flex-wrap:nowrap;align-content:center;align-items:center;flex-direction:row}.popover-header{background-color:#d5e3fa;border-bottom:1px solid #d8d8d8;padding:.975rem 1rem;margin-bottom:0;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;flex-wrap:wrap}.popover-header .mat-icon{font-size:1.5rem!important;font-variation-settings:\"FILL\" 1,\"wght\" 500,\"GRAD\" 0,\"opsz\" 24;color:#254d93}.header-dropdown-profile .popover-header{padding:1.125rem 1rem}.popover-header h3.popover-title{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;margin-bottom:0;line-height:normal;font-weight:500;color:#254d93}.popover-body{max-height:420px;overflow:auto;padding:0}.app-icon-wrapper{margin:0 1rem 0 0;max-width:48px;max-height:48px;width:48px;height:48px;overflow:hidden;background-size:70%;background-repeat:no-repeat;background-position:center;border:1px solid #c4c9d2;border-radius:8px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;flex-wrap:wrap}.app-icon-wrapper img.app-icon{width:100%;height:auto;overflow:hidden;padding:.5rem}h4.app-name{font-size:.65rem;margin:.5rem 0 0;line-height:normal;color:#254d93;font-weight:400;text-transform:uppercase}.popover-body ul.enabled-apps{display:flex;flex-flow:column wrap;justify-content:space-evenly;align-items:center;align-content:flex-start;border-bottom:1px solid #E9E9E9;margin:0;padding:0 1rem;list-style:none}.popover-body ul.enabled-apps li.enabled-app{flex-grow:1;flex:0 1 auto;text-align:center;font-size:.8125rem;padding:10px;list-style:none}.pmx-button.mdc-icon-button[color=theme-white],.pmx-button.icon-btn.mdc-button--raised[color=theme-white]{color:#254d93}.pmx-button.icon-btn.orders-menu[color=theme-white]{border:1px solid #fafafa!important}:host(.mat-accent){--mat-slider-ripple-color: #24a148;--mat-slider-hover-state-layer-color: rgba(255, 64, 129, .05);--mat-slider-focus-state-layer-color: rgba(255, 64, 129, .2);--mdc-slider-handle-color: #24a148;--mdc-slider-focus-handle-color: #24a148;--mdc-slider-hover-handle-color: #24a148;--mdc-slider-active-track-color: #24a148;--mdc-slider-inactive-track-color: #24a148;--mdc-slider-with-tick-marks-inactive-container-color: #24a148;--mdc-slider-with-tick-marks-active-container-color: #51bc6b}:host ::ng-deep .app-menu-sidenav-container{z-index:999}:host ::ng-deep .mat-drawer-backdrop.mat-drawer-shown{position:fixed;background:rgba(63,81,181,.25)}.mat-drawer-backdrop{position:fixed!important}.sidenavDrawer{position:fixed!important;left:0;width:250px;padding:0}.mdc-list-group__subheader{background-color:#eef4ff;padding:5px 20px;margin-bottom:5px!important;font-size:14px!important;font-weight:500!important}.menusubItems{padding-left:2rem!important}.switchCompanyField{min-width:175px!important;margin-left:13px}.profile-button{margin-left:10px}.brand-logo{width:100px;height:38px;background-repeat:no-repeat;background-size:contain;background-origin:content-box;padding:7px}.menuIconList{font-size:20px!important;height:20px;width:20px;margin-right:.5rem;position:relative;color:#747474;font-weight:300}.subHeadListItems{padding:0 15px}.subHeadListItems .menu-item{display:flex;flex-direction:row;align-items:center;color:#000;padding:.7rem .5rem;border-radius:3px;transition:all .3s;font-size:var(--contentfont)}.subHeadListItems .menu-item:hover:not(.no-select){cursor:pointer;background-color:#f5f5f5}.subHeadInnerItem{margin-bottom:0!important}.drawerHeadLogo{width:100%;padding:10px 20px;margin-bottom:20px;margin-top:15px}.drawerHeadLogo img{width:130px}.app-menu-content-section{overflow-y:auto;height:calc(100vh - 80px);padding-bottom:25px}.active-menu{background-color:var(--themelightblue)!important;color:#fff!important;font-weight:500}.active-menu .menuIconList{color:#fff}.appList{padding:11px 15px;background-color:#eef4ff;margin:20px 0 10px;height:35px;display:flex}.appList img{object-fit:contain}::ng-deep .header-dropdown-profile .mat-mdc-menu-content{margin:0;padding:0;list-style-type:none}\n"] }]
668
+ args: [{ selector: 'lib-header', template: "<mat-sidenav-container class=\"app-menu-sidenav-container\">\n <mat-sidenav cdkMenuBar #sidenav mode=\"over\" class=\"sidenavDrawer\">\n <div class=\"drawerHeadLogo\"><img [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.profetLogo)\"></div>\n <div class=\"app-menu-content-section\">\n <ng-container *ngFor=\"let appType of menuList\">\n <div class=\"appList\">\n <img *ngIf=\"appConfig[appType.key]?.appLogoUri\"\n [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[appType.key]?.appLogoUri)\">\n </div>\n <div class=\"subHeadListItems\">\n <div *ngFor=\"let item of appType.value\" class=\"menu-item\" (click)=\"menuSelection(item)\"\n [ngClass]=\"{'active-menu': item | activeRoute : _router.url:_headerSer.headerConfig.appType}\">\n <mat-icon class=\"menuIconList\" *ngIf=\"item.icon\">{{ item.icon }}</mat-icon>\n <span>{{ item.menuName }}</span>\n </div>\n </div>\n </ng-container>\n </div>\n </mat-sidenav>\n\n</mat-sidenav-container>\n<mat-toolbar cdkMenuBar color=\"primary\" class=\"header-wrapper common_header shadow-sm\">\n <!-- Main nav button and navigation links -->\n <button mat-icon-button color=\"theme-white\" (click)=\"sidenav.toggle()\"\n class=\"pmx-button pmx-menu-button orders-menu icon-btn ms-0 me-3\" aria-label=\"main menu\" tabindex=\"0\"\n matTooltip=\"Main menu\" matTooltipPosition=\"below\"\n matTooltipClass=\"poc-header-tooltip\"><mat-icon>menu</mat-icon></button>\n <a class=\"navbar-brand me-auto\" href=\"#\">\n <img [src]=\"_domSanitizer.bypassSecurityTrustUrl(appConfig[_headerSer.headerConfig.appType]?.appLogoUri)\"\n alt=\"App Logo\" class=\"app-logo\">\n </a>\n\n <ng-content></ng-content>\n\n <mat-form-field appearance=\"outline\" class=\"switchCompanyField\">\n <mat-label>Company</mat-label>\n <mat-select [formControl]=\"companyControl\" (selectionChange)=\"switchCompany($event)\"\n (openedChange)=\"onOpened($event)\">\n <div class=\"options-search mat-select-search-container\">\n <mat-form-field appearance=\"outline\">\n <input #searchInput matInput placeholder=\"Search\" [formControl]=\"searchControl\"\n (keydown)=\"$event.stopPropagation()\">\n <mat-icon matSuffix>search</mat-icon>\n </mat-form-field>\n </div>\n <mat-option *ngFor=\"let opt of filteredOptions\" [value]=\"opt\">\n {{opt.name}}\n </mat-option>\n </mat-select>\n </mat-form-field>\n\n\n <!-- Profile button and profile dropdown links -->\n <button class=\"pmx-button pmx-menu-button profile-button\" mat-button [matMenuTriggerFor]=\"menu\" color=\"primary\"\n matTooltipPosition=\"below\">\n <div class=\"profile-inner\">\n <!-- <div class=\"brand-logo align-self-center\" *ngIf=\"activeCompany?.logo\"\n [ngClass]=\"activeCompany?.logo ? 'branded-logo-true' : 'branded-logo-false'\"\n [ngStyle]=\"{'background-image': 'url(' + activeCompany?.logo + ')'}\"></div> -->\n <div class=\"avatar\">\n <img *ngIf=\"userImageLink;else defaultAvatar\" [src]=\"userImageLink\" class=\"avatar-image\" alt=\"Avatar\">\n <ng-template #defaultAvatar><img\n [src]=\"_domSanitizer.bypassSecurityTrustUrl(imageDataUrls.defaultUserImage)\"\n class=\"avatar-default\" alt=\"profile pic\"></ng-template>\n </div>\n </div>\n </button>\n <mat-menu #menu=\"matMenu\" class=\"accounts_drpmenu pmx-menu-group header-dropdown-profile\" xPosition=\"before\">\n <div class=\"popover-content show-menu\">\n <div class=\"popover-header\">\n <div class=\"popover-user-top\">\n <div class=\"avatar-wrapper\">\n <img *ngIf=\"userImageLink;else defaultLargeAvatar\" [src]=\"userImageLink\" class=\"avatar-icon\"\n alt=\"Avatar\">\n <ng-template #defaultLargeAvatar>\n <div [ngStyle]=\"{'background-image': 'url(' + imageDataUrls.defaultUserImage + ')'}\"\n class=\"avatar-icon default-avatar\" alt=\"Avatar icon\">&nbsp;</div>\n </ng-template>\n </div>\n <div class=\"user-data\">\n <h3 class=\"profile-name\"><span *ngIf=\"userAuthData\">{{ userAuthData?.firstName }} {{\n userAuthData?.lastName }}</span></h3>\n <button mat-button color=\"accent\" class=\"pmx-button btn btn-small view-profile ms-0\"\n (click)=\"profile()\">View Profile</button>\n </div>\n </div>\n </div>\n <div class=\"popover-body\">\n <!-- <div class=\"popover-content-title\">\n <p>Overview</p>\n </div> -->\n\n <div *ngIf=\"userAuthData?.email\">\n <p mat-menu-item class=\"list-text list-text-email mt-3 mb-3\">\n <mat-icon class=\"list-icon\">mail</mat-icon><span class=\"pmx-lower-case pmx-text-wrap me-auto\">{{\n userAuthData?.email }}</span>\n </p>\n </div>\n <ng-container *ngIf=\"userAuthData?.contactPhone\">\n <p mat-menu-item class=\"list-text mb-3\">\n <mat-icon class=\"list-icon\">call</mat-icon><span class=\"title-case me-auto\">{{\n userAuthData?.contactPhone }}</span>\n </p>\n </ng-container>\n\n <hr />\n <ul cdkMenu class=\"list-group last-group my-1\">\n <li cdkMenuItem class=\"list-item py-2\">\n <button mat-menu-item class=\"pmx-button list-button btn-logout\" (click)=\"onLogoutClick()\">\n <mat-icon>power_settings_new</mat-icon>\n <span class=\"list-text\">Logout</span>\n </button>\n </li>\n </ul>\n </div>\n </div>\n </mat-menu>\n</mat-toolbar>", styles: [":root{--contentfont: 13.12px !important;--labelfont: .75rem !important}.pmx-text-truncate{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pmx-text-wrap{overflow-wrap:break-word;word-break:break-word}.pmx-lower-case{text-transform:lowercase}.mat-mdc-button:not(:disabled){color:var(--mdc-text-button-label-text-color)}.mat-mdc-button.mat-accent{--mdc-text-button-label-text-color: #24a148;--mat-text-button-state-layer-color: #24a148;--mat-text-button-ripple-color: rgba(255, 64, 129, .1)}.header-user-name{text-align:end;color:#000}.header-user-name span{font-size:12px;color:#9e9e9ede}.avatarLogo{max-width:30px}mat-toolbar.mat-toolbar.common_header.mat-primary.mat-toolbar-single-row{position:fixed;left:0;top:0;background-color:#fff;height:56px}button.switchButton,button.menuHamberger{padding:8px!important}.sidenavPanel{padding:20px 25px;height:100vh;position:relative}ul.navbarList{padding-left:0;list-style:none;margin-top:40px}ul.navbarList li{color:#666;font-weight:400;margin-bottom:25px;width:170px;cursor:pointer}.active{color:#4177d6!important}ul.navbarList li img{width:23px;margin-right:15px}.accounts_drpmenu{margin-top:.7em}.xsShowUsername{display:none;padding:0 16px;height:48px;line-height:48px}.vr{width:2px;background-color:#f5f5f5;opacity:1;margin:0 .5rem 0 1rem}.vr-blury{background-image:linear-gradient(180deg,transparent,#666,transparent);width:1px;opacity:.25}.navbar-brand .app-logo{height:20px;width:auto}.pmx-button mat-icon.mat-icon,.pmx-button mat-icon.mat-primary,.pmx-button mat-icon.mat-accent,.pmx-button mat-icon.mat-warn{color:var(--mat-icon-color)}.pmx-button mat-icon.mat-icon{font-size:24px!important;line-height:1.5;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:transform .3s ease}.pmx-button.mdc-button--raised mat-icon.mat-icon{width:24px;height:24px;display:contents}.pmx-button.mat-mdc-button-base mat-icon.mat-icon{z-index:1}.pmx-button mat-icon.mat-icon.mat-icon-inline{font-size:inherit;height:inherit;line-height:inherit;width:inherit}.pmx-button mat-icon.mdc-button span.button-text{display:inline-flex;padding:0 1rem;text-transform:uppercase;font-size:.875rem;line-height:1.5}.pmx-button mat-icon.mdc-button span.upper-case{text-transform:uppercase}.pmx-button.mdc-button,.pmx-button.mdc-icon-button,.pmx-button.mdc-button--outlined,.pmx-button.mdc-button .mat-mdc-button-touch-target,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{height:40px!important;font-size:.75rem!important;letter-spacing:.2px;padding:0 .5rem;line-height:normal}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--outlined,.pmx-button.icon-btn.mdc-button--raised,.pmx-button.mdc-icon-button .mat-mdc-button-touch-target{width:40px;border-radius:5px}.pmx-button.btn-small.mdc-button,.pmx-button.btn-small.mdc-icon-button,.pmx-button.btn-small.mdc-button--outlined{height:28px!important;padding:0 1rem}.pmx-button.mdc-icon-button,.pmx-button.icon-btn.mdc-button--raised{color:#254d93}.pmx-header .icon-button-shadow{box-shadow:0 1px 3px #0003,0 0 #00000024,0 1px 3px #0000001f}.pmx-button.icon-btn.mdc-button--raised.btn-switch-apps.menu-opened,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps.menu-opened{background-color:#254d93;color:#fff;font-variation-settings:\"FILL\" 0,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24}.pmx-button.mdc-icon-button.pmx-menu-button:hover,.pmx-button.mat-mdc-outlined-button.btn-switch-apps:hover,.pmx-button.icon-btn.mdc-button--outlined.btn-switch-apps:hover{background-color:#e5f3fb}.pmx-button.icon-app{width:20px}.pmx-button.mat-mdc-outlined-button,.pmx-button.mat-mdc-outlined-button:not(:disabled){background-color:#fff;overflow:hidden}.pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{padding:0;border-color:#bfdff7!important}.btn-group-clicked .pmx-button.pmx-menu-button.profile-button.mat-mdc-outlined-button{border-color:#bfdff7!important}.pmx-button.profile-button .profile-inner{border:0 solid transparent!important;display:flex;align-items:center;overflow:clip}.pmx-button.profile-button .avatar{width:38px;height:38px;box-sizing:border-box;border-radius:50%;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-content:center;align-items:center;flex-wrap:wrap}.pmx-button.profile-button .avatar{background-color:#9cd7a8}.pmx-button.profile-button .avatar img.avatar-image,.pmx-button.profile-button .avatar img.avatar-default{width:100%;height:auto}.branded-group-false{margin-left:.65rem}.branded-group-false .pmx-button.pmx-menu-button.profile-button.branded-button-false{width:40px;border-radius:20px!important}.branded-group-true{margin-left:.65rem;border-radius:20px;border:1px solid #bfdff7}.btn-group-clicked.branded-group-true{background-color:#99ccf2}.branded-group-true .pmx-button.profile-button .profile-inner{border:0 solid #c4c9d2!important}.branded-group-true .pmx-button.pmx-menu-button.profile-button.branded-button-true{border-radius:20px}.branded-group-true .pmx-button.profile-button.branded-button-true .profile-inner .branded-logo-true{border-radius:5px;display:block;position:relative;height:38px;background-size:100%;background-position:center;background-repeat:no-repeat;min-width:100px;margin-right:1rem}.pmx-menu-group.mat-mdc-menu-panel{margin-top:1rem}.header-dropdown-apps.mat-mdc-menu-panel .mat-mdc-menu-content,.header-dropdown-profile.mat-mdc-menu-panel .mat-mdc-menu-content{padding:0!important}.header-dropdown-apps{width:400px!important}.header-dropdown-apps.mat-mdc-menu-panel .list-button{padding:.5rem 2rem}.header-dropdown-apps.mdc-menu-surface--open,.header-dropdown-profile.mdc-menu-surface--open{position:absolute;z-index:1;top:0;right:0;margin:0;padding:0;border:1px solid #e5e5e5;border-radius:6px;background:#fff;animation:popover .2s ease-in-out}.header-dropdown-apps.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:400px!important;width:400px!important;overflow:visible}::ng-deep .header-dropdown-profile.mat-mdc-menu-panel.mat-mdc-menu-panel{max-width:408px!important;width:408px!important;overflow:visible;margin-top:1rem}.popover-content:after,.popover-content:before{font-size:1.4em;display:block;width:0;height:0;content:\"\";pointer-events:none;position:absolute;top:-.45em}.popover-content:before{border-right:10px solid transparent;border-bottom:10px solid #999;border-left:10px solid transparent;right:.97em}.popover-content:after{border-right:12px solid transparent;border-bottom:12px solid #d5e3fa;border-left:12px solid transparent;right:.9em}.popover-content-title{display:flex;align-items:center;justify-content:flex-start;overflow:hidden;padding:0 1rem;min-height:40px}.popover-content-title p{margin:0;font-size:.75rem!important;color:#777}.popover-content .popover-user-top:after{clear:both;content:\"\";display:table}.popover-content .popover-user-top{display:flex;flex-flow:row;justify-content:flex-start;align-items:center}.popover-content .popover-user-top .avatar-wrapper{flex:0 4 auto;border-radius:100%;overflow-clip-margin:content-box;overflow:clip;background-color:#fff;padding:2px}.drop-shadow{filter:drop-shadow(0px 0px 3px rgba(0,0,0,.5))}.popover-content .popover-user-top .user-data{flex:1 0 auto;margin-left:1rem}.popover-content .popover-user-top .avatar-wrapper .avatar-icon{background-repeat:no-repeat;background-size:100%;background-position:center;width:64px;height:64px;background-color:#72c885}.avatar-icon.default-avatar{background-size:100%}.popover-content .popover-user-top .user-data h3.profile-name{font-size:1rem;text-overflow:ellipsis;margin-bottom:.5rem;line-height:normal;font-weight:600;color:#254d93}.btn.view-profile{background:#fafafa}.popover-content ul.list-group{padding:0 0 8px;margin:0;display:flex;list-style:none}.popover-content ul.list-group.last-group,.popover-content ul.list-group.last-group .list-item{background-color:transparent}.popover-content ul.list-group li.list-item{align-items:center;border:none;padding:0;width:100%;display:flex;flex-direction:row;flex-wrap:wrap;order:1}.popover-content ul.list-group li.list-item .list-button{padding:.5rem 1rem;min-height:40px}.popover-content ul.list-group li.list-item span.mat-mdc-menu-item-text,.popover-content ul.list-group li.list-item span.mdc-list-item__primary-text,.popover-content ul.list-group li.list-item .list-button>span{display:flex;align-items:center}.popover-content ul.list-group li.list-item.list-company .list-button>span{width:100%;overflow:hidden}.popover-content ul.list-group li.list-item .list-button .hover-label.tooltip-label{opacity:0}.popover-content ul.list-group li.list-item.list-app .list-button:hover>span .hover-label.tooltip-label,.popover-content ul.list-group li.list-item.list-company .list-button:hover>span .hover-label.tooltip-label{opacity:0;display:inline-flex;color:#fff;background-color:#616161;font-size:11px;border-radius:4px;padding:0 .5rem;transition:opacity .3s ease-out}.popover-content ul.list-group li.list-item .list-button:hover{background:rgba(0,0,0,.04)}.popover-content ul.list-group li.list-item.company-active,.popover-content ul.list-group li.list-item.app-active{cursor:not-allowed;pointer-events:none;order:0}.popover-content ul.list-group li.list-item.company-active .active-label,.popover-content ul.list-group li.list-item.app-active .active-label{background-color:#93c47d;color:#212121;padding:0 .5rem;border-radius:50px;font-size:.75rem;margin-left:.5rem}.popover-content ul.list-group.list-apps-group{display:flex}.popover-content ul.list-group.list-overview li.list-item{cursor:not-allowed;pointer-events:none}::ng-deep .popover-content ul.list-group li.list-item button.list-button .list-text{font-size:15px}.popover-content .popover-body p.list-text{padding:.5rem 1rem;margin:0;min-height:auto;cursor:default}::ng-deep .popover-content .popover-body p.list-text .mat-mdc-menu-item-text{font-size:15px;font-weight:500}.popover-content ul.list-group li.list-item .list-button .mat-icon,.popover-content ul.list-group li.list-item p.list-text mat-icon.list-icon,.popover-content ul.list-group li.list-item .list-button .list-icon,.popover-content ul.list-group li.list-item p.list-text .list-icon,.popover-content .popover-body p.list-text .list-icon{color:#2db051;font-variation-settings:\"FILL\" 0,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24;font-size:24px!important}.popover-content ul.list-group li.list-item.list-active.company-active button.list-button .mat-icon{color:#2db051;font-variation-settings:\"FILL\" 1,\"wght\" 300,\"GRAD\" 0,\"opsz\" 24}.popover-content ul.list-group li.list-item p.list-text span.mdc-list-item__primary-text{width:100%;display:flex}.popover-content ul.list-group li.list-item span.title-case,.popover-content ul.list-group li.list-item span.lower-case,.popover-content ul.list-group li.list-item span.pmx-lower-case{font-size:.8rem;color:#212121;font-weight:500;display:block;line-height:normal}small{color:#9e9e9e}.popover-content ul.list-group li.list-item span.text-label{font-size:12px;color:#979797;font-weight:400;display:block;line-height:normal}.popover-content ul.list-group li.list-item .list-text span.mat-mdc-menu-item-text{font-size:.875rem;color:#0a152f;font-weight:500;line-height:normal}.popover-content ul.list-group li.list-item .list-text.list-text-email span.mat-mdc-menu-item-text{width:calc(100% - 40px);display:inline-flex}.popover-content ul.list-group li.list-item .list-text.list-text-email span.pmx-text-wrap{overflow-wrap:break-word;word-wrap:break-word;-webkit-hyphens:none;hyphens:none;width:100%}.popover-content ul.list-group li.list-item span.upper-case{text-transform:uppercase}.popover-content ul.list-group li.list-item span.app-status,.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{font-size:13px;color:#0a152f;font-weight:400;display:block;line-height:normal;margin:0}.popover-content ul.list-group li.list-item.app-active .list-text,.popover-content ul.list-group li.list-item.company-active .list-text{color:#4b85ea}.popover-content ul.list-group li.list-item.app-active span.app-status,.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status,.popover-content ul.list-group li.list-item.company-active span.app-status,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status{color:#24a53f}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status{display:flex;flex-direction:row;justify-content:flex-start}.popover-content ul.list-group li.list-item .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{transition:all .3s ease-out;margin-left:auto;flex:1;justify-content:flex-end}.popover-content ul.list-group li.list-item.app-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected,.popover-content ul.list-group li.list-item.company-active .mat-mdc-chip-option.chip-status.mdc-evolution-chip--selected{background-color:#408dd7;color:#f5f5f5}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip .mat-mdc-chip-action-label{font-size:.75rem}.popover-content ul.list-group li.list-item .mat-mdc-standard-chip{height:24px}.popover-content ul.list-group li.list-item img.logo-thumb{width:24px;height:auto;margin-right:1rem}.popover-content ul.list-group li.list-item .list-button.btn-logout{display:flex;align-items:center;color:#616161}.popover-content ul.list-group li.list-item.app-active .list-button .app-icon-wrapper{background-color:#fff;border-color:#4b85ea;border-width:3px}.popover-content ul.list-group li.list-item.company-active .list-text .mat-icon{font-variation-settings:\"FILL\" 1,\"wght\" 200,\"GRAD\" 0,\"opsz\" 24;color:var(--themelightblue)}.popover-content ul.list-group li.list-item .list-button.btn-logout .list-text{color:#616161}.popover-content ul.list-group li.list-item.app-active button,.popover-content ul.list-group li.list-item.company-active button{cursor:not-allowed;pointer-events:none}.popover-content hr{background-color:#c4c9d2;margin:0;width:100%;border:0;border-top:1px solid #c4c9d2;opacity:1}.popover-content ul.apps-grid{width:100%;white-space:nowrap;overflow:auto}.popover-content ul.apps-grid li.list-item,.popover-content ul.apps-grid li.list-item img.logo-thumb{display:flex;justify-content:flex-start;flex-wrap:nowrap;align-content:center;align-items:center;flex-direction:row}.popover-header{background-color:#d5e3fa;border-bottom:1px solid #d8d8d8;padding:.975rem 1rem;margin-bottom:0;display:flex;flex-direction:row;align-content:center;justify-content:flex-start;align-items:center;flex-wrap:wrap}.popover-header .mat-icon{font-size:1.5rem!important;font-variation-settings:\"FILL\" 1,\"wght\" 500,\"GRAD\" 0,\"opsz\" 24;color:#254d93}.header-dropdown-profile .popover-header{padding:1.125rem 1rem}.popover-header h3.popover-title{font-size:1rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:normal;margin-bottom:0;line-height:normal;font-weight:500;color:#254d93}.popover-body{max-height:420px;overflow:auto;padding:0}.app-icon-wrapper{margin:0 1rem 0 0;max-width:48px;max-height:48px;width:48px;height:48px;overflow:hidden;background-size:70%;background-repeat:no-repeat;background-position:center;border:1px solid #c4c9d2;border-radius:8px;display:flex;flex-direction:row;align-content:center;justify-content:center;align-items:center;flex-wrap:wrap}.app-icon-wrapper img.app-icon{width:100%;height:auto;overflow:hidden;padding:.5rem}h4.app-name{font-size:.65rem;margin:.5rem 0 0;line-height:normal;color:#254d93;font-weight:400;text-transform:uppercase}.popover-body ul.enabled-apps{display:flex;flex-flow:column wrap;justify-content:space-evenly;align-items:center;align-content:flex-start;border-bottom:1px solid #E9E9E9;margin:0;padding:0 1rem;list-style:none}.popover-body ul.enabled-apps li.enabled-app{flex-grow:1;flex:0 1 auto;text-align:center;font-size:.8125rem;padding:10px;list-style:none}.pmx-button.mdc-icon-button[color=theme-white],.pmx-button.icon-btn.mdc-button--raised[color=theme-white]{color:#254d93}.pmx-button.icon-btn.orders-menu[color=theme-white]{border:1px solid #fafafa!important}:host(.mat-accent){--mat-slider-ripple-color: #24a148;--mat-slider-hover-state-layer-color: rgba(255, 64, 129, .05);--mat-slider-focus-state-layer-color: rgba(255, 64, 129, .2);--mdc-slider-handle-color: #24a148;--mdc-slider-focus-handle-color: #24a148;--mdc-slider-hover-handle-color: #24a148;--mdc-slider-active-track-color: #24a148;--mdc-slider-inactive-track-color: #24a148;--mdc-slider-with-tick-marks-inactive-container-color: #24a148;--mdc-slider-with-tick-marks-active-container-color: #51bc6b}:host ::ng-deep .app-menu-sidenav-container{z-index:999}:host ::ng-deep .mat-drawer-backdrop.mat-drawer-shown{position:fixed;background:rgba(63,81,181,.25)}.mat-drawer-backdrop{position:fixed!important}.sidenavDrawer{position:fixed!important;left:0;width:250px;padding:0}.mdc-list-group__subheader{background-color:#eef4ff;padding:5px 20px;margin-bottom:5px!important;font-size:14px!important;font-weight:500!important}.menusubItems{padding-left:2rem!important}.switchCompanyField{min-width:175px!important;margin-left:13px}.profile-button{margin-left:10px}.brand-logo{width:100px;height:38px;background-repeat:no-repeat;background-size:contain;background-origin:content-box;padding:7px}.menuIconList{font-size:20px!important;height:20px;width:20px;margin-right:.5rem;position:relative;color:#747474;font-weight:300}.subHeadListItems{padding:0 15px}.subHeadListItems .menu-item{display:flex;flex-direction:row;align-items:center;color:#000;padding:.7rem .5rem;border-radius:3px;transition:all .3s;font-size:var(--contentfont)}.subHeadListItems .menu-item:hover:not(.no-select){cursor:pointer;background-color:#f5f5f5}.subHeadInnerItem{margin-bottom:0!important}.drawerHeadLogo{width:100%;padding:10px 20px;margin-bottom:20px;margin-top:15px}.drawerHeadLogo img{width:130px}.app-menu-content-section{overflow-y:auto;height:calc(100vh - 80px);padding-bottom:25px}.active-menu{background-color:var(--themelightblue)!important;color:#fff!important;font-weight:500}.active-menu .menuIconList{color:#fff}.appList{padding:11px 15px;background-color:#eef4ff;margin:20px 0 10px;height:35px;display:flex}.appList img{object-fit:contain}::ng-deep .header-dropdown-profile .mat-mdc-menu-content{margin:0;padding:0;list-style-type:none}.options-search ::ng-deep .mat-mdc-form-field-icon-suffix>.mat-icon{font-size:21px!important;color:gray;padding:0!important}::ng-deep .mat-select-panel{position:relative}::ng-deep .mat-select-search-container{position:sticky;top:0;z-index:1;background:white;padding:8px 12px;border-bottom:1px solid #ddd}::ng-deep div.mat-mdc-select-panel{padding-top:0!important}\n"] }]
642
669
  }], ctorParameters: function () { return []; }, propDecorators: { INACTIVITY_LIMIT: [{
643
670
  type: Input
644
671
  }], sidenav: [{
645
672
  type: ViewChild,
646
673
  args: ['sidenav']
674
+ }], searchInput: [{
675
+ type: ViewChild,
676
+ args: ['searchInput', { static: false }]
647
677
  }], resetTimer: [{
648
678
  type: HostListener,
649
679
  args: ['document:mousemove']
@@ -684,7 +714,8 @@ CommonHeaderModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
684
714
  MatFormFieldModule,
685
715
  MatSelectModule,
686
716
  ReactiveFormsModule,
687
- MatDialogModule], exports: [HeaderComponent] });
717
+ MatDialogModule,
718
+ MatInputModule], exports: [HeaderComponent] });
688
719
  CommonHeaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CommonHeaderModule, providers: [TitleCasePipe, LowerCasePipe], imports: [CommonModule,
689
720
  MatToolbarModule,
690
721
  MatIconModule,
@@ -699,7 +730,8 @@ CommonHeaderModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", vers
699
730
  MatFormFieldModule,
700
731
  MatSelectModule,
701
732
  ReactiveFormsModule,
702
- MatDialogModule] });
733
+ MatDialogModule,
734
+ MatInputModule] });
703
735
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CommonHeaderModule, decorators: [{
704
736
  type: NgModule,
705
737
  args: [{
@@ -719,7 +751,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
719
751
  MatFormFieldModule,
720
752
  MatSelectModule,
721
753
  ReactiveFormsModule,
722
- MatDialogModule
754
+ MatDialogModule,
755
+ MatInputModule
723
756
  ],
724
757
  providers: [TitleCasePipe, LowerCasePipe],
725
758
  exports: [HeaderComponent],