ngx-vector-components 6.43.0 → 6.45.0

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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # Changelog
2
2
 
3
+ ## [6.45.0] (26/10/2026)
4
+
5
+ ### Fix
6
+
7
+ - Added corrections to the crud-footer that is overlapping the menu and obstructing the main navigation in `MenuComponent` (`menu.component.ts`)
8
+
9
+ ## [6.44.0] (23/10/2026)
10
+
11
+ ### Feat
12
+
13
+ - Added permission 'ENABLED_RESET_LOT_TRIP_IMAGEM' ('Enabled Reset Lot Trip Imagem') in `ProfileModuleActionType` (`profile.model.ts`)
14
+
3
15
  ## [6.43.0] (22/10/2026)
4
16
 
5
17
  ### Feat
@@ -326,6 +326,7 @@ var ProfileModuleActionType;
326
326
  ProfileModuleActionType["EDIT_LOT"] = "Edit Lot";
327
327
  ProfileModuleActionType["DELETE_LOT"] = "Delete Lot";
328
328
  ProfileModuleActionType["SHOW_LOT"] = "Show Lot";
329
+ ProfileModuleActionType["ENABLED_RESET_LOT_TRIP_IMAGEM"] = "Enabled Reset Lot Trip Imagem";
329
330
  ProfileModuleActionType["ACCEPT_CREDIT"] = "Accept Credit";
330
331
  ProfileModuleActionType["SHOW_CREDIT"] = "Show Credit";
331
332
  ProfileModuleActionType["ADD_VEHICLE_CONFIGURATION"] = "Add Vehicle Configuration";
@@ -1962,11 +1963,11 @@ class CrudFooterComponent {
1962
1963
  }
1963
1964
  ngOnInit() { }
1964
1965
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CrudFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1965
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CrudFooterComponent, isStandalone: false, selector: "vector-crud-footer", inputs: { submitDisabled: "submitDisabled", submitHidden: "submitHidden", goBackHidden: "goBackHidden", labelGoBack: "labelGoBack", typeGoBack: "typeGoBack", leftIconGoBack: "leftIconGoBack", labelGoSubmit: "labelGoSubmit", typeGoSubmit: "typeGoSubmit", leftIconGoSubmit: "leftIconGoSubmit", actionHidden: "actionHidden", actionDisabled: "actionDisabled", labelAction: "labelAction", typeAction: "typeAction", leftIconAction: "leftIconAction" }, outputs: { onGoBack: "onGoBack", onSubmit: "onSubmit", onAction: "onAction" }, ngImport: i0, template: "<div class=\"footer-container shadow-3\">\n @if (!actionHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelAction || ''\"\n [type]=\"typeAction ? typeAction : 'default'\"\n [leftIcon]=\"leftIconAction || ''\"\n [disabled]=\"actionDisabled\"\n (onClick)=\"onAction.emit()\"\n ></vector-button>\n </div>\n }\n @if (!goBackHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelGoBack ? labelGoBack : ('enums.Options.GO_BACK' | translate)\"\n [type]=\"typeGoBack ? typeGoBack : 'default'\"\n [leftIcon]=\"leftIconGoBack || ''\"\n (onClick)=\"onGoBack.emit()\"\n >\n </vector-button>\n </div>\n }\n\n @if (!submitHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelGoSubmit ? labelGoSubmit : ('enums.Options.SAVE' | translate)\"\n [type]=\"typeGoSubmit ? typeGoSubmit : 'success'\"\n [leftIcon]=\"leftIconGoSubmit || ''\"\n (onClick)=\"onSubmit.emit()\"\n [disabled]=\"submitDisabled\"\n ></vector-button>\n </div>\n }\n</div>\n", styles: [".footer-container{position:fixed;bottom:0;left:0;background-color:#f5f5f5;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;width:100%;height:60px}.footer-container .button{margin-right:10px}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "width", "leftIcon", "rightIcon", "shadow", "rounded", "cursor", "style", "loading"], outputs: ["onClick"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
1966
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: CrudFooterComponent, isStandalone: false, selector: "vector-crud-footer", inputs: { submitDisabled: "submitDisabled", submitHidden: "submitHidden", goBackHidden: "goBackHidden", labelGoBack: "labelGoBack", typeGoBack: "typeGoBack", leftIconGoBack: "leftIconGoBack", labelGoSubmit: "labelGoSubmit", typeGoSubmit: "typeGoSubmit", leftIconGoSubmit: "leftIconGoSubmit", actionHidden: "actionHidden", actionDisabled: "actionDisabled", labelAction: "labelAction", typeAction: "typeAction", leftIconAction: "leftIconAction" }, outputs: { onGoBack: "onGoBack", onSubmit: "onSubmit", onAction: "onAction" }, ngImport: i0, template: "<div class=\"footer-container shadow-3\">\n @if (!actionHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelAction || ''\"\n [type]=\"typeAction ? typeAction : 'default'\"\n [leftIcon]=\"leftIconAction || ''\"\n [disabled]=\"actionDisabled\"\n (onClick)=\"onAction.emit()\"\n ></vector-button>\n </div>\n }\n @if (!goBackHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelGoBack ? labelGoBack : ('enums.Options.GO_BACK' | translate)\"\n [type]=\"typeGoBack ? typeGoBack : 'default'\"\n [leftIcon]=\"leftIconGoBack || ''\"\n (onClick)=\"onGoBack.emit()\"\n >\n </vector-button>\n </div>\n }\n\n @if (!submitHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelGoSubmit ? labelGoSubmit : ('enums.Options.SAVE' | translate)\"\n [type]=\"typeGoSubmit ? typeGoSubmit : 'success'\"\n [leftIcon]=\"leftIconGoSubmit || ''\"\n (onClick)=\"onSubmit.emit()\"\n [disabled]=\"submitDisabled\"\n ></vector-button>\n </div>\n }\n</div>\n", styles: [".footer-container{position:fixed;bottom:0;left:var(--vector-sidebar-width, 0px);right:0;z-index:5;background-color:#f5f5f5;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;width:auto;height:60px}.footer-container .button{margin-right:10px}:host-context(.p-dialog) .footer-container{position:relative;left:0;right:auto;width:100%}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "width", "leftIcon", "rightIcon", "shadow", "rounded", "cursor", "style", "loading"], outputs: ["onClick"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
1966
1967
  }
1967
1968
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: CrudFooterComponent, decorators: [{
1968
1969
  type: Component,
1969
- args: [{ standalone: false, selector: 'vector-crud-footer', template: "<div class=\"footer-container shadow-3\">\n @if (!actionHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelAction || ''\"\n [type]=\"typeAction ? typeAction : 'default'\"\n [leftIcon]=\"leftIconAction || ''\"\n [disabled]=\"actionDisabled\"\n (onClick)=\"onAction.emit()\"\n ></vector-button>\n </div>\n }\n @if (!goBackHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelGoBack ? labelGoBack : ('enums.Options.GO_BACK' | translate)\"\n [type]=\"typeGoBack ? typeGoBack : 'default'\"\n [leftIcon]=\"leftIconGoBack || ''\"\n (onClick)=\"onGoBack.emit()\"\n >\n </vector-button>\n </div>\n }\n\n @if (!submitHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelGoSubmit ? labelGoSubmit : ('enums.Options.SAVE' | translate)\"\n [type]=\"typeGoSubmit ? typeGoSubmit : 'success'\"\n [leftIcon]=\"leftIconGoSubmit || ''\"\n (onClick)=\"onSubmit.emit()\"\n [disabled]=\"submitDisabled\"\n ></vector-button>\n </div>\n }\n</div>\n", styles: [".footer-container{position:fixed;bottom:0;left:0;background-color:#f5f5f5;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;width:100%;height:60px}.footer-container .button{margin-right:10px}\n"] }]
1970
+ args: [{ standalone: false, selector: 'vector-crud-footer', template: "<div class=\"footer-container shadow-3\">\n @if (!actionHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelAction || ''\"\n [type]=\"typeAction ? typeAction : 'default'\"\n [leftIcon]=\"leftIconAction || ''\"\n [disabled]=\"actionDisabled\"\n (onClick)=\"onAction.emit()\"\n ></vector-button>\n </div>\n }\n @if (!goBackHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelGoBack ? labelGoBack : ('enums.Options.GO_BACK' | translate)\"\n [type]=\"typeGoBack ? typeGoBack : 'default'\"\n [leftIcon]=\"leftIconGoBack || ''\"\n (onClick)=\"onGoBack.emit()\"\n >\n </vector-button>\n </div>\n }\n\n @if (!submitHidden) {\n <div class=\"button\">\n <vector-button\n [label]=\"labelGoSubmit ? labelGoSubmit : ('enums.Options.SAVE' | translate)\"\n [type]=\"typeGoSubmit ? typeGoSubmit : 'success'\"\n [leftIcon]=\"leftIconGoSubmit || ''\"\n (onClick)=\"onSubmit.emit()\"\n [disabled]=\"submitDisabled\"\n ></vector-button>\n </div>\n }\n</div>\n", styles: [".footer-container{position:fixed;bottom:0;left:var(--vector-sidebar-width, 0px);right:0;z-index:5;background-color:#f5f5f5;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;width:auto;height:60px}.footer-container .button{margin-right:10px}:host-context(.p-dialog) .footer-container{position:relative;left:0;right:auto;width:100%}\n"] }]
1970
1971
  }], ctorParameters: () => [], propDecorators: { submitDisabled: [{
1971
1972
  type: Input
1972
1973
  }], submitHidden: [{
@@ -6231,10 +6232,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
6231
6232
  }]
6232
6233
  }] });
6233
6234
 
6235
+ const SIDEBAR_WIDTH_VAR = '--vector-sidebar-width';
6236
+ const SIDEBAR_EXPANDED_WIDTH = '240px';
6237
+ const SIDEBAR_COLLAPSED_WIDTH = '72px';
6234
6238
  class MenuComponent {
6235
6239
  set opened(opened) {
6236
6240
  this._opened = opened;
6237
6241
  this.menuService.menuOpened$.next(this.opened);
6242
+ this.syncSidebarWidthVar();
6238
6243
  }
6239
6244
  get opened() {
6240
6245
  return this._opened;
@@ -6275,6 +6280,7 @@ class MenuComponent {
6275
6280
  this.highlightedIndex = -1;
6276
6281
  }
6277
6282
  ngOnInit() {
6283
+ this.syncSidebarWidthVar();
6278
6284
  this.subscription.add(this.menuService.toggleMenu$.subscribe(() => {
6279
6285
  this.toggleMenu();
6280
6286
  }));
@@ -6346,6 +6352,10 @@ class MenuComponent {
6346
6352
  // }
6347
6353
  ngOnDestroy() {
6348
6354
  this.subscription.unsubscribe();
6355
+ document.documentElement.style.removeProperty(SIDEBAR_WIDTH_VAR);
6356
+ }
6357
+ syncSidebarWidthVar() {
6358
+ document.documentElement.style.setProperty(SIDEBAR_WIDTH_VAR, this.opened ? SIDEBAR_EXPANDED_WIDTH : SIDEBAR_COLLAPSED_WIDTH);
6349
6359
  }
6350
6360
  toggleMenu() {
6351
6361
  this.opened = !this.opened;
@@ -6616,7 +6626,7 @@ class MenuComponent {
6616
6626
  this.activeSubmenuOption = undefined;
6617
6627
  }
6618
6628
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.25", ngImport: i0, type: MenuComponent, deps: [{ token: MenuService }, { token: i1$1.Router }, { token: ProfileService }, { token: StorageService }, { token: i0.ElementRef }, { token: ENVIRONMENT }, { token: APP_NAME }], target: i0.ɵɵFactoryTarget.Component }); }
6619
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: MenuComponent, isStandalone: false, selector: "vector-menu", inputs: { accountService: "accountService", apps: "apps" }, outputs: { onFinishMenuOptionsConfig: "onFinishMenuOptionsConfig" }, host: { listeners: { "document:keydown": "onDocumentKeydown($event)", "document:mousedown": "onDocumentMousedown($event)" } }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<div class=\"vector-main-menu\" [class.vector-main-menu--collapsed]=\"!opened\">\n <div class=\"menu-box-logo\" [class.menu-box-logo--small]=\"!opened\"></div>\n\n <div class=\"menu-box-scroll\">\n <ul class=\"menu-box-list\">\n <span class=\"title\" [class.d-none]=\"!opened\">Sele\u00E7\u00E3o de portal</span>\n\n @if (apps.length) {\n @for (app of apps; track app.appName) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(app.appName)\"\n >\n <div class=\"item-row\" (click)=\"navigateToPortal(app)\" [pTooltip]=\"app.description\" tooltipPosition=\"right\">\n <i class=\"ph-bold icon-item\" [ngClass]=\"app.className || 'ph-squares-four'\"></i>\n <span>{{ app.description }}</span>\n </div>\n </li>\n }\n } @else {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.LOGTECH)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.LOGTECH, isAdmin: false })\"\n pTooltip=\"Cargas\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-truck-trailer icon-item\"></i>\n <span>Cargas</span>\n </div>\n </li>\n\n @if (hasAnyFintechPermission) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.FINTECH)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: false })\"\n pTooltip=\"Conta digital\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-currency-circle-dollar icon-item\"></i>\n <span>Conta digital</span>\n </div>\n </li>\n }\n\n @if (!production) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.MARKETPLACE)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.MARKETPLACE, isAdmin: false })\"\n pTooltip=\"Combust\u00EDvel\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-gas-pump icon-item\"></i>\n <span>Combust\u00EDvel</span>\n </div>\n </li>\n }\n\n @if (adminOption && (hasFintechAdminPermission || hasMarketplaceAdminPermission)) {\n <li class=\"menu-box-item\" [class.menu-box-item--collapsed]=\"!opened\">\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: true })\"\n pTooltip=\"Admin Fintech\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-gear icon-item\"></i>\n <span>Admin Fintech</span>\n </div>\n </li>\n }\n }\n </ul>\n\n <ul class=\"menu-box-list\">\n <span class=\"title\" [class.d-none]=\"!opened\">Menu</span>\n @for (item of options; track item.id) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active]=\"isHighlighted(item)\"\n [class.menu-box-item--expanded]=\"isExpanded(item)\"\n >\n <div class=\"item-row\" (click)=\"onTopLevelClick(item)\" [pTooltip]=\"item.label\" tooltipPosition=\"right\">\n @if (item.iconFileName) {\n <img\n [src]=\"'../../../../assets/icons/' + item.iconFileName + '.svg'\"\n class=\"icon-item\"\n [alt]=\"item.label\"\n />\n } @else {\n <i class=\"ph-bold icon-item\" [ngClass]=\"item.icon || 'ph-dot-outline'\"></i>\n }\n <span>{{ item.label }}</span>\n @if (getMenuNotificationsCount(item)) {\n <span class=\"menu-notifications-count\">{{ getMenuNotificationsCount(item) }}</span>\n }\n @if (hasCaret(item)) {\n <i\n class=\"ph-bold icon-caret\"\n [class.ph-caret-down]=\"!isExpanded(item)\"\n [class.ph-caret-up]=\"isExpanded(item)\"\n ></i>\n }\n </div>\n\n @if (hasChildren(item)) {\n <div class=\"submenu-wrap\">\n <ul class=\"submenu-box-list\">\n <ng-container\n *ngTemplateOutlet=\"submenuLevel; context: { $implicit: visibleChildren(item), depth: 1 }\"\n ></ng-container>\n </ul>\n </div>\n }\n </li>\n }\n </ul>\n </div>\n\n <div class=\"vector-menu-search\" [class.vector-menu-search--collapsed]=\"!opened\">\n @if (searchResults.length) {\n <ul class=\"search-results\">\n @for (result of searchResults; track result.item.id; let i = $index) {\n <li\n class=\"search-result\"\n [class.search-result--highlighted]=\"i === highlightedIndex\"\n [pTooltip]=\"result.path\"\n tooltipPosition=\"right\"\n (mouseenter)=\"highlightedIndex = i\"\n (mousedown)=\"selectResult(result)\"\n >\n <span class=\"search-result__label\">{{ result.item.label }}</span>\n <span class=\"search-result__path\">{{ result.path }}</span>\n </li>\n }\n </ul>\n }\n\n <div class=\"search-field\" (click)=\"focusSearch()\">\n <i class=\"ph-bold ph-magnifying-glass\"></i>\n <input\n #searchInput\n type=\"text\"\n class=\"search-input\"\n placeholder=\"Buscar no menu\"\n autocomplete=\"off\"\n [attr.aria-label]=\"'Buscar no menu'\"\n (input)=\"onSearchInput(searchInput.value)\"\n (keydown)=\"onSearchKeydown($event)\"\n />\n <span class=\"search-shortcut\">Ctrl K</span>\n </div>\n </div>\n</div>\n\n<ng-template #submenuLevel let-items let-depth=\"depth\">\n @for (sub of items; track sub.id) {\n <li\n [class]=\"hasChildren(sub) ? 'submenu-box-item-list' : 'submenu-box-item'\"\n [class.submenu-box-item-list--active]=\"isExpanded(sub)\"\n >\n <div\n class=\"item-row\"\n [style.--menu-depth]=\"depth\"\n (click)=\"onItemClick(sub)\"\n [pTooltip]=\"sub.label\"\n tooltipPosition=\"right\"\n >\n <span>{{ sub.label }}</span>\n @if (getMenuNotificationsCount(sub)) {\n <span class=\"menu-notifications-count\">{{ getMenuNotificationsCount(sub) }}</span>\n }\n @if (hasCaret(sub)) {\n <i\n class=\"ph-bold icon-caret\"\n [class.ph-caret-down]=\"!isExpanded(sub)\"\n [class.ph-caret-up]=\"isExpanded(sub)\"\n ></i>\n }\n </div>\n\n @if (hasChildren(sub)) {\n <div class=\"submenu-wrap\">\n <ul class=\"submenu-last-list\">\n <ng-container\n *ngTemplateOutlet=\"submenuLevel; context: { $implicit: visibleChildren(sub), depth: depth + 1 }\"\n ></ng-container>\n </ul>\n </div>\n }\n </li>\n }\n</ng-template>\n", styles: [".angle-icon{position:absolute;right:10px}.menu-icon{filter:brightness(0) saturate(100%) invert(14%) sepia(87%) saturate(1218%) hue-rotate(233deg) brightness(88%) contrast(90%);width:20px;height:20px}.icon-container{width:20px;height:20px;position:relative}.icon-container .menu-icon{display:flex;justify-content:center;align-items:center;font-size:1.4em}.icon-container .menu-notifications-count{padding:0 4.5px;background-color:var(--error-color);border-radius:10px;position:absolute;top:-4px;right:-4px;font-size:8px}.menu-label{color:var(--theme-dark);font-weight:600;text-decoration:none;padding-bottom:1px;padding-right:24px;margin-left:20px;min-width:170px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}.vector-main-menu{display:flex;flex-direction:column;padding:0;height:100%;width:240px;box-sizing:border-box;min-width:72px;max-width:240px;font-family:Poppins,sans-serif;font-size:.875rem;font-weight:500;overflow:hidden;background-color:#fff;box-shadow:2px 2px 4px #00000029;transition:width .15s ease-in-out}.vector-main-menu--collapsed{width:72px}.vector-main-menu .menu-box-logo{display:flex;flex:0 0 auto;box-sizing:border-box;height:81px;align-items:center;padding-left:16px;background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-origin:content-box;background-position:left center;background-size:auto 24px;transition:background-position .15s ease-in-out}.vector-main-menu .menu-box-logo--small{padding-left:0;background-position:right 13px center}.vector-main-menu .menu-box-scroll{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:transparent transparent}.vector-main-menu .menu-box-scroll::-webkit-scrollbar{width:6px}.vector-main-menu .menu-box-scroll::-webkit-scrollbar-track{background:transparent}.vector-main-menu .menu-box-scroll::-webkit-scrollbar-thumb{background:transparent;border-radius:3px;transition:background-color .2s ease-in-out}.vector-main-menu:hover .menu-box-scroll{scrollbar-color:#e4e4e9 transparent}.vector-main-menu:hover .menu-box-scroll::-webkit-scrollbar-thumb{background:#e4e4e9}.vector-main-menu .vector-menu-search{flex:0 0 auto;position:relative;padding:8px}.vector-main-menu .vector-menu-search .search-field{display:flex;align-items:center;gap:4px;padding:16px 8px;border:1px solid #ebebf0;border-radius:8px;background:#fff;transition:border-color .15s ease-in-out}.vector-main-menu .vector-menu-search .search-field:focus{border:1px solid #cfdeff;background:#fff;outline:none}.vector-main-menu .vector-menu-search .search-field:focus-visible,.vector-main-menu .vector-menu-search .search-field:focus-within{background-color:#fff;border:1px solid #1545de!important;outline:3px solid #cfdeff;outline-offset:0}.vector-main-menu .vector-menu-search .search-field i{flex:none;font-size:1rem;color:#8e91a5}.vector-main-menu .vector-menu-search .search-input{flex:1 1 auto;min-width:0;border:none;outline:none;background:transparent;font-family:inherit;font-size:.875rem;color:#434560}.vector-main-menu .vector-menu-search .search-input::placeholder{color:#8e91a5}.vector-main-menu .vector-menu-search .search-shortcut{flex:none;padding:2px 6px;border:1px solid #ebebf0;border-radius:4px;font-size:.625rem;color:#8e91a5;white-space:nowrap}.vector-main-menu .vector-menu-search--collapsed .search-input,.vector-main-menu .vector-menu-search--collapsed .search-shortcut{display:none}.vector-main-menu .vector-menu-search--collapsed .search-field{justify-content:center;width:48px;height:48px;border-radius:48px;padding:0;margin:0 auto;cursor:pointer}.vector-main-menu .vector-menu-search .search-results{position:absolute;bottom:100%;left:8px;right:8px;margin:0 0 4px;padding:4px;list-style:none;background:#fff;border:1px solid #ebebf0;border-radius:8px;box-shadow:0 4px 16px #0000001f;z-index:10;max-height:250px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#dcdce2 transparent}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar{width:6px}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar-track{background:transparent}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar-thumb{background:#dcdce2;border-radius:3px}.vector-main-menu .vector-menu-search .search-result{display:block;margin:0;padding:8px;border-radius:6px;cursor:pointer;transition:background-color .15s ease-in-out}.vector-main-menu .vector-menu-search .search-result--highlighted{background:#ebf1ff}.vector-main-menu .vector-menu-search .search-result__label{display:block;font-size:.875rem;font-weight:500;color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vector-main-menu .vector-menu-search .search-result__path{display:block;font-size:.6875rem;color:#8e91a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vector-main-menu ul.menu-box-list{display:block;padding:16px 8px}.vector-main-menu ul.menu-box-list span.title{display:block;padding:8px;font-weight:600;font-size:.875rem;line-height:1.25rem;color:#8e91a5;white-space:nowrap;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list .item-row span.menu-notifications-count{flex:none;padding:0 5px;border-radius:10px;background-color:var(--error-color);color:#fff;font-size:.625rem;line-height:1.6;font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item{display:block;margin:0;color:#434560}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row{display:flex;padding:14px 8px;align-items:center;border-radius:8px;gap:16px;box-sizing:border-box;transition:background-color .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row i.icon-item{font-size:1.25rem;flex:none;width:24px;text-align:center}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row span:not(.menu-notifications-count){color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto;padding-right:4px;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row i.icon-caret{font-size:.857rem;margin-left:auto;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:hover{cursor:pointer;background:#f1f1f5}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:active,.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:focus,.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:focus-within{background:#ebf1ff}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row{background:#ebf1ff}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row i,.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row span:not(.menu-notifications-count){color:#1545de!important}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row i,.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row span:not(.menu-notifications-count){color:#1545de!important}.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row{width:48px;height:48px;gap:0;border-radius:48px;justify-content:center}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row span,.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row i.icon-caret{width:0;overflow:hidden;display:none}.vector-main-menu ul.menu-box-list li.menu-box-item .submenu-wrap{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .2s ease-in-out,opacity .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item .submenu-wrap>ul{overflow:hidden;min-height:0}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed .submenu-wrap{display:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list{display:block;padding:0;margin:0;list-style:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list{display:block;margin:0;color:#434560}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row{display:flex;padding:14px 8px;padding-left:calc(24px + var(--menu-depth, 1) * 20px);align-items:center;border-radius:8px;gap:16px;box-sizing:border-box;transition:background-color .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row span:not(.menu-notifications-count),.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row span:not(.menu-notifications-count){color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto;padding-right:4px;font-weight:400}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row i.icon-caret,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row i.icon-caret{font-size:.75rem;margin-left:auto}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row:hover,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row:hover{cursor:pointer;background:#f1f1f5}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list ul.submenu-last-list{display:block;padding:0;margin:0;list-style:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list--active>.submenu-wrap{grid-template-rows:1fr;opacity:1}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list--active>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--expanded>.submenu-wrap{grid-template-rows:1fr;opacity:1}.vector-main-menu--collapsed ul.menu-box-list span.title{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }], animations: [
6629
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.25", type: MenuComponent, isStandalone: false, selector: "vector-menu", inputs: { accountService: "accountService", apps: "apps" }, outputs: { onFinishMenuOptionsConfig: "onFinishMenuOptionsConfig" }, host: { listeners: { "document:keydown": "onDocumentKeydown($event)", "document:mousedown": "onDocumentMousedown($event)" } }, viewQueries: [{ propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true }], ngImport: i0, template: "<div class=\"vector-main-menu\" [class.vector-main-menu--collapsed]=\"!opened\">\n <div class=\"menu-box-logo\" [class.menu-box-logo--small]=\"!opened\"></div>\n\n <div class=\"menu-box-scroll\">\n <ul class=\"menu-box-list\">\n <span class=\"title\" [class.d-none]=\"!opened\">Sele\u00E7\u00E3o de portal</span>\n\n @if (apps.length) {\n @for (app of apps; track app.appName) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(app.appName)\"\n >\n <div class=\"item-row\" (click)=\"navigateToPortal(app)\" [pTooltip]=\"app.description\" tooltipPosition=\"right\">\n <i class=\"ph-bold icon-item\" [ngClass]=\"app.className || 'ph-squares-four'\"></i>\n <span>{{ app.description }}</span>\n </div>\n </li>\n }\n } @else {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.LOGTECH)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.LOGTECH, isAdmin: false })\"\n pTooltip=\"Cargas\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-truck-trailer icon-item\"></i>\n <span>Cargas</span>\n </div>\n </li>\n\n @if (hasAnyFintechPermission) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.FINTECH)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: false })\"\n pTooltip=\"Conta digital\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-currency-circle-dollar icon-item\"></i>\n <span>Conta digital</span>\n </div>\n </li>\n }\n\n @if (!production) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.MARKETPLACE)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.MARKETPLACE, isAdmin: false })\"\n pTooltip=\"Combust\u00EDvel\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-gas-pump icon-item\"></i>\n <span>Combust\u00EDvel</span>\n </div>\n </li>\n }\n\n @if (adminOption && (hasFintechAdminPermission || hasMarketplaceAdminPermission)) {\n <li class=\"menu-box-item\" [class.menu-box-item--collapsed]=\"!opened\">\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: true })\"\n pTooltip=\"Admin Fintech\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-gear icon-item\"></i>\n <span>Admin Fintech</span>\n </div>\n </li>\n }\n }\n </ul>\n\n <ul class=\"menu-box-list\">\n <span class=\"title\" [class.d-none]=\"!opened\">Menu</span>\n @for (item of options; track item.id) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active]=\"isHighlighted(item)\"\n [class.menu-box-item--expanded]=\"isExpanded(item)\"\n >\n <div class=\"item-row\" (click)=\"onTopLevelClick(item)\" [pTooltip]=\"item.label\" tooltipPosition=\"right\">\n @if (item.iconFileName) {\n <img\n [src]=\"'../../../../assets/icons/' + item.iconFileName + '.svg'\"\n class=\"icon-item\"\n [alt]=\"item.label\"\n />\n } @else {\n <i class=\"ph-bold icon-item\" [ngClass]=\"item.icon || 'ph-dot-outline'\"></i>\n }\n <span>{{ item.label }}</span>\n @if (getMenuNotificationsCount(item)) {\n <span class=\"menu-notifications-count\">{{ getMenuNotificationsCount(item) }}</span>\n }\n @if (hasCaret(item)) {\n <i\n class=\"ph-bold icon-caret\"\n [class.ph-caret-down]=\"!isExpanded(item)\"\n [class.ph-caret-up]=\"isExpanded(item)\"\n ></i>\n }\n </div>\n\n @if (hasChildren(item)) {\n <div class=\"submenu-wrap\">\n <ul class=\"submenu-box-list\">\n <ng-container\n *ngTemplateOutlet=\"submenuLevel; context: { $implicit: visibleChildren(item), depth: 1 }\"\n ></ng-container>\n </ul>\n </div>\n }\n </li>\n }\n </ul>\n </div>\n\n <div class=\"vector-menu-search\" [class.vector-menu-search--collapsed]=\"!opened\">\n @if (searchResults.length) {\n <ul class=\"search-results\">\n @for (result of searchResults; track result.item.id; let i = $index) {\n <li\n class=\"search-result\"\n [class.search-result--highlighted]=\"i === highlightedIndex\"\n [pTooltip]=\"result.path\"\n tooltipPosition=\"right\"\n (mouseenter)=\"highlightedIndex = i\"\n (mousedown)=\"selectResult(result)\"\n >\n <span class=\"search-result__label\">{{ result.item.label }}</span>\n <span class=\"search-result__path\">{{ result.path }}</span>\n </li>\n }\n </ul>\n }\n\n <div class=\"search-field\" (click)=\"focusSearch()\">\n <i class=\"ph-bold ph-magnifying-glass\"></i>\n <input\n #searchInput\n type=\"text\"\n class=\"search-input\"\n placeholder=\"Buscar no menu\"\n autocomplete=\"off\"\n [attr.aria-label]=\"'Buscar no menu'\"\n (input)=\"onSearchInput(searchInput.value)\"\n (keydown)=\"onSearchKeydown($event)\"\n />\n <span class=\"search-shortcut\">Ctrl K</span>\n </div>\n </div>\n</div>\n\n<ng-template #submenuLevel let-items let-depth=\"depth\">\n @for (sub of items; track sub.id) {\n <li\n [class]=\"hasChildren(sub) ? 'submenu-box-item-list' : 'submenu-box-item'\"\n [class.submenu-box-item-list--active]=\"isExpanded(sub)\"\n >\n <div\n class=\"item-row\"\n [style.--menu-depth]=\"depth\"\n (click)=\"onItemClick(sub)\"\n [pTooltip]=\"sub.label\"\n tooltipPosition=\"right\"\n >\n <span>{{ sub.label }}</span>\n @if (getMenuNotificationsCount(sub)) {\n <span class=\"menu-notifications-count\">{{ getMenuNotificationsCount(sub) }}</span>\n }\n @if (hasCaret(sub)) {\n <i\n class=\"ph-bold icon-caret\"\n [class.ph-caret-down]=\"!isExpanded(sub)\"\n [class.ph-caret-up]=\"isExpanded(sub)\"\n ></i>\n }\n </div>\n\n @if (hasChildren(sub)) {\n <div class=\"submenu-wrap\">\n <ul class=\"submenu-last-list\">\n <ng-container\n *ngTemplateOutlet=\"submenuLevel; context: { $implicit: visibleChildren(sub), depth: depth + 1 }\"\n ></ng-container>\n </ul>\n </div>\n }\n </li>\n }\n</ng-template>\n", styles: [".angle-icon{position:absolute;right:10px}.menu-icon{filter:brightness(0) saturate(100%) invert(14%) sepia(87%) saturate(1218%) hue-rotate(233deg) brightness(88%) contrast(90%);width:20px;height:20px}.icon-container{width:20px;height:20px;position:relative}.icon-container .menu-icon{display:flex;justify-content:center;align-items:center;font-size:1.4em}.icon-container .menu-notifications-count{padding:0 4.5px;background-color:var(--error-color);border-radius:10px;position:absolute;top:-4px;right:-4px;font-size:8px}.menu-label{color:var(--theme-dark);font-weight:600;text-decoration:none;padding-bottom:1px;padding-right:24px;margin-left:20px;min-width:170px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}:host{display:block;position:relative;z-index:20;height:100%}.vector-main-menu{display:flex;flex-direction:column;padding:0;height:100%;width:240px;box-sizing:border-box;min-width:72px;max-width:240px;font-family:Poppins,sans-serif;font-size:.875rem;font-weight:500;overflow:hidden;background-color:#fff;box-shadow:2px 2px 4px #00000029;transition:width .15s ease-in-out}.vector-main-menu--collapsed{width:72px}.vector-main-menu .menu-box-logo{display:flex;flex:0 0 auto;box-sizing:border-box;height:81px;align-items:center;padding-left:16px;background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-origin:content-box;background-position:left center;background-size:auto 24px;transition:background-position .15s ease-in-out}.vector-main-menu .menu-box-logo--small{padding-left:0;background-position:right 13px center}.vector-main-menu .menu-box-scroll{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:transparent transparent}.vector-main-menu .menu-box-scroll::-webkit-scrollbar{width:6px}.vector-main-menu .menu-box-scroll::-webkit-scrollbar-track{background:transparent}.vector-main-menu .menu-box-scroll::-webkit-scrollbar-thumb{background:transparent;border-radius:3px;transition:background-color .2s ease-in-out}.vector-main-menu:hover .menu-box-scroll{scrollbar-color:#e4e4e9 transparent}.vector-main-menu:hover .menu-box-scroll::-webkit-scrollbar-thumb{background:#e4e4e9}.vector-main-menu .vector-menu-search{flex:0 0 auto;position:relative;padding:8px}.vector-main-menu .vector-menu-search .search-field{display:flex;align-items:center;gap:4px;padding:16px 8px;border:1px solid #ebebf0;border-radius:8px;background:#fff;transition:border-color .15s ease-in-out}.vector-main-menu .vector-menu-search .search-field:focus{border:1px solid #cfdeff;background:#fff;outline:none}.vector-main-menu .vector-menu-search .search-field:focus-visible,.vector-main-menu .vector-menu-search .search-field:focus-within{background-color:#fff;border:1px solid #1545de!important;outline:3px solid #cfdeff;outline-offset:0}.vector-main-menu .vector-menu-search .search-field i{flex:none;font-size:1rem;color:#8e91a5}.vector-main-menu .vector-menu-search .search-input{flex:1 1 auto;min-width:0;border:none;outline:none;background:transparent;font-family:inherit;font-size:.875rem;color:#434560}.vector-main-menu .vector-menu-search .search-input::placeholder{color:#8e91a5}.vector-main-menu .vector-menu-search .search-shortcut{flex:none;padding:2px 6px;border:1px solid #ebebf0;border-radius:4px;font-size:.625rem;color:#8e91a5;white-space:nowrap}.vector-main-menu .vector-menu-search--collapsed .search-input,.vector-main-menu .vector-menu-search--collapsed .search-shortcut{display:none}.vector-main-menu .vector-menu-search--collapsed .search-field{justify-content:center;width:48px;height:48px;border-radius:48px;padding:0;margin:0 auto;cursor:pointer}.vector-main-menu .vector-menu-search .search-results{position:absolute;bottom:100%;left:8px;right:8px;margin:0 0 4px;padding:4px;list-style:none;background:#fff;border:1px solid #ebebf0;border-radius:8px;box-shadow:0 4px 16px #0000001f;z-index:10;max-height:250px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#dcdce2 transparent}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar{width:6px}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar-track{background:transparent}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar-thumb{background:#dcdce2;border-radius:3px}.vector-main-menu .vector-menu-search .search-result{display:block;margin:0;padding:8px;border-radius:6px;cursor:pointer;transition:background-color .15s ease-in-out}.vector-main-menu .vector-menu-search .search-result--highlighted{background:#ebf1ff}.vector-main-menu .vector-menu-search .search-result__label{display:block;font-size:.875rem;font-weight:500;color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vector-main-menu .vector-menu-search .search-result__path{display:block;font-size:.6875rem;color:#8e91a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vector-main-menu ul.menu-box-list{display:block;padding:16px 8px}.vector-main-menu ul.menu-box-list span.title{display:block;padding:8px;font-weight:600;font-size:.875rem;line-height:1.25rem;color:#8e91a5;white-space:nowrap;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list .item-row span.menu-notifications-count{flex:none;padding:0 5px;border-radius:10px;background-color:var(--error-color);color:#fff;font-size:.625rem;line-height:1.6;font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item{display:block;margin:0;color:#434560}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row{display:flex;padding:14px 8px;align-items:center;border-radius:8px;gap:16px;box-sizing:border-box;transition:background-color .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row i.icon-item{font-size:1.25rem;flex:none;width:24px;text-align:center}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row span:not(.menu-notifications-count){color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto;padding-right:4px;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row i.icon-caret{font-size:.857rem;margin-left:auto;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:hover{cursor:pointer;background:#f1f1f5}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:active,.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:focus,.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:focus-within{background:#ebf1ff}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row{background:#ebf1ff}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row i,.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row span:not(.menu-notifications-count){color:#1545de!important}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row i,.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row span:not(.menu-notifications-count){color:#1545de!important}.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row{width:48px;height:48px;gap:0;border-radius:48px;justify-content:center}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row span,.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row i.icon-caret{width:0;overflow:hidden;display:none}.vector-main-menu ul.menu-box-list li.menu-box-item .submenu-wrap{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .2s ease-in-out,opacity .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item .submenu-wrap>ul{overflow:hidden;min-height:0}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed .submenu-wrap{display:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list{display:block;padding:0;margin:0;list-style:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list{display:block;margin:0;color:#434560}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row{display:flex;padding:14px 8px;padding-left:calc(24px + var(--menu-depth, 1) * 20px);align-items:center;border-radius:8px;gap:16px;box-sizing:border-box;transition:background-color .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row span:not(.menu-notifications-count),.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row span:not(.menu-notifications-count){color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto;padding-right:4px;font-weight:400}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row i.icon-caret,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row i.icon-caret{font-size:.75rem;margin-left:auto}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row:hover,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row:hover{cursor:pointer;background:#f1f1f5}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list ul.submenu-last-list{display:block;padding:0;margin:0;list-style:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list--active>.submenu-wrap{grid-template-rows:1fr;opacity:1}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list--active>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--expanded>.submenu-wrap{grid-template-rows:1fr;opacity:1}.vector-main-menu--collapsed ul.menu-box-list span.title{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }], animations: [
6620
6630
  trigger('sideInOut', [state('in', style({ width: '60px' })), state('out', style({ width: '250px' }))]),
6621
6631
  trigger('fadeInOut', [
6622
6632
  state('0', style({
@@ -6698,7 +6708,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.25", ngImpo
6698
6708
  })),
6699
6709
  transition('0 <=> 1', animate('350ms ease-in-out')),
6700
6710
  ]),
6701
- ], template: "<div class=\"vector-main-menu\" [class.vector-main-menu--collapsed]=\"!opened\">\n <div class=\"menu-box-logo\" [class.menu-box-logo--small]=\"!opened\"></div>\n\n <div class=\"menu-box-scroll\">\n <ul class=\"menu-box-list\">\n <span class=\"title\" [class.d-none]=\"!opened\">Sele\u00E7\u00E3o de portal</span>\n\n @if (apps.length) {\n @for (app of apps; track app.appName) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(app.appName)\"\n >\n <div class=\"item-row\" (click)=\"navigateToPortal(app)\" [pTooltip]=\"app.description\" tooltipPosition=\"right\">\n <i class=\"ph-bold icon-item\" [ngClass]=\"app.className || 'ph-squares-four'\"></i>\n <span>{{ app.description }}</span>\n </div>\n </li>\n }\n } @else {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.LOGTECH)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.LOGTECH, isAdmin: false })\"\n pTooltip=\"Cargas\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-truck-trailer icon-item\"></i>\n <span>Cargas</span>\n </div>\n </li>\n\n @if (hasAnyFintechPermission) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.FINTECH)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: false })\"\n pTooltip=\"Conta digital\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-currency-circle-dollar icon-item\"></i>\n <span>Conta digital</span>\n </div>\n </li>\n }\n\n @if (!production) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.MARKETPLACE)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.MARKETPLACE, isAdmin: false })\"\n pTooltip=\"Combust\u00EDvel\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-gas-pump icon-item\"></i>\n <span>Combust\u00EDvel</span>\n </div>\n </li>\n }\n\n @if (adminOption && (hasFintechAdminPermission || hasMarketplaceAdminPermission)) {\n <li class=\"menu-box-item\" [class.menu-box-item--collapsed]=\"!opened\">\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: true })\"\n pTooltip=\"Admin Fintech\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-gear icon-item\"></i>\n <span>Admin Fintech</span>\n </div>\n </li>\n }\n }\n </ul>\n\n <ul class=\"menu-box-list\">\n <span class=\"title\" [class.d-none]=\"!opened\">Menu</span>\n @for (item of options; track item.id) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active]=\"isHighlighted(item)\"\n [class.menu-box-item--expanded]=\"isExpanded(item)\"\n >\n <div class=\"item-row\" (click)=\"onTopLevelClick(item)\" [pTooltip]=\"item.label\" tooltipPosition=\"right\">\n @if (item.iconFileName) {\n <img\n [src]=\"'../../../../assets/icons/' + item.iconFileName + '.svg'\"\n class=\"icon-item\"\n [alt]=\"item.label\"\n />\n } @else {\n <i class=\"ph-bold icon-item\" [ngClass]=\"item.icon || 'ph-dot-outline'\"></i>\n }\n <span>{{ item.label }}</span>\n @if (getMenuNotificationsCount(item)) {\n <span class=\"menu-notifications-count\">{{ getMenuNotificationsCount(item) }}</span>\n }\n @if (hasCaret(item)) {\n <i\n class=\"ph-bold icon-caret\"\n [class.ph-caret-down]=\"!isExpanded(item)\"\n [class.ph-caret-up]=\"isExpanded(item)\"\n ></i>\n }\n </div>\n\n @if (hasChildren(item)) {\n <div class=\"submenu-wrap\">\n <ul class=\"submenu-box-list\">\n <ng-container\n *ngTemplateOutlet=\"submenuLevel; context: { $implicit: visibleChildren(item), depth: 1 }\"\n ></ng-container>\n </ul>\n </div>\n }\n </li>\n }\n </ul>\n </div>\n\n <div class=\"vector-menu-search\" [class.vector-menu-search--collapsed]=\"!opened\">\n @if (searchResults.length) {\n <ul class=\"search-results\">\n @for (result of searchResults; track result.item.id; let i = $index) {\n <li\n class=\"search-result\"\n [class.search-result--highlighted]=\"i === highlightedIndex\"\n [pTooltip]=\"result.path\"\n tooltipPosition=\"right\"\n (mouseenter)=\"highlightedIndex = i\"\n (mousedown)=\"selectResult(result)\"\n >\n <span class=\"search-result__label\">{{ result.item.label }}</span>\n <span class=\"search-result__path\">{{ result.path }}</span>\n </li>\n }\n </ul>\n }\n\n <div class=\"search-field\" (click)=\"focusSearch()\">\n <i class=\"ph-bold ph-magnifying-glass\"></i>\n <input\n #searchInput\n type=\"text\"\n class=\"search-input\"\n placeholder=\"Buscar no menu\"\n autocomplete=\"off\"\n [attr.aria-label]=\"'Buscar no menu'\"\n (input)=\"onSearchInput(searchInput.value)\"\n (keydown)=\"onSearchKeydown($event)\"\n />\n <span class=\"search-shortcut\">Ctrl K</span>\n </div>\n </div>\n</div>\n\n<ng-template #submenuLevel let-items let-depth=\"depth\">\n @for (sub of items; track sub.id) {\n <li\n [class]=\"hasChildren(sub) ? 'submenu-box-item-list' : 'submenu-box-item'\"\n [class.submenu-box-item-list--active]=\"isExpanded(sub)\"\n >\n <div\n class=\"item-row\"\n [style.--menu-depth]=\"depth\"\n (click)=\"onItemClick(sub)\"\n [pTooltip]=\"sub.label\"\n tooltipPosition=\"right\"\n >\n <span>{{ sub.label }}</span>\n @if (getMenuNotificationsCount(sub)) {\n <span class=\"menu-notifications-count\">{{ getMenuNotificationsCount(sub) }}</span>\n }\n @if (hasCaret(sub)) {\n <i\n class=\"ph-bold icon-caret\"\n [class.ph-caret-down]=\"!isExpanded(sub)\"\n [class.ph-caret-up]=\"isExpanded(sub)\"\n ></i>\n }\n </div>\n\n @if (hasChildren(sub)) {\n <div class=\"submenu-wrap\">\n <ul class=\"submenu-last-list\">\n <ng-container\n *ngTemplateOutlet=\"submenuLevel; context: { $implicit: visibleChildren(sub), depth: depth + 1 }\"\n ></ng-container>\n </ul>\n </div>\n }\n </li>\n }\n</ng-template>\n", styles: [".angle-icon{position:absolute;right:10px}.menu-icon{filter:brightness(0) saturate(100%) invert(14%) sepia(87%) saturate(1218%) hue-rotate(233deg) brightness(88%) contrast(90%);width:20px;height:20px}.icon-container{width:20px;height:20px;position:relative}.icon-container .menu-icon{display:flex;justify-content:center;align-items:center;font-size:1.4em}.icon-container .menu-notifications-count{padding:0 4.5px;background-color:var(--error-color);border-radius:10px;position:absolute;top:-4px;right:-4px;font-size:8px}.menu-label{color:var(--theme-dark);font-weight:600;text-decoration:none;padding-bottom:1px;padding-right:24px;margin-left:20px;min-width:170px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}.vector-main-menu{display:flex;flex-direction:column;padding:0;height:100%;width:240px;box-sizing:border-box;min-width:72px;max-width:240px;font-family:Poppins,sans-serif;font-size:.875rem;font-weight:500;overflow:hidden;background-color:#fff;box-shadow:2px 2px 4px #00000029;transition:width .15s ease-in-out}.vector-main-menu--collapsed{width:72px}.vector-main-menu .menu-box-logo{display:flex;flex:0 0 auto;box-sizing:border-box;height:81px;align-items:center;padding-left:16px;background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-origin:content-box;background-position:left center;background-size:auto 24px;transition:background-position .15s ease-in-out}.vector-main-menu .menu-box-logo--small{padding-left:0;background-position:right 13px center}.vector-main-menu .menu-box-scroll{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:transparent transparent}.vector-main-menu .menu-box-scroll::-webkit-scrollbar{width:6px}.vector-main-menu .menu-box-scroll::-webkit-scrollbar-track{background:transparent}.vector-main-menu .menu-box-scroll::-webkit-scrollbar-thumb{background:transparent;border-radius:3px;transition:background-color .2s ease-in-out}.vector-main-menu:hover .menu-box-scroll{scrollbar-color:#e4e4e9 transparent}.vector-main-menu:hover .menu-box-scroll::-webkit-scrollbar-thumb{background:#e4e4e9}.vector-main-menu .vector-menu-search{flex:0 0 auto;position:relative;padding:8px}.vector-main-menu .vector-menu-search .search-field{display:flex;align-items:center;gap:4px;padding:16px 8px;border:1px solid #ebebf0;border-radius:8px;background:#fff;transition:border-color .15s ease-in-out}.vector-main-menu .vector-menu-search .search-field:focus{border:1px solid #cfdeff;background:#fff;outline:none}.vector-main-menu .vector-menu-search .search-field:focus-visible,.vector-main-menu .vector-menu-search .search-field:focus-within{background-color:#fff;border:1px solid #1545de!important;outline:3px solid #cfdeff;outline-offset:0}.vector-main-menu .vector-menu-search .search-field i{flex:none;font-size:1rem;color:#8e91a5}.vector-main-menu .vector-menu-search .search-input{flex:1 1 auto;min-width:0;border:none;outline:none;background:transparent;font-family:inherit;font-size:.875rem;color:#434560}.vector-main-menu .vector-menu-search .search-input::placeholder{color:#8e91a5}.vector-main-menu .vector-menu-search .search-shortcut{flex:none;padding:2px 6px;border:1px solid #ebebf0;border-radius:4px;font-size:.625rem;color:#8e91a5;white-space:nowrap}.vector-main-menu .vector-menu-search--collapsed .search-input,.vector-main-menu .vector-menu-search--collapsed .search-shortcut{display:none}.vector-main-menu .vector-menu-search--collapsed .search-field{justify-content:center;width:48px;height:48px;border-radius:48px;padding:0;margin:0 auto;cursor:pointer}.vector-main-menu .vector-menu-search .search-results{position:absolute;bottom:100%;left:8px;right:8px;margin:0 0 4px;padding:4px;list-style:none;background:#fff;border:1px solid #ebebf0;border-radius:8px;box-shadow:0 4px 16px #0000001f;z-index:10;max-height:250px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#dcdce2 transparent}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar{width:6px}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar-track{background:transparent}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar-thumb{background:#dcdce2;border-radius:3px}.vector-main-menu .vector-menu-search .search-result{display:block;margin:0;padding:8px;border-radius:6px;cursor:pointer;transition:background-color .15s ease-in-out}.vector-main-menu .vector-menu-search .search-result--highlighted{background:#ebf1ff}.vector-main-menu .vector-menu-search .search-result__label{display:block;font-size:.875rem;font-weight:500;color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vector-main-menu .vector-menu-search .search-result__path{display:block;font-size:.6875rem;color:#8e91a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vector-main-menu ul.menu-box-list{display:block;padding:16px 8px}.vector-main-menu ul.menu-box-list span.title{display:block;padding:8px;font-weight:600;font-size:.875rem;line-height:1.25rem;color:#8e91a5;white-space:nowrap;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list .item-row span.menu-notifications-count{flex:none;padding:0 5px;border-radius:10px;background-color:var(--error-color);color:#fff;font-size:.625rem;line-height:1.6;font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item{display:block;margin:0;color:#434560}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row{display:flex;padding:14px 8px;align-items:center;border-radius:8px;gap:16px;box-sizing:border-box;transition:background-color .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row i.icon-item{font-size:1.25rem;flex:none;width:24px;text-align:center}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row span:not(.menu-notifications-count){color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto;padding-right:4px;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row i.icon-caret{font-size:.857rem;margin-left:auto;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:hover{cursor:pointer;background:#f1f1f5}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:active,.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:focus,.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:focus-within{background:#ebf1ff}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row{background:#ebf1ff}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row i,.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row span:not(.menu-notifications-count){color:#1545de!important}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row i,.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row span:not(.menu-notifications-count){color:#1545de!important}.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row{width:48px;height:48px;gap:0;border-radius:48px;justify-content:center}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row span,.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row i.icon-caret{width:0;overflow:hidden;display:none}.vector-main-menu ul.menu-box-list li.menu-box-item .submenu-wrap{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .2s ease-in-out,opacity .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item .submenu-wrap>ul{overflow:hidden;min-height:0}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed .submenu-wrap{display:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list{display:block;padding:0;margin:0;list-style:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list{display:block;margin:0;color:#434560}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row{display:flex;padding:14px 8px;padding-left:calc(24px + var(--menu-depth, 1) * 20px);align-items:center;border-radius:8px;gap:16px;box-sizing:border-box;transition:background-color .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row span:not(.menu-notifications-count),.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row span:not(.menu-notifications-count){color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto;padding-right:4px;font-weight:400}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row i.icon-caret,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row i.icon-caret{font-size:.75rem;margin-left:auto}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row:hover,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row:hover{cursor:pointer;background:#f1f1f5}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list ul.submenu-last-list{display:block;padding:0;margin:0;list-style:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list--active>.submenu-wrap{grid-template-rows:1fr;opacity:1}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list--active>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--expanded>.submenu-wrap{grid-template-rows:1fr;opacity:1}.vector-main-menu--collapsed ul.menu-box-list span.title{display:none}\n"] }]
6711
+ ], template: "<div class=\"vector-main-menu\" [class.vector-main-menu--collapsed]=\"!opened\">\n <div class=\"menu-box-logo\" [class.menu-box-logo--small]=\"!opened\"></div>\n\n <div class=\"menu-box-scroll\">\n <ul class=\"menu-box-list\">\n <span class=\"title\" [class.d-none]=\"!opened\">Sele\u00E7\u00E3o de portal</span>\n\n @if (apps.length) {\n @for (app of apps; track app.appName) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(app.appName)\"\n >\n <div class=\"item-row\" (click)=\"navigateToPortal(app)\" [pTooltip]=\"app.description\" tooltipPosition=\"right\">\n <i class=\"ph-bold icon-item\" [ngClass]=\"app.className || 'ph-squares-four'\"></i>\n <span>{{ app.description }}</span>\n </div>\n </li>\n }\n } @else {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.LOGTECH)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.LOGTECH, isAdmin: false })\"\n pTooltip=\"Cargas\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-truck-trailer icon-item\"></i>\n <span>Cargas</span>\n </div>\n </li>\n\n @if (hasAnyFintechPermission) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.FINTECH)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: false })\"\n pTooltip=\"Conta digital\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-currency-circle-dollar icon-item\"></i>\n <span>Conta digital</span>\n </div>\n </li>\n }\n\n @if (!production) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active-portal]=\"isPortalSelected(appsEnum.MARKETPLACE)\"\n >\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.MARKETPLACE, isAdmin: false })\"\n pTooltip=\"Combust\u00EDvel\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-gas-pump icon-item\"></i>\n <span>Combust\u00EDvel</span>\n </div>\n </li>\n }\n\n @if (adminOption && (hasFintechAdminPermission || hasMarketplaceAdminPermission)) {\n <li class=\"menu-box-item\" [class.menu-box-item--collapsed]=\"!opened\">\n <div\n class=\"item-row\"\n (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: true })\"\n pTooltip=\"Admin Fintech\"\n tooltipPosition=\"right\"\n >\n <i class=\"ph-bold ph-gear icon-item\"></i>\n <span>Admin Fintech</span>\n </div>\n </li>\n }\n }\n </ul>\n\n <ul class=\"menu-box-list\">\n <span class=\"title\" [class.d-none]=\"!opened\">Menu</span>\n @for (item of options; track item.id) {\n <li\n class=\"menu-box-item\"\n [class.menu-box-item--collapsed]=\"!opened\"\n [class.menu-box-item--active]=\"isHighlighted(item)\"\n [class.menu-box-item--expanded]=\"isExpanded(item)\"\n >\n <div class=\"item-row\" (click)=\"onTopLevelClick(item)\" [pTooltip]=\"item.label\" tooltipPosition=\"right\">\n @if (item.iconFileName) {\n <img\n [src]=\"'../../../../assets/icons/' + item.iconFileName + '.svg'\"\n class=\"icon-item\"\n [alt]=\"item.label\"\n />\n } @else {\n <i class=\"ph-bold icon-item\" [ngClass]=\"item.icon || 'ph-dot-outline'\"></i>\n }\n <span>{{ item.label }}</span>\n @if (getMenuNotificationsCount(item)) {\n <span class=\"menu-notifications-count\">{{ getMenuNotificationsCount(item) }}</span>\n }\n @if (hasCaret(item)) {\n <i\n class=\"ph-bold icon-caret\"\n [class.ph-caret-down]=\"!isExpanded(item)\"\n [class.ph-caret-up]=\"isExpanded(item)\"\n ></i>\n }\n </div>\n\n @if (hasChildren(item)) {\n <div class=\"submenu-wrap\">\n <ul class=\"submenu-box-list\">\n <ng-container\n *ngTemplateOutlet=\"submenuLevel; context: { $implicit: visibleChildren(item), depth: 1 }\"\n ></ng-container>\n </ul>\n </div>\n }\n </li>\n }\n </ul>\n </div>\n\n <div class=\"vector-menu-search\" [class.vector-menu-search--collapsed]=\"!opened\">\n @if (searchResults.length) {\n <ul class=\"search-results\">\n @for (result of searchResults; track result.item.id; let i = $index) {\n <li\n class=\"search-result\"\n [class.search-result--highlighted]=\"i === highlightedIndex\"\n [pTooltip]=\"result.path\"\n tooltipPosition=\"right\"\n (mouseenter)=\"highlightedIndex = i\"\n (mousedown)=\"selectResult(result)\"\n >\n <span class=\"search-result__label\">{{ result.item.label }}</span>\n <span class=\"search-result__path\">{{ result.path }}</span>\n </li>\n }\n </ul>\n }\n\n <div class=\"search-field\" (click)=\"focusSearch()\">\n <i class=\"ph-bold ph-magnifying-glass\"></i>\n <input\n #searchInput\n type=\"text\"\n class=\"search-input\"\n placeholder=\"Buscar no menu\"\n autocomplete=\"off\"\n [attr.aria-label]=\"'Buscar no menu'\"\n (input)=\"onSearchInput(searchInput.value)\"\n (keydown)=\"onSearchKeydown($event)\"\n />\n <span class=\"search-shortcut\">Ctrl K</span>\n </div>\n </div>\n</div>\n\n<ng-template #submenuLevel let-items let-depth=\"depth\">\n @for (sub of items; track sub.id) {\n <li\n [class]=\"hasChildren(sub) ? 'submenu-box-item-list' : 'submenu-box-item'\"\n [class.submenu-box-item-list--active]=\"isExpanded(sub)\"\n >\n <div\n class=\"item-row\"\n [style.--menu-depth]=\"depth\"\n (click)=\"onItemClick(sub)\"\n [pTooltip]=\"sub.label\"\n tooltipPosition=\"right\"\n >\n <span>{{ sub.label }}</span>\n @if (getMenuNotificationsCount(sub)) {\n <span class=\"menu-notifications-count\">{{ getMenuNotificationsCount(sub) }}</span>\n }\n @if (hasCaret(sub)) {\n <i\n class=\"ph-bold icon-caret\"\n [class.ph-caret-down]=\"!isExpanded(sub)\"\n [class.ph-caret-up]=\"isExpanded(sub)\"\n ></i>\n }\n </div>\n\n @if (hasChildren(sub)) {\n <div class=\"submenu-wrap\">\n <ul class=\"submenu-last-list\">\n <ng-container\n *ngTemplateOutlet=\"submenuLevel; context: { $implicit: visibleChildren(sub), depth: depth + 1 }\"\n ></ng-container>\n </ul>\n </div>\n }\n </li>\n }\n</ng-template>\n", styles: [".angle-icon{position:absolute;right:10px}.menu-icon{filter:brightness(0) saturate(100%) invert(14%) sepia(87%) saturate(1218%) hue-rotate(233deg) brightness(88%) contrast(90%);width:20px;height:20px}.icon-container{width:20px;height:20px;position:relative}.icon-container .menu-icon{display:flex;justify-content:center;align-items:center;font-size:1.4em}.icon-container .menu-notifications-count{padding:0 4.5px;background-color:var(--error-color);border-radius:10px;position:absolute;top:-4px;right:-4px;font-size:8px}.menu-label{color:var(--theme-dark);font-weight:600;text-decoration:none;padding-bottom:1px;padding-right:24px;margin-left:20px;min-width:170px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}:host{display:block;position:relative;z-index:20;height:100%}.vector-main-menu{display:flex;flex-direction:column;padding:0;height:100%;width:240px;box-sizing:border-box;min-width:72px;max-width:240px;font-family:Poppins,sans-serif;font-size:.875rem;font-weight:500;overflow:hidden;background-color:#fff;box-shadow:2px 2px 4px #00000029;transition:width .15s ease-in-out}.vector-main-menu--collapsed{width:72px}.vector-main-menu .menu-box-logo{display:flex;flex:0 0 auto;box-sizing:border-box;height:81px;align-items:center;padding-left:16px;background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-origin:content-box;background-position:left center;background-size:auto 24px;transition:background-position .15s ease-in-out}.vector-main-menu .menu-box-logo--small{padding-left:0;background-position:right 13px center}.vector-main-menu .menu-box-scroll{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:transparent transparent}.vector-main-menu .menu-box-scroll::-webkit-scrollbar{width:6px}.vector-main-menu .menu-box-scroll::-webkit-scrollbar-track{background:transparent}.vector-main-menu .menu-box-scroll::-webkit-scrollbar-thumb{background:transparent;border-radius:3px;transition:background-color .2s ease-in-out}.vector-main-menu:hover .menu-box-scroll{scrollbar-color:#e4e4e9 transparent}.vector-main-menu:hover .menu-box-scroll::-webkit-scrollbar-thumb{background:#e4e4e9}.vector-main-menu .vector-menu-search{flex:0 0 auto;position:relative;padding:8px}.vector-main-menu .vector-menu-search .search-field{display:flex;align-items:center;gap:4px;padding:16px 8px;border:1px solid #ebebf0;border-radius:8px;background:#fff;transition:border-color .15s ease-in-out}.vector-main-menu .vector-menu-search .search-field:focus{border:1px solid #cfdeff;background:#fff;outline:none}.vector-main-menu .vector-menu-search .search-field:focus-visible,.vector-main-menu .vector-menu-search .search-field:focus-within{background-color:#fff;border:1px solid #1545de!important;outline:3px solid #cfdeff;outline-offset:0}.vector-main-menu .vector-menu-search .search-field i{flex:none;font-size:1rem;color:#8e91a5}.vector-main-menu .vector-menu-search .search-input{flex:1 1 auto;min-width:0;border:none;outline:none;background:transparent;font-family:inherit;font-size:.875rem;color:#434560}.vector-main-menu .vector-menu-search .search-input::placeholder{color:#8e91a5}.vector-main-menu .vector-menu-search .search-shortcut{flex:none;padding:2px 6px;border:1px solid #ebebf0;border-radius:4px;font-size:.625rem;color:#8e91a5;white-space:nowrap}.vector-main-menu .vector-menu-search--collapsed .search-input,.vector-main-menu .vector-menu-search--collapsed .search-shortcut{display:none}.vector-main-menu .vector-menu-search--collapsed .search-field{justify-content:center;width:48px;height:48px;border-radius:48px;padding:0;margin:0 auto;cursor:pointer}.vector-main-menu .vector-menu-search .search-results{position:absolute;bottom:100%;left:8px;right:8px;margin:0 0 4px;padding:4px;list-style:none;background:#fff;border:1px solid #ebebf0;border-radius:8px;box-shadow:0 4px 16px #0000001f;z-index:10;max-height:250px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#dcdce2 transparent}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar{width:6px}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar-track{background:transparent}.vector-main-menu .vector-menu-search .search-results::-webkit-scrollbar-thumb{background:#dcdce2;border-radius:3px}.vector-main-menu .vector-menu-search .search-result{display:block;margin:0;padding:8px;border-radius:6px;cursor:pointer;transition:background-color .15s ease-in-out}.vector-main-menu .vector-menu-search .search-result--highlighted{background:#ebf1ff}.vector-main-menu .vector-menu-search .search-result__label{display:block;font-size:.875rem;font-weight:500;color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vector-main-menu .vector-menu-search .search-result__path{display:block;font-size:.6875rem;color:#8e91a5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vector-main-menu ul.menu-box-list{display:block;padding:16px 8px}.vector-main-menu ul.menu-box-list span.title{display:block;padding:8px;font-weight:600;font-size:.875rem;line-height:1.25rem;color:#8e91a5;white-space:nowrap;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list .item-row span.menu-notifications-count{flex:none;padding:0 5px;border-radius:10px;background-color:var(--error-color);color:#fff;font-size:.625rem;line-height:1.6;font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item{display:block;margin:0;color:#434560}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row{display:flex;padding:14px 8px;align-items:center;border-radius:8px;gap:16px;box-sizing:border-box;transition:background-color .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row i.icon-item{font-size:1.25rem;flex:none;width:24px;text-align:center}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row span:not(.menu-notifications-count){color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto;padding-right:4px;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row i.icon-caret{font-size:.857rem;margin-left:auto;opacity:1;transition:opacity .1s ease-in .15s}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:hover{cursor:pointer;background:#f1f1f5}.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:active,.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:focus,.vector-main-menu ul.menu-box-list li.menu-box-item>.item-row:focus-within{background:#ebf1ff}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row{background:#ebf1ff}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row i,.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row span:not(.menu-notifications-count){color:#1545de!important}.vector-main-menu ul.menu-box-list li.menu-box-item--active-portal>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row i,.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row span:not(.menu-notifications-count){color:#1545de!important}.vector-main-menu ul.menu-box-list li.menu-box-item--active>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row{width:48px;height:48px;gap:0;border-radius:48px;justify-content:center}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row span,.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed>.item-row i.icon-caret{width:0;overflow:hidden;display:none}.vector-main-menu ul.menu-box-list li.menu-box-item .submenu-wrap{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .2s ease-in-out,opacity .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item .submenu-wrap>ul{overflow:hidden;min-height:0}.vector-main-menu ul.menu-box-list li.menu-box-item--collapsed .submenu-wrap{display:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list{display:block;padding:0;margin:0;list-style:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list{display:block;margin:0;color:#434560}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row{display:flex;padding:14px 8px;padding-left:calc(24px + var(--menu-depth, 1) * 20px);align-items:center;border-radius:8px;gap:16px;box-sizing:border-box;transition:background-color .15s ease-in-out}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row span:not(.menu-notifications-count),.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row span:not(.menu-notifications-count){color:#434560;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto;padding-right:4px;font-weight:400}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row i.icon-caret,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row i.icon-caret{font-size:.75rem;margin-left:auto}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item>.item-row:hover,.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list>.item-row:hover{cursor:pointer;background:#f1f1f5}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list ul.submenu-last-list{display:block;padding:0;margin:0;list-style:none}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list--active>.submenu-wrap{grid-template-rows:1fr;opacity:1}.vector-main-menu ul.menu-box-list li.menu-box-item ul.submenu-box-list li.submenu-box-item-list--active>.item-row span:not(.menu-notifications-count){font-weight:600}.vector-main-menu ul.menu-box-list li.menu-box-item--expanded>.submenu-wrap{grid-template-rows:1fr;opacity:1}.vector-main-menu--collapsed ul.menu-box-list span.title{display:none}\n"] }]
6702
6712
  }], ctorParameters: () => [{ type: MenuService }, { type: i1$1.Router }, { type: ProfileService }, { type: StorageService }, { type: i0.ElementRef }, { type: undefined, decorators: [{
6703
6713
  type: Inject,
6704
6714
  args: [ENVIRONMENT]