ngx-vector-components 5.47.1 → 5.49.0

package/fesm2022/ngx-vector-components.mjs

@@ -20,36 +20,38 @@ import * as i4 from 'primeng/calendar';
 import { CalendarModule } from 'primeng/calendar';
 import * as i3$1 from 'primeng/checkbox';
 import { CheckboxModule } from 'primeng/checkbox';
-import * as i2$7 from 'primeng/dialog';
+import * as i2$8 from 'primeng/dialog';
 import { DialogModule } from 'primeng/dialog';
-import * as i4$2 from 'primeng/dropdown';
+import * as i4$3 from 'primeng/dropdown';
 import { DropdownModule } from 'primeng/dropdown';
 import { FileUploadModule } from 'primeng/fileupload';
 import * as i5 from 'primeng/inputmask';
 import { InputMaskModule } from 'primeng/inputmask';
 import * as i2$2 from 'primeng/inputnumber';
 import { InputNumber, InputNumberModule } from 'primeng/inputnumber';
-import * as i2$4 from 'primeng/inputswitch';
+import * as i2$4 from 'primeng/inputotp';
+import { InputOtpModule } from 'primeng/inputotp';
+import * as i2$5 from 'primeng/inputswitch';
 import { InputSwitchModule } from 'primeng/inputswitch';
 import * as i4$1 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
-import * as i2$6 from 'primeng/inputtextarea';
+import * as i2$7 from 'primeng/inputtextarea';
 import { InputTextareaModule } from 'primeng/inputtextarea';
 import * as i3$2 from 'primeng/keyfilter';
 import { KeyFilterModule } from 'primeng/keyfilter';
 import * as i7 from 'primeng/menu';
 import { MenuModule as MenuModule$1 } from 'primeng/menu';
-import * as i3$3 from 'primeng/multiselect';
+import * as i4$2 from 'primeng/multiselect';
 import { MultiSelectModule } from 'primeng/multiselect';
 import * as i5$2 from 'primeng/radiobutton';
 import { RadioButtonModule } from 'primeng/radiobutton';
 import * as i2$3 from 'primeng/selectbutton';
 import { SelectButtonModule } from 'primeng/selectbutton';
-import * as i2$5 from 'primeng/slider';
+import * as i2$6 from 'primeng/slider';
 import { SliderModule } from 'primeng/slider';
 import * as i8 from 'primeng/table';
 import { TableModule } from 'primeng/table';
-import * as i4$3 from 'primeng/tabview';
+import * as i4$4 from 'primeng/tabview';
 import { TabViewModule } from 'primeng/tabview';
 import * as i1$3 from 'primeng/panel';
 import { PanelModule as PanelModule$1 } from 'primeng/panel';
@@ -58,9 +60,9 @@ import { DateTime } from 'luxon';
 import * as i1$4 from '@angular/common/http';
 import { HttpHeaders, HttpClient, HttpResponse } from '@angular/common/http';
 import { switchMap, map, tap, debounceTime, filter, catchError, take } from 'rxjs/operators';
-import * as i3$4 from 'primeng/accordion';
+import * as i3$3 from 'primeng/accordion';
 import { AccordionModule } from 'primeng/accordion';
-import { style, state, trigger, animate, transition } from '@angular/animations';
+import { trigger, state, style, transition, animate } from '@angular/animations';
 import * as i6 from 'primeng/overlaypanel';
 import { OverlayPanelModule } from 'primeng/overlaypanel';
 import * as i1$6 from 'primeng/steps';
@@ -609,12 +611,12 @@ class BadgeComponent {
         }
         return '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: BadgeComponent, selector: "vector-badge", inputs: { type: "type", label: "label", customColor: "customColor", customBackgroundColor: "customBackgroundColor", tooltip: "tooltip" }, ngImport: i0, template: "<div\r\n  class=\"badge\"\r\n  [class]=\"getStatusColor()\"\r\n  [ngStyle]=\"{ 'background-color': customBackgroundColor, color: customColor }\"\r\n  [pTooltip]=\"tooltip || ''\"\r\n  tooltipPosition=\"top\"\r\n>\r\n  {{ label }}\r\n</div>\r\n", styles: [".badge{padding:4px 12px;border-radius:8px;color:#fff}.badge-success{background-color:var(--success-color)}.badge-error{background-color:var(--error-color)}.badge-warning{background-color:var(--warning-color)}.badge-info{background-color:var(--theme-light)}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: BadgeComponent, selector: "vector-badge", inputs: { type: "type", label: "label", customColor: "customColor", customBackgroundColor: "customBackgroundColor", tooltip: "tooltip" }, ngImport: i0, template: "<div\n  class=\"badge\"\n  [class]=\"getStatusColor()\"\n  [ngStyle]=\"{ 'background-color': customBackgroundColor, color: customColor }\"\n  [pTooltip]=\"tooltip || ''\"\n  tooltipPosition=\"top\"\n>\n  {{ label }}\n</div>\n", styles: [".badge{padding:4px 12px;border-radius:8px;color:#fff}.badge-success{background-color:var(--success-color)}.badge-error{background-color:var(--error-color)}.badge-warning{background-color:var(--warning-color)}.badge-info{background-color:var(--theme-light)}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BadgeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-badge', template: "<div\r\n  class=\"badge\"\r\n  [class]=\"getStatusColor()\"\r\n  [ngStyle]=\"{ 'background-color': customBackgroundColor, color: customColor }\"\r\n  [pTooltip]=\"tooltip || ''\"\r\n  tooltipPosition=\"top\"\r\n>\r\n  {{ label }}\r\n</div>\r\n", styles: [".badge{padding:4px 12px;border-radius:8px;color:#fff}.badge-success{background-color:var(--success-color)}.badge-error{background-color:var(--error-color)}.badge-warning{background-color:var(--warning-color)}.badge-info{background-color:var(--theme-light)}\n"] }]
+            args: [{ selector: 'vector-badge', template: "<div\n  class=\"badge\"\n  [class]=\"getStatusColor()\"\n  [ngStyle]=\"{ 'background-color': customBackgroundColor, color: customColor }\"\n  [pTooltip]=\"tooltip || ''\"\n  tooltipPosition=\"top\"\n>\n  {{ label }}\n</div>\n", styles: [".badge{padding:4px 12px;border-radius:8px;color:#fff}.badge-success{background-color:var(--success-color)}.badge-error{background-color:var(--error-color)}.badge-warning{background-color:var(--warning-color)}.badge-info{background-color:var(--theme-light)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { type: [{
                 type: Input
             }], label: [{
@@ -633,10 +635,10 @@ class CurrencyBrlPipe {
             value = 0;
         return `${value.toLocaleString('pt-BR', { currency: 'BRL', minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CurrencyBrlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: CurrencyBrlPipe, name: "currencyBrl" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CurrencyBrlPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: CurrencyBrlPipe, name: "currencyBrl" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CurrencyBrlPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CurrencyBrlPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'currencyBrl',
@@ -1195,10 +1197,10 @@ class FormatDocumentPipe {
     transform(value = '') {
         return MaskUtil.formatDocument(value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FormatDocumentPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: FormatDocumentPipe, name: "formatDocument" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FormatDocumentPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: FormatDocumentPipe, name: "formatDocument" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FormatDocumentPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FormatDocumentPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'formatDocument',
@@ -1213,10 +1215,10 @@ class MaskPipe {
         }
         return MaskUtil.doMaskString(value, mask);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MaskPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: MaskPipe, name: "mask" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaskPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: MaskPipe, name: "mask" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MaskPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MaskPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'mask',
@@ -1227,10 +1229,10 @@ class NotHiddenPipe {
     transform(value) {
         return value?.filter((item) => !item.hidden) || [];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: NotHiddenPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: NotHiddenPipe, name: "notHidden" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NotHiddenPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: NotHiddenPipe, name: "notHidden" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: NotHiddenPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NotHiddenPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'notHidden',
@@ -1241,10 +1243,10 @@ class OnlyActivePipe {
     transform(value) {
         return value?.filter((item) => item.active) || [];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: OnlyActivePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: OnlyActivePipe, name: "onlyActive" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OnlyActivePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: OnlyActivePipe, name: "onlyActive" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: OnlyActivePipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OnlyActivePipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'onlyActive',
@@ -1257,10 +1259,10 @@ class RemoveLastChildPipe {
         newArray.pop();
         return newArray;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: RemoveLastChildPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: RemoveLastChildPipe, name: "removeLastChild" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RemoveLastChildPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: RemoveLastChildPipe, name: "removeLastChild" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: RemoveLastChildPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RemoveLastChildPipe, decorators: [{
             type: Pipe,
             args: [{
                     name: 'removeLastChild',
@@ -1272,17 +1274,17 @@ class UnreadNotificationsPipe {
     transform(notifications) {
         return notifications?.filter((item) => !item.wasRead) ?? [];
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: UnreadNotificationsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: UnreadNotificationsPipe, name: "unreadNotifications" }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UnreadNotificationsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: UnreadNotificationsPipe, name: "unreadNotifications" }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: UnreadNotificationsPipe, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UnreadNotificationsPipe, decorators: [{
             type: Pipe,
             args: [{ name: 'unreadNotifications' }]
         }], ctorParameters: () => [] });
 
 class PipesModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: PipesModule, declarations: [RemoveLastChildPipe,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PipesModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: PipesModule, declarations: [RemoveLastChildPipe,
             CurrencyBrlPipe,
             NotHiddenPipe,
             OnlyActivePipe,
@@ -1295,9 +1297,9 @@ class PipesModule {
             FormatDocumentPipe,
             MaskPipe,
             UnreadNotificationsPipe] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PipesModule }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PipesModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PipesModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PipesModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -1322,11 +1324,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
         }] });
 
 class SharedModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: SharedModule, imports: [TranslateModule], exports: [CommonModule, TooltipModule, PipesModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SharedModule, imports: [TranslateModule, CommonModule, TooltipModule, PipesModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SharedModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: SharedModule, imports: [TranslateModule], exports: [CommonModule, TooltipModule, PipesModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SharedModule, imports: [TranslateModule, CommonModule, TooltipModule, PipesModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SharedModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SharedModule, decorators: [{
             type: NgModule,
             args: [{
                     exports: [CommonModule, TooltipModule, PipesModule],
@@ -1335,11 +1337,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
         }] });
 
 class BadgeModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: BadgeModule, declarations: [BadgeComponent], imports: [SharedModule, TooltipModule], exports: [BadgeComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BadgeModule, imports: [SharedModule, TooltipModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: BadgeModule, declarations: [BadgeComponent], imports: [SharedModule, TooltipModule], exports: [BadgeComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeModule, imports: [SharedModule, TooltipModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BadgeModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BadgeModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [BadgeComponent],
@@ -1397,12 +1399,12 @@ class BreadcrumbComponent {
         }
         return foundItem;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i1$1.Router }, { token: ENVIRONMENT }, { token: MENU_OPTIONS }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: BreadcrumbComponent, selector: "vector-breadcrumb", ngImport: i0, template: "<div class=\"breadcrumb-container\" *ngIf=\"routeFragments?.length\">\r\n  <div class=\"route-path\">\r\n    <span class=\"app-name\">{{ appName }}</span>\r\n    <div *ngIf=\"routeFragments.length < 2\" class=\"chevron\"></div>\r\n    <span\r\n      class=\"route-fragment\"\r\n      [ngClass]=\"{ clickable: fragment.route }\"\r\n      *ngFor=\"let fragment of routeFragments | removeLastChild\"\r\n      (click)=\"navigateToFragment(fragment)\"\r\n      ><div class=\"chevron\"></div>\r\n      {{ fragment.label }}</span\r\n    >\r\n  </div>\r\n  <span class=\"last-route\">\r\n    {{ routeFragments[routeFragments.length - 1].label }}\r\n  </span>\r\n</div>\r\n", styles: [".breadcrumb-container{display:flex;flex-direction:column;margin-bottom:15px}.breadcrumb-container .route-path{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;color:var(--gray-dark)}.breadcrumb-container .app-name,.breadcrumb-container .last-route,.breadcrumb-container .route-path .route-fragment{font-weight:700;letter-spacing:.75px;display:flex;flex-direction:row;align-items:center;margin:2.5px}.breadcrumb-container .clickable{cursor:pointer}.breadcrumb-container .chevron{margin:0 5px;background-image:url(../../../../assets/icons/chevron_down_icon.svg);background-repeat:no-repeat;background-position:center;transform:rotate(-90deg);width:20px;height:20px;filter:invert(53%) sepia(13%) saturate(450%) hue-rotate(156deg) brightness(89%) contrast(85%)}.breadcrumb-container .last-route{font-size:1.5em;color:var(--success-color)}\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: "pipe", type: RemoveLastChildPipe, name: "removeLastChild" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i1$1.Router }, { token: ENVIRONMENT }, { token: MENU_OPTIONS }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: BreadcrumbComponent, selector: "vector-breadcrumb", ngImport: i0, template: "<div class=\"breadcrumb-container\" *ngIf=\"routeFragments?.length\">\n  <div class=\"route-path\">\n    <span class=\"app-name\">{{ appName }}</span>\n    <div *ngIf=\"routeFragments.length < 2\" class=\"chevron\"></div>\n    <span\n      class=\"route-fragment\"\n      [ngClass]=\"{ clickable: fragment.route }\"\n      *ngFor=\"let fragment of routeFragments | removeLastChild\"\n      (click)=\"navigateToFragment(fragment)\"\n      ><div class=\"chevron\"></div>\n      {{ fragment.label }}</span\n    >\n  </div>\n  <span class=\"last-route\">\n    {{ routeFragments[routeFragments.length - 1].label }}\n  </span>\n</div>\n", styles: [".breadcrumb-container{display:flex;flex-direction:column;margin-bottom:15px}.breadcrumb-container .route-path{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;color:var(--gray-dark)}.breadcrumb-container .app-name,.breadcrumb-container .last-route,.breadcrumb-container .route-path .route-fragment{font-weight:700;letter-spacing:.75px;display:flex;flex-direction:row;align-items:center;margin:2.5px}.breadcrumb-container .clickable{cursor:pointer}.breadcrumb-container .chevron{margin:0 5px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"7.4\" viewBox=\"0 0 12 7.4\">%0A  <path id=\"Caminho_1437\" data-name=\"Caminho 1437\" d=\"M1526.175,366.14l4.6,4.6,4.6-4.6,1.4,1.4-6,6-6-6Z\" transform=\"translate(-1524.775 -366.14)\" fill=\"%23333\"/>%0A</svg>%0A');background-repeat:no-repeat;background-position:center;transform:rotate(-90deg);width:20px;height:20px;filter:invert(53%) sepia(13%) saturate(450%) hue-rotate(156deg) brightness(89%) contrast(85%)}.breadcrumb-container .last-route{font-size:1.5em;color:var(--success-color)}\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: "pipe", type: RemoveLastChildPipe, name: "removeLastChild" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BreadcrumbComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BreadcrumbComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-breadcrumb', template: "<div class=\"breadcrumb-container\" *ngIf=\"routeFragments?.length\">\r\n  <div class=\"route-path\">\r\n    <span class=\"app-name\">{{ appName }}</span>\r\n    <div *ngIf=\"routeFragments.length < 2\" class=\"chevron\"></div>\r\n    <span\r\n      class=\"route-fragment\"\r\n      [ngClass]=\"{ clickable: fragment.route }\"\r\n      *ngFor=\"let fragment of routeFragments | removeLastChild\"\r\n      (click)=\"navigateToFragment(fragment)\"\r\n      ><div class=\"chevron\"></div>\r\n      {{ fragment.label }}</span\r\n    >\r\n  </div>\r\n  <span class=\"last-route\">\r\n    {{ routeFragments[routeFragments.length - 1].label }}\r\n  </span>\r\n</div>\r\n", styles: [".breadcrumb-container{display:flex;flex-direction:column;margin-bottom:15px}.breadcrumb-container .route-path{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;color:var(--gray-dark)}.breadcrumb-container .app-name,.breadcrumb-container .last-route,.breadcrumb-container .route-path .route-fragment{font-weight:700;letter-spacing:.75px;display:flex;flex-direction:row;align-items:center;margin:2.5px}.breadcrumb-container .clickable{cursor:pointer}.breadcrumb-container .chevron{margin:0 5px;background-image:url(../../../../assets/icons/chevron_down_icon.svg);background-repeat:no-repeat;background-position:center;transform:rotate(-90deg);width:20px;height:20px;filter:invert(53%) sepia(13%) saturate(450%) hue-rotate(156deg) brightness(89%) contrast(85%)}.breadcrumb-container .last-route{font-size:1.5em;color:var(--success-color)}\n"] }]
+            args: [{ selector: 'vector-breadcrumb', template: "<div class=\"breadcrumb-container\" *ngIf=\"routeFragments?.length\">\n  <div class=\"route-path\">\n    <span class=\"app-name\">{{ appName }}</span>\n    <div *ngIf=\"routeFragments.length < 2\" class=\"chevron\"></div>\n    <span\n      class=\"route-fragment\"\n      [ngClass]=\"{ clickable: fragment.route }\"\n      *ngFor=\"let fragment of routeFragments | removeLastChild\"\n      (click)=\"navigateToFragment(fragment)\"\n      ><div class=\"chevron\"></div>\n      {{ fragment.label }}</span\n    >\n  </div>\n  <span class=\"last-route\">\n    {{ routeFragments[routeFragments.length - 1].label }}\n  </span>\n</div>\n", styles: [".breadcrumb-container{display:flex;flex-direction:column;margin-bottom:15px}.breadcrumb-container .route-path{display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;color:var(--gray-dark)}.breadcrumb-container .app-name,.breadcrumb-container .last-route,.breadcrumb-container .route-path .route-fragment{font-weight:700;letter-spacing:.75px;display:flex;flex-direction:row;align-items:center;margin:2.5px}.breadcrumb-container .clickable{cursor:pointer}.breadcrumb-container .chevron{margin:0 5px;background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"7.4\" viewBox=\"0 0 12 7.4\">%0A  <path id=\"Caminho_1437\" data-name=\"Caminho 1437\" d=\"M1526.175,366.14l4.6,4.6,4.6-4.6,1.4,1.4-6,6-6-6Z\" transform=\"translate(-1524.775 -366.14)\" fill=\"%23333\"/>%0A</svg>%0A');background-repeat:no-repeat;background-position:center;transform:rotate(-90deg);width:20px;height:20px;filter:invert(53%) sepia(13%) saturate(450%) hue-rotate(156deg) brightness(89%) contrast(85%)}.breadcrumb-container .last-route{font-size:1.5em;color:var(--success-color)}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.Router }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [ENVIRONMENT]
@@ -1412,11 +1414,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
                 }] }] });
 
 class BreadcrumbModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BreadcrumbModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: BreadcrumbModule, declarations: [BreadcrumbComponent], imports: [SharedModule], exports: [BreadcrumbComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BreadcrumbModule, imports: [SharedModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BreadcrumbModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: BreadcrumbModule, declarations: [BreadcrumbComponent], imports: [SharedModule], exports: [BreadcrumbComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BreadcrumbModule, imports: [SharedModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: BreadcrumbModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BreadcrumbModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [BreadcrumbComponent],
@@ -1456,10 +1458,10 @@ class CrudBaseComponent {
                 return CrudMode.NEW;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudBaseComponent, deps: [{ token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: CrudBaseComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudBaseComponent, deps: [{ token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CrudBaseComponent, selector: "ng-component", ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudBaseComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudBaseComponent, decorators: [{
             type: Component,
             args: [{
                     template: '',
@@ -1476,17 +1478,18 @@ class ButtonComponent {
         this.noShadow = false;
         this.round = false;
         this.style = {};
+        this.loading = false;
         this.onClick = new EventEmitter();
     }
     get styleClass() {
         return `button shadow-3 ${this.type} ${this.noShadow && 'no-shadow'}`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: ButtonComponent, selector: "vector-button", inputs: { disabled: "disabled", label: "label", type: "type", leftIcon: "leftIcon", rightIcon: "rightIcon", noShadow: "noShadow", round: "round", style: "style" }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<p-button\r\n  [styleClass]=\"styleClass\"\r\n  [label]=\"label\"\r\n  [disabled]=\"disabled\"\r\n  [icon]=\"leftIcon || rightIcon\"\r\n  [iconPos]=\"rightIcon ? 'right' : 'left'\"\r\n  [style]=\"style\"\r\n  (onClick)=\"onClick.emit($event)\"\r\n  [ngClass]=\"{ round: round }\"\r\n></p-button>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "size", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ButtonComponent, selector: "vector-button", inputs: { disabled: "disabled", label: "label", type: "type", leftIcon: "leftIcon", rightIcon: "rightIcon", noShadow: "noShadow", round: "round", style: "style", loading: "loading" }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<p-button\n  [styleClass]=\"styleClass\"\n  [label]=\"label\"\n  [disabled]=\"disabled\"\n  [icon]=\"leftIcon || rightIcon\"\n  [iconPos]=\"rightIcon ? 'right' : 'left'\"\n  [style]=\"style\"\n  (onClick)=\"onClick.emit($event)\"\n  [ngClass]=\"{ round: round }\"\n  [loading]=\"loading\"\n></p-button>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ButtonComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-button', template: "<p-button\r\n  [styleClass]=\"styleClass\"\r\n  [label]=\"label\"\r\n  [disabled]=\"disabled\"\r\n  [icon]=\"leftIcon || rightIcon\"\r\n  [iconPos]=\"rightIcon ? 'right' : 'left'\"\r\n  [style]=\"style\"\r\n  (onClick)=\"onClick.emit($event)\"\r\n  [ngClass]=\"{ round: round }\"\r\n></p-button>\r\n" }]
+            args: [{ selector: 'vector-button', template: "<p-button\n  [styleClass]=\"styleClass\"\n  [label]=\"label\"\n  [disabled]=\"disabled\"\n  [icon]=\"leftIcon || rightIcon\"\n  [iconPos]=\"rightIcon ? 'right' : 'left'\"\n  [style]=\"style\"\n  (onClick)=\"onClick.emit($event)\"\n  [ngClass]=\"{ round: round }\"\n  [loading]=\"loading\"\n></p-button>\n" }]
         }], propDecorators: { disabled: [{
                 type: Input
             }], label: [{
@@ -1503,6 +1506,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
                 type: Input
             }], style: [{
                 type: Input
+            }], loading: [{
+                type: Input
             }], onClick: [{
                 type: Output
             }] } });
@@ -1516,12 +1521,12 @@ class CrudFooterComponent {
         this.onSubmit = new EventEmitter();
     }
     ngOnInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: CrudFooterComponent, selector: "vector-crud-footer", inputs: { submitDisabled: "submitDisabled", submitHidden: "submitHidden", goBackHidden: "goBackHidden", labelGoBack: "labelGoBack", typeGoBack: "typeGoBack", labelGoSubmit: "labelGoSubmit", typeGoSubmit: "typeGoSubmit" }, outputs: { onGoBack: "onGoBack", onSubmit: "onSubmit" }, ngImport: i0, template: "<div class=\"footer-container shadow-3\">\r\n  <div class=\"button\" *ngIf=\"!goBackHidden\">\r\n    <vector-button\r\n      [label]=\"labelGoBack ? labelGoBack : ('enums.Options.GO_BACK' | translate)\"\r\n      [type]=\"typeGoBack ? typeGoBack : 'default'\"\r\n      (onClick)=\"onGoBack.emit()\"\r\n    >\r\n    </vector-button>\r\n  </div>\r\n\r\n  <div class=\"button\" *ngIf=\"!submitHidden\">\r\n    <vector-button\r\n      [label]=\"labelGoSubmit ? labelGoSubmit : ('enums.Options.SAVE' | translate)\"\r\n      [type]=\"typeGoSubmit ? typeGoSubmit : 'success'\"\r\n      (onClick)=\"onSubmit.emit()\"\r\n      [disabled]=\"submitDisabled\"\r\n    ></vector-button>\r\n  </div>\r\n</div>\r\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style"], outputs: ["onClick"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudFooterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CrudFooterComponent, selector: "vector-crud-footer", inputs: { submitDisabled: "submitDisabled", submitHidden: "submitHidden", goBackHidden: "goBackHidden", labelGoBack: "labelGoBack", typeGoBack: "typeGoBack", labelGoSubmit: "labelGoSubmit", typeGoSubmit: "typeGoSubmit" }, outputs: { onGoBack: "onGoBack", onSubmit: "onSubmit" }, ngImport: i0, template: "<div class=\"footer-container shadow-3\">\n  <div class=\"button\" *ngIf=\"!goBackHidden\">\n    <vector-button\n      [label]=\"labelGoBack ? labelGoBack : ('enums.Options.GO_BACK' | translate)\"\n      [type]=\"typeGoBack ? typeGoBack : 'default'\"\n      (onClick)=\"onGoBack.emit()\"\n    >\n    </vector-button>\n  </div>\n\n  <div class=\"button\" *ngIf=\"!submitHidden\">\n    <vector-button\n      [label]=\"labelGoSubmit ? labelGoSubmit : ('enums.Options.SAVE' | translate)\"\n      [type]=\"typeGoSubmit ? typeGoSubmit : 'success'\"\n      (onClick)=\"onSubmit.emit()\"\n      [disabled]=\"submitDisabled\"\n    ></vector-button>\n  </div>\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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style", "loading"], outputs: ["onClick"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudFooterComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudFooterComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-crud-footer', template: "<div class=\"footer-container shadow-3\">\r\n  <div class=\"button\" *ngIf=\"!goBackHidden\">\r\n    <vector-button\r\n      [label]=\"labelGoBack ? labelGoBack : ('enums.Options.GO_BACK' | translate)\"\r\n      [type]=\"typeGoBack ? typeGoBack : 'default'\"\r\n      (onClick)=\"onGoBack.emit()\"\r\n    >\r\n    </vector-button>\r\n  </div>\r\n\r\n  <div class=\"button\" *ngIf=\"!submitHidden\">\r\n    <vector-button\r\n      [label]=\"labelGoSubmit ? labelGoSubmit : ('enums.Options.SAVE' | translate)\"\r\n      [type]=\"typeGoSubmit ? typeGoSubmit : 'success'\"\r\n      (onClick)=\"onSubmit.emit()\"\r\n      [disabled]=\"submitDisabled\"\r\n    ></vector-button>\r\n  </div>\r\n</div>\r\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"] }]
+            args: [{ selector: 'vector-crud-footer', template: "<div class=\"footer-container shadow-3\">\n  <div class=\"button\" *ngIf=\"!goBackHidden\">\n    <vector-button\n      [label]=\"labelGoBack ? labelGoBack : ('enums.Options.GO_BACK' | translate)\"\n      [type]=\"typeGoBack ? typeGoBack : 'default'\"\n      (onClick)=\"onGoBack.emit()\"\n    >\n    </vector-button>\n  </div>\n\n  <div class=\"button\" *ngIf=\"!submitHidden\">\n    <vector-button\n      [label]=\"labelGoSubmit ? labelGoSubmit : ('enums.Options.SAVE' | translate)\"\n      [type]=\"typeGoSubmit ? typeGoSubmit : 'success'\"\n      (onClick)=\"onSubmit.emit()\"\n      [disabled]=\"submitDisabled\"\n    ></vector-button>\n  </div>\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"] }]
         }], ctorParameters: () => [], propDecorators: { submitDisabled: [{
                 type: Input
             }], submitHidden: [{
@@ -1545,20 +1550,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
 class PanelComponent {
     constructor() { }
     ngOnInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: PanelComponent, selector: "vector-panel", ngImport: i0, template: "<p-panel [showHeader]=\"false\">\r\n  <ng-template pTemplate=\"content\">\r\n    <div class=\"shadow-3\"><ng-content></ng-content></div></ng-template\r\n></p-panel>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$3.Panel, selector: "p-panel", inputs: ["toggleable", "header", "collapsed", "style", "styleClass", "iconPos", "expandIcon", "collapseIcon", "showHeader", "toggler", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PanelComponent, selector: "vector-panel", ngImport: i0, template: "<p-panel [showHeader]=\"false\">\n  <ng-template pTemplate=\"content\">\n    <div class=\"shadow-3\"><ng-content></ng-content></div></ng-template\n></p-panel>\n", styles: [""], dependencies: [{ kind: "component", type: i1$3.Panel, selector: "p-panel", inputs: ["toggleable", "header", "collapsed", "style", "styleClass", "iconPos", "expandIcon", "collapseIcon", "showHeader", "toggler", "transitionOptions"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-panel', template: "<p-panel [showHeader]=\"false\">\r\n  <ng-template pTemplate=\"content\">\r\n    <div class=\"shadow-3\"><ng-content></ng-content></div></ng-template\r\n></p-panel>\r\n" }]
+            args: [{ selector: 'vector-panel', template: "<p-panel [showHeader]=\"false\">\n  <ng-template pTemplate=\"content\">\n    <div class=\"shadow-3\"><ng-content></ng-content></div></ng-template\n></p-panel>\n" }]
         }], ctorParameters: () => [] });
 
 class PanelModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: PanelModule, declarations: [PanelComponent], imports: [SharedModule, PanelModule$1], exports: [PanelComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PanelModule, imports: [SharedModule, PanelModule$1] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: PanelModule, declarations: [PanelComponent], imports: [SharedModule, PanelModule$1], exports: [PanelComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PanelModule, imports: [SharedModule, PanelModule$1] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PanelModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PanelModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [PanelComponent],
@@ -1572,22 +1577,22 @@ class ScoreComponent {
         this.score = 0;
     }
     ngOnInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ScoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: ScoreComponent, selector: "vector-score", inputs: { score: "score" }, ngImport: i0, template: "<div class=\"container\">\r\n  <span class=\"score\">{{ score }}</span>\r\n  <em class=\"fas fa-star star\"></em>\r\n</div>\r\n", styles: [".container{display:flex;align-items:center;gap:5px}.container .star{color:var(--theme-primary)}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ScoreComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ScoreComponent, selector: "vector-score", inputs: { score: "score" }, ngImport: i0, template: "<div class=\"container\">\n  <span class=\"score\">{{ score }}</span>\n  <em class=\"fas fa-star star\"></em>\n</div>\n", styles: [".container{display:flex;align-items:center;gap:5px}.container .star{color:var(--theme-primary)}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ScoreComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ScoreComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-score', template: "<div class=\"container\">\r\n  <span class=\"score\">{{ score }}</span>\r\n  <em class=\"fas fa-star star\"></em>\r\n</div>\r\n", styles: [".container{display:flex;align-items:center;gap:5px}.container .star{color:var(--theme-primary)}\n"] }]
+            args: [{ selector: 'vector-score', template: "<div class=\"container\">\n  <span class=\"score\">{{ score }}</span>\n  <em class=\"fas fa-star star\"></em>\n</div>\n", styles: [".container{display:flex;align-items:center;gap:5px}.container .star{color:var(--theme-primary)}\n"] }]
         }], ctorParameters: () => [], propDecorators: { score: [{
                 type: Input
             }] } });
 
 class ScoreModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ScoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: ScoreModule, declarations: [ScoreComponent], exports: [ScoreComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ScoreModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ScoreModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: ScoreModule, declarations: [ScoreComponent], exports: [ScoreComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ScoreModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ScoreModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ScoreModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [ScoreComponent],
@@ -1653,10 +1658,10 @@ class AuthService {
             window.parent.postMessage({ logout: true }, this.parentWindowUrl);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AuthService, deps: [{ token: ENVIRONMENT }, { token: i1$4.HttpClient }, { token: StorageService }, { token: ProfileService }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AuthService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuthService, deps: [{ token: ENVIRONMENT }, { token: i1$4.HttpClient }, { token: StorageService }, { token: ProfileService }, { token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuthService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: AuthService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuthService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -1708,10 +1713,10 @@ class EnumService {
             };
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: EnumService, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: EnumService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EnumService, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EnumService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: EnumService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EnumService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: i1$2.TranslateService }] });
@@ -1721,10 +1726,10 @@ class ErrorMessageService {
         this.hasToken$ = new Subject();
         this.genericModalErrorMessage$ = new Subject();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ErrorMessageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ErrorMessageService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ErrorMessageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ErrorMessageService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ErrorMessageService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ErrorMessageService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -1741,10 +1746,10 @@ class GeolocationService {
     createUserLoginInfo(userInfo) {
         return this.http.post(`Telemetry/CreateUserLogInfo`, userInfo);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GeolocationService, deps: [{ token: i1$4.HttpClient }, { token: i1$4.HttpBackend }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GeolocationService }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GeolocationService, deps: [{ token: i1$4.HttpClient }, { token: i1$4.HttpBackend }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GeolocationService }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GeolocationService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GeolocationService, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: i1$4.HttpClient }, { type: i1$4.HttpBackend }] });
 
@@ -1752,10 +1757,10 @@ class LoadingService {
     constructor() {
         this.loading$ = new Subject();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: LoadingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: LoadingService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LoadingService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LoadingService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: LoadingService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LoadingService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -1854,10 +1859,10 @@ class StorageService {
     removeProfile() {
         sessionStorage.removeItem('profile');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: StorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: StorageService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: StorageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: StorageService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: StorageService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: StorageService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -1959,10 +1964,10 @@ class ProfileService {
     getUserInfo() {
         return this.http.get(`connect/userinfo`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ProfileService, deps: [{ token: i1$4.HttpClient }, { token: StorageService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ProfileService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ProfileService, deps: [{ token: i1$4.HttpClient }, { token: StorageService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ProfileService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ProfileService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ProfileService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: i1$4.HttpClient }, { type: StorageService }] });
@@ -2095,10 +2100,10 @@ class MenuService {
             window.location.href = url;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MenuService, deps: [{ token: ENVIRONMENT }, { token: MENU_OPTIONS }, { token: APP_NAME }, { token: ProfileService }, { token: StorageService }, { token: i1$1.Router }, { token: AuthService }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MenuService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MenuService, deps: [{ token: ENVIRONMENT }, { token: MENU_OPTIONS }, { token: APP_NAME }, { token: ProfileService }, { token: StorageService }, { token: i1$1.Router }, { token: AuthService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MenuService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MenuService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MenuService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
@@ -2116,10 +2121,10 @@ class ModalService {
     constructor() {
         this.showModalBackground$ = new Subject();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ModalService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ModalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ModalService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: ModalService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ModalService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }] });
@@ -2134,10 +2139,10 @@ class NotificationsService {
         of(NOTIFICATIONS_MOCK).subscribe((notifications) => this.notifications$.next(notifications));
         // return this.http.get(`${this.baseUrl}`);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: NotificationsService, deps: [{ token: i1$4.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: NotificationsService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NotificationsService, deps: [{ token: i1$4.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NotificationsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: NotificationsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: NotificationsService, decorators: [{
             type: Injectable,
             args: [{ providedIn: 'root' }]
         }], ctorParameters: () => [{ type: i1$4.HttpClient }] });
@@ -2202,12 +2207,12 @@ class FieldErrorMessageComponent {
         }
         return '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FieldErrorMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: { control: "control" }, ngImport: i0, template: "<span class=\"input-error\">{{ fieldErrorLabel() }}</span>\r\n", styles: [".input-error{font-size:.7em;color:var(--error-color);position:absolute;left:0;width:100%}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FieldErrorMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: { control: "control" }, ngImport: i0, template: "<span class=\"input-error\">{{ fieldErrorLabel() }}</span>\n", styles: [".input-error{font-size:.7em;color:var(--error-color);position:absolute;left:0;width:100%}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FieldErrorMessageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FieldErrorMessageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-field-error-message', template: "<span class=\"input-error\">{{ fieldErrorLabel() }}</span>\r\n", styles: [".input-error{font-size:.7em;color:var(--error-color);position:absolute;left:0;width:100%}\n"] }]
+            args: [{ selector: 'vector-field-error-message', template: "<span class=\"input-error\">{{ fieldErrorLabel() }}</span>\n", styles: [".input-error{font-size:.7em;color:var(--error-color);position:absolute;left:0;width:100%}\n"] }]
         }], ctorParameters: () => [], propDecorators: { control: [{
                 type: Input
             }] } });
@@ -2253,12 +2258,12 @@ class CalendarComponent {
     onHideCalendar() {
         this.modalService.showModalBackground$.next(false);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CalendarComponent, deps: [{ token: ModalService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: CalendarComponent, selector: "vector-calendar-field", inputs: { isRequired: "isRequired", control: "control", label: "label", showCalendarOnFocus: "showCalendarOnFocus", min: "min", max: "max", disabledDates: "disabledDates", disabled: "disabled", defaultDate: "defaultDate", hiddenErrorMessage: "hiddenErrorMessage", showTime: "showTime", showSeconds: "showSeconds", stepMinute: "stepMinute" }, ngImport: i0, template: "<div class=\"relative\">\r\n  <div class=\"input-container\">\r\n    <p-calendar\r\n      appendTo=\"body\"\r\n      icon=\"fas fa-calendar-day\"\r\n      (onClose)=\"onHideCalendar()\"\r\n      (onShow)=\"onShowCalendar()\"\r\n      [defaultDate]=\"defaultDate\"\r\n      [disabled]=\"disabled\"\r\n      [disabledDates]=\"disabledDates\"\r\n      [formControl]=\"control\"\r\n      [maxDate]=\"max\"\r\n      [minDate]=\"min\"\r\n      [readonlyInput]=\"false\"\r\n      [showIcon]=\"true\"\r\n      [showOnFocus]=\"showCalendarOnFocus\"\r\n      [showSeconds]=\"showSeconds\"\r\n      [showTime]=\"showTime\"\r\n      [stepMinute]=\"stepMinute\"\r\n    ></p-calendar>\r\n  </div>\r\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\r\n</div>\r\n", styles: [".input-container{display:block}.input-container input{transition:border-width ease-in-out .08s;border:1px solid rgba(0,0,0,.6);width:100%;padding:6px 30px 6px 12px;font-size:14px;line-height:1.5em;border-radius:var(--border-radius);height:40px}.input-container input:disabled{cursor:not-allowed;background-color:var(--disabled-background);opacity:1}.input-container input:focus{outline:0;box-shadow:none;border-width:2px}.input-container input::placeholder{color:var(--placeholder-color);font-size:12px}.input-container input.ng-touched.ng-invalid{border-color:var(--error-color)!important}.input-container .input-error{font-size:.7em;color:var(--error-color)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: ["control"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CalendarComponent, deps: [{ token: ModalService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CalendarComponent, selector: "vector-calendar-field", inputs: { isRequired: "isRequired", control: "control", label: "label", showCalendarOnFocus: "showCalendarOnFocus", min: "min", max: "max", disabledDates: "disabledDates", disabled: "disabled", defaultDate: "defaultDate", hiddenErrorMessage: "hiddenErrorMessage", showTime: "showTime", showSeconds: "showSeconds", stepMinute: "stepMinute" }, ngImport: i0, template: "<div class=\"relative\">\n  <div class=\"input-container\">\n    <p-calendar\n      appendTo=\"body\"\n      icon=\"fas fa-calendar-day\"\n      (onClose)=\"onHideCalendar()\"\n      (onShow)=\"onShowCalendar()\"\n      [defaultDate]=\"defaultDate\"\n      [disabled]=\"disabled\"\n      [disabledDates]=\"disabledDates\"\n      [formControl]=\"control\"\n      [maxDate]=\"max\"\n      [minDate]=\"min\"\n      [readonlyInput]=\"false\"\n      [showIcon]=\"true\"\n      [showOnFocus]=\"showCalendarOnFocus\"\n      [showSeconds]=\"showSeconds\"\n      [showTime]=\"showTime\"\n      [stepMinute]=\"stepMinute\"\n    ></p-calendar>\n  </div>\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\n</div>\n", styles: [".input-container{display:block}.input-container input{transition:border-width ease-in-out .08s;border:1px solid rgba(0,0,0,.6);width:100%;padding:6px 30px 6px 12px;font-size:14px;line-height:1.5em;border-radius:var(--border-radius);height:40px}.input-container input:disabled{cursor:not-allowed;background-color:var(--disabled-background);opacity:1}.input-container input:focus{outline:0;box-shadow:none;border-width:2px}.input-container input::placeholder{color:var(--placeholder-color);font-size:12px}.input-container input.ng-touched.ng-invalid{border-color:var(--error-color)!important}.input-container .input-error{font-size:.7em;color:var(--error-color)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i4.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepYearPicker", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "component", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: ["control"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CalendarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CalendarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-calendar-field', template: "<div class=\"relative\">\r\n  <div class=\"input-container\">\r\n    <p-calendar\r\n      appendTo=\"body\"\r\n      icon=\"fas fa-calendar-day\"\r\n      (onClose)=\"onHideCalendar()\"\r\n      (onShow)=\"onShowCalendar()\"\r\n      [defaultDate]=\"defaultDate\"\r\n      [disabled]=\"disabled\"\r\n      [disabledDates]=\"disabledDates\"\r\n      [formControl]=\"control\"\r\n      [maxDate]=\"max\"\r\n      [minDate]=\"min\"\r\n      [readonlyInput]=\"false\"\r\n      [showIcon]=\"true\"\r\n      [showOnFocus]=\"showCalendarOnFocus\"\r\n      [showSeconds]=\"showSeconds\"\r\n      [showTime]=\"showTime\"\r\n      [stepMinute]=\"stepMinute\"\r\n    ></p-calendar>\r\n  </div>\r\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\r\n</div>\r\n", styles: [".input-container{display:block}.input-container input{transition:border-width ease-in-out .08s;border:1px solid rgba(0,0,0,.6);width:100%;padding:6px 30px 6px 12px;font-size:14px;line-height:1.5em;border-radius:var(--border-radius);height:40px}.input-container input:disabled{cursor:not-allowed;background-color:var(--disabled-background);opacity:1}.input-container input:focus{outline:0;box-shadow:none;border-width:2px}.input-container input::placeholder{color:var(--placeholder-color);font-size:12px}.input-container input.ng-touched.ng-invalid{border-color:var(--error-color)!important}.input-container .input-error{font-size:.7em;color:var(--error-color)}\n"] }]
+            args: [{ selector: 'vector-calendar-field', template: "<div class=\"relative\">\n  <div class=\"input-container\">\n    <p-calendar\n      appendTo=\"body\"\n      icon=\"fas fa-calendar-day\"\n      (onClose)=\"onHideCalendar()\"\n      (onShow)=\"onShowCalendar()\"\n      [defaultDate]=\"defaultDate\"\n      [disabled]=\"disabled\"\n      [disabledDates]=\"disabledDates\"\n      [formControl]=\"control\"\n      [maxDate]=\"max\"\n      [minDate]=\"min\"\n      [readonlyInput]=\"false\"\n      [showIcon]=\"true\"\n      [showOnFocus]=\"showCalendarOnFocus\"\n      [showSeconds]=\"showSeconds\"\n      [showTime]=\"showTime\"\n      [stepMinute]=\"stepMinute\"\n    ></p-calendar>\n  </div>\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\n</div>\n", styles: [".input-container{display:block}.input-container input{transition:border-width ease-in-out .08s;border:1px solid rgba(0,0,0,.6);width:100%;padding:6px 30px 6px 12px;font-size:14px;line-height:1.5em;border-radius:var(--border-radius);height:40px}.input-container input:disabled{cursor:not-allowed;background-color:var(--disabled-background);opacity:1}.input-container input:focus{outline:0;box-shadow:none;border-width:2px}.input-container input::placeholder{color:var(--placeholder-color);font-size:12px}.input-container input.ng-touched.ng-invalid{border-color:var(--error-color)!important}.input-container .input-error{font-size:.7em;color:var(--error-color)}\n"] }]
         }], ctorParameters: () => [{ type: ModalService }], propDecorators: { isRequired: [{
                 type: Input
             }], control: [{
@@ -2300,12 +2305,12 @@ class CheckboxFieldComponent {
         this.valueChange = new EventEmitter();
     }
     ngOnInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CheckboxFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: CheckboxFieldComponent, selector: "vector-checkbox-field", inputs: { isRequired: "isRequired", control: "control", label: "label", rounded: "rounded", labelSize: "labelSize", value: "value", groupName: "groupName", options: "options", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"checkbox-container flex-wrap\">\r\n  <ng-container *ngIf=\"control && groupName; else elseBlock\">\r\n    <div class=\"checkbox-item mb-3 mr-3\" *ngFor=\"let option of options\">\r\n      <p-checkbox\r\n        [name]=\"groupName\"\r\n        [formControl]=\"control\"\r\n        [value]=\"option\"\r\n        checkboxIcon=\"fas fa-check\"\r\n        [class.rounded-checkbox]=\"rounded\"\r\n        [inputId]=\"option.code\"\r\n      ></p-checkbox>\r\n      <label [for]=\"option.code\"> {{ option.name }}</label>\r\n    </div>\r\n  </ng-container>\r\n\r\n  <ng-template #elseBlock>\r\n    <p-checkbox\r\n      *ngIf=\"control && !groupName\"\r\n      [formControl]=\"control\"\r\n      checkboxIcon=\"fas fa-check\"\r\n      [binary]=\"true\"\r\n      [class.rounded-checkbox]=\"rounded\"\r\n      [disabled]=\"disabled\"\r\n    ></p-checkbox>\r\n    <p-checkbox\r\n      *ngIf=\"!control && !groupName\"\r\n      [ngModel]=\"value\"\r\n      (ngModelChange)=\"value = $event; valueChange.emit($event)\"\r\n      checkboxIcon=\"fas fa-check\"\r\n      [binary]=\"true\"\r\n      [class.rounded-checkbox]=\"rounded\"\r\n      [disabled]=\"disabled\"\r\n    ></p-checkbox>\r\n    <label *ngIf=\"label\" [class.large-label]=\"labelSize === 'large'\" (click)=\"control.setValue(!control.value)\"\r\n      >{{ label }}\r\n      <span class=\"red-label\" *ngIf=\"isRequired\"> (*)</span>\r\n    </label>\r\n  </ng-template>\r\n</div>\r\n", styles: [".checkbox-container{display:flex;align-items:center}.checkbox-container label{margin-left:10px}.checkbox-container .large-label{font-size:1em}.checkbox-container .checkbox-item{min-width:80px}\n"], dependencies: [{ 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$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$1.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "trueValue", "falseValue"], outputs: ["onChange", "onFocus", "onBlur"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CheckboxFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CheckboxFieldComponent, selector: "vector-checkbox-field", inputs: { isRequired: "isRequired", control: "control", label: "label", rounded: "rounded", labelSize: "labelSize", value: "value", groupName: "groupName", options: "options", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"checkbox-container flex-wrap\">\n  <ng-container *ngIf=\"control && groupName; else elseBlock\">\n    <div class=\"checkbox-item mb-3 mr-3\" *ngFor=\"let option of options\">\n      <p-checkbox\n        [name]=\"groupName\"\n        [formControl]=\"control\"\n        [value]=\"option\"\n        checkboxIcon=\"fas fa-check\"\n        [class.rounded-checkbox]=\"rounded\"\n        [inputId]=\"option.code\"\n      ></p-checkbox>\n      <label [for]=\"option.code\"> {{ option.name }}</label>\n    </div>\n  </ng-container>\n\n  <ng-template #elseBlock>\n    <p-checkbox\n      *ngIf=\"control && !groupName\"\n      [formControl]=\"control\"\n      checkboxIcon=\"fas fa-check\"\n      [binary]=\"true\"\n      [class.rounded-checkbox]=\"rounded\"\n      [disabled]=\"disabled\"\n    ></p-checkbox>\n    <p-checkbox\n      *ngIf=\"!control && !groupName\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"value = $event; valueChange.emit($event)\"\n      checkboxIcon=\"fas fa-check\"\n      [binary]=\"true\"\n      [class.rounded-checkbox]=\"rounded\"\n      [disabled]=\"disabled\"\n    ></p-checkbox>\n    <label *ngIf=\"label\" [class.large-label]=\"labelSize === 'large'\" (click)=\"control.setValue(!control.value)\"\n      >{{ label }}\n      <span class=\"red-label\" *ngIf=\"isRequired\"> (*)</span>\n    </label>\n  </ng-template>\n</div>\n", styles: [".checkbox-container{display:flex;align-items:center}.checkbox-container label{margin-left:10px}.checkbox-container .large-label{font-size:1em}.checkbox-container .checkbox-item{min-width:80px}\n"], dependencies: [{ 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$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$1.Checkbox, selector: "p-checkbox", inputs: ["value", "name", "disabled", "binary", "label", "ariaLabelledBy", "ariaLabel", "tabindex", "inputId", "style", "styleClass", "labelStyleClass", "formControl", "checkboxIcon", "readonly", "required", "autofocus", "trueValue", "falseValue", "variant"], outputs: ["onChange", "onFocus", "onBlur"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CheckboxFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CheckboxFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-checkbox-field', template: "<div class=\"checkbox-container flex-wrap\">\r\n  <ng-container *ngIf=\"control && groupName; else elseBlock\">\r\n    <div class=\"checkbox-item mb-3 mr-3\" *ngFor=\"let option of options\">\r\n      <p-checkbox\r\n        [name]=\"groupName\"\r\n        [formControl]=\"control\"\r\n        [value]=\"option\"\r\n        checkboxIcon=\"fas fa-check\"\r\n        [class.rounded-checkbox]=\"rounded\"\r\n        [inputId]=\"option.code\"\r\n      ></p-checkbox>\r\n      <label [for]=\"option.code\"> {{ option.name }}</label>\r\n    </div>\r\n  </ng-container>\r\n\r\n  <ng-template #elseBlock>\r\n    <p-checkbox\r\n      *ngIf=\"control && !groupName\"\r\n      [formControl]=\"control\"\r\n      checkboxIcon=\"fas fa-check\"\r\n      [binary]=\"true\"\r\n      [class.rounded-checkbox]=\"rounded\"\r\n      [disabled]=\"disabled\"\r\n    ></p-checkbox>\r\n    <p-checkbox\r\n      *ngIf=\"!control && !groupName\"\r\n      [ngModel]=\"value\"\r\n      (ngModelChange)=\"value = $event; valueChange.emit($event)\"\r\n      checkboxIcon=\"fas fa-check\"\r\n      [binary]=\"true\"\r\n      [class.rounded-checkbox]=\"rounded\"\r\n      [disabled]=\"disabled\"\r\n    ></p-checkbox>\r\n    <label *ngIf=\"label\" [class.large-label]=\"labelSize === 'large'\" (click)=\"control.setValue(!control.value)\"\r\n      >{{ label }}\r\n      <span class=\"red-label\" *ngIf=\"isRequired\"> (*)</span>\r\n    </label>\r\n  </ng-template>\r\n</div>\r\n", styles: [".checkbox-container{display:flex;align-items:center}.checkbox-container label{margin-left:10px}.checkbox-container .large-label{font-size:1em}.checkbox-container .checkbox-item{min-width:80px}\n"] }]
+            args: [{ selector: 'vector-checkbox-field', template: "<div class=\"checkbox-container flex-wrap\">\n  <ng-container *ngIf=\"control && groupName; else elseBlock\">\n    <div class=\"checkbox-item mb-3 mr-3\" *ngFor=\"let option of options\">\n      <p-checkbox\n        [name]=\"groupName\"\n        [formControl]=\"control\"\n        [value]=\"option\"\n        checkboxIcon=\"fas fa-check\"\n        [class.rounded-checkbox]=\"rounded\"\n        [inputId]=\"option.code\"\n      ></p-checkbox>\n      <label [for]=\"option.code\"> {{ option.name }}</label>\n    </div>\n  </ng-container>\n\n  <ng-template #elseBlock>\n    <p-checkbox\n      *ngIf=\"control && !groupName\"\n      [formControl]=\"control\"\n      checkboxIcon=\"fas fa-check\"\n      [binary]=\"true\"\n      [class.rounded-checkbox]=\"rounded\"\n      [disabled]=\"disabled\"\n    ></p-checkbox>\n    <p-checkbox\n      *ngIf=\"!control && !groupName\"\n      [ngModel]=\"value\"\n      (ngModelChange)=\"value = $event; valueChange.emit($event)\"\n      checkboxIcon=\"fas fa-check\"\n      [binary]=\"true\"\n      [class.rounded-checkbox]=\"rounded\"\n      [disabled]=\"disabled\"\n    ></p-checkbox>\n    <label *ngIf=\"label\" [class.large-label]=\"labelSize === 'large'\" (click)=\"control.setValue(!control.value)\"\n      >{{ label }}\n      <span class=\"red-label\" *ngIf=\"isRequired\"> (*)</span>\n    </label>\n  </ng-template>\n</div>\n", styles: [".checkbox-container{display:flex;align-items:center}.checkbox-container label{margin-left:10px}.checkbox-container .large-label{font-size:1em}.checkbox-container .checkbox-item{min-width:80px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { isRequired: [{
                 type: Input
             }], control: [{
@@ -2394,12 +2399,12 @@ class CurrencyFieldComponent {
     clearValue() {
         this.control.setValue(0);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CurrencyFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: CurrencyFieldComponent, selector: "vector-currency-field", inputs: { minValue: "minValue", maxValue: "maxValue", placeholder: "placeholder", numberOfDecimals: "numberOfDecimals", control: "control", outlined: "outlined", rounded: "rounded", label: "label", isBankingField: "isBankingField", inputClassName: "inputClassName", localePrefix: "localePrefix", currencyPrefix: "currencyPrefix", disabled: "disabled", centered: "centered", inputId: "inputId" }, outputs: { onBlur: "onBlur" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: InputNumber, descendants: true }], ngImport: i0, template: "<div [ngClass]=\"{ 'input-container': outlined, 'value-input-container': !outlined, rounded: rounded }\">\r\n  <div class=\"inner-container\">\r\n    <label *ngIf=\"label\">{{ label }}</label>\r\n    <div class=\"input\">\r\n      <span *ngIf=\"!outlined\">{{ currencyPrefix }} </span>\r\n      <div class=\"value-input\">\r\n        <p-inputNumber\r\n          class=\"currency-input\"\r\n          [ngClass]=\"getInputNgClass()\"\r\n          [styleClass]=\"centered ? 'text-centered' : ''\"\r\n          [formControl]=\"control\"\r\n          mode=\"decimal\"\r\n          [minFractionDigits]=\"2\"\r\n          [maxFractionDigits]=\"numberOfDecimals\"\r\n          [min]=\"minValue\"\r\n          [max]=\"maxValue\"\r\n          [prefix]=\"outlined ? currencyPrefix : ''\"\r\n          [disabled]=\"disabled\"\r\n          [locale]=\"localePrefix ? localePrefix : 'pt-BR'\"\r\n          (click)=\"isBankingField ? focusLastIndex($event) : null\"\r\n          (onKeyDown)=\"isBankingField ? inputNextChar($event) : null\"\r\n          (onBlur)=\"onBlur.emit($event)\"\r\n          [inputId]=\"inputId\"\r\n        ></p-inputNumber>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <span *ngIf=\"rounded\" class=\"clear-value\" (click)=\"clearValue()\"><i class=\"pi pi-times\"></i></span>\r\n</div>\r\n", styles: [".value-input-container{padding:5px 20px;display:flex;align-items:center;justify-content:space-between}.value-input-container:focus-within{border:2px solid var(--theme-dark)}.value-input-container:not(.rounded) span{font-size:2em}.value-input-container label{color:var(--gray-dark);font-size:13px}.value-input-container span{font-weight:700;color:var(--theme-dark)}.value-input-container .input{display:flex;align-items:center}.value-input-container .input .value-input{margin:0 4px;flex:1}.input-container{display:block}.rounded:not(.currency-input){padding:0 25px;background-color:#fff;border-radius:16px}.rounded span{font-size:1em}.rounded input{font-size:1rem}.rounded .clear-value{padding:5px 5px 0;border-radius:20px}.rounded .clear-value:hover{background-color:var(--gray-medium)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CurrencyFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CurrencyFieldComponent, selector: "vector-currency-field", inputs: { minValue: "minValue", maxValue: "maxValue", placeholder: "placeholder", numberOfDecimals: "numberOfDecimals", control: "control", outlined: "outlined", rounded: "rounded", label: "label", isBankingField: "isBankingField", inputClassName: "inputClassName", localePrefix: "localePrefix", currencyPrefix: "currencyPrefix", disabled: "disabled", centered: "centered", inputId: "inputId" }, outputs: { onBlur: "onBlur" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: InputNumber, descendants: true }], ngImport: i0, template: "<div [ngClass]=\"{ 'input-container': outlined, 'value-input-container': !outlined, rounded: rounded }\">\n  <div class=\"inner-container\">\n    <label *ngIf=\"label\">{{ label }}</label>\n    <div class=\"input\">\n      <span *ngIf=\"!outlined\">{{ currencyPrefix }} </span>\n      <div class=\"value-input\">\n        <p-inputNumber\n          class=\"currency-input\"\n          [ngClass]=\"getInputNgClass()\"\n          [styleClass]=\"centered ? 'text-centered' : ''\"\n          [formControl]=\"control\"\n          mode=\"decimal\"\n          [minFractionDigits]=\"2\"\n          [maxFractionDigits]=\"numberOfDecimals\"\n          [min]=\"minValue\"\n          [max]=\"maxValue\"\n          [prefix]=\"outlined ? currencyPrefix : ''\"\n          [disabled]=\"disabled\"\n          [locale]=\"localePrefix ? localePrefix : 'pt-BR'\"\n          (click)=\"isBankingField ? focusLastIndex($event) : null\"\n          (onKeyDown)=\"isBankingField ? inputNextChar($event) : null\"\n          (onBlur)=\"onBlur.emit($event)\"\n          [inputId]=\"inputId\"\n        ></p-inputNumber>\n      </div>\n    </div>\n  </div>\n  <span *ngIf=\"rounded\" class=\"clear-value\" (click)=\"clearValue()\"><i class=\"pi pi-times\"></i></span>\n</div>\n", styles: [".value-input-container{padding:5px 20px;display:flex;align-items:center;justify-content:space-between}.value-input-container:focus-within{border:2px solid var(--theme-dark)}.value-input-container:not(.rounded) span{font-size:2em}.value-input-container label{color:var(--gray-dark);font-size:13px}.value-input-container span{font-weight:700;color:var(--theme-dark)}.value-input-container .input{display:flex;align-items:center}.value-input-container .input .value-input{margin:0 4px;flex:1}.input-container{display:block}.rounded:not(.currency-input){padding:0 25px;background-color:#fff;border-radius:16px}.rounded span{font-size:1em}.rounded input{font-size:1rem}.rounded .clear-value{padding:5px 5px 0;border-radius:20px}.rounded .clear-value:hover{background-color:var(--gray-medium)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CurrencyFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CurrencyFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-currency-field', template: "<div [ngClass]=\"{ 'input-container': outlined, 'value-input-container': !outlined, rounded: rounded }\">\r\n  <div class=\"inner-container\">\r\n    <label *ngIf=\"label\">{{ label }}</label>\r\n    <div class=\"input\">\r\n      <span *ngIf=\"!outlined\">{{ currencyPrefix }} </span>\r\n      <div class=\"value-input\">\r\n        <p-inputNumber\r\n          class=\"currency-input\"\r\n          [ngClass]=\"getInputNgClass()\"\r\n          [styleClass]=\"centered ? 'text-centered' : ''\"\r\n          [formControl]=\"control\"\r\n          mode=\"decimal\"\r\n          [minFractionDigits]=\"2\"\r\n          [maxFractionDigits]=\"numberOfDecimals\"\r\n          [min]=\"minValue\"\r\n          [max]=\"maxValue\"\r\n          [prefix]=\"outlined ? currencyPrefix : ''\"\r\n          [disabled]=\"disabled\"\r\n          [locale]=\"localePrefix ? localePrefix : 'pt-BR'\"\r\n          (click)=\"isBankingField ? focusLastIndex($event) : null\"\r\n          (onKeyDown)=\"isBankingField ? inputNextChar($event) : null\"\r\n          (onBlur)=\"onBlur.emit($event)\"\r\n          [inputId]=\"inputId\"\r\n        ></p-inputNumber>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <span *ngIf=\"rounded\" class=\"clear-value\" (click)=\"clearValue()\"><i class=\"pi pi-times\"></i></span>\r\n</div>\r\n", styles: [".value-input-container{padding:5px 20px;display:flex;align-items:center;justify-content:space-between}.value-input-container:focus-within{border:2px solid var(--theme-dark)}.value-input-container:not(.rounded) span{font-size:2em}.value-input-container label{color:var(--gray-dark);font-size:13px}.value-input-container span{font-weight:700;color:var(--theme-dark)}.value-input-container .input{display:flex;align-items:center}.value-input-container .input .value-input{margin:0 4px;flex:1}.input-container{display:block}.rounded:not(.currency-input){padding:0 25px;background-color:#fff;border-radius:16px}.rounded span{font-size:1em}.rounded input{font-size:1rem}.rounded .clear-value{padding:5px 5px 0;border-radius:20px}.rounded .clear-value:hover{background-color:var(--gray-medium)}\n"] }]
+            args: [{ selector: 'vector-currency-field', template: "<div [ngClass]=\"{ 'input-container': outlined, 'value-input-container': !outlined, rounded: rounded }\">\n  <div class=\"inner-container\">\n    <label *ngIf=\"label\">{{ label }}</label>\n    <div class=\"input\">\n      <span *ngIf=\"!outlined\">{{ currencyPrefix }} </span>\n      <div class=\"value-input\">\n        <p-inputNumber\n          class=\"currency-input\"\n          [ngClass]=\"getInputNgClass()\"\n          [styleClass]=\"centered ? 'text-centered' : ''\"\n          [formControl]=\"control\"\n          mode=\"decimal\"\n          [minFractionDigits]=\"2\"\n          [maxFractionDigits]=\"numberOfDecimals\"\n          [min]=\"minValue\"\n          [max]=\"maxValue\"\n          [prefix]=\"outlined ? currencyPrefix : ''\"\n          [disabled]=\"disabled\"\n          [locale]=\"localePrefix ? localePrefix : 'pt-BR'\"\n          (click)=\"isBankingField ? focusLastIndex($event) : null\"\n          (onKeyDown)=\"isBankingField ? inputNextChar($event) : null\"\n          (onBlur)=\"onBlur.emit($event)\"\n          [inputId]=\"inputId\"\n        ></p-inputNumber>\n      </div>\n    </div>\n  </div>\n  <span *ngIf=\"rounded\" class=\"clear-value\" (click)=\"clearValue()\"><i class=\"pi pi-times\"></i></span>\n</div>\n", styles: [".value-input-container{padding:5px 20px;display:flex;align-items:center;justify-content:space-between}.value-input-container:focus-within{border:2px solid var(--theme-dark)}.value-input-container:not(.rounded) span{font-size:2em}.value-input-container label{color:var(--gray-dark);font-size:13px}.value-input-container span{font-weight:700;color:var(--theme-dark)}.value-input-container .input{display:flex;align-items:center}.value-input-container .input .value-input{margin:0 4px;flex:1}.input-container{display:block}.rounded:not(.currency-input){padding:0 25px;background-color:#fff;border-radius:16px}.rounded span{font-size:1em}.rounded input{font-size:1rem}.rounded .clear-value{padding:5px 5px 0;border-radius:20px}.rounded .clear-value:hover{background-color:var(--gray-medium)}\n"] }]
         }], propDecorators: { minValue: [{
                 type: Input
             }], maxValue: [{
@@ -2607,12 +2612,12 @@ class TextFieldComponent {
         }
         this.onDocumentTypeChange.emit(this.selectedDocumentType);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TextFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: TextFieldComponent, selector: "vector-text-field", inputs: { isRequired: "isRequired", label: "label", maxlength: "maxlength", isPassword: "isPassword", numeric: "numeric", numericPositive: "numericPositive", numericDotComma: "numericDotComma", decimal: "decimal", onlyText: "onlyText", alphaNumeric: "alphaNumeric", alphaNumericAndWhitespace: "alphaNumericAndWhitespace", mask: "mask", autoClear: "autoClear", readonly: "readonly", rightIcon: "rightIcon", centered: "centered", enableDocumentTypeChoice: "enableDocumentTypeChoice", hiddenErrorMessage: "hiddenErrorMessage", leftLabel: "leftLabel", control: "control", inputId: "inputId", slotChar: "slotChar" }, outputs: { blurEvent: "blurEvent", enterKeyPress: "enterKeyPress", backSpaceKeyPress: "backSpaceKeyPress", focusEvent: "focusEvent", onDocumentTypeChange: "onDocumentTypeChange" }, ngImport: i0, template: "<form class=\"input-container p-input-icon-right\">\r\n  <i *ngIf=\"rightIcon\" [class]=\"rightIcon\"></i>\r\n  <i *ngIf=\"isPassword\" class=\"show-password-icon {{ showPasswordIcon }}\" (click)=\"toggleShowPassword()\"></i>\r\n  <div class=\"p-inputgroup\" *ngIf=\"!inputId\">\r\n    <vector-button\r\n      *ngIf=\"enableDocumentTypeChoice\"\r\n      leftIcon=\"fas fa-exchange-alt\"\r\n      type=\"success\"\r\n      [label]=\"selectedDocumentType.name\"\r\n      [disabled]=\"control.disabled\"\r\n      [noShadow]=\"true\"\r\n      (onClick)=\"handleDocumentTypeChange()\"\r\n    ></vector-button>\r\n\r\n    <span *ngIf=\"leftLabel\" class=\"left-label\">\r\n      {{ leftLabel }}\r\n    </span>\r\n\r\n    <input\r\n      *ngIf=\"!mask\"\r\n      pInputText\r\n      type=\"text\"\r\n      [formControl]=\"control\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [placeholder]=\"placeholder\"\r\n      [pValidateOnly]=\"validateOnly\"\r\n      [pKeyFilter]=\"keyfilter\"\r\n      [ngClass]=\"{ 'password-field': isPassword && !isPasswordVisible, 'text-centered': centered }\"\r\n      (blur)=\"onBlur()\"\r\n      (keydown.enter)=\"onEnterPress()\"\r\n      (keydown.backspace)=\"onBackSpacePress()\"\r\n      (click)=\"onFocus($event)\"\r\n      [readonly]=\"readonly ? true : null\"\r\n    />\r\n    <p-inputMask\r\n      *ngIf=\"mask\"\r\n      type=\"text\"\r\n      [inputId]=\"inputId || 'mask-field'\"\r\n      [formControl]=\"control\"\r\n      [mask]=\"mask\"\r\n      [placeholder]=\"placeholder\"\r\n      (onBlur)=\"onBlur()\"\r\n      (keydown.enter)=\"onEnterPress()\"\r\n      (keydown.backspace)=\"onBackSpacePress()\"\r\n      [autoClear]=\"autoClear\"\r\n      [unmask]=\"true\"\r\n      [styleClass]=\"centered ? 'text-centered' : ''\"\r\n      [slotChar]=\"slotChar\"\r\n      (click)=\"onFocus($event)\"\r\n    ></p-inputMask>\r\n  </div>\r\n  <div class=\"p-inputgroup\" *ngIf=\"inputId\">\r\n    <vector-button\r\n      *ngIf=\"enableDocumentTypeChoice\"\r\n      leftIcon=\"fas fa-exchange-alt\"\r\n      type=\"success\"\r\n      [label]=\"selectedDocumentType.name\"\r\n      [disabled]=\"control.disabled\"\r\n      [noShadow]=\"true\"\r\n      (onClick)=\"handleDocumentTypeChange()\"\r\n    ></vector-button>\r\n\r\n    <span *ngIf=\"leftLabel\" class=\"left-label\">\r\n      {{ leftLabel }}\r\n    </span>\r\n\r\n    <input\r\n      *ngIf=\"!mask\"\r\n      [id]=\"inputId\"\r\n      pInputText\r\n      type=\"text\"\r\n      [formControl]=\"control\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [placeholder]=\"placeholder\"\r\n      [pValidateOnly]=\"validateOnly\"\r\n      [pKeyFilter]=\"keyfilter\"\r\n      [ngClass]=\"{ 'password-field': isPassword && !isPasswordVisible, 'text-centered': centered }\"\r\n      (blur)=\"onBlur()\"\r\n      (keydown.enter)=\"onEnterPress()\"\r\n      (keydown.backspace)=\"onBackSpacePress()\"\r\n      (click)=\"onFocus($event)\"\r\n      [readonly]=\"readonly ? true : null\"\r\n    />\r\n    <p-inputMask\r\n      *ngIf=\"mask\"\r\n      type=\"text\"\r\n      [inputId]=\"inputId || 'mask-field'\"\r\n      [formControl]=\"control\"\r\n      [mask]=\"mask\"\r\n      [placeholder]=\"placeholder\"\r\n      (onBlur)=\"onBlur()\"\r\n      (keydown.enter)=\"onEnterPress()\"\r\n      (keydown.backspace)=\"onBackSpacePress()\"\r\n      [autoClear]=\"autoClear\"\r\n      [unmask]=\"true\"\r\n      [styleClass]=\"centered ? 'text-centered' : ''\"\r\n      [slotChar]=\"slotChar\"\r\n      (click)=\"onFocus($event)\"\r\n    ></p-inputMask>\r\n  </div>\r\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\r\n</form>\r\n", styles: [".input-container{width:100%;display:block!important}.input-container .password-field{-webkit-text-security:disc}.input-container .input-error{font-size:.7em;color:var(--error-color);position:absolute;width:max-content}.input-container .show-password-icon{font-size:1.4em;margin-right:5px;cursor:pointer}.input-container .text-centered{text-align:center}.input-container .left-label{min-height:100%;display:flex;align-items:center;justify-content:center;padding:0 10px;white-space:nowrap;font-size:13px;background-color:var(--gray-light);color:var(--theme-primary)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$5.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: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.KeyFilter, selector: "[pKeyFilter]", inputs: ["pValidateOnly", "pKeyFilter"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]" }, { kind: "component", type: i5.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style"], outputs: ["onClick"] }, { kind: "component", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: ["control"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TextFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TextFieldComponent, selector: "vector-text-field", inputs: { isRequired: "isRequired", label: "label", maxlength: "maxlength", isPassword: "isPassword", numeric: "numeric", numericPositive: "numericPositive", numericDotComma: "numericDotComma", decimal: "decimal", onlyText: "onlyText", alphaNumeric: "alphaNumeric", alphaNumericAndWhitespace: "alphaNumericAndWhitespace", mask: "mask", autoClear: "autoClear", readonly: "readonly", rightIcon: "rightIcon", centered: "centered", enableDocumentTypeChoice: "enableDocumentTypeChoice", hiddenErrorMessage: "hiddenErrorMessage", leftLabel: "leftLabel", control: "control", inputId: "inputId", slotChar: "slotChar" }, outputs: { blurEvent: "blurEvent", enterKeyPress: "enterKeyPress", backSpaceKeyPress: "backSpaceKeyPress", focusEvent: "focusEvent", onDocumentTypeChange: "onDocumentTypeChange" }, ngImport: i0, template: "<form class=\"input-container p-input-icon-right\">\n  <i *ngIf=\"rightIcon\" [class]=\"rightIcon\"></i>\n  <i *ngIf=\"isPassword\" class=\"show-password-icon {{ showPasswordIcon }}\" (click)=\"toggleShowPassword()\"></i>\n  <div class=\"p-inputgroup\" *ngIf=\"!inputId\">\n    <vector-button\n      *ngIf=\"enableDocumentTypeChoice\"\n      leftIcon=\"fas fa-exchange-alt\"\n      type=\"success\"\n      [label]=\"selectedDocumentType.name\"\n      [disabled]=\"control.disabled\"\n      [noShadow]=\"true\"\n      (onClick)=\"handleDocumentTypeChange()\"\n    ></vector-button>\n\n    <span *ngIf=\"leftLabel\" class=\"left-label\">\n      {{ leftLabel }}\n    </span>\n\n    <input\n      *ngIf=\"!mask\"\n      pInputText\n      type=\"text\"\n      [formControl]=\"control\"\n      [attr.maxlength]=\"maxlength\"\n      [placeholder]=\"placeholder\"\n      [pValidateOnly]=\"validateOnly\"\n      [pKeyFilter]=\"keyfilter\"\n      [ngClass]=\"{ 'password-field': isPassword && !isPasswordVisible, 'text-centered': centered }\"\n      (blur)=\"onBlur()\"\n      (keydown.enter)=\"onEnterPress()\"\n      (keydown.backspace)=\"onBackSpacePress()\"\n      (click)=\"onFocus($event)\"\n      [readonly]=\"readonly ? true : null\"\n    />\n    <p-inputMask\n      *ngIf=\"mask\"\n      type=\"text\"\n      [inputId]=\"inputId || 'mask-field'\"\n      [formControl]=\"control\"\n      [mask]=\"mask\"\n      [placeholder]=\"placeholder\"\n      (onBlur)=\"onBlur()\"\n      (keydown.enter)=\"onEnterPress()\"\n      (keydown.backspace)=\"onBackSpacePress()\"\n      [autoClear]=\"autoClear\"\n      [unmask]=\"true\"\n      [styleClass]=\"centered ? 'text-centered' : ''\"\n      [slotChar]=\"slotChar\"\n      (click)=\"onFocus($event)\"\n    ></p-inputMask>\n  </div>\n  <div class=\"p-inputgroup\" *ngIf=\"inputId\">\n    <vector-button\n      *ngIf=\"enableDocumentTypeChoice\"\n      leftIcon=\"fas fa-exchange-alt\"\n      type=\"success\"\n      [label]=\"selectedDocumentType.name\"\n      [disabled]=\"control.disabled\"\n      [noShadow]=\"true\"\n      (onClick)=\"handleDocumentTypeChange()\"\n    ></vector-button>\n\n    <span *ngIf=\"leftLabel\" class=\"left-label\">\n      {{ leftLabel }}\n    </span>\n\n    <input\n      *ngIf=\"!mask\"\n      [id]=\"inputId\"\n      pInputText\n      type=\"text\"\n      [formControl]=\"control\"\n      [attr.maxlength]=\"maxlength\"\n      [placeholder]=\"placeholder\"\n      [pValidateOnly]=\"validateOnly\"\n      [pKeyFilter]=\"keyfilter\"\n      [ngClass]=\"{ 'password-field': isPassword && !isPasswordVisible, 'text-centered': centered }\"\n      (blur)=\"onBlur()\"\n      (keydown.enter)=\"onEnterPress()\"\n      (keydown.backspace)=\"onBackSpacePress()\"\n      (click)=\"onFocus($event)\"\n      [readonly]=\"readonly ? true : null\"\n    />\n    <p-inputMask\n      *ngIf=\"mask\"\n      type=\"text\"\n      [inputId]=\"inputId || 'mask-field'\"\n      [formControl]=\"control\"\n      [mask]=\"mask\"\n      [placeholder]=\"placeholder\"\n      (onBlur)=\"onBlur()\"\n      (keydown.enter)=\"onEnterPress()\"\n      (keydown.backspace)=\"onBackSpacePress()\"\n      [autoClear]=\"autoClear\"\n      [unmask]=\"true\"\n      [styleClass]=\"centered ? 'text-centered' : ''\"\n      [slotChar]=\"slotChar\"\n      (click)=\"onFocus($event)\"\n    ></p-inputMask>\n  </div>\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\n</form>\n", styles: [".input-container{width:100%;display:block!important}.input-container .password-field{-webkit-text-security:disc}.input-container .input-error{font-size:.7em;color:var(--error-color);position:absolute;width:max-content}.input-container .show-password-icon{font-size:1.4em;margin-right:5px;cursor:pointer}.input-container .text-centered{text-align:center}.input-container .left-label{min-height:100%;display:flex;align-items:center;justify-content:center;padding:0 10px;white-space:nowrap;font-size:13px;background-color:var(--gray-light);color:var(--theme-primary)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$5.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: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.KeyFilter, selector: "[pKeyFilter]", inputs: ["pValidateOnly", "pKeyFilter"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "component", type: i5.InputMask, selector: "p-inputMask", inputs: ["type", "slotChar", "autoClear", "showClear", "style", "inputId", "styleClass", "placeholder", "size", "maxlength", "tabindex", "title", "variant", "ariaLabel", "ariaLabelledBy", "ariaRequired", "disabled", "readonly", "unmask", "name", "required", "characterPattern", "autofocus", "autoFocus", "autocomplete", "keepBuffer", "mask"], outputs: ["onComplete", "onFocus", "onBlur", "onInput", "onKeydown", "onClear"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style", "loading"], outputs: ["onClick"] }, { kind: "component", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: ["control"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TextFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TextFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-text-field', template: "<form class=\"input-container p-input-icon-right\">\r\n  <i *ngIf=\"rightIcon\" [class]=\"rightIcon\"></i>\r\n  <i *ngIf=\"isPassword\" class=\"show-password-icon {{ showPasswordIcon }}\" (click)=\"toggleShowPassword()\"></i>\r\n  <div class=\"p-inputgroup\" *ngIf=\"!inputId\">\r\n    <vector-button\r\n      *ngIf=\"enableDocumentTypeChoice\"\r\n      leftIcon=\"fas fa-exchange-alt\"\r\n      type=\"success\"\r\n      [label]=\"selectedDocumentType.name\"\r\n      [disabled]=\"control.disabled\"\r\n      [noShadow]=\"true\"\r\n      (onClick)=\"handleDocumentTypeChange()\"\r\n    ></vector-button>\r\n\r\n    <span *ngIf=\"leftLabel\" class=\"left-label\">\r\n      {{ leftLabel }}\r\n    </span>\r\n\r\n    <input\r\n      *ngIf=\"!mask\"\r\n      pInputText\r\n      type=\"text\"\r\n      [formControl]=\"control\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [placeholder]=\"placeholder\"\r\n      [pValidateOnly]=\"validateOnly\"\r\n      [pKeyFilter]=\"keyfilter\"\r\n      [ngClass]=\"{ 'password-field': isPassword && !isPasswordVisible, 'text-centered': centered }\"\r\n      (blur)=\"onBlur()\"\r\n      (keydown.enter)=\"onEnterPress()\"\r\n      (keydown.backspace)=\"onBackSpacePress()\"\r\n      (click)=\"onFocus($event)\"\r\n      [readonly]=\"readonly ? true : null\"\r\n    />\r\n    <p-inputMask\r\n      *ngIf=\"mask\"\r\n      type=\"text\"\r\n      [inputId]=\"inputId || 'mask-field'\"\r\n      [formControl]=\"control\"\r\n      [mask]=\"mask\"\r\n      [placeholder]=\"placeholder\"\r\n      (onBlur)=\"onBlur()\"\r\n      (keydown.enter)=\"onEnterPress()\"\r\n      (keydown.backspace)=\"onBackSpacePress()\"\r\n      [autoClear]=\"autoClear\"\r\n      [unmask]=\"true\"\r\n      [styleClass]=\"centered ? 'text-centered' : ''\"\r\n      [slotChar]=\"slotChar\"\r\n      (click)=\"onFocus($event)\"\r\n    ></p-inputMask>\r\n  </div>\r\n  <div class=\"p-inputgroup\" *ngIf=\"inputId\">\r\n    <vector-button\r\n      *ngIf=\"enableDocumentTypeChoice\"\r\n      leftIcon=\"fas fa-exchange-alt\"\r\n      type=\"success\"\r\n      [label]=\"selectedDocumentType.name\"\r\n      [disabled]=\"control.disabled\"\r\n      [noShadow]=\"true\"\r\n      (onClick)=\"handleDocumentTypeChange()\"\r\n    ></vector-button>\r\n\r\n    <span *ngIf=\"leftLabel\" class=\"left-label\">\r\n      {{ leftLabel }}\r\n    </span>\r\n\r\n    <input\r\n      *ngIf=\"!mask\"\r\n      [id]=\"inputId\"\r\n      pInputText\r\n      type=\"text\"\r\n      [formControl]=\"control\"\r\n      [attr.maxlength]=\"maxlength\"\r\n      [placeholder]=\"placeholder\"\r\n      [pValidateOnly]=\"validateOnly\"\r\n      [pKeyFilter]=\"keyfilter\"\r\n      [ngClass]=\"{ 'password-field': isPassword && !isPasswordVisible, 'text-centered': centered }\"\r\n      (blur)=\"onBlur()\"\r\n      (keydown.enter)=\"onEnterPress()\"\r\n      (keydown.backspace)=\"onBackSpacePress()\"\r\n      (click)=\"onFocus($event)\"\r\n      [readonly]=\"readonly ? true : null\"\r\n    />\r\n    <p-inputMask\r\n      *ngIf=\"mask\"\r\n      type=\"text\"\r\n      [inputId]=\"inputId || 'mask-field'\"\r\n      [formControl]=\"control\"\r\n      [mask]=\"mask\"\r\n      [placeholder]=\"placeholder\"\r\n      (onBlur)=\"onBlur()\"\r\n      (keydown.enter)=\"onEnterPress()\"\r\n      (keydown.backspace)=\"onBackSpacePress()\"\r\n      [autoClear]=\"autoClear\"\r\n      [unmask]=\"true\"\r\n      [styleClass]=\"centered ? 'text-centered' : ''\"\r\n      [slotChar]=\"slotChar\"\r\n      (click)=\"onFocus($event)\"\r\n    ></p-inputMask>\r\n  </div>\r\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\r\n</form>\r\n", styles: [".input-container{width:100%;display:block!important}.input-container .password-field{-webkit-text-security:disc}.input-container .input-error{font-size:.7em;color:var(--error-color);position:absolute;width:max-content}.input-container .show-password-icon{font-size:1.4em;margin-right:5px;cursor:pointer}.input-container .text-centered{text-align:center}.input-container .left-label{min-height:100%;display:flex;align-items:center;justify-content:center;padding:0 10px;white-space:nowrap;font-size:13px;background-color:var(--gray-light);color:var(--theme-primary)}\n"] }]
+            args: [{ selector: 'vector-text-field', template: "<form class=\"input-container p-input-icon-right\">\n  <i *ngIf=\"rightIcon\" [class]=\"rightIcon\"></i>\n  <i *ngIf=\"isPassword\" class=\"show-password-icon {{ showPasswordIcon }}\" (click)=\"toggleShowPassword()\"></i>\n  <div class=\"p-inputgroup\" *ngIf=\"!inputId\">\n    <vector-button\n      *ngIf=\"enableDocumentTypeChoice\"\n      leftIcon=\"fas fa-exchange-alt\"\n      type=\"success\"\n      [label]=\"selectedDocumentType.name\"\n      [disabled]=\"control.disabled\"\n      [noShadow]=\"true\"\n      (onClick)=\"handleDocumentTypeChange()\"\n    ></vector-button>\n\n    <span *ngIf=\"leftLabel\" class=\"left-label\">\n      {{ leftLabel }}\n    </span>\n\n    <input\n      *ngIf=\"!mask\"\n      pInputText\n      type=\"text\"\n      [formControl]=\"control\"\n      [attr.maxlength]=\"maxlength\"\n      [placeholder]=\"placeholder\"\n      [pValidateOnly]=\"validateOnly\"\n      [pKeyFilter]=\"keyfilter\"\n      [ngClass]=\"{ 'password-field': isPassword && !isPasswordVisible, 'text-centered': centered }\"\n      (blur)=\"onBlur()\"\n      (keydown.enter)=\"onEnterPress()\"\n      (keydown.backspace)=\"onBackSpacePress()\"\n      (click)=\"onFocus($event)\"\n      [readonly]=\"readonly ? true : null\"\n    />\n    <p-inputMask\n      *ngIf=\"mask\"\n      type=\"text\"\n      [inputId]=\"inputId || 'mask-field'\"\n      [formControl]=\"control\"\n      [mask]=\"mask\"\n      [placeholder]=\"placeholder\"\n      (onBlur)=\"onBlur()\"\n      (keydown.enter)=\"onEnterPress()\"\n      (keydown.backspace)=\"onBackSpacePress()\"\n      [autoClear]=\"autoClear\"\n      [unmask]=\"true\"\n      [styleClass]=\"centered ? 'text-centered' : ''\"\n      [slotChar]=\"slotChar\"\n      (click)=\"onFocus($event)\"\n    ></p-inputMask>\n  </div>\n  <div class=\"p-inputgroup\" *ngIf=\"inputId\">\n    <vector-button\n      *ngIf=\"enableDocumentTypeChoice\"\n      leftIcon=\"fas fa-exchange-alt\"\n      type=\"success\"\n      [label]=\"selectedDocumentType.name\"\n      [disabled]=\"control.disabled\"\n      [noShadow]=\"true\"\n      (onClick)=\"handleDocumentTypeChange()\"\n    ></vector-button>\n\n    <span *ngIf=\"leftLabel\" class=\"left-label\">\n      {{ leftLabel }}\n    </span>\n\n    <input\n      *ngIf=\"!mask\"\n      [id]=\"inputId\"\n      pInputText\n      type=\"text\"\n      [formControl]=\"control\"\n      [attr.maxlength]=\"maxlength\"\n      [placeholder]=\"placeholder\"\n      [pValidateOnly]=\"validateOnly\"\n      [pKeyFilter]=\"keyfilter\"\n      [ngClass]=\"{ 'password-field': isPassword && !isPasswordVisible, 'text-centered': centered }\"\n      (blur)=\"onBlur()\"\n      (keydown.enter)=\"onEnterPress()\"\n      (keydown.backspace)=\"onBackSpacePress()\"\n      (click)=\"onFocus($event)\"\n      [readonly]=\"readonly ? true : null\"\n    />\n    <p-inputMask\n      *ngIf=\"mask\"\n      type=\"text\"\n      [inputId]=\"inputId || 'mask-field'\"\n      [formControl]=\"control\"\n      [mask]=\"mask\"\n      [placeholder]=\"placeholder\"\n      (onBlur)=\"onBlur()\"\n      (keydown.enter)=\"onEnterPress()\"\n      (keydown.backspace)=\"onBackSpacePress()\"\n      [autoClear]=\"autoClear\"\n      [unmask]=\"true\"\n      [styleClass]=\"centered ? 'text-centered' : ''\"\n      [slotChar]=\"slotChar\"\n      (click)=\"onFocus($event)\"\n    ></p-inputMask>\n  </div>\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\n</form>\n", styles: [".input-container{width:100%;display:block!important}.input-container .password-field{-webkit-text-security:disc}.input-container .input-error{font-size:.7em;color:var(--error-color);position:absolute;width:max-content}.input-container .show-password-icon{font-size:1.4em;margin-right:5px;cursor:pointer}.input-container .text-centered{text-align:center}.input-container .left-label{min-height:100%;display:flex;align-items:center;justify-content:center;padding:0 10px;white-space:nowrap;font-size:13px;background-color:var(--gray-light);color:var(--theme-primary)}\n"] }]
         }], propDecorators: { isRequired: [{
                 type: Input
             }], label: [{
@@ -2674,6 +2679,36 @@ class MultiselectFieldComponent {
         this._pagedSugestion = _pagedSugestion;
         this.options = this.pagedSugestion || [];
     }
+    set showFlagsOptions(value) {
+        if (!this.showFlags) {
+            throw new Error('showFlags is set to false. Setting showFlagsOptions is not allowed.');
+        }
+        value.forEach((option) => {
+            if (option.type === 'img') {
+                if (!option.imgSource) {
+                    throw new Error("imgSource is required when type is 'img'");
+                }
+                if (!option.imgSize) {
+                    throw new Error("imgSize is required when type is 'img'");
+                }
+            }
+            else if (option.type === 'icon') {
+                if (!option.iconSource) {
+                    throw new Error("iconSource is required when type is 'icon'");
+                }
+                if (!option.iconSize) {
+                    throw new Error("iconSize is required when type is 'icon'");
+                }
+            }
+        });
+        this._showFlagsOptions = value;
+    }
+    get showFlagsOptions() {
+        if (!this._showFlagsOptions) {
+            throw new Error('showFlagsOptions was not set');
+        }
+        return this._showFlagsOptions;
+    }
     get placeholder() {
         if (!this.label) {
             return '';
@@ -2696,6 +2731,8 @@ class MultiselectFieldComponent {
         this.minLengthToService = 0;
         this.initialLoad = true;
         this.filterVirtualScrool = false;
+        this.showHeader = true;
+        this.showFlags = false;
         this.onChange = new EventEmitter();
         this.onClosePanel = new EventEmitter();
         this.currentSearchQuery = '';
@@ -2730,6 +2767,25 @@ class MultiselectFieldComponent {
             });
         }
     }
+    customFormattingMultiSelectFieldWithFlags() {
+        setTimeout(() => {
+            const vectorMultiselectField = document.querySelector('vector-multiselect-field.multiselect-flags');
+            if (vectorMultiselectField) {
+                const pOverlayElement = vectorMultiselectField.querySelector('p-overlay');
+                if (pOverlayElement) {
+                    const classList = Array.from(pOverlayElement.classList);
+                    const targetClass = classList.find((className) => className.startsWith('ng-tns-'));
+                    if (targetClass) {
+                        const classReferenceCode = targetClass.replace('ng-tns-', '');
+                        const targetDivWithRefCode = document.querySelector(`div.ng-tns-${classReferenceCode}`);
+                        if (targetDivWithRefCode) {
+                            targetDivWithRefCode.classList.add('multiselect-flags');
+                        }
+                    }
+                }
+            }
+        }, 200);
+    }
     onHideAutocompletePanel() {
         if (this.paged) {
             this.unlistenAutocompleteVirtualScroll();
@@ -2780,12 +2836,12 @@ class MultiselectFieldComponent {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MultiselectFieldComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: MultiselectFieldComponent, selector: "vector-multiselect-field", inputs: { pagedSugestion: "pagedSugestion", isRequired: "isRequired", control: "control", label: "label", options: "options", filter: "filter", showSelectAllOption: "showSelectAllOption", display: "display", paged: "paged", disabled: "disabled", minLengthToService: "minLengthToService", initialLoad: "initialLoad", service: "service", filterVirtualScrool: "filterVirtualScrool" }, outputs: { onChange: "onChange", onClosePanel: "onClosePanel" }, ngImport: i0, template: "<div class=\"multiselect-field-input-container\">\r\n  <p-multiSelect\r\n    *ngIf=\"!filterVirtualScrool\"\r\n    #multiselect\r\n    appendTo=\"body\"\r\n    optionLabel=\"name\"\r\n    optionValue=\"code\"\r\n    dropdownIcon=\"fas fa-sort-down\"\r\n    selectedItemsLabel=\"Selecionar todos\"\r\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n    [options]=\"options\"\r\n    [formControl]=\"control\"\r\n    [placeholder]=\"placeholder\"\r\n    [filter]=\"filter\"\r\n    [maxSelectedLabels]=\"options.length - 1\"\r\n    [showHeader]=\"true\"\r\n    [showToggleAll]=\"showSelectAllOption\"\r\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n    [display]=\"display\"\r\n    (onChange)=\"onChange.emit($event)\"\r\n    (onPanelHide)=\"onClosePanel.emit($event)\"\r\n    [disabled]=\"disabled\"\r\n  >\r\n  </p-multiSelect>\r\n  <p-multiSelect\r\n    *ngIf=\"filterVirtualScrool\"\r\n    #multiselect\r\n    appendTo=\"body\"\r\n    optionLabel=\"name\"\r\n    optionValue=\"code\"\r\n    dropdownIcon=\"fas fa-sort-down\"\r\n    selectedItemsLabel=\"Selecionar todos\"\r\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n    [options]=\"options\"\r\n    [formControl]=\"control\"\r\n    [placeholder]=\"placeholder\"\r\n    [filter]=\"filter\"\r\n    [maxSelectedLabels]=\"options.length - 1\"\r\n    [showHeader]=\"true\"\r\n    [showToggleAll]=\"showSelectAllOption\"\r\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n    [display]=\"display\"\r\n    (onChange)=\"onChange.emit($event)\"\r\n    (onFilter)=\"search($event)\"\r\n    (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n    (onPanelHide)=\"onHideAutocompletePanel()\"\r\n    [disabled]=\"disabled\"\r\n  >\r\n  </p-multiSelect>\r\n  <p-multiSelect\r\n    *ngIf=\"filterVirtualScrool\"\r\n    #multiselect\r\n    appendTo=\"body\"\r\n    optionLabel=\"name\"\r\n    optionValue=\"code\"\r\n    dropdownIcon=\"fas fa-sort-down\"\r\n    selectedItemsLabel=\"Selecionar todos\"\r\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n    [options]=\"options\"\r\n    [formControl]=\"control\"\r\n    [placeholder]=\"placeholder\"\r\n    [filter]=\"filter\"\r\n    [maxSelectedLabels]=\"options.length - 1\"\r\n    [showHeader]=\"true\"\r\n    [showToggleAll]=\"showSelectAllOption\"\r\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n    [display]=\"display\"\r\n    (onChange)=\"onChange.emit($event)\"\r\n    (onFilter)=\"search($event)\"\r\n    (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n    (onPanelHide)=\"onHideAutocompletePanel()\"\r\n    [disabled]=\"disabled\"\r\n  >\r\n  </p-multiSelect>\r\n  <span class=\"input-error\">{{ fieldErrorLabel() }}</span>\r\n</div>\r\n", styles: [".multiselect-field-input-container{height:62px}.multiselect-field-input-container .input-error{font-size:.7em;color:var(--error-color)}.multiselect-field-input-container div.p-multiselect-token{padding:auto 1em!important;background:#eff0f6!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3$3.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MultiselectFieldComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: MultiselectFieldComponent, selector: "vector-multiselect-field", inputs: { pagedSugestion: "pagedSugestion", isRequired: "isRequired", control: "control", label: "label", options: "options", filter: "filter", showSelectAllOption: "showSelectAllOption", display: "display", paged: "paged", disabled: "disabled", minLengthToService: "minLengthToService", initialLoad: "initialLoad", service: "service", filterVirtualScrool: "filterVirtualScrool", showHeader: "showHeader", showFlags: "showFlags", showFlagsOptions: "showFlagsOptions" }, outputs: { onChange: "onChange", onClosePanel: "onClosePanel" }, ngImport: i0, template: "<div class=\"multiselect-field-input-container\">\n  <p-multiSelect\n    *ngIf=\"!filterVirtualScrool\"\n    #multiselect\n    appendTo=\"body\"\n    optionLabel=\"name\"\n    optionValue=\"code\"\n    dropdownIcon=\"fas fa-sort-down\"\n    selectedItemsLabel=\"Selecionar todos\"\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\n    [options]=\"options\"\n    [formControl]=\"control\"\n    [placeholder]=\"placeholder\"\n    [filter]=\"filter\"\n    [maxSelectedLabels]=\"options.length - 1\"\n    [showToggleAll]=\"showSelectAllOption\"\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\n    [display]=\"display\"\n    (onChange)=\"onChange.emit($event)\"\n    (onPanelHide)=\"onClosePanel.emit($event)\"\n    (onPanelShow)=\"customFormattingMultiSelectFieldWithFlags()\"\n    [disabled]=\"disabled\"\n    [showHeader]=\"showHeader\"\n  >\n    <ng-container *ngIf=\"showFlags\">\n      <ng-template let-option pTemplate=\"item\">\n        <div class=\"grid-nogutter w-full flex\">\n          <div\n            class=\"md:col-6 sm:col-12 align-content-center\"\n            [ngClass]=\"option.align === 'center' ? 'md:text-center' : 'md:text-left'\"\n          >\n            <img\n              *ngIf=\"option.type == 'img'\"\n              [src]=\"option.imgSource\"\n              [ngClass]=\"option.imgClass\"\n              [style]=\"{ height: option.imgSize + 'px' }\"\n            />\n            <i\n              *ngIf=\"option.type == 'icon'\"\n              [className]=\"option.iconSource\"\n              [ngClass]=\"option.iconClass\"\n              [style]=\"{ 'font-size': option.iconSize }\"\n            ></i>\n          </div>\n\n          <div class=\"col-6 hidden md:block align-content-center\">\n            <span class=\"block\">{{ option.name }}</span>\n          </div>\n        </div>\n      </ng-template>\n    </ng-container>\n  </p-multiSelect>\n\n  <p-multiSelect\n    *ngIf=\"filterVirtualScrool\"\n    #multiselect\n    appendTo=\"body\"\n    optionLabel=\"name\"\n    optionValue=\"code\"\n    dropdownIcon=\"fas fa-sort-down\"\n    selectedItemsLabel=\"Selecionar todos\"\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\n    [options]=\"options\"\n    [formControl]=\"control\"\n    [placeholder]=\"placeholder\"\n    [filter]=\"filter\"\n    [maxSelectedLabels]=\"options.length - 1\"\n    [showHeader]=\"true\"\n    [showToggleAll]=\"showSelectAllOption\"\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\n    [display]=\"display\"\n    (onChange)=\"onChange.emit($event)\"\n    (onFilter)=\"search($event)\"\n    (onPanelShow)=\"onOpenAutocompletePanel()\"\n    (onPanelHide)=\"onHideAutocompletePanel()\"\n    [disabled]=\"disabled\"\n  >\n  </p-multiSelect>\n  <p-multiSelect\n    *ngIf=\"filterVirtualScrool\"\n    #multiselect\n    appendTo=\"body\"\n    optionLabel=\"name\"\n    optionValue=\"code\"\n    dropdownIcon=\"fas fa-sort-down\"\n    selectedItemsLabel=\"Selecionar todos\"\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\n    [options]=\"options\"\n    [formControl]=\"control\"\n    [placeholder]=\"placeholder\"\n    [filter]=\"filter\"\n    [maxSelectedLabels]=\"options.length - 1\"\n    [showHeader]=\"true\"\n    [showToggleAll]=\"showSelectAllOption\"\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\n    [display]=\"display\"\n    (onChange)=\"onChange.emit($event)\"\n    (onFilter)=\"search($event)\"\n    (onPanelShow)=\"onOpenAutocompletePanel()\"\n    (onPanelHide)=\"onHideAutocompletePanel()\"\n    [disabled]=\"disabled\"\n  >\n  </p-multiSelect>\n  <span class=\"input-error\">{{ fieldErrorLabel() }}</span>\n</div>\n", styles: [".multiselect-field-input-container{height:62px}.multiselect-field-input-container .input-error{font-size:.7em;color:var(--error-color)}.multiselect-field-input-container div.p-multiselect-token{padding:auto 1em!important;background:#eff0f6!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4$2.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MultiselectFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MultiselectFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-multiselect-field', template: "<div class=\"multiselect-field-input-container\">\r\n  <p-multiSelect\r\n    *ngIf=\"!filterVirtualScrool\"\r\n    #multiselect\r\n    appendTo=\"body\"\r\n    optionLabel=\"name\"\r\n    optionValue=\"code\"\r\n    dropdownIcon=\"fas fa-sort-down\"\r\n    selectedItemsLabel=\"Selecionar todos\"\r\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n    [options]=\"options\"\r\n    [formControl]=\"control\"\r\n    [placeholder]=\"placeholder\"\r\n    [filter]=\"filter\"\r\n    [maxSelectedLabels]=\"options.length - 1\"\r\n    [showHeader]=\"true\"\r\n    [showToggleAll]=\"showSelectAllOption\"\r\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n    [display]=\"display\"\r\n    (onChange)=\"onChange.emit($event)\"\r\n    (onPanelHide)=\"onClosePanel.emit($event)\"\r\n    [disabled]=\"disabled\"\r\n  >\r\n  </p-multiSelect>\r\n  <p-multiSelect\r\n    *ngIf=\"filterVirtualScrool\"\r\n    #multiselect\r\n    appendTo=\"body\"\r\n    optionLabel=\"name\"\r\n    optionValue=\"code\"\r\n    dropdownIcon=\"fas fa-sort-down\"\r\n    selectedItemsLabel=\"Selecionar todos\"\r\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n    [options]=\"options\"\r\n    [formControl]=\"control\"\r\n    [placeholder]=\"placeholder\"\r\n    [filter]=\"filter\"\r\n    [maxSelectedLabels]=\"options.length - 1\"\r\n    [showHeader]=\"true\"\r\n    [showToggleAll]=\"showSelectAllOption\"\r\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n    [display]=\"display\"\r\n    (onChange)=\"onChange.emit($event)\"\r\n    (onFilter)=\"search($event)\"\r\n    (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n    (onPanelHide)=\"onHideAutocompletePanel()\"\r\n    [disabled]=\"disabled\"\r\n  >\r\n  </p-multiSelect>\r\n  <p-multiSelect\r\n    *ngIf=\"filterVirtualScrool\"\r\n    #multiselect\r\n    appendTo=\"body\"\r\n    optionLabel=\"name\"\r\n    optionValue=\"code\"\r\n    dropdownIcon=\"fas fa-sort-down\"\r\n    selectedItemsLabel=\"Selecionar todos\"\r\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\r\n    [options]=\"options\"\r\n    [formControl]=\"control\"\r\n    [placeholder]=\"placeholder\"\r\n    [filter]=\"filter\"\r\n    [maxSelectedLabels]=\"options.length - 1\"\r\n    [showHeader]=\"true\"\r\n    [showToggleAll]=\"showSelectAllOption\"\r\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\r\n    [display]=\"display\"\r\n    (onChange)=\"onChange.emit($event)\"\r\n    (onFilter)=\"search($event)\"\r\n    (onPanelShow)=\"onOpenAutocompletePanel()\"\r\n    (onPanelHide)=\"onHideAutocompletePanel()\"\r\n    [disabled]=\"disabled\"\r\n  >\r\n  </p-multiSelect>\r\n  <span class=\"input-error\">{{ fieldErrorLabel() }}</span>\r\n</div>\r\n", styles: [".multiselect-field-input-container{height:62px}.multiselect-field-input-container .input-error{font-size:.7em;color:var(--error-color)}.multiselect-field-input-container div.p-multiselect-token{padding:auto 1em!important;background:#eff0f6!important}\n"] }]
+            args: [{ selector: 'vector-multiselect-field', template: "<div class=\"multiselect-field-input-container\">\n  <p-multiSelect\n    *ngIf=\"!filterVirtualScrool\"\n    #multiselect\n    appendTo=\"body\"\n    optionLabel=\"name\"\n    optionValue=\"code\"\n    dropdownIcon=\"fas fa-sort-down\"\n    selectedItemsLabel=\"Selecionar todos\"\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\n    [options]=\"options\"\n    [formControl]=\"control\"\n    [placeholder]=\"placeholder\"\n    [filter]=\"filter\"\n    [maxSelectedLabels]=\"options.length - 1\"\n    [showToggleAll]=\"showSelectAllOption\"\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\n    [display]=\"display\"\n    (onChange)=\"onChange.emit($event)\"\n    (onPanelHide)=\"onClosePanel.emit($event)\"\n    (onPanelShow)=\"customFormattingMultiSelectFieldWithFlags()\"\n    [disabled]=\"disabled\"\n    [showHeader]=\"showHeader\"\n  >\n    <ng-container *ngIf=\"showFlags\">\n      <ng-template let-option pTemplate=\"item\">\n        <div class=\"grid-nogutter w-full flex\">\n          <div\n            class=\"md:col-6 sm:col-12 align-content-center\"\n            [ngClass]=\"option.align === 'center' ? 'md:text-center' : 'md:text-left'\"\n          >\n            <img\n              *ngIf=\"option.type == 'img'\"\n              [src]=\"option.imgSource\"\n              [ngClass]=\"option.imgClass\"\n              [style]=\"{ height: option.imgSize + 'px' }\"\n            />\n            <i\n              *ngIf=\"option.type == 'icon'\"\n              [className]=\"option.iconSource\"\n              [ngClass]=\"option.iconClass\"\n              [style]=\"{ 'font-size': option.iconSize }\"\n            ></i>\n          </div>\n\n          <div class=\"col-6 hidden md:block align-content-center\">\n            <span class=\"block\">{{ option.name }}</span>\n          </div>\n        </div>\n      </ng-template>\n    </ng-container>\n  </p-multiSelect>\n\n  <p-multiSelect\n    *ngIf=\"filterVirtualScrool\"\n    #multiselect\n    appendTo=\"body\"\n    optionLabel=\"name\"\n    optionValue=\"code\"\n    dropdownIcon=\"fas fa-sort-down\"\n    selectedItemsLabel=\"Selecionar todos\"\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\n    [options]=\"options\"\n    [formControl]=\"control\"\n    [placeholder]=\"placeholder\"\n    [filter]=\"filter\"\n    [maxSelectedLabels]=\"options.length - 1\"\n    [showHeader]=\"true\"\n    [showToggleAll]=\"showSelectAllOption\"\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\n    [display]=\"display\"\n    (onChange)=\"onChange.emit($event)\"\n    (onFilter)=\"search($event)\"\n    (onPanelShow)=\"onOpenAutocompletePanel()\"\n    (onPanelHide)=\"onHideAutocompletePanel()\"\n    [disabled]=\"disabled\"\n  >\n  </p-multiSelect>\n  <p-multiSelect\n    *ngIf=\"filterVirtualScrool\"\n    #multiselect\n    appendTo=\"body\"\n    optionLabel=\"name\"\n    optionValue=\"code\"\n    dropdownIcon=\"fas fa-sort-down\"\n    selectedItemsLabel=\"Selecionar todos\"\n    [panelStyleClass]=\"filter ? 'has-filter' : ''\"\n    [options]=\"options\"\n    [formControl]=\"control\"\n    [placeholder]=\"placeholder\"\n    [filter]=\"filter\"\n    [maxSelectedLabels]=\"options.length - 1\"\n    [showHeader]=\"true\"\n    [showToggleAll]=\"showSelectAllOption\"\n    [dropdownIcon]=\"'pi pi-chevron-down'\"\n    [display]=\"display\"\n    (onChange)=\"onChange.emit($event)\"\n    (onFilter)=\"search($event)\"\n    (onPanelShow)=\"onOpenAutocompletePanel()\"\n    (onPanelHide)=\"onHideAutocompletePanel()\"\n    [disabled]=\"disabled\"\n  >\n  </p-multiSelect>\n  <span class=\"input-error\">{{ fieldErrorLabel() }}</span>\n</div>\n", styles: [".multiselect-field-input-container{height:62px}.multiselect-field-input-container .input-error{font-size:.7em;color:var(--error-color)}.multiselect-field-input-container div.p-multiselect-token{padding:auto 1em!important;background:#eff0f6!important}\n"] }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { pagedSugestion: [{
                 type: Input
             }], isRequired: [{
@@ -2814,6 +2870,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
                 type: Input
             }], filterVirtualScrool: [{
                 type: Input
+            }], showHeader: [{
+                type: Input
+            }], showFlags: [{
+                type: Input
+            }], showFlagsOptions: [{
+                type: Input
             }], onChange: [{
                 type: Output
             }], onClosePanel: [{
@@ -2988,12 +3050,12 @@ class DropdownFieldComponent {
     filterListByQuery(list = [], query) {
         return list.filter((opt) => String(opt.code).toUpperCase().includes(query) || opt.name.toUpperCase().includes(query));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: DropdownFieldComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: DropdownFieldComponent, selector: "vector-dropdown-field", inputs: { options: "options", isNgContent: "isNgContent", forceSelection: "forceSelection", isRequired: "isRequired", control: "control", label: "label", service: "service", paged: "paged", buttonAction: "buttonAction", dependencies: "dependencies", hiddenErrorMessage: "hiddenErrorMessage", dynamicFilters: "dynamicFilters", minLengthToService: "minLengthToService", initialLoad: "initialLoad", disabled: "disabled", limitScrollPage: "limitScrollPage", inputId: "inputId" }, outputs: { onFocus: "onFocus", onChange: "onChange" }, ngImport: i0, template: "<div class=\"relative\">\r\n  <div class=\"input-container\">\r\n    <div class=\"input-inner-container\" *ngIf=\"!isNgContent\">\r\n      <p-dropdown\r\n        *ngIf=\"dynamicFilters\"\r\n        appendTo=\"body\"\r\n        optionLabel=\"name\"\r\n        optionValue=\"code\"\r\n        [(ngModel)]=\"selectedDynamicFilter\"\r\n        [options]=\"dynamicFilters\"\r\n        [disabled]=\"disabled\"\r\n        [inputId]=\"inputId\"\r\n      >\r\n      </p-dropdown>\r\n      <p-autoComplete\r\n        appendTo=\"body\"\r\n        field=\"name\"\r\n        [forceSelection]=\"forceSelection\"\r\n        [dropdown]=\"true\"\r\n        [formControl]=\"control\"\r\n        [placeholder]=\"placeholder\"\r\n        [suggestions]=\"pagedSuggestions\"\r\n        [dropdownIcon]=\"dynamicFilters ? 'pi pi-search' : 'pi pi-chevron-down'\"\r\n        [delay]=\"800\"\r\n        (completeMethod)=\"search($event)\"\r\n        (onShow)=\"onOpenAutocompletePanel()\"\r\n        (onHide)=\"onHideAutocompletePanel()\"\r\n        (onFocus)=\"onFocus.emit($event)\"\r\n        (onChange)=\"onChange.emit($event)\"\r\n        [disabled]=\"disabled\"\r\n        [inputId]=\"inputId\"\r\n      >\r\n      </p-autoComplete>\r\n    </div>\r\n\r\n    <div class=\"input-inner-container\" *ngIf=\"isNgContent\">\r\n      <p-autoComplete\r\n        appendTo=\"body\"\r\n        field=\"name\"\r\n        [forceSelection]=\"forceSelection\"\r\n        [dropdown]=\"true\"\r\n        [formControl]=\"control\"\r\n        [placeholder]=\"placeholder\"\r\n        [suggestions]=\"pagedSuggestions\"\r\n        [dropdownIcon]=\"dynamicFilters ? 'pi pi-search' : 'pi pi-chevron-down'\"\r\n        [delay]=\"800\"\r\n        (completeMethod)=\"search($event)\"\r\n        (onShow)=\"onOpenAutocompletePanel()\"\r\n        (onHide)=\"onHideAutocompletePanel()\"\r\n        (onFocus)=\"onFocus.emit($event)\"\r\n        (onChange)=\"onChange.emit($event)\"\r\n        [disabled]=\"disabled\"\r\n        [inputId]=\"inputId\"\r\n      >\r\n        <ng-template let-option pTemplate=\"item\">\r\n          <div class=\"option-content\">\r\n            <span class=\"option-label\">{{ option.name }}</span>\r\n            <br />\r\n            <span class=\"option-sublabel\">{{ option.code }}</span>\r\n          </div>\r\n        </ng-template>\r\n      </p-autoComplete>\r\n    </div>\r\n\r\n    <vector-button\r\n      *ngIf=\"buttonAction\"\r\n      [label]=\"buttonAction.label\"\r\n      [disabled]=\"disabled\"\r\n      (onClick)=\"buttonAction.onClick(control.value)\"\r\n    ></vector-button>\r\n  </div>\r\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\r\n</div>\r\n", styles: [".input-container{display:flex;align-items:flex-end;width:100%}@media (max-width: 575px){.input-container{align-items:flex-start;flex-direction:column}}.input-container p-autoComplete{flex:1}@media (max-width: 575px){.input-container p-autoComplete{width:100%}}.input-container vector-button{margin-left:15px}@media (max-width: 575px){.input-container vector-button{margin-left:0;margin-top:10px;width:100%}}.input-container p-dropdown{margin-right:-5px;width:150px}@media (max-width: 575px){.input-container p-dropdown{width:100px}}.input-container .input-inner-container{display:flex;width:100%}.p-dropdown-panel,.p-autocomplete-panel,.p-multiselect-panel{max-width:100%!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4$2.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style"], outputs: ["onClick"] }, { kind: "component", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: ["control"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DropdownFieldComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DropdownFieldComponent, selector: "vector-dropdown-field", inputs: { options: "options", isNgContent: "isNgContent", forceSelection: "forceSelection", isRequired: "isRequired", control: "control", label: "label", service: "service", paged: "paged", buttonAction: "buttonAction", dependencies: "dependencies", hiddenErrorMessage: "hiddenErrorMessage", dynamicFilters: "dynamicFilters", minLengthToService: "minLengthToService", initialLoad: "initialLoad", disabled: "disabled", limitScrollPage: "limitScrollPage", inputId: "inputId" }, outputs: { onFocus: "onFocus", onChange: "onChange" }, ngImport: i0, template: "<div class=\"relative\">\n  <div class=\"input-container\">\n    <div class=\"input-inner-container\" *ngIf=\"!isNgContent\">\n      <p-dropdown\n        *ngIf=\"dynamicFilters\"\n        appendTo=\"body\"\n        optionLabel=\"name\"\n        optionValue=\"code\"\n        [(ngModel)]=\"selectedDynamicFilter\"\n        [options]=\"dynamicFilters\"\n        [disabled]=\"disabled\"\n        [inputId]=\"inputId\"\n      >\n      </p-dropdown>\n      <p-autoComplete\n        appendTo=\"body\"\n        field=\"name\"\n        [forceSelection]=\"forceSelection\"\n        [dropdown]=\"true\"\n        [formControl]=\"control\"\n        [placeholder]=\"placeholder\"\n        [suggestions]=\"pagedSuggestions\"\n        [dropdownIcon]=\"dynamicFilters ? 'pi pi-search' : 'pi pi-chevron-down'\"\n        [delay]=\"800\"\n        (completeMethod)=\"search($event)\"\n        (onShow)=\"onOpenAutocompletePanel()\"\n        (onHide)=\"onHideAutocompletePanel()\"\n        (onFocus)=\"onFocus.emit($event)\"\n        (onChange)=\"onChange.emit($event)\"\n        [disabled]=\"disabled\"\n        [inputId]=\"inputId\"\n      >\n      </p-autoComplete>\n    </div>\n\n    <div class=\"input-inner-container\" *ngIf=\"isNgContent\">\n      <p-autoComplete\n        appendTo=\"body\"\n        field=\"name\"\n        [forceSelection]=\"forceSelection\"\n        [dropdown]=\"true\"\n        [formControl]=\"control\"\n        [placeholder]=\"placeholder\"\n        [suggestions]=\"pagedSuggestions\"\n        [dropdownIcon]=\"dynamicFilters ? 'pi pi-search' : 'pi pi-chevron-down'\"\n        [delay]=\"800\"\n        (completeMethod)=\"search($event)\"\n        (onShow)=\"onOpenAutocompletePanel()\"\n        (onHide)=\"onHideAutocompletePanel()\"\n        (onFocus)=\"onFocus.emit($event)\"\n        (onChange)=\"onChange.emit($event)\"\n        [disabled]=\"disabled\"\n        [inputId]=\"inputId\"\n      >\n        <ng-template let-option pTemplate=\"item\">\n          <div class=\"option-content\">\n            <span class=\"option-label\">{{ option.name }}</span>\n            <br />\n            <span class=\"option-sublabel\">{{ option.code }}</span>\n          </div>\n        </ng-template>\n      </p-autoComplete>\n    </div>\n\n    <vector-button\n      *ngIf=\"buttonAction\"\n      [label]=\"buttonAction.label\"\n      [disabled]=\"disabled\"\n      (onClick)=\"buttonAction.onClick(control.value)\"\n    ></vector-button>\n  </div>\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\n</div>\n", styles: [".input-container{display:flex;align-items:flex-end;width:100%}@media (max-width: 575px){.input-container{align-items:flex-start;flex-direction:column}}.input-container p-autoComplete{flex:1}@media (max-width: 575px){.input-container p-autoComplete{width:100%}}.input-container vector-button{margin-left:15px}@media (max-width: 575px){.input-container vector-button{margin-left:0;margin-top:10px;width:100%}}.input-container p-dropdown{margin-right:-5px;width:150px}@media (max-width: 575px){.input-container p-dropdown{width:100px}}.input-container .input-inner-container{display:flex;width:100%}.p-dropdown-panel,.p-autocomplete-panel,.p-multiselect-panel{max-width:100%!important}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4$3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style", "loading"], outputs: ["onClick"] }, { kind: "component", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: ["control"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: DropdownFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DropdownFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-dropdown-field', encapsulation: ViewEncapsulation.None, template: "<div class=\"relative\">\r\n  <div class=\"input-container\">\r\n    <div class=\"input-inner-container\" *ngIf=\"!isNgContent\">\r\n      <p-dropdown\r\n        *ngIf=\"dynamicFilters\"\r\n        appendTo=\"body\"\r\n        optionLabel=\"name\"\r\n        optionValue=\"code\"\r\n        [(ngModel)]=\"selectedDynamicFilter\"\r\n        [options]=\"dynamicFilters\"\r\n        [disabled]=\"disabled\"\r\n        [inputId]=\"inputId\"\r\n      >\r\n      </p-dropdown>\r\n      <p-autoComplete\r\n        appendTo=\"body\"\r\n        field=\"name\"\r\n        [forceSelection]=\"forceSelection\"\r\n        [dropdown]=\"true\"\r\n        [formControl]=\"control\"\r\n        [placeholder]=\"placeholder\"\r\n        [suggestions]=\"pagedSuggestions\"\r\n        [dropdownIcon]=\"dynamicFilters ? 'pi pi-search' : 'pi pi-chevron-down'\"\r\n        [delay]=\"800\"\r\n        (completeMethod)=\"search($event)\"\r\n        (onShow)=\"onOpenAutocompletePanel()\"\r\n        (onHide)=\"onHideAutocompletePanel()\"\r\n        (onFocus)=\"onFocus.emit($event)\"\r\n        (onChange)=\"onChange.emit($event)\"\r\n        [disabled]=\"disabled\"\r\n        [inputId]=\"inputId\"\r\n      >\r\n      </p-autoComplete>\r\n    </div>\r\n\r\n    <div class=\"input-inner-container\" *ngIf=\"isNgContent\">\r\n      <p-autoComplete\r\n        appendTo=\"body\"\r\n        field=\"name\"\r\n        [forceSelection]=\"forceSelection\"\r\n        [dropdown]=\"true\"\r\n        [formControl]=\"control\"\r\n        [placeholder]=\"placeholder\"\r\n        [suggestions]=\"pagedSuggestions\"\r\n        [dropdownIcon]=\"dynamicFilters ? 'pi pi-search' : 'pi pi-chevron-down'\"\r\n        [delay]=\"800\"\r\n        (completeMethod)=\"search($event)\"\r\n        (onShow)=\"onOpenAutocompletePanel()\"\r\n        (onHide)=\"onHideAutocompletePanel()\"\r\n        (onFocus)=\"onFocus.emit($event)\"\r\n        (onChange)=\"onChange.emit($event)\"\r\n        [disabled]=\"disabled\"\r\n        [inputId]=\"inputId\"\r\n      >\r\n        <ng-template let-option pTemplate=\"item\">\r\n          <div class=\"option-content\">\r\n            <span class=\"option-label\">{{ option.name }}</span>\r\n            <br />\r\n            <span class=\"option-sublabel\">{{ option.code }}</span>\r\n          </div>\r\n        </ng-template>\r\n      </p-autoComplete>\r\n    </div>\r\n\r\n    <vector-button\r\n      *ngIf=\"buttonAction\"\r\n      [label]=\"buttonAction.label\"\r\n      [disabled]=\"disabled\"\r\n      (onClick)=\"buttonAction.onClick(control.value)\"\r\n    ></vector-button>\r\n  </div>\r\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\r\n</div>\r\n", styles: [".input-container{display:flex;align-items:flex-end;width:100%}@media (max-width: 575px){.input-container{align-items:flex-start;flex-direction:column}}.input-container p-autoComplete{flex:1}@media (max-width: 575px){.input-container p-autoComplete{width:100%}}.input-container vector-button{margin-left:15px}@media (max-width: 575px){.input-container vector-button{margin-left:0;margin-top:10px;width:100%}}.input-container p-dropdown{margin-right:-5px;width:150px}@media (max-width: 575px){.input-container p-dropdown{width:100px}}.input-container .input-inner-container{display:flex;width:100%}.p-dropdown-panel,.p-autocomplete-panel,.p-multiselect-panel{max-width:100%!important}\n"] }]
+            args: [{ selector: 'vector-dropdown-field', encapsulation: ViewEncapsulation.None, template: "<div class=\"relative\">\n  <div class=\"input-container\">\n    <div class=\"input-inner-container\" *ngIf=\"!isNgContent\">\n      <p-dropdown\n        *ngIf=\"dynamicFilters\"\n        appendTo=\"body\"\n        optionLabel=\"name\"\n        optionValue=\"code\"\n        [(ngModel)]=\"selectedDynamicFilter\"\n        [options]=\"dynamicFilters\"\n        [disabled]=\"disabled\"\n        [inputId]=\"inputId\"\n      >\n      </p-dropdown>\n      <p-autoComplete\n        appendTo=\"body\"\n        field=\"name\"\n        [forceSelection]=\"forceSelection\"\n        [dropdown]=\"true\"\n        [formControl]=\"control\"\n        [placeholder]=\"placeholder\"\n        [suggestions]=\"pagedSuggestions\"\n        [dropdownIcon]=\"dynamicFilters ? 'pi pi-search' : 'pi pi-chevron-down'\"\n        [delay]=\"800\"\n        (completeMethod)=\"search($event)\"\n        (onShow)=\"onOpenAutocompletePanel()\"\n        (onHide)=\"onHideAutocompletePanel()\"\n        (onFocus)=\"onFocus.emit($event)\"\n        (onChange)=\"onChange.emit($event)\"\n        [disabled]=\"disabled\"\n        [inputId]=\"inputId\"\n      >\n      </p-autoComplete>\n    </div>\n\n    <div class=\"input-inner-container\" *ngIf=\"isNgContent\">\n      <p-autoComplete\n        appendTo=\"body\"\n        field=\"name\"\n        [forceSelection]=\"forceSelection\"\n        [dropdown]=\"true\"\n        [formControl]=\"control\"\n        [placeholder]=\"placeholder\"\n        [suggestions]=\"pagedSuggestions\"\n        [dropdownIcon]=\"dynamicFilters ? 'pi pi-search' : 'pi pi-chevron-down'\"\n        [delay]=\"800\"\n        (completeMethod)=\"search($event)\"\n        (onShow)=\"onOpenAutocompletePanel()\"\n        (onHide)=\"onHideAutocompletePanel()\"\n        (onFocus)=\"onFocus.emit($event)\"\n        (onChange)=\"onChange.emit($event)\"\n        [disabled]=\"disabled\"\n        [inputId]=\"inputId\"\n      >\n        <ng-template let-option pTemplate=\"item\">\n          <div class=\"option-content\">\n            <span class=\"option-label\">{{ option.name }}</span>\n            <br />\n            <span class=\"option-sublabel\">{{ option.code }}</span>\n          </div>\n        </ng-template>\n      </p-autoComplete>\n    </div>\n\n    <vector-button\n      *ngIf=\"buttonAction\"\n      [label]=\"buttonAction.label\"\n      [disabled]=\"disabled\"\n      (onClick)=\"buttonAction.onClick(control.value)\"\n    ></vector-button>\n  </div>\n  <vector-field-error-message *ngIf=\"!hiddenErrorMessage\" [control]=\"control\"></vector-field-error-message>\n</div>\n", styles: [".input-container{display:flex;align-items:flex-end;width:100%}@media (max-width: 575px){.input-container{align-items:flex-start;flex-direction:column}}.input-container p-autoComplete{flex:1}@media (max-width: 575px){.input-container p-autoComplete{width:100%}}.input-container vector-button{margin-left:15px}@media (max-width: 575px){.input-container vector-button{margin-left:0;margin-top:10px;width:100%}}.input-container p-dropdown{margin-right:-5px;width:150px}@media (max-width: 575px){.input-container p-dropdown{width:100px}}.input-container .input-inner-container{display:flex;width:100%}.p-dropdown-panel,.p-autocomplete-panel,.p-multiselect-panel{max-width:100%!important}\n"] }]
         }], ctorParameters: () => [{ type: i0.Renderer2 }], propDecorators: { options: [{
                 type: Input
             }], isNgContent: [{
@@ -3039,12 +3101,12 @@ class SelectButtonFieldComponent {
         this.options = [];
         this.disabled = false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SelectButtonFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: SelectButtonFieldComponent, selector: "vector-select-button-field", inputs: { options: "options", control: "control", disabled: "disabled" }, ngImport: i0, template: "<div class=\"input-container p-input-icon-right\">\r\n  <p-selectButton\r\n    [options]=\"options\"\r\n    [formControl]=\"control\"\r\n    optionLabel=\"name\"\r\n    optionValue=\"code\"\r\n    [disabled]=\"disabled\"\r\n  ></p-selectButton>\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$3.SelectButton, selector: "p-selectButton", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "disabled", "dataKey"], outputs: ["onOptionClick", "onChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SelectButtonFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SelectButtonFieldComponent, selector: "vector-select-button-field", inputs: { options: "options", control: "control", disabled: "disabled" }, ngImport: i0, template: "<div class=\"input-container p-input-icon-right\">\n  <p-selectButton\n    [options]=\"options\"\n    [formControl]=\"control\"\n    optionLabel=\"name\"\n    optionValue=\"code\"\n    [disabled]=\"disabled\"\n  ></p-selectButton>\n</div>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$3.SelectButton, selector: "p-selectButton", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "style", "styleClass", "ariaLabelledBy", "disabled", "dataKey", "autofocus"], outputs: ["onOptionClick", "onChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SelectButtonFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SelectButtonFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-select-button-field', template: "<div class=\"input-container p-input-icon-right\">\r\n  <p-selectButton\r\n    [options]=\"options\"\r\n    [formControl]=\"control\"\r\n    optionLabel=\"name\"\r\n    optionValue=\"code\"\r\n    [disabled]=\"disabled\"\r\n  ></p-selectButton>\r\n</div>\r\n" }]
+            args: [{ selector: 'vector-select-button-field', template: "<div class=\"input-container p-input-icon-right\">\n  <p-selectButton\n    [options]=\"options\"\n    [formControl]=\"control\"\n    optionLabel=\"name\"\n    optionValue=\"code\"\n    [disabled]=\"disabled\"\n  ></p-selectButton>\n</div>\n" }]
         }], ctorParameters: () => [], propDecorators: { options: [{
                 type: Input
             }], control: [{
@@ -3230,12 +3292,12 @@ class FiltersComponent {
         }
         return validators;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FiltersComponent, deps: [{ token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: FiltersComponent, selector: "vector-filters", inputs: { fields: "fields" }, outputs: { onSearch: "onSearch", formBuilded: "formBuilded" }, ngImport: i0, template: "<div class=\"grid filter-container\" [ngClass]=\"{ 'display-none': hideFilters }\" [formGroup]=\"formGroup\">\r\n  <div *ngFor=\"let field of fields | notHidden\" class=\"field col-12 sm:col-8 {{ getGridClass(field) }}\">\r\n    <label\r\n      >{{ field.label }}\r\n      <i\r\n        *ngIf=\"field.tooltip\"\r\n        class=\"fas fa-info-circle mt-1 pl-2 ch\"\r\n        pTooltip=\"{{ field.tooltip }}\"\r\n        tooltipPosition=\"bottom\"\r\n      ></i\r\n    ></label>\r\n    <vector-text-field\r\n      *ngIf=\"isTextFieldType(field)\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [mask]=\"field.mask\"\r\n      [label]=\"field.placeholder\"\r\n      [isRequired]=\"field.required\"\r\n      [numeric]=\"field.type === fieldTypes.NUMBER\"\r\n    ></vector-text-field>\r\n    <vector-dropdown-field\r\n      *ngIf=\"[fieldTypes.DYNAMIC_DROPDOWN, fieldTypes.DROPDOWN].includes(field.type)\"\r\n      [dynamicFilters]=\"field.filterTypes\"\r\n      [disabled]=\"field.disabled\"\r\n      [options]=\"field.options || []\"\r\n      [service]=\"field.service\"\r\n      [isRequired]=\"field.required\"\r\n      [minLengthToService]=\"field.minLengthToService || 0\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [paged]=\"false\"\r\n      [dependencies]=\"getFieldDependencies(field)\"\r\n      [initialLoad]=\"field.initiateValue\"\r\n    ></vector-dropdown-field>\r\n    <vector-currency-field\r\n      *ngIf=\"field.type === fieldTypes.CURRENCY\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [outlined]=\"true\"\r\n      [disabled]=\"field.disabled\"\r\n    ></vector-currency-field>\r\n    <vector-calendar-field\r\n      *ngIf=\"field.type === fieldTypes.DATE\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [isRequired]=\"field.required\"\r\n      [label]=\"field.placeholder || ''\"\r\n      [disabled]=\"field.disabled\"\r\n      [min]=\"field.dateMin\"\r\n      [max]=\"field.dateMax\"\r\n    ></vector-calendar-field>\r\n    <vector-select-button-field\r\n      *ngIf=\"field.type === fieldTypes.SELECT_BUTTON\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [options]=\"field.options\"\r\n      (click)=\"search()\"\r\n      [disabled]=\"field.disabled\"\r\n    >\r\n    </vector-select-button-field>\r\n    <div *ngIf=\"field.type === fieldTypes.DATE_RANGE\" class=\"range-date-container\">\r\n      <vector-calendar-field\r\n        [control]=\"formGroup.get(field.name + '.startDate')\"\r\n        [isRequired]=\"field.required\"\r\n        [label]=\"field.placeholder || ''\"\r\n        [disabled]=\"field.disabled\"\r\n        [min]=\"field.dateMin\"\r\n      ></vector-calendar-field>\r\n      At\u00E9\r\n      <vector-calendar-field\r\n        [control]=\"formGroup.get(field.name + '.endDate')\"\r\n        [isRequired]=\"field.required\"\r\n        [label]=\"field.placeholder || ''\"\r\n        [disabled]=\"field.disabled\"\r\n        [max]=\"field.dateMax\"\r\n      ></vector-calendar-field>\r\n    </div>\r\n    <vector-multiselect-field\r\n      *ngIf=\"field.type === fieldTypes.MULTISELECT\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [options]=\"field.options || []\"\r\n      [disabled]=\"field.disabled\"\r\n    >\r\n    </vector-multiselect-field>\r\n  </div>\r\n  <div class=\"search-button sm:col-4\">\r\n    <vector-button\r\n      [label]=\"'app.label.search' | translate\"\r\n      (click)=\"search()\"\r\n      [disabled]=\"!formGroup.valid\"\r\n    ></vector-button>\r\n  </div>\r\n</div>\r\n", styles: [".filter-container{align-items:center}.filter-container .field{display:flex;flex-direction:column}.filter-container .search-button{flex:1;padding-right:7px;display:flex;justify-content:flex-end}@media (min-width: 768px){.filter-container .search-button{padding-top:36px}}.filter-container .range-date-container{display:flex;align-items:center;gap:10px}.display-none{display:none!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: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TextFieldComponent, selector: "vector-text-field", inputs: ["isRequired", "label", "maxlength", "isPassword", "numeric", "numericPositive", "numericDotComma", "decimal", "onlyText", "alphaNumeric", "alphaNumericAndWhitespace", "mask", "autoClear", "readonly", "rightIcon", "centered", "enableDocumentTypeChoice", "hiddenErrorMessage", "leftLabel", "control", "inputId", "slotChar"], outputs: ["blurEvent", "enterKeyPress", "backSpaceKeyPress", "focusEvent", "onDocumentTypeChange"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style"], outputs: ["onClick"] }, { kind: "component", type: CalendarComponent, selector: "vector-calendar-field", inputs: ["isRequired", "control", "label", "showCalendarOnFocus", "min", "max", "disabledDates", "disabled", "defaultDate", "hiddenErrorMessage", "showTime", "showSeconds", "stepMinute"] }, { kind: "component", type: MultiselectFieldComponent, selector: "vector-multiselect-field", inputs: ["pagedSugestion", "isRequired", "control", "label", "options", "filter", "showSelectAllOption", "display", "paged", "disabled", "minLengthToService", "initialLoad", "service", "filterVirtualScrool"], outputs: ["onChange", "onClosePanel"] }, { kind: "component", type: DropdownFieldComponent, selector: "vector-dropdown-field", inputs: ["options", "isNgContent", "forceSelection", "isRequired", "control", "label", "service", "paged", "buttonAction", "dependencies", "hiddenErrorMessage", "dynamicFilters", "minLengthToService", "initialLoad", "disabled", "limitScrollPage", "inputId"], outputs: ["onFocus", "onChange"] }, { kind: "component", type: CurrencyFieldComponent, selector: "vector-currency-field", inputs: ["minValue", "maxValue", "placeholder", "numberOfDecimals", "control", "outlined", "rounded", "label", "isBankingField", "inputClassName", "localePrefix", "currencyPrefix", "disabled", "centered", "inputId"], outputs: ["onBlur"] }, { kind: "component", type: SelectButtonFieldComponent, selector: "vector-select-button-field", inputs: ["options", "control", "disabled"] }, { kind: "pipe", type: NotHiddenPipe, name: "notHidden" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FiltersComponent, deps: [{ token: i1$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FiltersComponent, selector: "vector-filters", inputs: { fields: "fields" }, outputs: { onSearch: "onSearch", formBuilded: "formBuilded" }, ngImport: i0, template: "<div class=\"grid filter-container\" [ngClass]=\"{ 'display-none': hideFilters }\" [formGroup]=\"formGroup\">\n  <div *ngFor=\"let field of fields | notHidden\" class=\"field col-12 sm:col-8 {{ getGridClass(field) }}\">\n    <label\n      >{{ field.label }}\n      <i\n        *ngIf=\"field.tooltip\"\n        class=\"fas fa-info-circle mt-1 pl-2 ch\"\n        pTooltip=\"{{ field.tooltip }}\"\n        tooltipPosition=\"bottom\"\n      ></i\n    ></label>\n    <vector-text-field\n      *ngIf=\"isTextFieldType(field)\"\n      [control]=\"formGroup.get(field.name)\"\n      [mask]=\"field.mask\"\n      [label]=\"field.placeholder\"\n      [isRequired]=\"field.required\"\n      [numeric]=\"field.type === fieldTypes.NUMBER\"\n    ></vector-text-field>\n    <vector-dropdown-field\n      *ngIf=\"[fieldTypes.DYNAMIC_DROPDOWN, fieldTypes.DROPDOWN].includes(field.type)\"\n      [dynamicFilters]=\"field.filterTypes\"\n      [disabled]=\"field.disabled\"\n      [options]=\"field.options || []\"\n      [service]=\"field.service\"\n      [isRequired]=\"field.required\"\n      [minLengthToService]=\"field.minLengthToService || 0\"\n      [control]=\"formGroup.get(field.name)\"\n      [paged]=\"false\"\n      [dependencies]=\"getFieldDependencies(field)\"\n      [initialLoad]=\"field.initiateValue\"\n    ></vector-dropdown-field>\n    <vector-currency-field\n      *ngIf=\"field.type === fieldTypes.CURRENCY\"\n      [control]=\"formGroup.get(field.name)\"\n      [outlined]=\"true\"\n      [disabled]=\"field.disabled\"\n    ></vector-currency-field>\n    <vector-calendar-field\n      *ngIf=\"field.type === fieldTypes.DATE\"\n      [control]=\"formGroup.get(field.name)\"\n      [isRequired]=\"field.required\"\n      [label]=\"field.placeholder || ''\"\n      [disabled]=\"field.disabled\"\n      [min]=\"field.dateMin\"\n      [max]=\"field.dateMax\"\n    ></vector-calendar-field>\n    <vector-select-button-field\n      *ngIf=\"field.type === fieldTypes.SELECT_BUTTON\"\n      [control]=\"formGroup.get(field.name)\"\n      [options]=\"field.options\"\n      (click)=\"search()\"\n      [disabled]=\"field.disabled\"\n    >\n    </vector-select-button-field>\n    <div *ngIf=\"field.type === fieldTypes.DATE_RANGE\" class=\"range-date-container\">\n      <vector-calendar-field\n        [control]=\"formGroup.get(field.name + '.startDate')\"\n        [isRequired]=\"field.required\"\n        [label]=\"field.placeholder || ''\"\n        [disabled]=\"field.disabled\"\n        [min]=\"field.dateMin\"\n      ></vector-calendar-field>\n      At\u00E9\n      <vector-calendar-field\n        [control]=\"formGroup.get(field.name + '.endDate')\"\n        [isRequired]=\"field.required\"\n        [label]=\"field.placeholder || ''\"\n        [disabled]=\"field.disabled\"\n        [max]=\"field.dateMax\"\n      ></vector-calendar-field>\n    </div>\n    <vector-multiselect-field\n      *ngIf=\"field.type === fieldTypes.MULTISELECT\"\n      [control]=\"formGroup.get(field.name)\"\n      [options]=\"field.options || []\"\n      [disabled]=\"field.disabled\"\n    >\n    </vector-multiselect-field>\n  </div>\n  <div class=\"search-button sm:col-4\">\n    <vector-button\n      [label]=\"'app.label.search' | translate\"\n      (click)=\"search()\"\n      [disabled]=\"!formGroup.valid\"\n    ></vector-button>\n  </div>\n</div>\n", styles: [".filter-container{align-items:center}.filter-container .field{display:flex;flex-direction:column}.filter-container .search-button{flex:1;padding-right:7px;display:flex;justify-content:flex-end}@media (min-width: 768px){.filter-container .search-button{padding-top:36px}}.filter-container .range-date-container{display:flex;align-items:center;gap:10px}.display-none{display:none!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: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$5.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: TextFieldComponent, selector: "vector-text-field", inputs: ["isRequired", "label", "maxlength", "isPassword", "numeric", "numericPositive", "numericDotComma", "decimal", "onlyText", "alphaNumeric", "alphaNumericAndWhitespace", "mask", "autoClear", "readonly", "rightIcon", "centered", "enableDocumentTypeChoice", "hiddenErrorMessage", "leftLabel", "control", "inputId", "slotChar"], outputs: ["blurEvent", "enterKeyPress", "backSpaceKeyPress", "focusEvent", "onDocumentTypeChange"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style", "loading"], outputs: ["onClick"] }, { kind: "component", type: CalendarComponent, selector: "vector-calendar-field", inputs: ["isRequired", "control", "label", "showCalendarOnFocus", "min", "max", "disabledDates", "disabled", "defaultDate", "hiddenErrorMessage", "showTime", "showSeconds", "stepMinute"] }, { kind: "component", type: MultiselectFieldComponent, selector: "vector-multiselect-field", inputs: ["pagedSugestion", "isRequired", "control", "label", "options", "filter", "showSelectAllOption", "display", "paged", "disabled", "minLengthToService", "initialLoad", "service", "filterVirtualScrool", "showHeader", "showFlags", "showFlagsOptions"], outputs: ["onChange", "onClosePanel"] }, { kind: "component", type: DropdownFieldComponent, selector: "vector-dropdown-field", inputs: ["options", "isNgContent", "forceSelection", "isRequired", "control", "label", "service", "paged", "buttonAction", "dependencies", "hiddenErrorMessage", "dynamicFilters", "minLengthToService", "initialLoad", "disabled", "limitScrollPage", "inputId"], outputs: ["onFocus", "onChange"] }, { kind: "component", type: CurrencyFieldComponent, selector: "vector-currency-field", inputs: ["minValue", "maxValue", "placeholder", "numberOfDecimals", "control", "outlined", "rounded", "label", "isBankingField", "inputClassName", "localePrefix", "currencyPrefix", "disabled", "centered", "inputId"], outputs: ["onBlur"] }, { kind: "component", type: SelectButtonFieldComponent, selector: "vector-select-button-field", inputs: ["options", "control", "disabled"] }, { kind: "pipe", type: NotHiddenPipe, name: "notHidden" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FiltersComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FiltersComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-filters', template: "<div class=\"grid filter-container\" [ngClass]=\"{ 'display-none': hideFilters }\" [formGroup]=\"formGroup\">\r\n  <div *ngFor=\"let field of fields | notHidden\" class=\"field col-12 sm:col-8 {{ getGridClass(field) }}\">\r\n    <label\r\n      >{{ field.label }}\r\n      <i\r\n        *ngIf=\"field.tooltip\"\r\n        class=\"fas fa-info-circle mt-1 pl-2 ch\"\r\n        pTooltip=\"{{ field.tooltip }}\"\r\n        tooltipPosition=\"bottom\"\r\n      ></i\r\n    ></label>\r\n    <vector-text-field\r\n      *ngIf=\"isTextFieldType(field)\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [mask]=\"field.mask\"\r\n      [label]=\"field.placeholder\"\r\n      [isRequired]=\"field.required\"\r\n      [numeric]=\"field.type === fieldTypes.NUMBER\"\r\n    ></vector-text-field>\r\n    <vector-dropdown-field\r\n      *ngIf=\"[fieldTypes.DYNAMIC_DROPDOWN, fieldTypes.DROPDOWN].includes(field.type)\"\r\n      [dynamicFilters]=\"field.filterTypes\"\r\n      [disabled]=\"field.disabled\"\r\n      [options]=\"field.options || []\"\r\n      [service]=\"field.service\"\r\n      [isRequired]=\"field.required\"\r\n      [minLengthToService]=\"field.minLengthToService || 0\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [paged]=\"false\"\r\n      [dependencies]=\"getFieldDependencies(field)\"\r\n      [initialLoad]=\"field.initiateValue\"\r\n    ></vector-dropdown-field>\r\n    <vector-currency-field\r\n      *ngIf=\"field.type === fieldTypes.CURRENCY\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [outlined]=\"true\"\r\n      [disabled]=\"field.disabled\"\r\n    ></vector-currency-field>\r\n    <vector-calendar-field\r\n      *ngIf=\"field.type === fieldTypes.DATE\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [isRequired]=\"field.required\"\r\n      [label]=\"field.placeholder || ''\"\r\n      [disabled]=\"field.disabled\"\r\n      [min]=\"field.dateMin\"\r\n      [max]=\"field.dateMax\"\r\n    ></vector-calendar-field>\r\n    <vector-select-button-field\r\n      *ngIf=\"field.type === fieldTypes.SELECT_BUTTON\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [options]=\"field.options\"\r\n      (click)=\"search()\"\r\n      [disabled]=\"field.disabled\"\r\n    >\r\n    </vector-select-button-field>\r\n    <div *ngIf=\"field.type === fieldTypes.DATE_RANGE\" class=\"range-date-container\">\r\n      <vector-calendar-field\r\n        [control]=\"formGroup.get(field.name + '.startDate')\"\r\n        [isRequired]=\"field.required\"\r\n        [label]=\"field.placeholder || ''\"\r\n        [disabled]=\"field.disabled\"\r\n        [min]=\"field.dateMin\"\r\n      ></vector-calendar-field>\r\n      At\u00E9\r\n      <vector-calendar-field\r\n        [control]=\"formGroup.get(field.name + '.endDate')\"\r\n        [isRequired]=\"field.required\"\r\n        [label]=\"field.placeholder || ''\"\r\n        [disabled]=\"field.disabled\"\r\n        [max]=\"field.dateMax\"\r\n      ></vector-calendar-field>\r\n    </div>\r\n    <vector-multiselect-field\r\n      *ngIf=\"field.type === fieldTypes.MULTISELECT\"\r\n      [control]=\"formGroup.get(field.name)\"\r\n      [options]=\"field.options || []\"\r\n      [disabled]=\"field.disabled\"\r\n    >\r\n    </vector-multiselect-field>\r\n  </div>\r\n  <div class=\"search-button sm:col-4\">\r\n    <vector-button\r\n      [label]=\"'app.label.search' | translate\"\r\n      (click)=\"search()\"\r\n      [disabled]=\"!formGroup.valid\"\r\n    ></vector-button>\r\n  </div>\r\n</div>\r\n", styles: [".filter-container{align-items:center}.filter-container .field{display:flex;flex-direction:column}.filter-container .search-button{flex:1;padding-right:7px;display:flex;justify-content:flex-end}@media (min-width: 768px){.filter-container .search-button{padding-top:36px}}.filter-container .range-date-container{display:flex;align-items:center;gap:10px}.display-none{display:none!important}\n"] }]
+            args: [{ selector: 'vector-filters', template: "<div class=\"grid filter-container\" [ngClass]=\"{ 'display-none': hideFilters }\" [formGroup]=\"formGroup\">\n  <div *ngFor=\"let field of fields | notHidden\" class=\"field col-12 sm:col-8 {{ getGridClass(field) }}\">\n    <label\n      >{{ field.label }}\n      <i\n        *ngIf=\"field.tooltip\"\n        class=\"fas fa-info-circle mt-1 pl-2 ch\"\n        pTooltip=\"{{ field.tooltip }}\"\n        tooltipPosition=\"bottom\"\n      ></i\n    ></label>\n    <vector-text-field\n      *ngIf=\"isTextFieldType(field)\"\n      [control]=\"formGroup.get(field.name)\"\n      [mask]=\"field.mask\"\n      [label]=\"field.placeholder\"\n      [isRequired]=\"field.required\"\n      [numeric]=\"field.type === fieldTypes.NUMBER\"\n    ></vector-text-field>\n    <vector-dropdown-field\n      *ngIf=\"[fieldTypes.DYNAMIC_DROPDOWN, fieldTypes.DROPDOWN].includes(field.type)\"\n      [dynamicFilters]=\"field.filterTypes\"\n      [disabled]=\"field.disabled\"\n      [options]=\"field.options || []\"\n      [service]=\"field.service\"\n      [isRequired]=\"field.required\"\n      [minLengthToService]=\"field.minLengthToService || 0\"\n      [control]=\"formGroup.get(field.name)\"\n      [paged]=\"false\"\n      [dependencies]=\"getFieldDependencies(field)\"\n      [initialLoad]=\"field.initiateValue\"\n    ></vector-dropdown-field>\n    <vector-currency-field\n      *ngIf=\"field.type === fieldTypes.CURRENCY\"\n      [control]=\"formGroup.get(field.name)\"\n      [outlined]=\"true\"\n      [disabled]=\"field.disabled\"\n    ></vector-currency-field>\n    <vector-calendar-field\n      *ngIf=\"field.type === fieldTypes.DATE\"\n      [control]=\"formGroup.get(field.name)\"\n      [isRequired]=\"field.required\"\n      [label]=\"field.placeholder || ''\"\n      [disabled]=\"field.disabled\"\n      [min]=\"field.dateMin\"\n      [max]=\"field.dateMax\"\n    ></vector-calendar-field>\n    <vector-select-button-field\n      *ngIf=\"field.type === fieldTypes.SELECT_BUTTON\"\n      [control]=\"formGroup.get(field.name)\"\n      [options]=\"field.options\"\n      (click)=\"search()\"\n      [disabled]=\"field.disabled\"\n    >\n    </vector-select-button-field>\n    <div *ngIf=\"field.type === fieldTypes.DATE_RANGE\" class=\"range-date-container\">\n      <vector-calendar-field\n        [control]=\"formGroup.get(field.name + '.startDate')\"\n        [isRequired]=\"field.required\"\n        [label]=\"field.placeholder || ''\"\n        [disabled]=\"field.disabled\"\n        [min]=\"field.dateMin\"\n      ></vector-calendar-field>\n      At\u00E9\n      <vector-calendar-field\n        [control]=\"formGroup.get(field.name + '.endDate')\"\n        [isRequired]=\"field.required\"\n        [label]=\"field.placeholder || ''\"\n        [disabled]=\"field.disabled\"\n        [max]=\"field.dateMax\"\n      ></vector-calendar-field>\n    </div>\n    <vector-multiselect-field\n      *ngIf=\"field.type === fieldTypes.MULTISELECT\"\n      [control]=\"formGroup.get(field.name)\"\n      [options]=\"field.options || []\"\n      [disabled]=\"field.disabled\"\n    >\n    </vector-multiselect-field>\n  </div>\n  <div class=\"search-button sm:col-4\">\n    <vector-button\n      [label]=\"'app.label.search' | translate\"\n      (click)=\"search()\"\n      [disabled]=\"!formGroup.valid\"\n    ></vector-button>\n  </div>\n</div>\n", styles: [".filter-container{align-items:center}.filter-container .field{display:flex;flex-direction:column}.filter-container .search-button{flex:1;padding-right:7px;display:flex;justify-content:flex-end}@media (min-width: 768px){.filter-container .search-button{padding-top:36px}}.filter-container .range-date-container{display:flex;align-items:center;gap:10px}.display-none{display:none!important}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.ActivatedRoute }], propDecorators: { fields: [{
                 type: Input
             }], onSearch: [{
@@ -3541,12 +3603,12 @@ class DataTableComponent {
     getActiveStatusColor(active) {
         return active ? 'success' : 'error';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: DataTableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: DataTableComponent, selector: "vector-data-table", inputs: { columns: "columns", data: "data", exportExcel: "exportExcel", exportPDF: "exportPDF", customFunction: "customFunction", totalRecords: "totalRecords", disabledHeadercheckbox: "disabledHeadercheckbox", filters: "filters", addItemLabel: "addItemLabel", pagination: "pagination", virtualPagination: "virtualPagination", tabs: "tabs", customButtons: "customButtons", addItemButtonPlusSign: "addItemButtonPlusSign", hasActions: "hasActions", hasExpandableIcon: "hasExpandableIcon", addNameColumnExpand: "addNameColumnExpand", expandable: "expandable", expansionTemplate: "expansionTemplate", selectionMode: "selectionMode", selectionType: "selectionType", height: "height", firstLazyLoad: "firstLazyLoad", shouldLazyLoadWithoutFilter: "shouldLazyLoadWithoutFilter" }, outputs: { onLazyLoad: "onLazyLoad", onFilter: "onFilter", onAdd: "onAdd", onExportExcel: "onExportExcel", onExportPDF: "onExportPDF", onSelectedRows: "onSelectedRows", onFilterChanged: "onFilterChanged", onTabSelected: "onTabSelected", onExpandRow: "onExpandRow" }, viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: FiltersComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"grid\">\r\n  <div class=\"col-12\">\r\n    <vector-filters\r\n      [fields]=\"filters\"\r\n      (onSearch)=\"lazyLoaded({ filter: true, data: $event })\"\r\n      (formBuilded)=\"subscribeToFilterChanges()\"\r\n    ></vector-filters>\r\n  </div>\r\n  <div class=\"table-header-actions field\" *ngIf=\"addItemLabel || exportExcel || exportPDF || customFunction\">\r\n    <button *ngIf=\"exportExcel\" (click)=\"onExportExcel.emit()\" class=\"export-button export-excel\">\r\n      <i class=\"fas fa-file-excel\"></i><span>Excel</span>\r\n    </button>\r\n    <button *ngIf=\"exportPDF\" (click)=\"onExportPDF.emit()\" class=\"export-button export-pdf\">\r\n      <i class=\"fas fa-file-pdf\"></i><span>PDF</span>\r\n    </button>\r\n    <button\r\n      *ngFor=\"let button of customFunction\"\r\n      (click)=\"button.clickFunction()\"\r\n      class=\"export-button custom-function\"\r\n    >\r\n      <i *ngIf=\"button?.icon\" class=\"{{ button?.icon }}\"></i><span>{{ button?.label }}</span>\r\n    </button>\r\n\r\n    <vector-button\r\n      *ngFor=\"let button of customButtons\"\r\n      class=\"add-item-button\"\r\n      [label]=\"button.label\"\r\n      (click)=\"button.clickFunction()\"\r\n      [rightIcon]=\"addItemButtonPlusSign ? 'pi pi-plus' : ''\"\r\n    ></vector-button>\r\n    <vector-button\r\n      *ngIf=\"addItemLabel\"\r\n      class=\"add-item-button\"\r\n      [label]=\"addItemLabel\"\r\n      (click)=\"onAdd.emit()\"\r\n      [rightIcon]=\"addItemButtonPlusSign ? 'pi pi-plus' : ''\"\r\n    ></vector-button>\r\n  </div>\r\n  <div class=\"col-12\">\r\n    <vector-panel class=\"data-table-panel\">\r\n      <p-tabView (onChange)=\"onTabChange($event)\" *ngIf=\"tabs?.length\">\r\n        <p-tabPanel *ngFor=\"let tab of tabs\">\r\n          <ng-template pTemplate=\"header\">\r\n            <em *ngIf=\"tab.icon\" [class]=\"tab.icon\">&nbsp;</em>\r\n            <span>{{ tab.name }}</span>\r\n          </ng-template>\r\n        </p-tabPanel>\r\n      </p-tabView>\r\n      <p-table\r\n        currentPageReportTemplate=\"Mostrando {first} at\u00E9 {last} de {totalRecords} registros\"\r\n        sortMode=\"single\"\r\n        [rows]=\"10\"\r\n        [lazy]=\"pagination && !virtualPagination\"\r\n        [value]=\"data\"\r\n        [paginator]=\"pagination\"\r\n        [totalRecords]=\"totalRecords\"\r\n        [showCurrentPageReport]=\"true\"\r\n        [rowsPerPageOptions]=\"[10, 25, 50, 100]\"\r\n        [responsive]=\"true\"\r\n        [resizableColumns]=\"true\"\r\n        [scrollable]=\"true\"\r\n        scrollDirection=\"vertical\"\r\n        responsiveLayout=\"scroll\"\r\n        dataKey=\"id\"\r\n        [scrollHeight]=\"height\"\r\n        [attr.selectionMode]=\"selectionMode\"\r\n        [(selection)]=\"selectedItems\"\r\n        (onRowSelect)=\"changeSelectedItems($event)\"\r\n        (onHeaderCheckboxToggle)=\"changeSelectedItems($event)\"\r\n        (onRowUnselect)=\"changeSelectedItems($event)\"\r\n        (onLazyLoad)=\"lazyLoaded({ filter: false, data: $event })\"\r\n        (selectionChange)=\"onSelectionChange($event)\"\r\n      >\r\n        <ng-template pTemplate=\"header\">\r\n          <tr class=\"header\">\r\n            <th *ngIf=\"selectionType === 'checkbox'\">\r\n              <p-tableHeaderCheckbox [disabled]=\"disabledHeadercheckbox\"></p-tableHeaderCheckbox>\r\n            </th>\r\n            <th class=\"text-center\" *ngIf=\"hasExpandableIcon\">\r\n              {{ addNameColumnExpand }}\r\n            </th>\r\n            <th *ngIf=\"hasActions\">{{ 'app.label.actions' | translate }}</th>\r\n            <th\r\n              *ngFor=\"let col of columns\"\r\n              [ngStyle]=\"getColStyle(col)\"\r\n              [pSortableColumn]=\"col.notSortable ? '' : col.field\"\r\n            >\r\n              <div class=\"flex align-items-center\">\r\n                <span>{{ col.header }}</span> <p-sortIcon *ngIf=\"!col.notSortable\" [field]=\"col.field\"></p-sortIcon>\r\n              </div>\r\n            </th>\r\n          </tr>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"body\" let-rowData let-item let-expanded=\"expanded\">\r\n          <tr\r\n            class=\"row\"\r\n            [pSelectableRow]=\"rowData\"\r\n            [ngClass]=\"{ expandable: expandable }\"\r\n            [pRowToggler]=\"expandable ? item : undefined\"\r\n            (click)=\"onRowClick(item)\"\r\n          >\r\n            <ng-container *ngIf=\"selectionType === 'checkbox'\">\r\n              <td style=\"max-width: 3rem; padding-left: 10px\" class=\"flex justify-content-center align-items-center\">\r\n                <p-tableCheckbox [value]=\"item\" [disabled]=\"item.disabledCheckBox\"></p-tableCheckbox>\r\n              </td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"selectionType === 'radiobutton'\">\r\n              <td style=\"max-width: 3rem; padding-left: 10px\" class=\"flex justify-content-center align-items-center\">\r\n                <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\r\n              </td>\r\n            </ng-container>\r\n            <td *ngIf=\"hasExpandableIcon\" style=\"max-width: 150px\" class=\"centered\">\r\n              <p-menu #menu [model]=\"item.actions\" [popup]=\"true\" appendTo=\"body\"></p-menu>\r\n              <i\r\n                [ngClass]=\"\r\n                  expanded ? 'actions-menu-button pi pi-chevron-down' : 'actions-menu-button pi pi-chevron-right'\r\n                \"\r\n              ></i>\r\n            </td>\r\n            <td *ngIf=\"hasActions\">\r\n              <p-menu #menu [model]=\"item.actions\" [popup]=\"true\" appendTo=\"body\"></p-menu>\r\n              <i class=\"actions-menu-button fas fa-cog\" (click)=\"menu.toggle($event)\"></i>\r\n            </td>\r\n            <ng-container *ngFor=\"let col of columns\">\r\n              <td\r\n                *ngIf=\"isHtmlCell(col)\"\r\n                class=\"cell\"\r\n                [innerHTML]=\"getCellContent(item, col)\"\r\n                (click)=\"col && col.clickFunction && col.clickFunction(item)\"\r\n                [ngStyle]=\"getColStyle(col)\"\r\n              ></td>\r\n              <td\r\n                *ngIf=\"(!isHtmlCell(col) && !!col.getStatus) || isScoreCell(col)\"\r\n                class=\"cell\"\r\n                (click)=\"col && col.clickFunction && col.clickFunction(item)\"\r\n                [ngStyle]=\"getColStyle(col)\"\r\n              >\r\n                <vector-badge\r\n                  *ngIf=\"isBadgeCell(col)\"\r\n                  [label]=\"getCellText(item, col)\"\r\n                  [type]=\"col.getStatus && col.getStatus(item[col.field])\"\r\n                  [tooltip]=\"getTooltipText(item, col)\"\r\n                ></vector-badge>\r\n                <vector-score *ngIf=\"isScoreCell(col)\" [score]=\"item[col.field]\"></vector-score>\r\n              </td>\r\n            </ng-container>\r\n          </tr>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"emptymessage\">\r\n          <tr class=\"row\">\r\n            <td class=\"no-results\" [attr.colspan]=\"columns.length + 1\">Nenhum resultado encontrado</td>\r\n          </tr>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"paginatorright\"> </ng-template>\r\n        <ng-template let-item pTemplate=\"paginatordropdownitem\"> {{ item.value }} </ng-template>\r\n        <ng-template pTemplate=\"rowexpansion\" let-item>\r\n          <tr>\r\n            <td [attr.colspan]=\"columns.length + (hasActions ? 1 : 0)\">\r\n              <ng-container *ngTemplateOutlet=\"expansionTemplate; context: { item }\"> </ng-container>\r\n            </td>\r\n          </tr>\r\n        </ng-template>\r\n      </p-table>\r\n    </vector-panel>\r\n  </div>\r\n</div>\r\n", styles: [".no-results{padding:15px;background-color:#fff;width:100%}.centered{display:flex;justify-content:center}.table-header-actions{display:flex;justify-content:flex-end;align-items:flex-end;width:100%;padding-right:7px;margin-bottom:15px!important}@media (min-width: 768px){.table-header-actions{margin-top:-3px}}.table-header-actions .export-button{padding:7px 10px;color:#fff;display:flex;align-items:center;border:none;border-radius:5px;margin:5px;font-size:.75rem;cursor:pointer}.table-header-actions .export-button.export-excel{background-color:var(--success-color)}.table-header-actions .export-button.export-excel:hover{background-color:var(--success-color-dark)}.table-header-actions .export-button.export-pdf{background-color:var(--error-color)}.table-header-actions .export-button.export-pdf:hover{background-color:var(--error-color-dark)}.table-header-actions .export-button.custom-function{background-color:var(--theme-primary)}.table-header-actions .export-button.custom-function:hover{background-color:var(--theme-medium)}.table-header-actions .export-button i{color:#fff}.table-header-actions .export-button span{margin-left:5px}.table-header-actions .add-item-button{margin-left:10px}.actions-menu-button{font-size:23px;cursor:pointer;color:var(--theme-medium)}.expandable{cursor:pointer}\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: PanelComponent, selector: "vector-panel" }, { kind: "component", type: i4$3.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "nextButtonAriaLabel", "prevButtonAriaLabel", "autoHideButtons", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i4$3.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "component", type: BadgeComponent, selector: "vector-badge", inputs: ["type", "label", "customColor", "customBackgroundColor", "tooltip"] }, { kind: "component", type: ScoreComponent, selector: "vector-score", inputs: ["score"] }, { kind: "component", type: i7.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i8.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i8.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i8.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i8.RowToggler, selector: "[pRowToggler]", inputs: ["pRowToggler", "pRowTogglerDisabled"] }, { kind: "component", type: i8.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i8.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i8.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i8.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style"], outputs: ["onClick"] }, { kind: "component", type: FiltersComponent, selector: "vector-filters", inputs: ["fields"], outputs: ["onSearch", "formBuilded"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DataTableComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: DataTableComponent, selector: "vector-data-table", inputs: { columns: "columns", data: "data", exportExcel: "exportExcel", exportPDF: "exportPDF", customFunction: "customFunction", totalRecords: "totalRecords", disabledHeadercheckbox: "disabledHeadercheckbox", filters: "filters", addItemLabel: "addItemLabel", pagination: "pagination", virtualPagination: "virtualPagination", tabs: "tabs", customButtons: "customButtons", addItemButtonPlusSign: "addItemButtonPlusSign", hasActions: "hasActions", hasExpandableIcon: "hasExpandableIcon", addNameColumnExpand: "addNameColumnExpand", expandable: "expandable", expansionTemplate: "expansionTemplate", selectionMode: "selectionMode", selectionType: "selectionType", height: "height", firstLazyLoad: "firstLazyLoad", shouldLazyLoadWithoutFilter: "shouldLazyLoadWithoutFilter" }, outputs: { onLazyLoad: "onLazyLoad", onFilter: "onFilter", onAdd: "onAdd", onExportExcel: "onExportExcel", onExportPDF: "onExportPDF", onSelectedRows: "onSelectedRows", onFilterChanged: "onFilterChanged", onTabSelected: "onTabSelected", onExpandRow: "onExpandRow" }, viewQueries: [{ propertyName: "filtersComponent", first: true, predicate: FiltersComponent, descendants: true, static: true }], ngImport: i0, template: "<div class=\"grid\">\n  <div class=\"col-12\">\n    <vector-filters\n      [fields]=\"filters\"\n      (onSearch)=\"lazyLoaded({ filter: true, data: $event })\"\n      (formBuilded)=\"subscribeToFilterChanges()\"\n    ></vector-filters>\n  </div>\n  <div class=\"table-header-actions field\" *ngIf=\"addItemLabel || exportExcel || exportPDF || customFunction\">\n    <button *ngIf=\"exportExcel\" (click)=\"onExportExcel.emit()\" class=\"export-button export-excel\">\n      <i class=\"fas fa-file-excel\"></i><span>Excel</span>\n    </button>\n    <button *ngIf=\"exportPDF\" (click)=\"onExportPDF.emit()\" class=\"export-button export-pdf\">\n      <i class=\"fas fa-file-pdf\"></i><span>PDF</span>\n    </button>\n    <button\n      *ngFor=\"let button of customFunction\"\n      (click)=\"button.clickFunction()\"\n      class=\"export-button custom-function\"\n    >\n      <i *ngIf=\"button?.icon\" class=\"{{ button?.icon }}\"></i><span>{{ button?.label }}</span>\n    </button>\n\n    <vector-button\n      *ngFor=\"let button of customButtons\"\n      class=\"add-item-button\"\n      [label]=\"button.label\"\n      (click)=\"button.clickFunction()\"\n      [rightIcon]=\"addItemButtonPlusSign ? 'pi pi-plus' : ''\"\n    ></vector-button>\n    <vector-button\n      *ngIf=\"addItemLabel\"\n      class=\"add-item-button\"\n      [label]=\"addItemLabel\"\n      (click)=\"onAdd.emit()\"\n      [rightIcon]=\"addItemButtonPlusSign ? 'pi pi-plus' : ''\"\n    ></vector-button>\n  </div>\n  <div class=\"col-12\">\n    <vector-panel class=\"data-table-panel\">\n      <p-tabView (onChange)=\"onTabChange($event)\" *ngIf=\"tabs?.length\">\n        <p-tabPanel *ngFor=\"let tab of tabs\">\n          <ng-template pTemplate=\"header\">\n            <em *ngIf=\"tab.icon\" [class]=\"tab.icon\">&nbsp;</em>\n            <span>{{ tab.name }}</span>\n          </ng-template>\n        </p-tabPanel>\n      </p-tabView>\n      <p-table\n        currentPageReportTemplate=\"Mostrando {first} at\u00E9 {last} de {totalRecords} registros\"\n        sortMode=\"single\"\n        [rows]=\"10\"\n        [lazy]=\"pagination && !virtualPagination\"\n        [value]=\"data\"\n        [paginator]=\"pagination\"\n        [totalRecords]=\"totalRecords\"\n        [showCurrentPageReport]=\"true\"\n        [rowsPerPageOptions]=\"[10, 25, 50, 100]\"\n        [responsive]=\"true\"\n        [resizableColumns]=\"true\"\n        [scrollable]=\"true\"\n        scrollDirection=\"vertical\"\n        responsiveLayout=\"scroll\"\n        dataKey=\"id\"\n        [scrollHeight]=\"height\"\n        [attr.selectionMode]=\"selectionMode\"\n        [(selection)]=\"selectedItems\"\n        (onRowSelect)=\"changeSelectedItems($event)\"\n        (onHeaderCheckboxToggle)=\"changeSelectedItems($event)\"\n        (onRowUnselect)=\"changeSelectedItems($event)\"\n        (onLazyLoad)=\"lazyLoaded({ filter: false, data: $event })\"\n        (selectionChange)=\"onSelectionChange($event)\"\n      >\n        <ng-template pTemplate=\"header\">\n          <tr class=\"header\">\n            <th *ngIf=\"selectionType === 'checkbox'\">\n              <p-tableHeaderCheckbox [disabled]=\"disabledHeadercheckbox\"></p-tableHeaderCheckbox>\n            </th>\n            <th class=\"text-center\" *ngIf=\"hasExpandableIcon\">\n              {{ addNameColumnExpand }}\n            </th>\n            <th *ngIf=\"hasActions\">{{ 'app.label.actions' | translate }}</th>\n            <th\n              *ngFor=\"let col of columns\"\n              [ngStyle]=\"getColStyle(col)\"\n              [pSortableColumn]=\"col.notSortable ? '' : col.field\"\n            >\n              <div class=\"flex align-items-center\">\n                <span>{{ col.header }}</span> <p-sortIcon *ngIf=\"!col.notSortable\" [field]=\"col.field\"></p-sortIcon>\n              </div>\n            </th>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"body\" let-rowData let-item let-expanded=\"expanded\">\n          <tr\n            class=\"row\"\n            [pSelectableRow]=\"rowData\"\n            [ngClass]=\"{ expandable: expandable }\"\n            [pRowToggler]=\"expandable ? item : undefined\"\n            (click)=\"onRowClick(item)\"\n          >\n            <ng-container *ngIf=\"selectionType === 'checkbox'\">\n              <td style=\"max-width: 3rem; padding-left: 10px\" class=\"flex justify-content-center align-items-center\">\n                <p-tableCheckbox [value]=\"item\" [disabled]=\"item.disabledCheckBox\"></p-tableCheckbox>\n              </td>\n            </ng-container>\n            <ng-container *ngIf=\"selectionType === 'radiobutton'\">\n              <td style=\"max-width: 3rem; padding-left: 10px\" class=\"flex justify-content-center align-items-center\">\n                <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n              </td>\n            </ng-container>\n            <td *ngIf=\"hasExpandableIcon\" style=\"max-width: 150px\" class=\"centered\">\n              <p-menu #menu [model]=\"item.actions\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n              <i\n                [ngClass]=\"\n                  expanded ? 'actions-menu-button pi pi-chevron-down' : 'actions-menu-button pi pi-chevron-right'\n                \"\n              ></i>\n            </td>\n            <td *ngIf=\"hasActions\">\n              <p-menu #menu [model]=\"item.actions\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n              <i class=\"actions-menu-button fas fa-cog\" (click)=\"menu.toggle($event)\"></i>\n            </td>\n            <ng-container *ngFor=\"let col of columns\">\n              <td\n                *ngIf=\"isHtmlCell(col)\"\n                class=\"cell\"\n                [innerHTML]=\"getCellContent(item, col)\"\n                (click)=\"col && col.clickFunction && col.clickFunction(item)\"\n                [ngStyle]=\"getColStyle(col)\"\n              ></td>\n              <td\n                *ngIf=\"(!isHtmlCell(col) && !!col.getStatus) || isScoreCell(col)\"\n                class=\"cell\"\n                (click)=\"col && col.clickFunction && col.clickFunction(item)\"\n                [ngStyle]=\"getColStyle(col)\"\n              >\n                <vector-badge\n                  *ngIf=\"isBadgeCell(col)\"\n                  [label]=\"getCellText(item, col)\"\n                  [type]=\"col.getStatus && col.getStatus(item[col.field])\"\n                  [tooltip]=\"getTooltipText(item, col)\"\n                ></vector-badge>\n                <vector-score *ngIf=\"isScoreCell(col)\" [score]=\"item[col.field]\"></vector-score>\n              </td>\n            </ng-container>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"emptymessage\">\n          <tr class=\"row\">\n            <td class=\"no-results\" [attr.colspan]=\"columns.length + 1\">Nenhum resultado encontrado</td>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"paginatorright\"> </ng-template>\n        <ng-template let-item pTemplate=\"paginatordropdownitem\"> {{ item.value }} </ng-template>\n        <ng-template pTemplate=\"rowexpansion\" let-item>\n          <tr>\n            <td [attr.colspan]=\"columns.length + (hasActions ? 1 : 0)\">\n              <ng-container *ngTemplateOutlet=\"expansionTemplate; context: { item }\"> </ng-container>\n            </td>\n          </tr>\n        </ng-template>\n      </p-table>\n    </vector-panel>\n  </div>\n</div>\n", styles: [".no-results{padding:15px;background-color:#fff;width:100%}.centered{display:flex;justify-content:center}.table-header-actions{display:flex;justify-content:flex-end;align-items:flex-end;width:100%;padding-right:7px;margin-bottom:15px!important}@media (min-width: 768px){.table-header-actions{margin-top:-3px}}.table-header-actions .export-button{padding:7px 10px;color:#fff;display:flex;align-items:center;border:none;border-radius:5px;margin:5px;font-size:.75rem;cursor:pointer}.table-header-actions .export-button.export-excel{background-color:var(--success-color)}.table-header-actions .export-button.export-excel:hover{background-color:var(--success-color-dark)}.table-header-actions .export-button.export-pdf{background-color:var(--error-color)}.table-header-actions .export-button.export-pdf:hover{background-color:var(--error-color-dark)}.table-header-actions .export-button.custom-function{background-color:var(--theme-primary)}.table-header-actions .export-button.custom-function:hover{background-color:var(--theme-medium)}.table-header-actions .export-button i{color:#fff}.table-header-actions .export-button span{margin-left:5px}.table-header-actions .add-item-button{margin-left:10px}.actions-menu-button{font-size:23px;cursor:pointer;color:var(--theme-medium)}.expandable{cursor:pointer}\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.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: PanelComponent, selector: "vector-panel" }, { kind: "component", type: i4$4.TabView, selector: "p-tabView", inputs: ["style", "styleClass", "controlClose", "scrollable", "activeIndex", "selectOnFocus", "nextButtonAriaLabel", "prevButtonAriaLabel", "autoHideButtons", "tabindex"], outputs: ["onChange", "onClose", "activeIndexChange"] }, { kind: "component", type: i4$4.TabPanel, selector: "p-tabPanel", inputs: ["closable", "headerStyle", "headerStyleClass", "cache", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "selected", "disabled", "header", "leftIcon", "rightIcon"] }, { kind: "component", type: BadgeComponent, selector: "vector-badge", inputs: ["type", "label", "customColor", "customBackgroundColor", "tooltip"] }, { kind: "component", type: ScoreComponent, selector: "vector-score", inputs: ["score"] }, { kind: "component", type: i7.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i8.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i8.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i8.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i8.RowToggler, selector: "[pRowToggler]", inputs: ["pRowToggler", "pRowTogglerDisabled"] }, { kind: "component", type: i8.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i8.TableRadioButton, selector: "p-tableRadioButton", inputs: ["disabled", "value", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i8.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i8.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style", "loading"], outputs: ["onClick"] }, { kind: "component", type: FiltersComponent, selector: "vector-filters", inputs: ["fields"], outputs: ["onSearch", "formBuilded"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: DataTableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DataTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-data-table', template: "<div class=\"grid\">\r\n  <div class=\"col-12\">\r\n    <vector-filters\r\n      [fields]=\"filters\"\r\n      (onSearch)=\"lazyLoaded({ filter: true, data: $event })\"\r\n      (formBuilded)=\"subscribeToFilterChanges()\"\r\n    ></vector-filters>\r\n  </div>\r\n  <div class=\"table-header-actions field\" *ngIf=\"addItemLabel || exportExcel || exportPDF || customFunction\">\r\n    <button *ngIf=\"exportExcel\" (click)=\"onExportExcel.emit()\" class=\"export-button export-excel\">\r\n      <i class=\"fas fa-file-excel\"></i><span>Excel</span>\r\n    </button>\r\n    <button *ngIf=\"exportPDF\" (click)=\"onExportPDF.emit()\" class=\"export-button export-pdf\">\r\n      <i class=\"fas fa-file-pdf\"></i><span>PDF</span>\r\n    </button>\r\n    <button\r\n      *ngFor=\"let button of customFunction\"\r\n      (click)=\"button.clickFunction()\"\r\n      class=\"export-button custom-function\"\r\n    >\r\n      <i *ngIf=\"button?.icon\" class=\"{{ button?.icon }}\"></i><span>{{ button?.label }}</span>\r\n    </button>\r\n\r\n    <vector-button\r\n      *ngFor=\"let button of customButtons\"\r\n      class=\"add-item-button\"\r\n      [label]=\"button.label\"\r\n      (click)=\"button.clickFunction()\"\r\n      [rightIcon]=\"addItemButtonPlusSign ? 'pi pi-plus' : ''\"\r\n    ></vector-button>\r\n    <vector-button\r\n      *ngIf=\"addItemLabel\"\r\n      class=\"add-item-button\"\r\n      [label]=\"addItemLabel\"\r\n      (click)=\"onAdd.emit()\"\r\n      [rightIcon]=\"addItemButtonPlusSign ? 'pi pi-plus' : ''\"\r\n    ></vector-button>\r\n  </div>\r\n  <div class=\"col-12\">\r\n    <vector-panel class=\"data-table-panel\">\r\n      <p-tabView (onChange)=\"onTabChange($event)\" *ngIf=\"tabs?.length\">\r\n        <p-tabPanel *ngFor=\"let tab of tabs\">\r\n          <ng-template pTemplate=\"header\">\r\n            <em *ngIf=\"tab.icon\" [class]=\"tab.icon\">&nbsp;</em>\r\n            <span>{{ tab.name }}</span>\r\n          </ng-template>\r\n        </p-tabPanel>\r\n      </p-tabView>\r\n      <p-table\r\n        currentPageReportTemplate=\"Mostrando {first} at\u00E9 {last} de {totalRecords} registros\"\r\n        sortMode=\"single\"\r\n        [rows]=\"10\"\r\n        [lazy]=\"pagination && !virtualPagination\"\r\n        [value]=\"data\"\r\n        [paginator]=\"pagination\"\r\n        [totalRecords]=\"totalRecords\"\r\n        [showCurrentPageReport]=\"true\"\r\n        [rowsPerPageOptions]=\"[10, 25, 50, 100]\"\r\n        [responsive]=\"true\"\r\n        [resizableColumns]=\"true\"\r\n        [scrollable]=\"true\"\r\n        scrollDirection=\"vertical\"\r\n        responsiveLayout=\"scroll\"\r\n        dataKey=\"id\"\r\n        [scrollHeight]=\"height\"\r\n        [attr.selectionMode]=\"selectionMode\"\r\n        [(selection)]=\"selectedItems\"\r\n        (onRowSelect)=\"changeSelectedItems($event)\"\r\n        (onHeaderCheckboxToggle)=\"changeSelectedItems($event)\"\r\n        (onRowUnselect)=\"changeSelectedItems($event)\"\r\n        (onLazyLoad)=\"lazyLoaded({ filter: false, data: $event })\"\r\n        (selectionChange)=\"onSelectionChange($event)\"\r\n      >\r\n        <ng-template pTemplate=\"header\">\r\n          <tr class=\"header\">\r\n            <th *ngIf=\"selectionType === 'checkbox'\">\r\n              <p-tableHeaderCheckbox [disabled]=\"disabledHeadercheckbox\"></p-tableHeaderCheckbox>\r\n            </th>\r\n            <th class=\"text-center\" *ngIf=\"hasExpandableIcon\">\r\n              {{ addNameColumnExpand }}\r\n            </th>\r\n            <th *ngIf=\"hasActions\">{{ 'app.label.actions' | translate }}</th>\r\n            <th\r\n              *ngFor=\"let col of columns\"\r\n              [ngStyle]=\"getColStyle(col)\"\r\n              [pSortableColumn]=\"col.notSortable ? '' : col.field\"\r\n            >\r\n              <div class=\"flex align-items-center\">\r\n                <span>{{ col.header }}</span> <p-sortIcon *ngIf=\"!col.notSortable\" [field]=\"col.field\"></p-sortIcon>\r\n              </div>\r\n            </th>\r\n          </tr>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"body\" let-rowData let-item let-expanded=\"expanded\">\r\n          <tr\r\n            class=\"row\"\r\n            [pSelectableRow]=\"rowData\"\r\n            [ngClass]=\"{ expandable: expandable }\"\r\n            [pRowToggler]=\"expandable ? item : undefined\"\r\n            (click)=\"onRowClick(item)\"\r\n          >\r\n            <ng-container *ngIf=\"selectionType === 'checkbox'\">\r\n              <td style=\"max-width: 3rem; padding-left: 10px\" class=\"flex justify-content-center align-items-center\">\r\n                <p-tableCheckbox [value]=\"item\" [disabled]=\"item.disabledCheckBox\"></p-tableCheckbox>\r\n              </td>\r\n            </ng-container>\r\n            <ng-container *ngIf=\"selectionType === 'radiobutton'\">\r\n              <td style=\"max-width: 3rem; padding-left: 10px\" class=\"flex justify-content-center align-items-center\">\r\n                <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\r\n              </td>\r\n            </ng-container>\r\n            <td *ngIf=\"hasExpandableIcon\" style=\"max-width: 150px\" class=\"centered\">\r\n              <p-menu #menu [model]=\"item.actions\" [popup]=\"true\" appendTo=\"body\"></p-menu>\r\n              <i\r\n                [ngClass]=\"\r\n                  expanded ? 'actions-menu-button pi pi-chevron-down' : 'actions-menu-button pi pi-chevron-right'\r\n                \"\r\n              ></i>\r\n            </td>\r\n            <td *ngIf=\"hasActions\">\r\n              <p-menu #menu [model]=\"item.actions\" [popup]=\"true\" appendTo=\"body\"></p-menu>\r\n              <i class=\"actions-menu-button fas fa-cog\" (click)=\"menu.toggle($event)\"></i>\r\n            </td>\r\n            <ng-container *ngFor=\"let col of columns\">\r\n              <td\r\n                *ngIf=\"isHtmlCell(col)\"\r\n                class=\"cell\"\r\n                [innerHTML]=\"getCellContent(item, col)\"\r\n                (click)=\"col && col.clickFunction && col.clickFunction(item)\"\r\n                [ngStyle]=\"getColStyle(col)\"\r\n              ></td>\r\n              <td\r\n                *ngIf=\"(!isHtmlCell(col) && !!col.getStatus) || isScoreCell(col)\"\r\n                class=\"cell\"\r\n                (click)=\"col && col.clickFunction && col.clickFunction(item)\"\r\n                [ngStyle]=\"getColStyle(col)\"\r\n              >\r\n                <vector-badge\r\n                  *ngIf=\"isBadgeCell(col)\"\r\n                  [label]=\"getCellText(item, col)\"\r\n                  [type]=\"col.getStatus && col.getStatus(item[col.field])\"\r\n                  [tooltip]=\"getTooltipText(item, col)\"\r\n                ></vector-badge>\r\n                <vector-score *ngIf=\"isScoreCell(col)\" [score]=\"item[col.field]\"></vector-score>\r\n              </td>\r\n            </ng-container>\r\n          </tr>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"emptymessage\">\r\n          <tr class=\"row\">\r\n            <td class=\"no-results\" [attr.colspan]=\"columns.length + 1\">Nenhum resultado encontrado</td>\r\n          </tr>\r\n        </ng-template>\r\n        <ng-template pTemplate=\"paginatorright\"> </ng-template>\r\n        <ng-template let-item pTemplate=\"paginatordropdownitem\"> {{ item.value }} </ng-template>\r\n        <ng-template pTemplate=\"rowexpansion\" let-item>\r\n          <tr>\r\n            <td [attr.colspan]=\"columns.length + (hasActions ? 1 : 0)\">\r\n              <ng-container *ngTemplateOutlet=\"expansionTemplate; context: { item }\"> </ng-container>\r\n            </td>\r\n          </tr>\r\n        </ng-template>\r\n      </p-table>\r\n    </vector-panel>\r\n  </div>\r\n</div>\r\n", styles: [".no-results{padding:15px;background-color:#fff;width:100%}.centered{display:flex;justify-content:center}.table-header-actions{display:flex;justify-content:flex-end;align-items:flex-end;width:100%;padding-right:7px;margin-bottom:15px!important}@media (min-width: 768px){.table-header-actions{margin-top:-3px}}.table-header-actions .export-button{padding:7px 10px;color:#fff;display:flex;align-items:center;border:none;border-radius:5px;margin:5px;font-size:.75rem;cursor:pointer}.table-header-actions .export-button.export-excel{background-color:var(--success-color)}.table-header-actions .export-button.export-excel:hover{background-color:var(--success-color-dark)}.table-header-actions .export-button.export-pdf{background-color:var(--error-color)}.table-header-actions .export-button.export-pdf:hover{background-color:var(--error-color-dark)}.table-header-actions .export-button.custom-function{background-color:var(--theme-primary)}.table-header-actions .export-button.custom-function:hover{background-color:var(--theme-medium)}.table-header-actions .export-button i{color:#fff}.table-header-actions .export-button span{margin-left:5px}.table-header-actions .add-item-button{margin-left:10px}.actions-menu-button{font-size:23px;cursor:pointer;color:var(--theme-medium)}.expandable{cursor:pointer}\n"] }]
+            args: [{ selector: 'vector-data-table', template: "<div class=\"grid\">\n  <div class=\"col-12\">\n    <vector-filters\n      [fields]=\"filters\"\n      (onSearch)=\"lazyLoaded({ filter: true, data: $event })\"\n      (formBuilded)=\"subscribeToFilterChanges()\"\n    ></vector-filters>\n  </div>\n  <div class=\"table-header-actions field\" *ngIf=\"addItemLabel || exportExcel || exportPDF || customFunction\">\n    <button *ngIf=\"exportExcel\" (click)=\"onExportExcel.emit()\" class=\"export-button export-excel\">\n      <i class=\"fas fa-file-excel\"></i><span>Excel</span>\n    </button>\n    <button *ngIf=\"exportPDF\" (click)=\"onExportPDF.emit()\" class=\"export-button export-pdf\">\n      <i class=\"fas fa-file-pdf\"></i><span>PDF</span>\n    </button>\n    <button\n      *ngFor=\"let button of customFunction\"\n      (click)=\"button.clickFunction()\"\n      class=\"export-button custom-function\"\n    >\n      <i *ngIf=\"button?.icon\" class=\"{{ button?.icon }}\"></i><span>{{ button?.label }}</span>\n    </button>\n\n    <vector-button\n      *ngFor=\"let button of customButtons\"\n      class=\"add-item-button\"\n      [label]=\"button.label\"\n      (click)=\"button.clickFunction()\"\n      [rightIcon]=\"addItemButtonPlusSign ? 'pi pi-plus' : ''\"\n    ></vector-button>\n    <vector-button\n      *ngIf=\"addItemLabel\"\n      class=\"add-item-button\"\n      [label]=\"addItemLabel\"\n      (click)=\"onAdd.emit()\"\n      [rightIcon]=\"addItemButtonPlusSign ? 'pi pi-plus' : ''\"\n    ></vector-button>\n  </div>\n  <div class=\"col-12\">\n    <vector-panel class=\"data-table-panel\">\n      <p-tabView (onChange)=\"onTabChange($event)\" *ngIf=\"tabs?.length\">\n        <p-tabPanel *ngFor=\"let tab of tabs\">\n          <ng-template pTemplate=\"header\">\n            <em *ngIf=\"tab.icon\" [class]=\"tab.icon\">&nbsp;</em>\n            <span>{{ tab.name }}</span>\n          </ng-template>\n        </p-tabPanel>\n      </p-tabView>\n      <p-table\n        currentPageReportTemplate=\"Mostrando {first} at\u00E9 {last} de {totalRecords} registros\"\n        sortMode=\"single\"\n        [rows]=\"10\"\n        [lazy]=\"pagination && !virtualPagination\"\n        [value]=\"data\"\n        [paginator]=\"pagination\"\n        [totalRecords]=\"totalRecords\"\n        [showCurrentPageReport]=\"true\"\n        [rowsPerPageOptions]=\"[10, 25, 50, 100]\"\n        [responsive]=\"true\"\n        [resizableColumns]=\"true\"\n        [scrollable]=\"true\"\n        scrollDirection=\"vertical\"\n        responsiveLayout=\"scroll\"\n        dataKey=\"id\"\n        [scrollHeight]=\"height\"\n        [attr.selectionMode]=\"selectionMode\"\n        [(selection)]=\"selectedItems\"\n        (onRowSelect)=\"changeSelectedItems($event)\"\n        (onHeaderCheckboxToggle)=\"changeSelectedItems($event)\"\n        (onRowUnselect)=\"changeSelectedItems($event)\"\n        (onLazyLoad)=\"lazyLoaded({ filter: false, data: $event })\"\n        (selectionChange)=\"onSelectionChange($event)\"\n      >\n        <ng-template pTemplate=\"header\">\n          <tr class=\"header\">\n            <th *ngIf=\"selectionType === 'checkbox'\">\n              <p-tableHeaderCheckbox [disabled]=\"disabledHeadercheckbox\"></p-tableHeaderCheckbox>\n            </th>\n            <th class=\"text-center\" *ngIf=\"hasExpandableIcon\">\n              {{ addNameColumnExpand }}\n            </th>\n            <th *ngIf=\"hasActions\">{{ 'app.label.actions' | translate }}</th>\n            <th\n              *ngFor=\"let col of columns\"\n              [ngStyle]=\"getColStyle(col)\"\n              [pSortableColumn]=\"col.notSortable ? '' : col.field\"\n            >\n              <div class=\"flex align-items-center\">\n                <span>{{ col.header }}</span> <p-sortIcon *ngIf=\"!col.notSortable\" [field]=\"col.field\"></p-sortIcon>\n              </div>\n            </th>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"body\" let-rowData let-item let-expanded=\"expanded\">\n          <tr\n            class=\"row\"\n            [pSelectableRow]=\"rowData\"\n            [ngClass]=\"{ expandable: expandable }\"\n            [pRowToggler]=\"expandable ? item : undefined\"\n            (click)=\"onRowClick(item)\"\n          >\n            <ng-container *ngIf=\"selectionType === 'checkbox'\">\n              <td style=\"max-width: 3rem; padding-left: 10px\" class=\"flex justify-content-center align-items-center\">\n                <p-tableCheckbox [value]=\"item\" [disabled]=\"item.disabledCheckBox\"></p-tableCheckbox>\n              </td>\n            </ng-container>\n            <ng-container *ngIf=\"selectionType === 'radiobutton'\">\n              <td style=\"max-width: 3rem; padding-left: 10px\" class=\"flex justify-content-center align-items-center\">\n                <p-tableRadioButton [value]=\"item\"></p-tableRadioButton>\n              </td>\n            </ng-container>\n            <td *ngIf=\"hasExpandableIcon\" style=\"max-width: 150px\" class=\"centered\">\n              <p-menu #menu [model]=\"item.actions\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n              <i\n                [ngClass]=\"\n                  expanded ? 'actions-menu-button pi pi-chevron-down' : 'actions-menu-button pi pi-chevron-right'\n                \"\n              ></i>\n            </td>\n            <td *ngIf=\"hasActions\">\n              <p-menu #menu [model]=\"item.actions\" [popup]=\"true\" appendTo=\"body\"></p-menu>\n              <i class=\"actions-menu-button fas fa-cog\" (click)=\"menu.toggle($event)\"></i>\n            </td>\n            <ng-container *ngFor=\"let col of columns\">\n              <td\n                *ngIf=\"isHtmlCell(col)\"\n                class=\"cell\"\n                [innerHTML]=\"getCellContent(item, col)\"\n                (click)=\"col && col.clickFunction && col.clickFunction(item)\"\n                [ngStyle]=\"getColStyle(col)\"\n              ></td>\n              <td\n                *ngIf=\"(!isHtmlCell(col) && !!col.getStatus) || isScoreCell(col)\"\n                class=\"cell\"\n                (click)=\"col && col.clickFunction && col.clickFunction(item)\"\n                [ngStyle]=\"getColStyle(col)\"\n              >\n                <vector-badge\n                  *ngIf=\"isBadgeCell(col)\"\n                  [label]=\"getCellText(item, col)\"\n                  [type]=\"col.getStatus && col.getStatus(item[col.field])\"\n                  [tooltip]=\"getTooltipText(item, col)\"\n                ></vector-badge>\n                <vector-score *ngIf=\"isScoreCell(col)\" [score]=\"item[col.field]\"></vector-score>\n              </td>\n            </ng-container>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"emptymessage\">\n          <tr class=\"row\">\n            <td class=\"no-results\" [attr.colspan]=\"columns.length + 1\">Nenhum resultado encontrado</td>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"paginatorright\"> </ng-template>\n        <ng-template let-item pTemplate=\"paginatordropdownitem\"> {{ item.value }} </ng-template>\n        <ng-template pTemplate=\"rowexpansion\" let-item>\n          <tr>\n            <td [attr.colspan]=\"columns.length + (hasActions ? 1 : 0)\">\n              <ng-container *ngTemplateOutlet=\"expansionTemplate; context: { item }\"> </ng-container>\n            </td>\n          </tr>\n        </ng-template>\n      </p-table>\n    </vector-panel>\n  </div>\n</div>\n", styles: [".no-results{padding:15px;background-color:#fff;width:100%}.centered{display:flex;justify-content:center}.table-header-actions{display:flex;justify-content:flex-end;align-items:flex-end;width:100%;padding-right:7px;margin-bottom:15px!important}@media (min-width: 768px){.table-header-actions{margin-top:-3px}}.table-header-actions .export-button{padding:7px 10px;color:#fff;display:flex;align-items:center;border:none;border-radius:5px;margin:5px;font-size:.75rem;cursor:pointer}.table-header-actions .export-button.export-excel{background-color:var(--success-color)}.table-header-actions .export-button.export-excel:hover{background-color:var(--success-color-dark)}.table-header-actions .export-button.export-pdf{background-color:var(--error-color)}.table-header-actions .export-button.export-pdf:hover{background-color:var(--error-color-dark)}.table-header-actions .export-button.custom-function{background-color:var(--theme-primary)}.table-header-actions .export-button.custom-function:hover{background-color:var(--theme-medium)}.table-header-actions .export-button i{color:#fff}.table-header-actions .export-button span{margin-left:5px}.table-header-actions .add-item-button{margin-left:10px}.actions-menu-button{font-size:23px;cursor:pointer;color:var(--theme-medium)}.expandable{cursor:pointer}\n"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { columns: [{
                 type: Input
             }], data: [{
@@ -3657,12 +3719,12 @@ class InputNumberFieldComponent {
         }
         return '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: InputNumberFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: InputNumberFieldComponent, selector: "vector-input-number", inputs: { inputId: "inputId", control: "control", showButtons: "showButtons", type: "type", minFractionDigits: "minFractionDigits", maxFractionDigits: "maxFractionDigits", buttonLayout: "buttonLayout", incrementButtonIcon: "incrementButtonIcon", decrementButtonIcon: "decrementButtonIcon", min: "min", step: "step", disabled: "disabled", max: "max", suffix: "suffix" }, outputs: { onFocus: "onFocus", onBlur: "onBlur", onInput: "onInput", onClear: "onClear" }, ngImport: i0, template: "<div class=\"input-container\">\r\n  <p-inputNumber\r\n    [inputId]=\"inputId\"\r\n    [formControl]=\"control\"\r\n    [min]=\"min\"\r\n    [max]=\"max\"\r\n    [suffix]=\"suffix\"\r\n    [step]=\"step\"\r\n    [minFractionDigits]=\"minFractionDigits\"\r\n    [maxFractionDigits]=\"maxFractionDigits\"\r\n    [showButtons]=\"showButtons\"\r\n    [disabled]=\"disabled\"\r\n    [buttonLayout]=\"buttonLayout\"\r\n    [incrementButtonIcon]=\"incrementButtonIcon\"\r\n    [decrementButtonIcon]=\"decrementButtonIcon\"\r\n    (onBlur)=\"onBlur.emit($event)\"\r\n    (onFocus)=\"onFocus.emit($event)\"\r\n  ></p-inputNumber>\r\n  <vector-field-error-message [control]=\"control\"></vector-field-error-message>\r\n</div>\r\n", styles: [".input-container{width:100%;position:relative;display:block}\n"], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: ["control"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputNumberFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: InputNumberFieldComponent, selector: "vector-input-number", inputs: { inputId: "inputId", control: "control", showButtons: "showButtons", type: "type", minFractionDigits: "minFractionDigits", maxFractionDigits: "maxFractionDigits", buttonLayout: "buttonLayout", incrementButtonIcon: "incrementButtonIcon", decrementButtonIcon: "decrementButtonIcon", min: "min", step: "step", disabled: "disabled", max: "max", suffix: "suffix" }, outputs: { onFocus: "onFocus", onBlur: "onBlur", onInput: "onInput", onClear: "onClear" }, ngImport: i0, template: "<div class=\"input-container\">\n  <p-inputNumber\n    [inputId]=\"inputId\"\n    [formControl]=\"control\"\n    [min]=\"min\"\n    [max]=\"max\"\n    [suffix]=\"suffix\"\n    [step]=\"step\"\n    [minFractionDigits]=\"minFractionDigits\"\n    [maxFractionDigits]=\"maxFractionDigits\"\n    [showButtons]=\"showButtons\"\n    [disabled]=\"disabled\"\n    [buttonLayout]=\"buttonLayout\"\n    [incrementButtonIcon]=\"incrementButtonIcon\"\n    [decrementButtonIcon]=\"decrementButtonIcon\"\n    (onBlur)=\"onBlur.emit($event)\"\n    (onFocus)=\"onFocus.emit($event)\"\n  ></p-inputNumber>\n  <vector-field-error-message [control]=\"control\"></vector-field-error-message>\n</div>\n", styles: [".input-container{width:100%;position:relative;display:block}\n"], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "component", type: FieldErrorMessageComponent, selector: "vector-field-error-message", inputs: ["control"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: InputNumberFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputNumberFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-input-number', template: "<div class=\"input-container\">\r\n  <p-inputNumber\r\n    [inputId]=\"inputId\"\r\n    [formControl]=\"control\"\r\n    [min]=\"min\"\r\n    [max]=\"max\"\r\n    [suffix]=\"suffix\"\r\n    [step]=\"step\"\r\n    [minFractionDigits]=\"minFractionDigits\"\r\n    [maxFractionDigits]=\"maxFractionDigits\"\r\n    [showButtons]=\"showButtons\"\r\n    [disabled]=\"disabled\"\r\n    [buttonLayout]=\"buttonLayout\"\r\n    [incrementButtonIcon]=\"incrementButtonIcon\"\r\n    [decrementButtonIcon]=\"decrementButtonIcon\"\r\n    (onBlur)=\"onBlur.emit($event)\"\r\n    (onFocus)=\"onFocus.emit($event)\"\r\n  ></p-inputNumber>\r\n  <vector-field-error-message [control]=\"control\"></vector-field-error-message>\r\n</div>\r\n", styles: [".input-container{width:100%;position:relative;display:block}\n"] }]
+            args: [{ selector: 'vector-input-number', template: "<div class=\"input-container\">\n  <p-inputNumber\n    [inputId]=\"inputId\"\n    [formControl]=\"control\"\n    [min]=\"min\"\n    [max]=\"max\"\n    [suffix]=\"suffix\"\n    [step]=\"step\"\n    [minFractionDigits]=\"minFractionDigits\"\n    [maxFractionDigits]=\"maxFractionDigits\"\n    [showButtons]=\"showButtons\"\n    [disabled]=\"disabled\"\n    [buttonLayout]=\"buttonLayout\"\n    [incrementButtonIcon]=\"incrementButtonIcon\"\n    [decrementButtonIcon]=\"decrementButtonIcon\"\n    (onBlur)=\"onBlur.emit($event)\"\n    (onFocus)=\"onFocus.emit($event)\"\n  ></p-inputNumber>\n  <vector-field-error-message [control]=\"control\"></vector-field-error-message>\n</div>\n", styles: [".input-container{width:100%;position:relative;display:block}\n"] }]
         }], propDecorators: { inputId: [{
                 type: Input
             }], control: [{
@@ -3701,17 +3763,63 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
                 type: Output
             }] } });
 
+class InputOtpComponent {
+    constructor() {
+        this.integerOnly = false;
+        this.length = 6;
+        this.isReadonly = false;
+        this.isDisabled = false;
+        this.isInvalid = false;
+        this.onChangeOtp = new EventEmitter();
+        this.onBlurOtp = new EventEmitter();
+        this.onFocusOtp = new EventEmitter();
+    }
+    onChange($event) {
+        this.onChangeOtp.emit($event);
+    }
+    onBlur($event) {
+        this.onBlurOtp.emit($event);
+    }
+    onFocus($event) {
+        this.onFocusOtp.emit($event);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputOtpComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: InputOtpComponent, selector: "vector-input-otp", inputs: { integerOnly: "integerOnly", length: "length", inputValue: "inputValue", isReadonly: "isReadonly", isDisabled: "isDisabled", isInvalid: "isInvalid" }, outputs: { onChangeOtp: "onChangeOtp", onBlurOtp: "onBlurOtp", onFocusOtp: "onFocusOtp" }, ngImport: i0, template: "<p-inputOtp\n  class=\"custom-field-text input-otp\"\n  [integerOnly]=\"integerOnly\"\n  [length]=\"length\"\n  [ngModel]=\"inputValue\"\n  [invalid]=\"isInvalid\"\n  [disabled]=\"isDisabled\"\n  [readonly]=\"isReadonly\"\n  (onChange)=\"onChange($event)\"\n  (onBlur)=\"onBlur($event)\"\n  (onFocus)=\"onFocus($event)\"\n></p-inputOtp>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$4.InputOtp, selector: "p-inputOtp", inputs: ["invalid", "disabled", "readonly", "variant", "tabindex", "length", "mask", "integerOnly", "autofocus"], outputs: ["onChange", "onFocus", "onBlur"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputOtpComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'vector-input-otp', template: "<p-inputOtp\n  class=\"custom-field-text input-otp\"\n  [integerOnly]=\"integerOnly\"\n  [length]=\"length\"\n  [ngModel]=\"inputValue\"\n  [invalid]=\"isInvalid\"\n  [disabled]=\"isDisabled\"\n  [readonly]=\"isReadonly\"\n  (onChange)=\"onChange($event)\"\n  (onBlur)=\"onBlur($event)\"\n  (onFocus)=\"onFocus($event)\"\n></p-inputOtp>\n" }]
+        }], propDecorators: { integerOnly: [{
+                type: Input
+            }], length: [{
+                type: Input
+            }], inputValue: [{
+                type: Input
+            }], isReadonly: [{
+                type: Input
+            }], isDisabled: [{
+                type: Input
+            }], isInvalid: [{
+                type: Input
+            }], onChangeOtp: [{
+                type: Output
+            }], onBlurOtp: [{
+                type: Output
+            }], onFocusOtp: [{
+                type: Output
+            }] } });
+
 class InputSwitchFieldComponent {
     constructor() {
         this.disabled = false;
     }
     ngOnInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: InputSwitchFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: InputSwitchFieldComponent, selector: "vector-input-switch-field", inputs: { control: "control", disabled: "disabled" }, ngImport: i0, template: "<p-inputSwitch [formControl]=\"control\" [disabled]=\"disabled\"></p-inputSwitch>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$4.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy"], outputs: ["onChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputSwitchFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: InputSwitchFieldComponent, selector: "vector-input-switch-field", inputs: { control: "control", disabled: "disabled" }, ngImport: i0, template: "<p-inputSwitch [formControl]=\"control\" [disabled]=\"disabled\"></p-inputSwitch>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$5.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabel", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: InputSwitchFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputSwitchFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-input-switch-field', template: "<p-inputSwitch [formControl]=\"control\" [disabled]=\"disabled\"></p-inputSwitch>\r\n" }]
+            args: [{ selector: 'vector-input-switch-field', template: "<p-inputSwitch [formControl]=\"control\" [disabled]=\"disabled\"></p-inputSwitch>\n" }]
         }], propDecorators: { control: [{
                 type: Input
             }], disabled: [{
@@ -3742,12 +3850,12 @@ class PercentageFieldComponent {
             });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PercentageFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: PercentageFieldComponent, selector: "vector-percentage-field", inputs: { control: "control", min: "min", max: "max", minFractionDigits: "minFractionDigits", maxFractionDigits: "maxFractionDigits", step: "step" }, outputs: { blurEvent: "blurEvent", enterKeyPress: "enterKeyPress", focusEvent: "focusEvent" }, ngImport: i0, template: "<form class=\"input-container\">\r\n  <p-inputNumber\r\n    [formControl]=\"control\"\r\n    suffix=\"%\"\r\n    [min]=\"min\"\r\n    [max]=\"max\"\r\n    [minFractionDigits]=\"minFractionDigits\"\r\n    [maxFractionDigits]=\"maxFractionDigits\"\r\n    [step]=\"step\"\r\n    [showButtons]=\"step > 1\"\r\n    buttonLayout=\"horizontal\"\r\n    decrementButtonIcon=\"pi pi-minus-circle\"\r\n    incrementButtonIcon=\"pi pi-plus-circle\"\r\n    (onBlur)=\"onBlur()\"\r\n  ></p-inputNumber>\r\n</form>\r\n", styles: [".input-container{width:100%}\n"], dependencies: [{ kind: "directive", type: i1$5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PercentageFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: PercentageFieldComponent, selector: "vector-percentage-field", inputs: { control: "control", min: "min", max: "max", minFractionDigits: "minFractionDigits", maxFractionDigits: "maxFractionDigits", step: "step" }, outputs: { blurEvent: "blurEvent", enterKeyPress: "enterKeyPress", focusEvent: "focusEvent" }, ngImport: i0, template: "<form class=\"input-container\">\n  <p-inputNumber\n    [formControl]=\"control\"\n    suffix=\"%\"\n    [min]=\"min\"\n    [max]=\"max\"\n    [minFractionDigits]=\"minFractionDigits\"\n    [maxFractionDigits]=\"maxFractionDigits\"\n    [step]=\"step\"\n    [showButtons]=\"step > 1\"\n    buttonLayout=\"horizontal\"\n    decrementButtonIcon=\"pi pi-minus-circle\"\n    incrementButtonIcon=\"pi pi-plus-circle\"\n    (onBlur)=\"onBlur()\"\n  ></p-inputNumber>\n</form>\n", styles: [".input-container{width:100%}\n"], dependencies: [{ kind: "directive", type: i1$5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i2$2.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabelledBy", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "variant", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: PercentageFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: PercentageFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-percentage-field', template: "<form class=\"input-container\">\r\n  <p-inputNumber\r\n    [formControl]=\"control\"\r\n    suffix=\"%\"\r\n    [min]=\"min\"\r\n    [max]=\"max\"\r\n    [minFractionDigits]=\"minFractionDigits\"\r\n    [maxFractionDigits]=\"maxFractionDigits\"\r\n    [step]=\"step\"\r\n    [showButtons]=\"step > 1\"\r\n    buttonLayout=\"horizontal\"\r\n    decrementButtonIcon=\"pi pi-minus-circle\"\r\n    incrementButtonIcon=\"pi pi-plus-circle\"\r\n    (onBlur)=\"onBlur()\"\r\n  ></p-inputNumber>\r\n</form>\r\n", styles: [".input-container{width:100%}\n"] }]
+            args: [{ selector: 'vector-percentage-field', template: "<form class=\"input-container\">\n  <p-inputNumber\n    [formControl]=\"control\"\n    suffix=\"%\"\n    [min]=\"min\"\n    [max]=\"max\"\n    [minFractionDigits]=\"minFractionDigits\"\n    [maxFractionDigits]=\"maxFractionDigits\"\n    [step]=\"step\"\n    [showButtons]=\"step > 1\"\n    buttonLayout=\"horizontal\"\n    decrementButtonIcon=\"pi pi-minus-circle\"\n    incrementButtonIcon=\"pi pi-plus-circle\"\n    (onBlur)=\"onBlur()\"\n  ></p-inputNumber>\n</form>\n", styles: [".input-container{width:100%}\n"] }]
         }], propDecorators: { control: [{
                 type: Input
             }], min: [{
@@ -3792,12 +3900,12 @@ class RadioButtonFieldComponent {
         const label = this.translateService.instant('app.label.no');
         return label !== 'app.label.no' ? label : 'Não';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: RadioButtonFieldComponent, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: RadioButtonFieldComponent, selector: "vector-radio-button-field", inputs: { groupName: "groupName", options: "options", control: "control", layout: "layout", justifySpaceBetween: "justifySpaceBetween", addIcon: "addIcon" }, ngImport: i0, template: "<div\r\n  class=\"radio-buttons-container\"\r\n  [ngClass]=\"layoutClass\"\r\n  [ngStyle]=\"{ 'justify-content': justifySpaceBetween ? 'space-between' : 'flex-start' }\"\r\n>\r\n  <div *ngFor=\"let option of options\" class=\"radio-button-item\">\r\n    <p-radioButton\r\n      [name]=\"groupName\"\r\n      [value]=\"option.value\"\r\n      [label]=\"option.label\"\r\n      [formControl]=\"control\"\r\n    ></p-radioButton>\r\n    <i\r\n      *ngIf=\"addIcon\"\r\n      class=\"fas fa-info-circle mt-1 pr-3 pl-2\"\r\n      pTooltip=\"{{ option.textTooltip }}\"\r\n      tooltipPosition=\"bottom\"\r\n    ></i>\r\n  </div>\r\n</div>\r\n", styles: [".radio-buttons-container{flex-wrap:wrap;height:100%;width:100%;padding-top:5px}.radio-buttons-container .radio-button-item{margin:5px;flex:1 100px}.vertical{flex-direction:column;align-items:flex-start}.vertical .radio-button-item{margin-bottom:.5rem}.horizontal{display:flex;flex-direction:row;padding-top:5px}.horizontal .radio-buttons-container .radio-button-item{margin:0 5px}\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: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i5$2.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass"], outputs: ["onClick", "onFocus", "onBlur"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RadioButtonFieldComponent, deps: [{ token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: RadioButtonFieldComponent, selector: "vector-radio-button-field", inputs: { groupName: "groupName", options: "options", control: "control", layout: "layout", justifySpaceBetween: "justifySpaceBetween", addIcon: "addIcon" }, ngImport: i0, template: "<div\n  class=\"radio-buttons-container\"\n  [ngClass]=\"layoutClass\"\n  [ngStyle]=\"{ 'justify-content': justifySpaceBetween ? 'space-between' : 'flex-start' }\"\n>\n  <div *ngFor=\"let option of options\" class=\"radio-button-item\">\n    <p-radioButton\n      [name]=\"groupName\"\n      [value]=\"option.value\"\n      [label]=\"option.label\"\n      [formControl]=\"control\"\n    ></p-radioButton>\n    <i\n      *ngIf=\"addIcon\"\n      class=\"fas fa-info-circle mt-1 pr-3 pl-2\"\n      pTooltip=\"{{ option.textTooltip }}\"\n      tooltipPosition=\"bottom\"\n    ></i>\n  </div>\n</div>\n", styles: [".radio-buttons-container{flex-wrap:wrap;height:100%;width:100%;padding-top:5px}.radio-buttons-container .radio-button-item{margin:5px;flex:1 100px}.vertical{flex-direction:column;align-items:flex-start}.vertical .radio-button-item{margin-bottom:.5rem}.horizontal{display:flex;flex-direction:row;padding-top:5px}.horizontal .radio-buttons-container .radio-button-item{margin:0 5px}\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: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i5$2.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: RadioButtonFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RadioButtonFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-radio-button-field', template: "<div\r\n  class=\"radio-buttons-container\"\r\n  [ngClass]=\"layoutClass\"\r\n  [ngStyle]=\"{ 'justify-content': justifySpaceBetween ? 'space-between' : 'flex-start' }\"\r\n>\r\n  <div *ngFor=\"let option of options\" class=\"radio-button-item\">\r\n    <p-radioButton\r\n      [name]=\"groupName\"\r\n      [value]=\"option.value\"\r\n      [label]=\"option.label\"\r\n      [formControl]=\"control\"\r\n    ></p-radioButton>\r\n    <i\r\n      *ngIf=\"addIcon\"\r\n      class=\"fas fa-info-circle mt-1 pr-3 pl-2\"\r\n      pTooltip=\"{{ option.textTooltip }}\"\r\n      tooltipPosition=\"bottom\"\r\n    ></i>\r\n  </div>\r\n</div>\r\n", styles: [".radio-buttons-container{flex-wrap:wrap;height:100%;width:100%;padding-top:5px}.radio-buttons-container .radio-button-item{margin:5px;flex:1 100px}.vertical{flex-direction:column;align-items:flex-start}.vertical .radio-button-item{margin-bottom:.5rem}.horizontal{display:flex;flex-direction:row;padding-top:5px}.horizontal .radio-buttons-container .radio-button-item{margin:0 5px}\n"] }]
+            args: [{ selector: 'vector-radio-button-field', template: "<div\n  class=\"radio-buttons-container\"\n  [ngClass]=\"layoutClass\"\n  [ngStyle]=\"{ 'justify-content': justifySpaceBetween ? 'space-between' : 'flex-start' }\"\n>\n  <div *ngFor=\"let option of options\" class=\"radio-button-item\">\n    <p-radioButton\n      [name]=\"groupName\"\n      [value]=\"option.value\"\n      [label]=\"option.label\"\n      [formControl]=\"control\"\n    ></p-radioButton>\n    <i\n      *ngIf=\"addIcon\"\n      class=\"fas fa-info-circle mt-1 pr-3 pl-2\"\n      pTooltip=\"{{ option.textTooltip }}\"\n      tooltipPosition=\"bottom\"\n    ></i>\n  </div>\n</div>\n", styles: [".radio-buttons-container{flex-wrap:wrap;height:100%;width:100%;padding-top:5px}.radio-buttons-container .radio-button-item{margin:5px;flex:1 100px}.vertical{flex-direction:column;align-items:flex-start}.vertical .radio-button-item{margin-bottom:.5rem}.horizontal{display:flex;flex-direction:row;padding-top:5px}.horizontal .radio-buttons-container .radio-button-item{margin:0 5px}\n"] }]
         }], ctorParameters: () => [{ type: i1$2.TranslateService }], propDecorators: { groupName: [{
                 type: Input
             }], options: [{
@@ -3860,12 +3968,12 @@ class RangeValueComponent {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: RangeValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: RangeValueComponent, selector: "vector-range-value", inputs: { value: "value", movimentedValue: "movimentedValue", min: "min", max: "max", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"range-input\">\r\n  <a href=\"javascript:void(0)\" class=\"btn-range minus\" (click)=\"decrement()\"></a>\r\n  <p-slider [(ngModel)]=\"value\" (onChange)=\"changeValue()\" [min]=\"min\" [max]=\"max\" [disabled]=\"disabled\"></p-slider>\r\n  <a href=\"javascript:void(0)\" class=\"btn-range plus\" (click)=\"increment()\"></a>\r\n</div>\r\n", styles: [".range-input{display:flex;flex-flow:row;align-items:center}.range-input .btn-range{width:26px;height:26px;display:flex;justify-content:center;align-items:center;background-color:#fff;border:2px solid var(--theme-dark);border-radius:4px;color:var(--theme-dark);text-decoration:none;font-size:1rem}.range-input .btn-range:hover{-webkit-transition:.2s linear;-moz-transition:.2s linear;-o-prop:.2s linear;background-color:var(--theme-dark);color:#fff}.range-input .minus:before{content:\"-\"}.range-input p-slider{flex:1;margin:0 10px}.range-input .plus:before{content:\"+\"}\n"], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$5.Slider, selector: "p-slider", inputs: ["animate", "disabled", "min", "max", "orientation", "step", "range", "style", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex"], outputs: ["onChange", "onSlideEnd"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RangeValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: RangeValueComponent, selector: "vector-range-value", inputs: { value: "value", movimentedValue: "movimentedValue", min: "min", max: "max", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"range-input\">\n  <a href=\"javascript:void(0)\" class=\"btn-range minus\" (click)=\"decrement()\"></a>\n  <p-slider [(ngModel)]=\"value\" (onChange)=\"changeValue()\" [min]=\"min\" [max]=\"max\" [disabled]=\"disabled\"></p-slider>\n  <a href=\"javascript:void(0)\" class=\"btn-range plus\" (click)=\"increment()\"></a>\n</div>\n", styles: [".range-input{display:flex;flex-flow:row;align-items:center}.range-input .btn-range{width:26px;height:26px;display:flex;justify-content:center;align-items:center;background-color:#fff;border:2px solid var(--theme-dark);border-radius:4px;color:var(--theme-dark);text-decoration:none;font-size:1rem}.range-input .btn-range:hover{-webkit-transition:.2s linear;-moz-transition:.2s linear;-o-prop:.2s linear;background-color:var(--theme-dark);color:#fff}.range-input .minus:before{content:\"-\"}.range-input p-slider{flex:1;margin:0 10px}.range-input .plus:before{content:\"+\"}\n"], dependencies: [{ kind: "directive", type: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2$6.Slider, selector: "p-slider", inputs: ["animate", "disabled", "min", "max", "orientation", "step", "range", "style", "styleClass", "ariaLabel", "ariaLabelledBy", "tabindex", "autofocus"], outputs: ["onChange", "onSlideEnd"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: RangeValueComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RangeValueComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-range-value', template: "<div class=\"range-input\">\r\n  <a href=\"javascript:void(0)\" class=\"btn-range minus\" (click)=\"decrement()\"></a>\r\n  <p-slider [(ngModel)]=\"value\" (onChange)=\"changeValue()\" [min]=\"min\" [max]=\"max\" [disabled]=\"disabled\"></p-slider>\r\n  <a href=\"javascript:void(0)\" class=\"btn-range plus\" (click)=\"increment()\"></a>\r\n</div>\r\n", styles: [".range-input{display:flex;flex-flow:row;align-items:center}.range-input .btn-range{width:26px;height:26px;display:flex;justify-content:center;align-items:center;background-color:#fff;border:2px solid var(--theme-dark);border-radius:4px;color:var(--theme-dark);text-decoration:none;font-size:1rem}.range-input .btn-range:hover{-webkit-transition:.2s linear;-moz-transition:.2s linear;-o-prop:.2s linear;background-color:var(--theme-dark);color:#fff}.range-input .minus:before{content:\"-\"}.range-input p-slider{flex:1;margin:0 10px}.range-input .plus:before{content:\"+\"}\n"] }]
+            args: [{ selector: 'vector-range-value', template: "<div class=\"range-input\">\n  <a href=\"javascript:void(0)\" class=\"btn-range minus\" (click)=\"decrement()\"></a>\n  <p-slider [(ngModel)]=\"value\" (onChange)=\"changeValue()\" [min]=\"min\" [max]=\"max\" [disabled]=\"disabled\"></p-slider>\n  <a href=\"javascript:void(0)\" class=\"btn-range plus\" (click)=\"increment()\"></a>\n</div>\n", styles: [".range-input{display:flex;flex-flow:row;align-items:center}.range-input .btn-range{width:26px;height:26px;display:flex;justify-content:center;align-items:center;background-color:#fff;border:2px solid var(--theme-dark);border-radius:4px;color:var(--theme-dark);text-decoration:none;font-size:1rem}.range-input .btn-range:hover{-webkit-transition:.2s linear;-moz-transition:.2s linear;-o-prop:.2s linear;background-color:var(--theme-dark);color:#fff}.range-input .minus:before{content:\"-\"}.range-input p-slider{flex:1;margin:0 10px}.range-input .plus:before{content:\"+\"}\n"] }]
         }], ctorParameters: () => [], propDecorators: { value: [{
                 type: Input
             }], movimentedValue: [{
@@ -3895,12 +4003,12 @@ class SearchFieldComponent {
     ngOnDestroy() {
         this.subscription.unsubscribe();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SearchFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: SearchFieldComponent, selector: "vector-search-field", inputs: { placeholder: "placeholder" }, outputs: { onSearch: "onSearch" }, ngImport: i0, template: "<vector-text-field [control]=\"formControl\" rightIcon=\"fas fa-search\" [label]=\"placeholder\"></vector-text-field>\r\n", styles: [""], dependencies: [{ kind: "component", type: TextFieldComponent, selector: "vector-text-field", inputs: ["isRequired", "label", "maxlength", "isPassword", "numeric", "numericPositive", "numericDotComma", "decimal", "onlyText", "alphaNumeric", "alphaNumericAndWhitespace", "mask", "autoClear", "readonly", "rightIcon", "centered", "enableDocumentTypeChoice", "hiddenErrorMessage", "leftLabel", "control", "inputId", "slotChar"], outputs: ["blurEvent", "enterKeyPress", "backSpaceKeyPress", "focusEvent", "onDocumentTypeChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SearchFieldComponent, selector: "vector-search-field", inputs: { placeholder: "placeholder" }, outputs: { onSearch: "onSearch" }, ngImport: i0, template: "<vector-text-field [control]=\"formControl\" rightIcon=\"fas fa-search\" [label]=\"placeholder\"></vector-text-field>\n", styles: [""], dependencies: [{ kind: "component", type: TextFieldComponent, selector: "vector-text-field", inputs: ["isRequired", "label", "maxlength", "isPassword", "numeric", "numericPositive", "numericDotComma", "decimal", "onlyText", "alphaNumeric", "alphaNumericAndWhitespace", "mask", "autoClear", "readonly", "rightIcon", "centered", "enableDocumentTypeChoice", "hiddenErrorMessage", "leftLabel", "control", "inputId", "slotChar"], outputs: ["blurEvent", "enterKeyPress", "backSpaceKeyPress", "focusEvent", "onDocumentTypeChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SearchFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SearchFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-search-field', template: "<vector-text-field [control]=\"formControl\" rightIcon=\"fas fa-search\" [label]=\"placeholder\"></vector-text-field>\r\n" }]
+            args: [{ selector: 'vector-search-field', template: "<vector-text-field [control]=\"formControl\" rightIcon=\"fas fa-search\" [label]=\"placeholder\"></vector-text-field>\n" }]
         }], ctorParameters: () => [], propDecorators: { placeholder: [{
                 type: Input
             }], onSearch: [{
@@ -3958,12 +4066,12 @@ class TextareaFieldComponent {
         const target = $event.target;
         this.focusEvent.emit(target?.value);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TextareaFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: TextareaFieldComponent, selector: "vector-textarea-field", inputs: { isRequired: "isRequired", label: "label", maxlength: "maxlength", rows: "rows", cols: "cols", control: "control" }, outputs: { blurEvent: "blurEvent", enterKeyPress: "enterKeyPress", focusEvent: "focusEvent" }, ngImport: i0, template: "<form class=\"input-container\">\r\n  <textarea\r\n    pInputTextarea\r\n    [rows]=\"rows\"\r\n    [cols]=\"cols\"\r\n    [formControl]=\"control\"\r\n    [attr.maxlength]=\"maxlength\"\r\n    [placeholder]=\"placeholder\"\r\n    [autoResize]=\"false\"\r\n    (onBlur)=\"onBlur()\"\r\n    (keydown.enter)=\"onEnterPress()\"\r\n    (click)=\"onFocus($event)\"\r\n  >\r\n  </textarea>\r\n  <span class=\"length-control\">{{ control?.value?.length || 0 }} / {{ maxlength }}</span>\r\n</form>\r\n", styles: [".input-container{width:100%;position:relative}.input-container .length-control{position:absolute;right:15px;bottom:15px;opacity:.8;font-size:.6rem}\n"], dependencies: [{ kind: "directive", type: i1$5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$5.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: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$6.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize"], outputs: ["onResize"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TextareaFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TextareaFieldComponent, selector: "vector-textarea-field", inputs: { isRequired: "isRequired", label: "label", maxlength: "maxlength", rows: "rows", cols: "cols", control: "control" }, outputs: { blurEvent: "blurEvent", enterKeyPress: "enterKeyPress", focusEvent: "focusEvent" }, ngImport: i0, template: "<form class=\"input-container\">\n  <textarea\n    pInputTextarea\n    [rows]=\"rows\"\n    [cols]=\"cols\"\n    [formControl]=\"control\"\n    [attr.maxlength]=\"maxlength\"\n    [placeholder]=\"placeholder\"\n    [autoResize]=\"false\"\n    (onBlur)=\"onBlur()\"\n    (keydown.enter)=\"onEnterPress()\"\n    (click)=\"onFocus($event)\"\n  >\n  </textarea>\n  <span class=\"length-control\">{{ control?.value?.length || 0 }} / {{ maxlength }}</span>\n</form>\n", styles: [".input-container{width:100%;position:relative}.input-container .length-control{position:absolute;right:15px;bottom:15px;opacity:.8;font-size:.6rem}\n"], dependencies: [{ kind: "directive", type: i1$5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$5.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: i1$5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2$7.InputTextarea, selector: "[pInputTextarea]", inputs: ["autoResize", "variant"], outputs: ["onResize"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TextareaFieldComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TextareaFieldComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-textarea-field', template: "<form class=\"input-container\">\r\n  <textarea\r\n    pInputTextarea\r\n    [rows]=\"rows\"\r\n    [cols]=\"cols\"\r\n    [formControl]=\"control\"\r\n    [attr.maxlength]=\"maxlength\"\r\n    [placeholder]=\"placeholder\"\r\n    [autoResize]=\"false\"\r\n    (onBlur)=\"onBlur()\"\r\n    (keydown.enter)=\"onEnterPress()\"\r\n    (click)=\"onFocus($event)\"\r\n  >\r\n  </textarea>\r\n  <span class=\"length-control\">{{ control?.value?.length || 0 }} / {{ maxlength }}</span>\r\n</form>\r\n", styles: [".input-container{width:100%;position:relative}.input-container .length-control{position:absolute;right:15px;bottom:15px;opacity:.8;font-size:.6rem}\n"] }]
+            args: [{ selector: 'vector-textarea-field', template: "<form class=\"input-container\">\n  <textarea\n    pInputTextarea\n    [rows]=\"rows\"\n    [cols]=\"cols\"\n    [formControl]=\"control\"\n    [attr.maxlength]=\"maxlength\"\n    [placeholder]=\"placeholder\"\n    [autoResize]=\"false\"\n    (onBlur)=\"onBlur()\"\n    (keydown.enter)=\"onEnterPress()\"\n    (click)=\"onFocus($event)\"\n  >\n  </textarea>\n  <span class=\"length-control\">{{ control?.value?.length || 0 }} / {{ maxlength }}</span>\n</form>\n", styles: [".input-container{width:100%;position:relative}.input-container .length-control{position:absolute;right:15px;bottom:15px;opacity:.8;font-size:.6rem}\n"] }]
         }], propDecorators: { isRequired: [{
                 type: Input
             }], label: [{
@@ -3985,8 +4093,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
             }] } });
 
 class FieldsModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FieldsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: FieldsModule, declarations: [DataTableComponent,
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FieldsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: FieldsModule, declarations: [DataTableComponent,
             TextFieldComponent,
             CheckboxFieldComponent,
             ButtonComponent,
@@ -4003,7 +4111,8 @@ class FieldsModule {
             FieldErrorMessageComponent,
             SelectButtonFieldComponent,
             InputNumberFieldComponent,
-            InputSwitchFieldComponent], imports: [SharedModule,
+            InputSwitchFieldComponent,
+            InputOtpComponent], imports: [SharedModule,
             FormsModule,
             ReactiveFormsModule,
             KeyFilterModule,
@@ -4030,7 +4139,8 @@ class FieldsModule {
             TranslateModule,
             InputSwitchModule,
             MenuModule$1,
-            TableModule], exports: [DataTableComponent,
+            TableModule,
+            InputOtpModule], exports: [DataTableComponent,
             TextFieldComponent,
             CheckboxFieldComponent,
             ButtonComponent,
@@ -4049,8 +4159,9 @@ class FieldsModule {
             FieldErrorMessageComponent,
             SelectButtonFieldComponent,
             InputNumberFieldComponent,
-            InputSwitchFieldComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FieldsModule, imports: [SharedModule,
+            InputSwitchFieldComponent,
+            InputOtpComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FieldsModule, imports: [SharedModule,
             FormsModule,
             ReactiveFormsModule,
             KeyFilterModule,
@@ -4077,10 +4188,11 @@ class FieldsModule {
             TranslateModule,
             InputSwitchModule,
             MenuModule$1,
-            TableModule, FileUploadModule,
+            TableModule,
+            InputOtpModule, FileUploadModule,
             DialogModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FieldsModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FieldsModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [
@@ -4112,6 +4224,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
                         InputSwitchModule,
                         MenuModule$1,
                         TableModule,
+                        InputOtpModule,
                     ],
                     declarations: [
                         DataTableComponent,
@@ -4132,6 +4245,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
                         SelectButtonFieldComponent,
                         InputNumberFieldComponent,
                         InputSwitchFieldComponent,
+                        InputOtpComponent,
                     ],
                     exports: [
                         DataTableComponent,
@@ -4154,16 +4268,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
                         SelectButtonFieldComponent,
                         InputNumberFieldComponent,
                         InputSwitchFieldComponent,
+                        InputOtpComponent,
                     ],
                 }]
         }] });
 
 class FooterModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FooterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: FooterModule, declarations: [CrudFooterComponent], imports: [SharedModule, FieldsModule, TranslateModule], exports: [CrudFooterComponent, TranslateModule] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FooterModule, imports: [SharedModule, FieldsModule, TranslateModule, TranslateModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FooterModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: FooterModule, declarations: [CrudFooterComponent], imports: [SharedModule, FieldsModule, TranslateModule], exports: [CrudFooterComponent, TranslateModule] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FooterModule, imports: [SharedModule, FieldsModule, TranslateModule, TranslateModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: FooterModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FooterModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [CrudFooterComponent],
@@ -4186,12 +4301,12 @@ class CrudHeaderComponent {
     }
     constructor() { }
     ngOnInit() { }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: CrudHeaderComponent, selector: "vector-crud-header", inputs: { statusCode: "statusCode", code: "code" }, ngImport: i0, template: "<div class=\"container\">\r\n  <div class=\"status-container\">\r\n    <span>Status</span>\r\n    <vector-badge [label]=\"statusLabel\" [type]=\"statusCode\"></vector-badge>\r\n  </div>\r\n  <div class=\"separator\"></div>\r\n  <span class=\"code-label\"\r\n    >C\u00F3digo de identifica\u00E7\u00E3o<span class=\"code\">{{ code }}</span></span\r\n  >\r\n</div>\r\n", styles: [".container{display:flex;align-items:center;margin-bottom:15px;justify-content:space-between;flex-wrap:wrap}@media (min-width: 441px){.container{justify-content:flex-end;height:40px}}.container .status-container{display:flex;align-items:center}.container .status-container vector-badge{margin-left:15px}.container .separator{width:1px;height:100%;margin:0 20px;background-color:var(--gray-medium)}@media (max-width: 440px){.container .separator{display:none}}.container .code-label{color:var(--form-labels-color);font-size:13px;max-width:150px;line-height:1rem}.container .code-label .code{color:#000;font-weight:600;font-size:20px;margin-left:10px}\n"], dependencies: [{ kind: "component", type: BadgeComponent, selector: "vector-badge", inputs: ["type", "label", "customColor", "customBackgroundColor", "tooltip"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CrudHeaderComponent, selector: "vector-crud-header", inputs: { statusCode: "statusCode", code: "code" }, ngImport: i0, template: "<div class=\"container\">\n  <div class=\"status-container\">\n    <span>Status</span>\n    <vector-badge [label]=\"statusLabel\" [type]=\"statusCode\"></vector-badge>\n  </div>\n  <div class=\"separator\"></div>\n  <span class=\"code-label\"\n    >C\u00F3digo de identifica\u00E7\u00E3o<span class=\"code\">{{ code }}</span></span\n  >\n</div>\n", styles: [".container{display:flex;align-items:center;margin-bottom:15px;justify-content:space-between;flex-wrap:wrap}@media (min-width: 441px){.container{justify-content:flex-end;height:40px}}.container .status-container{display:flex;align-items:center}.container .status-container vector-badge{margin-left:15px}.container .separator{width:1px;height:100%;margin:0 20px;background-color:var(--gray-medium)}@media (max-width: 440px){.container .separator{display:none}}.container .code-label{color:var(--form-labels-color);font-size:13px;max-width:150px;line-height:1rem}.container .code-label .code{color:#000;font-weight:600;font-size:20px;margin-left:10px}\n"], dependencies: [{ kind: "component", type: BadgeComponent, selector: "vector-badge", inputs: ["type", "label", "customColor", "customBackgroundColor", "tooltip"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-crud-header', template: "<div class=\"container\">\r\n  <div class=\"status-container\">\r\n    <span>Status</span>\r\n    <vector-badge [label]=\"statusLabel\" [type]=\"statusCode\"></vector-badge>\r\n  </div>\r\n  <div class=\"separator\"></div>\r\n  <span class=\"code-label\"\r\n    >C\u00F3digo de identifica\u00E7\u00E3o<span class=\"code\">{{ code }}</span></span\r\n  >\r\n</div>\r\n", styles: [".container{display:flex;align-items:center;margin-bottom:15px;justify-content:space-between;flex-wrap:wrap}@media (min-width: 441px){.container{justify-content:flex-end;height:40px}}.container .status-container{display:flex;align-items:center}.container .status-container vector-badge{margin-left:15px}.container .separator{width:1px;height:100%;margin:0 20px;background-color:var(--gray-medium)}@media (max-width: 440px){.container .separator{display:none}}.container .code-label{color:var(--form-labels-color);font-size:13px;max-width:150px;line-height:1rem}.container .code-label .code{color:#000;font-weight:600;font-size:20px;margin-left:10px}\n"] }]
+            args: [{ selector: 'vector-crud-header', template: "<div class=\"container\">\n  <div class=\"status-container\">\n    <span>Status</span>\n    <vector-badge [label]=\"statusLabel\" [type]=\"statusCode\"></vector-badge>\n  </div>\n  <div class=\"separator\"></div>\n  <span class=\"code-label\"\n    >C\u00F3digo de identifica\u00E7\u00E3o<span class=\"code\">{{ code }}</span></span\n  >\n</div>\n", styles: [".container{display:flex;align-items:center;margin-bottom:15px;justify-content:space-between;flex-wrap:wrap}@media (min-width: 441px){.container{justify-content:flex-end;height:40px}}.container .status-container{display:flex;align-items:center}.container .status-container vector-badge{margin-left:15px}.container .separator{width:1px;height:100%;margin:0 20px;background-color:var(--gray-medium)}@media (max-width: 440px){.container .separator{display:none}}.container .code-label{color:var(--form-labels-color);font-size:13px;max-width:150px;line-height:1rem}.container .code-label .code{color:#000;font-weight:600;font-size:20px;margin-left:10px}\n"] }]
         }], ctorParameters: () => [], propDecorators: { statusCode: [{
                 type: Input
             }], code: [{
@@ -4199,11 +4314,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
             }] } });
 
 class CrudHeaderModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: CrudHeaderModule, declarations: [CrudHeaderComponent], imports: [SharedModule, BadgeModule], exports: [CrudHeaderComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHeaderModule, imports: [SharedModule, BadgeModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHeaderModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: CrudHeaderModule, declarations: [CrudHeaderComponent], imports: [SharedModule, BadgeModule], exports: [CrudHeaderComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHeaderModule, imports: [SharedModule, BadgeModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHeaderModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHeaderModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [CrudHeaderComponent],
@@ -4276,12 +4391,12 @@ class CrudHistoryComponent {
                 return '';
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: CrudHistoryComponent, selector: "vector-crud-history", inputs: { crudHistory: "crudHistory" }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<p-accordionTab *ngIf=\"crudHistory\" class=\"history-item\">\r\n  <ng-template pTemplate=\"header\">\r\n    <div class=\"history-item-header-container\" (click)=\"onClick.emit()\">\r\n      <div class=\"history-item-header-left\">\r\n        <span id=\"color-first-span\" *ngIf=\"crudHistory.typeOfModification\">{{ crudHistory.typeOfModification }}</span>\r\n        <vector-badge\r\n          [customBackgroundColor]=\"getHistoryBadgeBackgroundColor(crudHistory.eventType)\"\r\n          [customColor]=\"getHistoryBadgeColor(crudHistory.eventType)\"\r\n          [label]=\"getHistoryBadgeLabel(crudHistory.eventType)\"\r\n        ></vector-badge>\r\n        <span>por {{ crudHistory.modifierName }}</span>\r\n      </div>\r\n      <span class=\"history-item-header-right\">\r\n        {{ crudHistory.dateTime | date : 'dd/MM/yyyy HH:mm' }}\r\n      </span>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"content\">\r\n    <div *ngFor=\"let auditDelta of crudHistory.dataAuditDelta\">\r\n      <div class=\"grid\">\r\n        <div class=\"col-12 md:col-6 field\">\r\n          <span>{{ auditDelta.fieldName }}</span>\r\n        </div>\r\n        <div class=\"col-12 md:col-6 field\">\r\n          <span class=\"new-value\">{{ auditDelta.newValue }}</span>\r\n          <s class=\"old-value pl-1\">{{ auditDelta.oldValue }}</s>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n</p-accordionTab>\r\n", styles: [".history-item{width:100%;margin:10px 0}.history-item .history-item-header-container{display:flex;align-items:center;justify-content:space-between;width:100%}.history-item .history-item-header-container .history-item-header-left{display:flex;align-items:center}.history-item .history-item-header-container .history-item-header-left span#color-first-span{color:#000;margin-right:10px}.history-item .history-item-header-container .history-item-header-left span{margin-left:15px;color:var(--theme-medium);font-weight:600}.history-item .history-item-header-container .history-item-header-right{font-size:.8rem;color:var(--gray-darker);margin-right:40px}.new-value{color:#83c5be}.old-value{color:#000}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BadgeComponent, selector: "vector-badge", inputs: ["type", "label", "customColor", "customBackgroundColor", "tooltip"] }, { kind: "component", type: i3$4.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHistoryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CrudHistoryComponent, selector: "vector-crud-history", inputs: { crudHistory: "crudHistory" }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<p-accordionTab *ngIf=\"crudHistory\" class=\"history-item\">\n  <ng-template pTemplate=\"header\">\n    <div class=\"history-item-header-container\" (click)=\"onClick.emit()\">\n      <div class=\"history-item-header-left\">\n        <span id=\"color-first-span\" *ngIf=\"crudHistory.typeOfModification\">{{ crudHistory.typeOfModification }}</span>\n        <vector-badge\n          [customBackgroundColor]=\"getHistoryBadgeBackgroundColor(crudHistory.eventType)\"\n          [customColor]=\"getHistoryBadgeColor(crudHistory.eventType)\"\n          [label]=\"getHistoryBadgeLabel(crudHistory.eventType)\"\n        ></vector-badge>\n        <span>por {{ crudHistory.modifierName }}</span>\n      </div>\n      <span class=\"history-item-header-right\">\n        {{ crudHistory.dateTime | date : 'dd/MM/yyyy HH:mm' }}\n      </span>\n    </div>\n  </ng-template>\n  <ng-template pTemplate=\"content\">\n    <div *ngFor=\"let auditDelta of crudHistory.dataAuditDelta\">\n      <div class=\"grid\">\n        <div class=\"col-12 md:col-6 field\">\n          <span>{{ auditDelta.fieldName }}</span>\n        </div>\n        <div class=\"col-12 md:col-6 field\">\n          <span class=\"new-value\">{{ auditDelta.newValue }}</span>\n          <s class=\"old-value pl-1\">{{ auditDelta.oldValue }}</s>\n        </div>\n      </div>\n    </div>\n  </ng-template>\n</p-accordionTab>\n", styles: [".history-item{width:100%;margin:10px 0}.history-item .history-item-header-container{display:flex;align-items:center;justify-content:space-between;width:100%}.history-item .history-item-header-container .history-item-header-left{display:flex;align-items:center}.history-item .history-item-header-container .history-item-header-left span#color-first-span{color:#000;margin-right:10px}.history-item .history-item-header-container .history-item-header-left span{margin-left:15px;color:var(--theme-medium);font-weight:600}.history-item .history-item-header-container .history-item-header-right{font-size:.8rem;color:var(--gray-darker);margin-right:40px}.new-value{color:#83c5be}.old-value{color:#000}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BadgeComponent, selector: "vector-badge", inputs: ["type", "label", "customColor", "customBackgroundColor", "tooltip"] }, { kind: "component", type: i3$3.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "pipe", type: i1.DatePipe, name: "date" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHistoryComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHistoryComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-crud-history', template: "<p-accordionTab *ngIf=\"crudHistory\" class=\"history-item\">\r\n  <ng-template pTemplate=\"header\">\r\n    <div class=\"history-item-header-container\" (click)=\"onClick.emit()\">\r\n      <div class=\"history-item-header-left\">\r\n        <span id=\"color-first-span\" *ngIf=\"crudHistory.typeOfModification\">{{ crudHistory.typeOfModification }}</span>\r\n        <vector-badge\r\n          [customBackgroundColor]=\"getHistoryBadgeBackgroundColor(crudHistory.eventType)\"\r\n          [customColor]=\"getHistoryBadgeColor(crudHistory.eventType)\"\r\n          [label]=\"getHistoryBadgeLabel(crudHistory.eventType)\"\r\n        ></vector-badge>\r\n        <span>por {{ crudHistory.modifierName }}</span>\r\n      </div>\r\n      <span class=\"history-item-header-right\">\r\n        {{ crudHistory.dateTime | date : 'dd/MM/yyyy HH:mm' }}\r\n      </span>\r\n    </div>\r\n  </ng-template>\r\n  <ng-template pTemplate=\"content\">\r\n    <div *ngFor=\"let auditDelta of crudHistory.dataAuditDelta\">\r\n      <div class=\"grid\">\r\n        <div class=\"col-12 md:col-6 field\">\r\n          <span>{{ auditDelta.fieldName }}</span>\r\n        </div>\r\n        <div class=\"col-12 md:col-6 field\">\r\n          <span class=\"new-value\">{{ auditDelta.newValue }}</span>\r\n          <s class=\"old-value pl-1\">{{ auditDelta.oldValue }}</s>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </ng-template>\r\n</p-accordionTab>\r\n", styles: [".history-item{width:100%;margin:10px 0}.history-item .history-item-header-container{display:flex;align-items:center;justify-content:space-between;width:100%}.history-item .history-item-header-container .history-item-header-left{display:flex;align-items:center}.history-item .history-item-header-container .history-item-header-left span#color-first-span{color:#000;margin-right:10px}.history-item .history-item-header-container .history-item-header-left span{margin-left:15px;color:var(--theme-medium);font-weight:600}.history-item .history-item-header-container .history-item-header-right{font-size:.8rem;color:var(--gray-darker);margin-right:40px}.new-value{color:#83c5be}.old-value{color:#000}\n"] }]
+            args: [{ selector: 'vector-crud-history', template: "<p-accordionTab *ngIf=\"crudHistory\" class=\"history-item\">\n  <ng-template pTemplate=\"header\">\n    <div class=\"history-item-header-container\" (click)=\"onClick.emit()\">\n      <div class=\"history-item-header-left\">\n        <span id=\"color-first-span\" *ngIf=\"crudHistory.typeOfModification\">{{ crudHistory.typeOfModification }}</span>\n        <vector-badge\n          [customBackgroundColor]=\"getHistoryBadgeBackgroundColor(crudHistory.eventType)\"\n          [customColor]=\"getHistoryBadgeColor(crudHistory.eventType)\"\n          [label]=\"getHistoryBadgeLabel(crudHistory.eventType)\"\n        ></vector-badge>\n        <span>por {{ crudHistory.modifierName }}</span>\n      </div>\n      <span class=\"history-item-header-right\">\n        {{ crudHistory.dateTime | date : 'dd/MM/yyyy HH:mm' }}\n      </span>\n    </div>\n  </ng-template>\n  <ng-template pTemplate=\"content\">\n    <div *ngFor=\"let auditDelta of crudHistory.dataAuditDelta\">\n      <div class=\"grid\">\n        <div class=\"col-12 md:col-6 field\">\n          <span>{{ auditDelta.fieldName }}</span>\n        </div>\n        <div class=\"col-12 md:col-6 field\">\n          <span class=\"new-value\">{{ auditDelta.newValue }}</span>\n          <s class=\"old-value pl-1\">{{ auditDelta.oldValue }}</s>\n        </div>\n      </div>\n    </div>\n  </ng-template>\n</p-accordionTab>\n", styles: [".history-item{width:100%;margin:10px 0}.history-item .history-item-header-container{display:flex;align-items:center;justify-content:space-between;width:100%}.history-item .history-item-header-container .history-item-header-left{display:flex;align-items:center}.history-item .history-item-header-container .history-item-header-left span#color-first-span{color:#000;margin-right:10px}.history-item .history-item-header-container .history-item-header-left span{margin-left:15px;color:var(--theme-medium);font-weight:600}.history-item .history-item-header-container .history-item-header-right{font-size:.8rem;color:var(--gray-darker);margin-right:40px}.new-value{color:#83c5be}.old-value{color:#000}\n"] }]
         }], propDecorators: { crudHistory: [{
                 type: Input
             }], onClick: [{
@@ -4289,11 +4404,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
             }] } });
 
 class CrudHistoryModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHistoryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: CrudHistoryModule, declarations: [CrudHistoryComponent], imports: [SharedModule, BadgeModule, AccordionModule], exports: [CrudHistoryComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHistoryModule, imports: [SharedModule, BadgeModule, AccordionModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHistoryModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: CrudHistoryModule, declarations: [CrudHistoryComponent], imports: [SharedModule, BadgeModule, AccordionModule], exports: [CrudHistoryComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHistoryModule, imports: [SharedModule, BadgeModule, AccordionModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: CrudHistoryModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CrudHistoryModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [CrudHistoryComponent],
@@ -4321,22 +4436,22 @@ class GenericErrorModalComponent {
     close() {
         this.message = '';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericErrorModalComponent, deps: [{ token: ErrorMessageService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: GenericErrorModalComponent, selector: "vector-generic-error-modal", inputs: { skipMessages: "skipMessages" }, ngImport: i0, template: "<p-dialog\r\n  [visible]=\"!!message\"\r\n  [modal]=\"true\"\r\n  [breakpoints]=\"{ '440px': '95vw' }\"\r\n  [style]=\"{ width: '400px' }\"\r\n  [draggable]=\"false\"\r\n  [resizable]=\"false\"\r\n  [blockScroll]=\"true\"\r\n  [closeOnEscape]=\"false\"\r\n  [closable]=\"true\"\r\n>\r\n  <div class=\"content-container\">\r\n    <img class=\"emote\" src=\".././../../assets/images/emote_bad.svg\" />\r\n    <p class=\"title\">Algo deu errado!</p>\r\n    <p class=\"message\">{{ message }}</p>\r\n\r\n    <div class=\"actions\">\r\n      <vector-button (click)=\"close()\" label=\"Voltar\"></vector-button>\r\n    </div>\r\n  </div>\r\n</p-dialog>\r\n", styles: [".content-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.content-container .title{text-align:center;color:var(--theme-dark);font-weight:600;margin-bottom:20px}.content-container .emote{height:40px;width:40px}@media (min-width: 991px){.content-container .emote{height:60px;width:60px}}.content-container .actions{margin-top:20px;width:100%;display:flex;flex-direction:row;justify-content:center;align-items:center}.content-container .actions vector-button{width:75%}\n"], dependencies: [{ kind: "component", type: i2$7.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style"], outputs: ["onClick"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericErrorModalComponent, deps: [{ token: ErrorMessageService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: GenericErrorModalComponent, selector: "vector-generic-error-modal", inputs: { skipMessages: "skipMessages" }, ngImport: i0, template: "<p-dialog\n  [visible]=\"!!message\"\n  [modal]=\"true\"\n  [breakpoints]=\"{ '440px': '95vw' }\"\n  [style]=\"{ width: '400px' }\"\n  [draggable]=\"false\"\n  [resizable]=\"false\"\n  [blockScroll]=\"true\"\n  [closeOnEscape]=\"false\"\n  [closable]=\"true\"\n>\n  <div class=\"content-container\">\n    <img class=\"emote\" src=\".././../../assets/images/emote_bad.svg\" />\n    <p class=\"title\">Algo deu errado!</p>\n    <p class=\"message\">{{ message }}</p>\n\n    <div class=\"actions\">\n      <vector-button (click)=\"close()\" label=\"Voltar\"></vector-button>\n    </div>\n  </div>\n</p-dialog>\n", styles: [".content-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.content-container .title{text-align:center;color:var(--theme-dark);font-weight:600;margin-bottom:20px}.content-container .emote{height:40px;width:40px}@media (min-width: 991px){.content-container .emote{height:60px;width:60px}}.content-container .actions{margin-top:20px;width:100%;display:flex;flex-direction:row;justify-content:center;align-items:center}.content-container .actions vector-button{width:75%}\n"], dependencies: [{ kind: "component", type: i2$8.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style", "loading"], outputs: ["onClick"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericErrorModalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericErrorModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-generic-error-modal', template: "<p-dialog\r\n  [visible]=\"!!message\"\r\n  [modal]=\"true\"\r\n  [breakpoints]=\"{ '440px': '95vw' }\"\r\n  [style]=\"{ width: '400px' }\"\r\n  [draggable]=\"false\"\r\n  [resizable]=\"false\"\r\n  [blockScroll]=\"true\"\r\n  [closeOnEscape]=\"false\"\r\n  [closable]=\"true\"\r\n>\r\n  <div class=\"content-container\">\r\n    <img class=\"emote\" src=\".././../../assets/images/emote_bad.svg\" />\r\n    <p class=\"title\">Algo deu errado!</p>\r\n    <p class=\"message\">{{ message }}</p>\r\n\r\n    <div class=\"actions\">\r\n      <vector-button (click)=\"close()\" label=\"Voltar\"></vector-button>\r\n    </div>\r\n  </div>\r\n</p-dialog>\r\n", styles: [".content-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.content-container .title{text-align:center;color:var(--theme-dark);font-weight:600;margin-bottom:20px}.content-container .emote{height:40px;width:40px}@media (min-width: 991px){.content-container .emote{height:60px;width:60px}}.content-container .actions{margin-top:20px;width:100%;display:flex;flex-direction:row;justify-content:center;align-items:center}.content-container .actions vector-button{width:75%}\n"] }]
+            args: [{ selector: 'vector-generic-error-modal', template: "<p-dialog\n  [visible]=\"!!message\"\n  [modal]=\"true\"\n  [breakpoints]=\"{ '440px': '95vw' }\"\n  [style]=\"{ width: '400px' }\"\n  [draggable]=\"false\"\n  [resizable]=\"false\"\n  [blockScroll]=\"true\"\n  [closeOnEscape]=\"false\"\n  [closable]=\"true\"\n>\n  <div class=\"content-container\">\n    <img class=\"emote\" src=\".././../../assets/images/emote_bad.svg\" />\n    <p class=\"title\">Algo deu errado!</p>\n    <p class=\"message\">{{ message }}</p>\n\n    <div class=\"actions\">\n      <vector-button (click)=\"close()\" label=\"Voltar\"></vector-button>\n    </div>\n  </div>\n</p-dialog>\n", styles: [".content-container{display:flex;flex-direction:column;justify-content:center;align-items:center}.content-container .title{text-align:center;color:var(--theme-dark);font-weight:600;margin-bottom:20px}.content-container .emote{height:40px;width:40px}@media (min-width: 991px){.content-container .emote{height:60px;width:60px}}.content-container .actions{margin-top:20px;width:100%;display:flex;flex-direction:row;justify-content:center;align-items:center}.content-container .actions vector-button{width:75%}\n"] }]
         }], ctorParameters: () => [{ type: ErrorMessageService }], propDecorators: { skipMessages: [{
                 type: Input
             }] } });
 
 class GenericErrorModalModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericErrorModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: GenericErrorModalModule, declarations: [GenericErrorModalComponent], imports: [SharedModule, DialogModule, FieldsModule], exports: [GenericErrorModalComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericErrorModalModule, imports: [SharedModule, DialogModule, FieldsModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericErrorModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: GenericErrorModalModule, declarations: [GenericErrorModalComponent], imports: [SharedModule, DialogModule, FieldsModule], exports: [GenericErrorModalComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericErrorModalModule, imports: [SharedModule, DialogModule, FieldsModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericErrorModalModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericErrorModalModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [GenericErrorModalComponent],
@@ -4377,12 +4492,12 @@ class GenericModalComponent {
         this.displayChange.emit(this.display);
         this.onCloseModal.emit();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericModalComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: GenericModalComponent, selector: "vector-generic-modal", inputs: { modalMessage: "modalMessage", isClosable: "isClosable", hiddenActions: "hiddenActions", linkLabel: "linkLabel", linkUrl: "linkUrl", display: "display", maxWidth: "maxWidth", lineBreak: "lineBreak" }, outputs: { displayChange: "displayChange", onCloseModal: "onCloseModal" }, ngImport: i0, template: "<p-dialog\r\n  [(visible)]=\"display\"\r\n  [modal]=\"true\"\r\n  [breakpoints]=\"{ '440px': '95vw' }\"\r\n  [style]=\"{ width: '400px' }\"\r\n  [draggable]=\"false\"\r\n  [resizable]=\"false\"\r\n  [blockScroll]=\"true\"\r\n  [closeOnEscape]=\"false\"\r\n  [closable]=\"isClosable\"\r\n  (onHide)=\"hideModal()\"\r\n  [ngStyle]=\"{ 'max-width': maxWidth, 'line-break': lineBreak }\"\r\n>\r\n  <div class=\"grid modal-generic\">\r\n    <div class=\"col-12\">\r\n      <img\r\n        *ngIf=\"modalMessage.fileIcon\"\r\n        class=\"flex mx-auto mb-3\"\r\n        [ngClass]=\"!isClosable ? 'mt-4' : ''\"\r\n        src=\"assets/images/{{ modalMessage.fileIcon }}.svg\"\r\n      />\r\n      <h1 *ngIf=\"modalMessage.title\">{{ modalMessage.title }}</h1>\r\n      <p *ngFor=\"let text of modalMessage.message\" [innerHTML]=\"text\"></p>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"linkLabel\" class=\"grid mt-2 justify-content-center\">\r\n    <div class=\"col-12 md:col-6\">\r\n      <vector-button [label]=\"linkLabel\" (click)=\"routerLink(linkUrl)\"></vector-button>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"!hiddenActions\" class=\"grid mt-2 justify-content-center\">\r\n    <div class=\"col-12 md:col-6\" *ngIf=\"modalMessage.cancelButton\">\r\n      <vector-button\r\n        (onClick)=\"modalMessage.cancelButton && modalMessage.cancelButton.clickFunction()\"\r\n        [label]=\"modalMessage.cancelButton.label\"\r\n        [type]=\"modalMessage.cancelButton.type ? modalMessage.cancelButton.type : 'default'\"\r\n      ></vector-button>\r\n    </div>\r\n\r\n    <div class=\"col-12 md:col-6\" *ngIf=\"modalMessage.confirmButton\">\r\n      <vector-button\r\n        (onClick)=\"modalMessage.confirmButton && modalMessage.confirmButton.clickFunction()\"\r\n        [label]=\"modalMessage.confirmButton.label\"\r\n        [type]=\"modalMessage.confirmButton.type ? modalMessage.confirmButton.type : 'default-filled'\"\r\n      ></vector-button>\r\n    </div>\r\n  </div>\r\n</p-dialog>\r\n", styles: [".modal-generic{font-style:normal;font-family:Poppins;text-align:center!important}.modal-generic h1{margin:1em auto!important;font-weight:700;font-size:1.42em!important;line-height:1.2em;letter-spacing:1px;color:#262338}.modal-generic p{margin:0 auto;font-weight:400;font-size:1.07em;line-height:1.5em;letter-spacing:.053em;color:#4e4b66}\n"], dependencies: [{ kind: "component", type: i2$7.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style"], outputs: ["onClick"] }, { 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"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericModalComponent, deps: [{ token: i1$1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: GenericModalComponent, selector: "vector-generic-modal", inputs: { modalMessage: "modalMessage", isClosable: "isClosable", hiddenActions: "hiddenActions", linkLabel: "linkLabel", linkUrl: "linkUrl", display: "display", maxWidth: "maxWidth", lineBreak: "lineBreak" }, outputs: { displayChange: "displayChange", onCloseModal: "onCloseModal" }, ngImport: i0, template: "<p-dialog\n  [(visible)]=\"display\"\n  [modal]=\"true\"\n  [breakpoints]=\"{ '440px': '95vw' }\"\n  [style]=\"{ width: '400px' }\"\n  [draggable]=\"false\"\n  [resizable]=\"false\"\n  [blockScroll]=\"true\"\n  [closeOnEscape]=\"false\"\n  [closable]=\"isClosable\"\n  (onHide)=\"hideModal()\"\n  [ngStyle]=\"{ 'max-width': maxWidth, 'line-break': lineBreak }\"\n>\n  <div class=\"grid modal-generic\">\n    <div class=\"col-12\">\n      <img\n        *ngIf=\"modalMessage.fileIcon\"\n        class=\"flex mx-auto mb-3\"\n        [ngClass]=\"!isClosable ? 'mt-4' : ''\"\n        src=\"assets/images/{{ modalMessage.fileIcon }}.svg\"\n      />\n      <h1 *ngIf=\"modalMessage.title\">{{ modalMessage.title }}</h1>\n      <p *ngFor=\"let text of modalMessage.message\" [innerHTML]=\"text\"></p>\n    </div>\n  </div>\n\n  <div *ngIf=\"linkLabel\" class=\"grid mt-2 justify-content-center\">\n    <div class=\"col-12 md:col-6\">\n      <vector-button [label]=\"linkLabel\" (click)=\"routerLink(linkUrl)\"></vector-button>\n    </div>\n  </div>\n\n  <div *ngIf=\"!hiddenActions\" class=\"grid mt-2 justify-content-center\">\n    <div class=\"col-12 md:col-6\" *ngIf=\"modalMessage.cancelButton\">\n      <vector-button\n        (onClick)=\"modalMessage.cancelButton && modalMessage.cancelButton.clickFunction()\"\n        [label]=\"modalMessage.cancelButton.label\"\n        [type]=\"modalMessage.cancelButton.type ? modalMessage.cancelButton.type : 'default'\"\n      ></vector-button>\n    </div>\n\n    <div class=\"col-12 md:col-6\" *ngIf=\"modalMessage.confirmButton\">\n      <vector-button\n        (onClick)=\"modalMessage.confirmButton && modalMessage.confirmButton.clickFunction()\"\n        [label]=\"modalMessage.confirmButton.label\"\n        [type]=\"modalMessage.confirmButton.type ? modalMessage.confirmButton.type : 'default-filled'\"\n      ></vector-button>\n    </div>\n  </div>\n</p-dialog>\n", styles: [".modal-generic{font-style:normal;font-family:Poppins;text-align:center!important}.modal-generic h1{margin:1em auto!important;font-weight:700;font-size:1.42em!important;line-height:1.2em;letter-spacing:1px;color:#262338}.modal-generic p{margin:0 auto;font-weight:400;font-size:1.07em;line-height:1.5em;letter-spacing:.053em;color:#4e4b66}\n"], dependencies: [{ kind: "component", type: i2$8.Dialog, selector: "p-dialog", inputs: ["header", "draggable", "resizable", "positionLeft", "positionTop", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "responsive", "appendTo", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "breakpoint", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "visible", "style", "position"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "component", type: ButtonComponent, selector: "vector-button", inputs: ["disabled", "label", "type", "leftIcon", "rightIcon", "noShadow", "round", "style", "loading"], outputs: ["onClick"] }, { 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"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericModalComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericModalComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-generic-modal', template: "<p-dialog\r\n  [(visible)]=\"display\"\r\n  [modal]=\"true\"\r\n  [breakpoints]=\"{ '440px': '95vw' }\"\r\n  [style]=\"{ width: '400px' }\"\r\n  [draggable]=\"false\"\r\n  [resizable]=\"false\"\r\n  [blockScroll]=\"true\"\r\n  [closeOnEscape]=\"false\"\r\n  [closable]=\"isClosable\"\r\n  (onHide)=\"hideModal()\"\r\n  [ngStyle]=\"{ 'max-width': maxWidth, 'line-break': lineBreak }\"\r\n>\r\n  <div class=\"grid modal-generic\">\r\n    <div class=\"col-12\">\r\n      <img\r\n        *ngIf=\"modalMessage.fileIcon\"\r\n        class=\"flex mx-auto mb-3\"\r\n        [ngClass]=\"!isClosable ? 'mt-4' : ''\"\r\n        src=\"assets/images/{{ modalMessage.fileIcon }}.svg\"\r\n      />\r\n      <h1 *ngIf=\"modalMessage.title\">{{ modalMessage.title }}</h1>\r\n      <p *ngFor=\"let text of modalMessage.message\" [innerHTML]=\"text\"></p>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"linkLabel\" class=\"grid mt-2 justify-content-center\">\r\n    <div class=\"col-12 md:col-6\">\r\n      <vector-button [label]=\"linkLabel\" (click)=\"routerLink(linkUrl)\"></vector-button>\r\n    </div>\r\n  </div>\r\n\r\n  <div *ngIf=\"!hiddenActions\" class=\"grid mt-2 justify-content-center\">\r\n    <div class=\"col-12 md:col-6\" *ngIf=\"modalMessage.cancelButton\">\r\n      <vector-button\r\n        (onClick)=\"modalMessage.cancelButton && modalMessage.cancelButton.clickFunction()\"\r\n        [label]=\"modalMessage.cancelButton.label\"\r\n        [type]=\"modalMessage.cancelButton.type ? modalMessage.cancelButton.type : 'default'\"\r\n      ></vector-button>\r\n    </div>\r\n\r\n    <div class=\"col-12 md:col-6\" *ngIf=\"modalMessage.confirmButton\">\r\n      <vector-button\r\n        (onClick)=\"modalMessage.confirmButton && modalMessage.confirmButton.clickFunction()\"\r\n        [label]=\"modalMessage.confirmButton.label\"\r\n        [type]=\"modalMessage.confirmButton.type ? modalMessage.confirmButton.type : 'default-filled'\"\r\n      ></vector-button>\r\n    </div>\r\n  </div>\r\n</p-dialog>\r\n", styles: [".modal-generic{font-style:normal;font-family:Poppins;text-align:center!important}.modal-generic h1{margin:1em auto!important;font-weight:700;font-size:1.42em!important;line-height:1.2em;letter-spacing:1px;color:#262338}.modal-generic p{margin:0 auto;font-weight:400;font-size:1.07em;line-height:1.5em;letter-spacing:.053em;color:#4e4b66}\n"] }]
+            args: [{ selector: 'vector-generic-modal', template: "<p-dialog\n  [(visible)]=\"display\"\n  [modal]=\"true\"\n  [breakpoints]=\"{ '440px': '95vw' }\"\n  [style]=\"{ width: '400px' }\"\n  [draggable]=\"false\"\n  [resizable]=\"false\"\n  [blockScroll]=\"true\"\n  [closeOnEscape]=\"false\"\n  [closable]=\"isClosable\"\n  (onHide)=\"hideModal()\"\n  [ngStyle]=\"{ 'max-width': maxWidth, 'line-break': lineBreak }\"\n>\n  <div class=\"grid modal-generic\">\n    <div class=\"col-12\">\n      <img\n        *ngIf=\"modalMessage.fileIcon\"\n        class=\"flex mx-auto mb-3\"\n        [ngClass]=\"!isClosable ? 'mt-4' : ''\"\n        src=\"assets/images/{{ modalMessage.fileIcon }}.svg\"\n      />\n      <h1 *ngIf=\"modalMessage.title\">{{ modalMessage.title }}</h1>\n      <p *ngFor=\"let text of modalMessage.message\" [innerHTML]=\"text\"></p>\n    </div>\n  </div>\n\n  <div *ngIf=\"linkLabel\" class=\"grid mt-2 justify-content-center\">\n    <div class=\"col-12 md:col-6\">\n      <vector-button [label]=\"linkLabel\" (click)=\"routerLink(linkUrl)\"></vector-button>\n    </div>\n  </div>\n\n  <div *ngIf=\"!hiddenActions\" class=\"grid mt-2 justify-content-center\">\n    <div class=\"col-12 md:col-6\" *ngIf=\"modalMessage.cancelButton\">\n      <vector-button\n        (onClick)=\"modalMessage.cancelButton && modalMessage.cancelButton.clickFunction()\"\n        [label]=\"modalMessage.cancelButton.label\"\n        [type]=\"modalMessage.cancelButton.type ? modalMessage.cancelButton.type : 'default'\"\n      ></vector-button>\n    </div>\n\n    <div class=\"col-12 md:col-6\" *ngIf=\"modalMessage.confirmButton\">\n      <vector-button\n        (onClick)=\"modalMessage.confirmButton && modalMessage.confirmButton.clickFunction()\"\n        [label]=\"modalMessage.confirmButton.label\"\n        [type]=\"modalMessage.confirmButton.type ? modalMessage.confirmButton.type : 'default-filled'\"\n      ></vector-button>\n    </div>\n  </div>\n</p-dialog>\n", styles: [".modal-generic{font-style:normal;font-family:Poppins;text-align:center!important}.modal-generic h1{margin:1em auto!important;font-weight:700;font-size:1.42em!important;line-height:1.2em;letter-spacing:1px;color:#262338}.modal-generic p{margin:0 auto;font-weight:400;font-size:1.07em;line-height:1.5em;letter-spacing:.053em;color:#4e4b66}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.Router }], propDecorators: { modalMessage: [{
                 type: Input
             }], isClosable: [{
@@ -4406,11 +4521,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
             }] } });
 
 class GenericModalModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: GenericModalModule, declarations: [GenericModalComponent], imports: [DialogModule, FieldsModule, SharedModule], exports: [GenericModalComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericModalModule, imports: [DialogModule, FieldsModule, SharedModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericModalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: GenericModalModule, declarations: [GenericModalComponent], imports: [DialogModule, FieldsModule, SharedModule], exports: [GenericModalComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericModalModule, imports: [DialogModule, FieldsModule, SharedModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: GenericModalModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GenericModalModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [GenericModalComponent],
@@ -4439,12 +4554,12 @@ class SubMenusListComponent {
     get paddingLeft() {
         return this.childLevel * 10 + 'px';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SubMenusListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: { showList: "showList", options: "options", childLevel: "childLevel", submenuSelected: "submenuSelected" }, outputs: { submenuSelectedChange: "submenuSelectedChange" }, ngImport: i0, template: "<div class=\"sub-menu-container\">\r\n  <ul *ngIf=\"showList\" class=\"sub-menu\">\r\n    <div *ngFor=\"let submenuItem of options\">\r\n      <li class=\"sub-menu-item\" [ngStyle]=\"{ 'padding-left': paddingLeft }\" (click)=\"submenuClick(submenuItem)\">\r\n        <div\r\n          class=\"current-item\"\r\n          [ngClass]=\"{\r\n            'active-menu': submenuSelected?.id === submenuItem.id,\r\n            'always-open': !!submenuItem.alwaysOpen,\r\n            'last-child': !submenuItem.children?.length\r\n          }\"\r\n          [pTooltip]=\"submenuItem.label\"\r\n          tooltipPosition=\"right\"\r\n        >\r\n          <div *ngIf=\"submenuItem.icon\" class=\"icon-container\">\r\n            <i [class]=\"submenuItem.icon\"></i>\r\n          </div>\r\n          <span class=\"menu-label\">{{ submenuItem.label }}</span>\r\n          <i\r\n            *ngIf=\"submenuItem.children?.length && !submenuItem.alwaysOpen\"\r\n            class=\"fas angle-icon\"\r\n            [ngClass]=\"{\r\n              'fa-angle-down': submenuSelected?.id !== submenuItem.id,\r\n              'fa-angle-up': submenuSelected?.id === submenuItem.id\r\n            }\"\r\n          ></i>\r\n        </div>\r\n      </li>\r\n      <vector-sub-menus-list\r\n        *ngIf=\"submenuItem?.children\"\r\n        [options]=\"submenuItem?.children\"\r\n        [showList]=\"submenuItem?.id === submenuSelected?.id || !!submenuItem?.alwaysOpen\"\r\n        [childLevel]=\"childLevel + 1\"\r\n        (submenuSelectedChange)=\"submenuClick($event)\"\r\n      ></vector-sub-menus-list>\r\n    </div>\r\n  </ul>\r\n</div>\r\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;margin-left:20px;min-width:175px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}.sub-menu-container .sub-menu{list-style:none;display:contents}.sub-menu-container .sub-menu .sub-menu-item{animation:showSubMenu ease-in-out .1s;animation-fill-mode:both}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(n){animation-delay:50ms}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(2n){animation-delay:.1s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(3n){animation-delay:.15s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(4n){animation-delay:.2s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(5n){animation-delay:.25s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(6n){animation-delay:.3s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(7n){animation-delay:.35s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(8n){animation-delay:.4s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(9n){animation-delay:.45s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(10n){animation-delay:.5s}.sub-menu-container .sub-menu .sub-menu-item .current-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}.sub-menu-container .sub-menu .sub-menu-item .current-item:not(.always-open){cursor:pointer}.sub-menu-container .sub-menu .sub-menu-item .current-item:hover,.sub-menu-container .sub-menu .sub-menu-item .current-item.active{background-color:var(--gray-light)}.sub-menu-container .sub-menu .sub-menu-item .current-item.active span,.sub-menu-container .sub-menu .sub-menu-item .current-item.active i{color:#fff}@keyframes showSubMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}.sub-menu-container .sub-menu .sub-menu-item .last-child .menu-label{font-weight:400}\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: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: ["showList", "options", "childLevel", "submenuSelected"], outputs: ["submenuSelectedChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SubMenusListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: { showList: "showList", options: "options", childLevel: "childLevel", submenuSelected: "submenuSelected" }, outputs: { submenuSelectedChange: "submenuSelectedChange" }, ngImport: i0, template: "<div class=\"sub-menu-container\">\n  <ul *ngIf=\"showList\" class=\"sub-menu\">\n    <div *ngFor=\"let submenuItem of options\">\n      <li class=\"sub-menu-item\" [ngStyle]=\"{ 'padding-left': paddingLeft }\" (click)=\"submenuClick(submenuItem)\">\n        <div\n          class=\"current-item\"\n          [ngClass]=\"{\n            'active-menu': submenuSelected?.id === submenuItem.id,\n            'always-open': !!submenuItem.alwaysOpen,\n            'last-child': !submenuItem.children?.length\n          }\"\n          [pTooltip]=\"submenuItem.label\"\n          tooltipPosition=\"right\"\n        >\n          <div *ngIf=\"submenuItem.icon\" class=\"icon-container\">\n            <i [class]=\"submenuItem.icon\"></i>\n          </div>\n          <span class=\"menu-label\">{{ submenuItem.label }}</span>\n          <i\n            *ngIf=\"submenuItem.children?.length && !submenuItem.alwaysOpen\"\n            class=\"fas angle-icon\"\n            [ngClass]=\"{\n              'fa-angle-down': submenuSelected?.id !== submenuItem.id,\n              'fa-angle-up': submenuSelected?.id === submenuItem.id\n            }\"\n          ></i>\n        </div>\n      </li>\n      <vector-sub-menus-list\n        *ngIf=\"submenuItem?.children\"\n        [options]=\"submenuItem?.children\"\n        [showList]=\"submenuItem?.id === submenuSelected?.id || !!submenuItem?.alwaysOpen\"\n        [childLevel]=\"childLevel + 1\"\n        (submenuSelectedChange)=\"submenuClick($event)\"\n      ></vector-sub-menus-list>\n    </div>\n  </ul>\n</div>\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;margin-left:20px;min-width:175px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}.sub-menu-container .sub-menu{list-style:none;display:contents}.sub-menu-container .sub-menu .sub-menu-item{animation:showSubMenu ease-in-out .1s;animation-fill-mode:both}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(n){animation-delay:50ms}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(2n){animation-delay:.1s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(3n){animation-delay:.15s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(4n){animation-delay:.2s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(5n){animation-delay:.25s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(6n){animation-delay:.3s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(7n){animation-delay:.35s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(8n){animation-delay:.4s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(9n){animation-delay:.45s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(10n){animation-delay:.5s}.sub-menu-container .sub-menu .sub-menu-item .current-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}.sub-menu-container .sub-menu .sub-menu-item .current-item:not(.always-open){cursor:pointer}.sub-menu-container .sub-menu .sub-menu-item .current-item:hover,.sub-menu-container .sub-menu .sub-menu-item .current-item.active{background-color:var(--gray-light)}.sub-menu-container .sub-menu .sub-menu-item .current-item.active span,.sub-menu-container .sub-menu .sub-menu-item .current-item.active i{color:#fff}@keyframes showSubMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}.sub-menu-container .sub-menu .sub-menu-item .last-child .menu-label{font-weight:400}\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: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: ["showList", "options", "childLevel", "submenuSelected"], outputs: ["submenuSelectedChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: SubMenusListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SubMenusListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-sub-menus-list', template: "<div class=\"sub-menu-container\">\r\n  <ul *ngIf=\"showList\" class=\"sub-menu\">\r\n    <div *ngFor=\"let submenuItem of options\">\r\n      <li class=\"sub-menu-item\" [ngStyle]=\"{ 'padding-left': paddingLeft }\" (click)=\"submenuClick(submenuItem)\">\r\n        <div\r\n          class=\"current-item\"\r\n          [ngClass]=\"{\r\n            'active-menu': submenuSelected?.id === submenuItem.id,\r\n            'always-open': !!submenuItem.alwaysOpen,\r\n            'last-child': !submenuItem.children?.length\r\n          }\"\r\n          [pTooltip]=\"submenuItem.label\"\r\n          tooltipPosition=\"right\"\r\n        >\r\n          <div *ngIf=\"submenuItem.icon\" class=\"icon-container\">\r\n            <i [class]=\"submenuItem.icon\"></i>\r\n          </div>\r\n          <span class=\"menu-label\">{{ submenuItem.label }}</span>\r\n          <i\r\n            *ngIf=\"submenuItem.children?.length && !submenuItem.alwaysOpen\"\r\n            class=\"fas angle-icon\"\r\n            [ngClass]=\"{\r\n              'fa-angle-down': submenuSelected?.id !== submenuItem.id,\r\n              'fa-angle-up': submenuSelected?.id === submenuItem.id\r\n            }\"\r\n          ></i>\r\n        </div>\r\n      </li>\r\n      <vector-sub-menus-list\r\n        *ngIf=\"submenuItem?.children\"\r\n        [options]=\"submenuItem?.children\"\r\n        [showList]=\"submenuItem?.id === submenuSelected?.id || !!submenuItem?.alwaysOpen\"\r\n        [childLevel]=\"childLevel + 1\"\r\n        (submenuSelectedChange)=\"submenuClick($event)\"\r\n      ></vector-sub-menus-list>\r\n    </div>\r\n  </ul>\r\n</div>\r\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;margin-left:20px;min-width:175px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}.sub-menu-container .sub-menu{list-style:none;display:contents}.sub-menu-container .sub-menu .sub-menu-item{animation:showSubMenu ease-in-out .1s;animation-fill-mode:both}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(n){animation-delay:50ms}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(2n){animation-delay:.1s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(3n){animation-delay:.15s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(4n){animation-delay:.2s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(5n){animation-delay:.25s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(6n){animation-delay:.3s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(7n){animation-delay:.35s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(8n){animation-delay:.4s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(9n){animation-delay:.45s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(10n){animation-delay:.5s}.sub-menu-container .sub-menu .sub-menu-item .current-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}.sub-menu-container .sub-menu .sub-menu-item .current-item:not(.always-open){cursor:pointer}.sub-menu-container .sub-menu .sub-menu-item .current-item:hover,.sub-menu-container .sub-menu .sub-menu-item .current-item.active{background-color:var(--gray-light)}.sub-menu-container .sub-menu .sub-menu-item .current-item.active span,.sub-menu-container .sub-menu .sub-menu-item .current-item.active i{color:#fff}@keyframes showSubMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}.sub-menu-container .sub-menu .sub-menu-item .last-child .menu-label{font-weight:400}\n"] }]
+            args: [{ selector: 'vector-sub-menus-list', template: "<div class=\"sub-menu-container\">\n  <ul *ngIf=\"showList\" class=\"sub-menu\">\n    <div *ngFor=\"let submenuItem of options\">\n      <li class=\"sub-menu-item\" [ngStyle]=\"{ 'padding-left': paddingLeft }\" (click)=\"submenuClick(submenuItem)\">\n        <div\n          class=\"current-item\"\n          [ngClass]=\"{\n            'active-menu': submenuSelected?.id === submenuItem.id,\n            'always-open': !!submenuItem.alwaysOpen,\n            'last-child': !submenuItem.children?.length\n          }\"\n          [pTooltip]=\"submenuItem.label\"\n          tooltipPosition=\"right\"\n        >\n          <div *ngIf=\"submenuItem.icon\" class=\"icon-container\">\n            <i [class]=\"submenuItem.icon\"></i>\n          </div>\n          <span class=\"menu-label\">{{ submenuItem.label }}</span>\n          <i\n            *ngIf=\"submenuItem.children?.length && !submenuItem.alwaysOpen\"\n            class=\"fas angle-icon\"\n            [ngClass]=\"{\n              'fa-angle-down': submenuSelected?.id !== submenuItem.id,\n              'fa-angle-up': submenuSelected?.id === submenuItem.id\n            }\"\n          ></i>\n        </div>\n      </li>\n      <vector-sub-menus-list\n        *ngIf=\"submenuItem?.children\"\n        [options]=\"submenuItem?.children\"\n        [showList]=\"submenuItem?.id === submenuSelected?.id || !!submenuItem?.alwaysOpen\"\n        [childLevel]=\"childLevel + 1\"\n        (submenuSelectedChange)=\"submenuClick($event)\"\n      ></vector-sub-menus-list>\n    </div>\n  </ul>\n</div>\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;margin-left:20px;min-width:175px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}.sub-menu-container .sub-menu{list-style:none;display:contents}.sub-menu-container .sub-menu .sub-menu-item{animation:showSubMenu ease-in-out .1s;animation-fill-mode:both}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(n){animation-delay:50ms}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(2n){animation-delay:.1s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(3n){animation-delay:.15s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(4n){animation-delay:.2s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(5n){animation-delay:.25s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(6n){animation-delay:.3s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(7n){animation-delay:.35s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(8n){animation-delay:.4s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(9n){animation-delay:.45s}.sub-menu-container .sub-menu .sub-menu-item:not(:first-child):nth-child(10n){animation-delay:.5s}.sub-menu-container .sub-menu .sub-menu-item .current-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}.sub-menu-container .sub-menu .sub-menu-item .current-item:not(.always-open){cursor:pointer}.sub-menu-container .sub-menu .sub-menu-item .current-item:hover,.sub-menu-container .sub-menu .sub-menu-item .current-item.active{background-color:var(--gray-light)}.sub-menu-container .sub-menu .sub-menu-item .current-item.active span,.sub-menu-container .sub-menu .sub-menu-item .current-item.active i{color:#fff}@keyframes showSubMenu{0%{transform:translate(-100%)}to{transform:translate(0)}}.sub-menu-container .sub-menu .sub-menu-item .last-child .menu-label{font-weight:400}\n"] }]
         }], propDecorators: { showList: [{
                 type: Input
             }], options: [{
@@ -4648,8 +4763,8 @@ class MenuComponent {
         this.widthStyle = { width: this.opened ? '250px' : '60px' };
         this.activeSubmenuOption = undefined;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MenuComponent, deps: [{ token: MenuService }, { token: i1$1.Router }, { token: ProfileService }, { token: StorageService }, { token: ENVIRONMENT }, { token: APP_NAME }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: MenuComponent, selector: "vector-menu", inputs: { accountService: "accountService", apps: "apps" }, outputs: { onFinishMenuOptionsConfig: "onFinishMenuOptionsConfig" }, host: { listeners: { "window:resize": "onResize($event)", "document:keydown.escape": "handleKeyboardEvent($event)" } }, ngImport: i0, template: "<nav id=\"menu\" [ngStyle]=\"widthStyle\" [@sideInOut]=\"lastAnimation\">\r\n  <div class=\"header-menu\">\r\n    <div class=\"logo-container\">\r\n      <div class=\"logo\" [ngClass]=\"{ 'logo-small': !opened }\"></div>\r\n    </div>\r\n  </div>\r\n  <div class=\"menu-sections\">\r\n    <div class=\"menu-section\">\r\n      <span [ngStyle]=\"{ opacity: opened ? 1 : 0 }\" class=\"menu-section-title\">SELE\u00C7\u00C3O DE PORTAL</span>\r\n      <ul class=\"side-menu\">\r\n        <ng-container *ngIf=\"apps.length\">\r\n          <li *ngFor=\"let app of apps\">\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(app.appName) }\"\r\n              (click)=\"navigateToPortal(app)\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item {{ app.className }}\"></div>\r\n              <span class=\"menu-label\">{{ app.description }}</span>\r\n            </div>\r\n          </li>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!apps.length\">\r\n          <li>\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.LOGTECH) }\"\r\n              (click)=\"navigateToPortal({ appName: appsEnum.LOGTECH, isAdmin: false })\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item logtech\"></div>\r\n              <span class=\"menu-label\">Cargas</span>\r\n            </div>\r\n          </li>\r\n          <li *ngIf=\"hasAnyFintechPermission\">\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.FINTECH) }\"\r\n              (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: false })\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item fintech\"></div>\r\n              <span class=\"menu-label\">Conta digital</span>\r\n            </div>\r\n          </li>\r\n          <li *ngIf=\"!production\">\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.MARKETPLACE) }\"\r\n              (click)=\"navigateToPortal({ appName: appsEnum.MARKETPLACE, isAdmin: false })\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item marketplace\"></div>\r\n              <span class=\"menu-label\">Combust\u00EDvel</span>\r\n            </div>\r\n          </li>\r\n          <li *ngIf=\"adminOption && (hasFintechAdminPermission || hasMarketplaceAdminPermission)\">\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'active-menu': activeOption?.id === adminOption.id }\"\r\n              (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: true })\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item admin\"></div>\r\n              <span class=\"menu-label\">Admin Fintech</span>\r\n            </div>\r\n          </li>\r\n        </ng-container>\r\n      </ul>\r\n    </div>\r\n    <div class=\"menu-section\">\r\n      <span [ngStyle]=\"{ opacity: opened && options.length ? 1 : 0 }\" class=\"menu-section-title\">MENU</span>\r\n      <ul class=\"side-menu\">\r\n        <li *ngFor=\"let option of options\">\r\n          <div\r\n            class=\"side-menu-item\"\r\n            [ngClass]=\"{ 'active-menu': activeOption?.id === option.id, 'always-open': !!option.alwaysOpen }\"\r\n            [pTooltip]=\"option.label\"\r\n            tooltipPosition=\"right\"\r\n            (click)=\"onMenuClick(option)\"\r\n          >\r\n            <div class=\"icon-container\">\r\n              <img\r\n                *ngIf=\"option.iconFileName\"\r\n                [src]=\"'../../../../assets/icons/' + option.iconFileName + '.svg'\"\r\n                class=\"menu-icon\"\r\n              />\r\n              <i *ngIf=\"option.icon\" class=\"menu-icon {{ option.icon }}\"></i>\r\n              <span *ngIf=\"getMenuNotificationsCount(option)\" class=\"menu-notifications-count\">{{\r\n                getMenuNotificationsCount(option)\r\n              }}</span>\r\n            </div>\r\n            <span class=\"menu-label\">{{ option.label }}</span>\r\n            <i\r\n              *ngIf=\"opened && option.children?.length && !option.alwaysOpen\"\r\n              class=\"fas angle-icon\"\r\n              [ngClass]=\"{\r\n                'fa-angle-down': activeOption?.id !== option.id,\r\n                'fa-angle-up': activeOption?.id === option.id\r\n              }\"\r\n            ></i>\r\n          </div>\r\n          <vector-sub-menus-list\r\n            [options]=\"option.children\"\r\n            [showList]=\"activeOption?.id === option.id || (!!option.alwaysOpen && opened)\"\r\n            [submenuSelected]=\"activeSubmenuOption\"\r\n            (submenuSelectedChange)=\"onSubmenuClick($event)\"\r\n          ></vector-sub-menus-list>\r\n        </li>\r\n      </ul>\r\n    </div>\r\n  </div>\r\n  <div class=\"footer side-menu-item\">\r\n    <div class=\"icon-container\">\r\n      <a>\r\n        <img src=\"../../../../assets/icons/menu_footer_icon.svg\" (click)=\"openTermsOfUse()\" class=\"menu-icon\" />\r\n      </a>\r\n    </div>\r\n    <span class=\"menu-label footer-content\">\r\n      <span> Veja nosso <a (click)=\"openTermsOfUse()\">Termo de uso</a> </span>\r\n      <span>e <a (click)=\"openTermsOfUse()\">Pol\u00EDtica de privacidade</a></span>\r\n    </span>\r\n  </div>\r\n</nav>\r\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;margin-left:20px;min-width:175px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}nav{height:100vh;min-height:100vh;background-color:#fff;transition:width ease-in-out .2s;display:flex;flex-direction:column;z-index:500;position:sticky;box-shadow:2px 2px 4px #00000029}nav .header-menu{display:flex;justify-content:center;flex-direction:column;width:100%}nav .header-menu .logo-container{height:81px;padding:5px;display:flex;justify-content:center;align-items:center}nav .header-menu .logo-container .logo{background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-position:center;height:50px;width:150px}nav .header-menu .logo-container .logo-small{background-position-y:center;background-position-x:right}nav .menu-sections{display:flex;flex-direction:column;flex:1;overflow-y:overlay;overflow-x:hidden}nav .menu-sections::-webkit-scrollbar{width:4px}nav .menu-sections .menu-section{margin:5px 10px 0}nav .menu-sections .menu-section:first-child{border-bottom:1px solid var(--gray-light)}nav .menu-sections .menu-section .menu-section-title{color:var(--gray-dark);font-weight:500;font-size:.8em;padding-left:10px;white-space:nowrap;transition:opacity .2s ease-in-out}nav .menu-sections .menu-section .side-menu{padding:0;margin:0;list-style:none;overflow-x:hidden;overflow-y:scroll;-ms-overflow-style:none}nav .menu-sections .menu-section .side-menu::-webkit-scrollbar{display:none}@media screen and (max-width: 650px){nav .menu-sections .menu-section .side-menu{background-size:120px;background-position:20px}}nav .menu-sections .menu-section .side-menu-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}nav .menu-sections .menu-section .side-menu-item:not(.always-open){cursor:pointer}nav .menu-sections .menu-section .side-menu-item:hover{background-color:var(--gray-light)}nav .menu-sections .menu-section .side-menu-item.active{background-color:var(--gray-light)}nav .menu-sections .menu-section .side-menu-item.active span{color:#fff}nav .menu-sections .menu-section .side-menu-item.active i{color:#fff}nav .menu-sections .menu-section .fintech{-webkit-mask-image:url(../../../../assets/icons/vector_fintech_icon.svg);-moz-mask-image:url(../../../../assets/icons/vector_fintech_icon.svg);-o-prop:url(../../../../assets/icons/vector_fintech_icon.svg)}nav .menu-sections .menu-section .logtech{-webkit-mask-image:url(../../../../assets/icons/vector_logtech_icon.svg);-moz-mask-image:url(../../../../assets/icons/vector_logtech_icon.svg);-o-prop:url(../../../../assets/icons/vector_logtech_icon.svg)}nav .menu-sections .menu-section .marketplace{-webkit-mask-image:url(../../../../assets/icons/vector_marketplace_icon.svg);-moz-mask-image:url(../../../../assets/icons/vector_marketplace_icon.svg);-o-prop:url(../../../../assets/icons/vector_marketplace_icon.svg)}nav .menu-sections .menu-section .admin{-webkit-mask-image:url(../../../../assets/icons/vector_admin_icon.svg);-moz-mask-image:url(../../../../assets/icons/vector_admin_icon.svg);-o-prop:url(../../../../assets/icons/vector_admin_icon.svg)}nav .menu-sections .menu-section .selected-portal-item{-webkit-mask-size:contain;-moz-mask-size:contain;-o-prop:contain;background-color:var(--form-labels-color)}nav .menu-sections .menu-section .selected-portal-item:before{content:\"\";width:20px;height:20px;display:block}nav .menu-sections .menu-section .selected-portal{background-color:var(--gray-light);border-radius:15px}nav .menu-sections .menu-section .selected-portal .icon-container{-webkit-mask-size:contain;-moz-mask-size:contain;-o-prop:contain}nav .menu-sections .menu-section .selected-portal .icon-container .menu-icon{filter:invert(35%) sepia(100%) saturate(5659%) hue-rotate(210deg) brightness(87%) contrast(118%)}nav .menu-sections .menu-section .selected-portal .selected-portal-item{background-color:var(--theme-primary)}nav .menu-sections .menu-section .selected-portal .marketplace .menu-label{color:var(--success-color)}nav .menu-sections .menu-section .selected-portal .menu-label{color:var(--theme-primary)}nav .footer{display:flex;align-items:center;padding:10px;margin:0 10px;border-top:1px solid var(--gray-light);overflow:hidden;height:50px}nav .footer .footer-icon{width:50px}nav .footer .footer-content{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;font-size:.8em;text-overflow:hidden;white-space:nowrap}\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: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: ["showList", "options", "childLevel", "submenuSelected"], outputs: ["submenuSelectedChange"] }], animations: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MenuComponent, deps: [{ token: MenuService }, { token: i1$1.Router }, { token: ProfileService }, { token: StorageService }, { token: ENVIRONMENT }, { token: APP_NAME }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: MenuComponent, selector: "vector-menu", inputs: { accountService: "accountService", apps: "apps" }, outputs: { onFinishMenuOptionsConfig: "onFinishMenuOptionsConfig" }, host: { listeners: { "window:resize": "onResize($event)", "document:keydown.escape": "handleKeyboardEvent($event)" } }, ngImport: i0, template: "<nav id=\"menu\" [ngStyle]=\"widthStyle\" [@sideInOut]=\"lastAnimation\">\n  <div class=\"header-menu\">\n    <div class=\"logo-container\">\n      <div class=\"logo\" [ngClass]=\"{ 'logo-small': !opened }\"></div>\n    </div>\n  </div>\n  <div class=\"menu-sections\">\n    <div class=\"menu-section\">\n      <span [ngStyle]=\"{ opacity: opened ? 1 : 0 }\" class=\"menu-section-title\">SELE\u00C7\u00C3O DE PORTAL</span>\n      <ul class=\"side-menu\">\n        <ng-container *ngIf=\"apps.length\">\n          <li *ngFor=\"let app of apps\">\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(app.appName) }\"\n              (click)=\"navigateToPortal(app)\"\n            >\n              <div class=\"icon-container selected-portal-item {{ app.className }}\"></div>\n              <span class=\"menu-label\">{{ app.description }}</span>\n            </div>\n          </li>\n        </ng-container>\n        <ng-container *ngIf=\"!apps.length\">\n          <li>\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.LOGTECH) }\"\n              (click)=\"navigateToPortal({ appName: appsEnum.LOGTECH, isAdmin: false })\"\n            >\n              <div class=\"icon-container selected-portal-item logtech\"></div>\n              <span class=\"menu-label\">Cargas</span>\n            </div>\n          </li>\n          <li *ngIf=\"hasAnyFintechPermission\">\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.FINTECH) }\"\n              (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: false })\"\n            >\n              <div class=\"icon-container selected-portal-item fintech\"></div>\n              <span class=\"menu-label\">Conta digital</span>\n            </div>\n          </li>\n          <li *ngIf=\"!production\">\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.MARKETPLACE) }\"\n              (click)=\"navigateToPortal({ appName: appsEnum.MARKETPLACE, isAdmin: false })\"\n            >\n              <div class=\"icon-container selected-portal-item marketplace\"></div>\n              <span class=\"menu-label\">Combust\u00EDvel</span>\n            </div>\n          </li>\n          <li *ngIf=\"adminOption && (hasFintechAdminPermission || hasMarketplaceAdminPermission)\">\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'active-menu': activeOption?.id === adminOption.id }\"\n              (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: true })\"\n            >\n              <div class=\"icon-container selected-portal-item admin\"></div>\n              <span class=\"menu-label\">Admin Fintech</span>\n            </div>\n          </li>\n        </ng-container>\n      </ul>\n    </div>\n    <div class=\"menu-section\">\n      <span [ngStyle]=\"{ opacity: opened && options.length ? 1 : 0 }\" class=\"menu-section-title\">MENU</span>\n      <ul class=\"side-menu\">\n        <li *ngFor=\"let option of options\">\n          <div\n            class=\"side-menu-item\"\n            [ngClass]=\"{ 'active-menu': activeOption?.id === option.id, 'always-open': !!option.alwaysOpen }\"\n            [pTooltip]=\"option.label\"\n            tooltipPosition=\"right\"\n            (click)=\"onMenuClick(option)\"\n          >\n            <div class=\"icon-container\">\n              <img\n                *ngIf=\"option.iconFileName\"\n                [src]=\"'../../../../assets/icons/' + option.iconFileName + '.svg'\"\n                class=\"menu-icon\"\n              />\n              <i *ngIf=\"option.icon\" class=\"menu-icon {{ option.icon }}\"></i>\n              <span *ngIf=\"getMenuNotificationsCount(option)\" class=\"menu-notifications-count\">{{\n                getMenuNotificationsCount(option)\n              }}</span>\n            </div>\n            <span class=\"menu-label\">{{ option.label }}</span>\n            <i\n              *ngIf=\"opened && option.children?.length && !option.alwaysOpen\"\n              class=\"fas angle-icon\"\n              [ngClass]=\"{\n                'fa-angle-down': activeOption?.id !== option.id,\n                'fa-angle-up': activeOption?.id === option.id\n              }\"\n            ></i>\n          </div>\n          <vector-sub-menus-list\n            [options]=\"option.children\"\n            [showList]=\"activeOption?.id === option.id || (!!option.alwaysOpen && opened)\"\n            [submenuSelected]=\"activeSubmenuOption\"\n            (submenuSelectedChange)=\"onSubmenuClick($event)\"\n          ></vector-sub-menus-list>\n        </li>\n      </ul>\n    </div>\n  </div>\n  <div class=\"footer side-menu-item\">\n    <div class=\"icon-container\">\n      <a>\n        <img src=\"../../../../assets/icons/menu_footer_icon.svg\" (click)=\"openTermsOfUse()\" class=\"menu-icon\" />\n      </a>\n    </div>\n    <span class=\"menu-label footer-content\">\n      <span> Veja nosso <a (click)=\"openTermsOfUse()\">Termo de uso</a> </span>\n      <span>e <a (click)=\"openTermsOfUse()\">Pol\u00EDtica de privacidade</a></span>\n    </span>\n  </div>\n</nav>\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;margin-left:20px;min-width:175px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}nav{height:100vh;min-height:100vh;background-color:#fff;transition:width ease-in-out .2s;display:flex;flex-direction:column;z-index:500;position:sticky;box-shadow:2px 2px 4px #00000029}nav .header-menu{display:flex;justify-content:center;flex-direction:column;width:100%}nav .header-menu .logo-container{height:81px;padding:5px;display:flex;justify-content:center;align-items:center}nav .header-menu .logo-container .logo{background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-position:center;height:50px;width:150px}nav .header-menu .logo-container .logo-small{background-position-y:center;background-position-x:right}nav .menu-sections{display:flex;flex-direction:column;flex:1;overflow-y:overlay;overflow-x:hidden}nav .menu-sections::-webkit-scrollbar{width:4px}nav .menu-sections .menu-section{margin:5px 10px 0}nav .menu-sections .menu-section:first-child{border-bottom:1px solid var(--gray-light)}nav .menu-sections .menu-section .menu-section-title{color:var(--gray-dark);font-weight:500;font-size:.8em;padding-left:10px;white-space:nowrap;transition:opacity .2s ease-in-out}nav .menu-sections .menu-section .side-menu{padding:0;margin:0;list-style:none;overflow-x:hidden;overflow-y:scroll;-ms-overflow-style:none}nav .menu-sections .menu-section .side-menu::-webkit-scrollbar{display:none}@media screen and (max-width: 650px){nav .menu-sections .menu-section .side-menu{background-size:120px;background-position:20px}}nav .menu-sections .menu-section .side-menu-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}nav .menu-sections .menu-section .side-menu-item:not(.always-open){cursor:pointer}nav .menu-sections .menu-section .side-menu-item:hover{background-color:var(--gray-light)}nav .menu-sections .menu-section .side-menu-item.active{background-color:var(--gray-light)}nav .menu-sections .menu-section .side-menu-item.active span{color:#fff}nav .menu-sections .menu-section .side-menu-item.active i{color:#fff}nav .menu-sections .menu-section .fintech{-webkit-mask-image:url('data:image/svg+xml,<svg width=\"35\" height=\"35\" viewBox=\"0 0 35 35\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.5 0C14.0388 0 10.6554 1.02636 7.77753 2.94928C4.89967 4.87221 2.65665 7.60533 1.33212 10.803C0.00758245 14.0007 -0.338976 17.5194 0.336265 20.9141C1.01151 24.3087 2.67822 27.4269 5.12564 29.8744C7.57306 32.3218 10.6913 33.9885 14.0859 34.6637C17.4806 35.339 20.9993 34.9924 24.197 33.6679C27.3947 32.3434 30.1278 30.1003 32.0507 27.2225C33.9736 24.3446 35 20.9612 35 17.5C34.9981 12.8593 33.1538 8.40918 29.8723 5.1277C26.5908 1.84622 22.1407 0.00187031 17.5 0ZM19.0402 27.5812V29.7512H15.9774V27.4929C14.7019 27.2047 13.5315 26.5677 12.5969 25.653C11.6623 24.7384 11.0002 23.582 10.6846 22.313L13.585 21.1415C13.7924 22.1249 14.3147 23.014 15.0727 23.6739C15.8307 24.3339 16.7832 24.7288 17.7858 24.7989C19.4143 24.7989 21.2509 23.9591 21.2509 21.976C21.2509 20.2964 20.0265 19.4213 17.2601 18.4227C15.3352 17.7399 11.3973 16.6196 11.3973 12.6306C11.4319 11.3659 11.9105 10.1538 12.7492 9.20665C13.5879 8.25952 14.7333 7.63784 15.9845 7.4506V5.25053H19.0473V7.42061C20.1005 7.59773 21.0873 8.05283 21.9059 8.7389C22.7244 9.42497 23.3449 10.3171 23.7033 11.3232L20.9386 12.4965C20.7138 11.7977 20.2678 11.191 19.6678 10.768C19.0679 10.345 18.3466 10.1287 17.6129 10.1517C16.3885 10.1517 14.4372 10.7992 14.4372 12.5847C14.4372 14.2466 15.9421 14.8783 19.0579 15.9104C23.2586 17.3624 24.326 19.4972 24.326 21.9478C24.2905 23.372 23.732 24.7333 22.7572 25.7723C21.7824 26.8112 20.4593 27.4551 19.0402 27.5812Z\" fill=\"%234E4B66\"/>%0A</svg>%0A');-moz-mask-image:url('data:image/svg+xml,<svg width=\"35\" height=\"35\" viewBox=\"0 0 35 35\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.5 0C14.0388 0 10.6554 1.02636 7.77753 2.94928C4.89967 4.87221 2.65665 7.60533 1.33212 10.803C0.00758245 14.0007 -0.338976 17.5194 0.336265 20.9141C1.01151 24.3087 2.67822 27.4269 5.12564 29.8744C7.57306 32.3218 10.6913 33.9885 14.0859 34.6637C17.4806 35.339 20.9993 34.9924 24.197 33.6679C27.3947 32.3434 30.1278 30.1003 32.0507 27.2225C33.9736 24.3446 35 20.9612 35 17.5C34.9981 12.8593 33.1538 8.40918 29.8723 5.1277C26.5908 1.84622 22.1407 0.00187031 17.5 0ZM19.0402 27.5812V29.7512H15.9774V27.4929C14.7019 27.2047 13.5315 26.5677 12.5969 25.653C11.6623 24.7384 11.0002 23.582 10.6846 22.313L13.585 21.1415C13.7924 22.1249 14.3147 23.014 15.0727 23.6739C15.8307 24.3339 16.7832 24.7288 17.7858 24.7989C19.4143 24.7989 21.2509 23.9591 21.2509 21.976C21.2509 20.2964 20.0265 19.4213 17.2601 18.4227C15.3352 17.7399 11.3973 16.6196 11.3973 12.6306C11.4319 11.3659 11.9105 10.1538 12.7492 9.20665C13.5879 8.25952 14.7333 7.63784 15.9845 7.4506V5.25053H19.0473V7.42061C20.1005 7.59773 21.0873 8.05283 21.9059 8.7389C22.7244 9.42497 23.3449 10.3171 23.7033 11.3232L20.9386 12.4965C20.7138 11.7977 20.2678 11.191 19.6678 10.768C19.0679 10.345 18.3466 10.1287 17.6129 10.1517C16.3885 10.1517 14.4372 10.7992 14.4372 12.5847C14.4372 14.2466 15.9421 14.8783 19.0579 15.9104C23.2586 17.3624 24.326 19.4972 24.326 21.9478C24.2905 23.372 23.732 24.7333 22.7572 25.7723C21.7824 26.8112 20.4593 27.4551 19.0402 27.5812Z\" fill=\"%234E4B66\"/>%0A</svg>%0A');-o-prop:url('data:image/svg+xml,<svg width=\"35\" height=\"35\" viewBox=\"0 0 35 35\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.5 0C14.0388 0 10.6554 1.02636 7.77753 2.94928C4.89967 4.87221 2.65665 7.60533 1.33212 10.803C0.00758245 14.0007 -0.338976 17.5194 0.336265 20.9141C1.01151 24.3087 2.67822 27.4269 5.12564 29.8744C7.57306 32.3218 10.6913 33.9885 14.0859 34.6637C17.4806 35.339 20.9993 34.9924 24.197 33.6679C27.3947 32.3434 30.1278 30.1003 32.0507 27.2225C33.9736 24.3446 35 20.9612 35 17.5C34.9981 12.8593 33.1538 8.40918 29.8723 5.1277C26.5908 1.84622 22.1407 0.00187031 17.5 0ZM19.0402 27.5812V29.7512H15.9774V27.4929C14.7019 27.2047 13.5315 26.5677 12.5969 25.653C11.6623 24.7384 11.0002 23.582 10.6846 22.313L13.585 21.1415C13.7924 22.1249 14.3147 23.014 15.0727 23.6739C15.8307 24.3339 16.7832 24.7288 17.7858 24.7989C19.4143 24.7989 21.2509 23.9591 21.2509 21.976C21.2509 20.2964 20.0265 19.4213 17.2601 18.4227C15.3352 17.7399 11.3973 16.6196 11.3973 12.6306C11.4319 11.3659 11.9105 10.1538 12.7492 9.20665C13.5879 8.25952 14.7333 7.63784 15.9845 7.4506V5.25053H19.0473V7.42061C20.1005 7.59773 21.0873 8.05283 21.9059 8.7389C22.7244 9.42497 23.3449 10.3171 23.7033 11.3232L20.9386 12.4965C20.7138 11.7977 20.2678 11.191 19.6678 10.768C19.0679 10.345 18.3466 10.1287 17.6129 10.1517C16.3885 10.1517 14.4372 10.7992 14.4372 12.5847C14.4372 14.2466 15.9421 14.8783 19.0579 15.9104C23.2586 17.3624 24.326 19.4972 24.326 21.9478C24.2905 23.372 23.732 24.7333 22.7572 25.7723C21.7824 26.8112 20.4593 27.4551 19.0402 27.5812Z\" fill=\"%234E4B66\"/>%0A</svg>%0A')}nav .menu-sections .menu-section .logtech{-webkit-mask-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<rect x=\"1\" y=\"3\" width=\"14\" height=\"13\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<path d=\"M15 8H19L23 12V16H15V8Z\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"5.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"17.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A</svg>%0A');-moz-mask-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<rect x=\"1\" y=\"3\" width=\"14\" height=\"13\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<path d=\"M15 8H19L23 12V16H15V8Z\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"5.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"17.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A</svg>%0A');-o-prop:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<rect x=\"1\" y=\"3\" width=\"14\" height=\"13\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<path d=\"M15 8H19L23 12V16H15V8Z\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"5.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"17.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A</svg>%0A')}nav .menu-sections .menu-section .marketplace{-webkit-mask-image:url('data:image/svg+xml,<svg width=\"23\" height=\"24\" viewBox=\"0 0 23 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.0131 23.19V2.74561C17.0387 2.3768 16.9901 2.00661 16.8701 1.65691C16.7502 1.3072 16.5614 0.985084 16.3149 0.709586C16.0394 0.4611 15.7166 0.270786 15.3658 0.150048C15.015 0.0293103 14.6434 -0.019366 14.2733 0.0069356H4.46056C4.09267 -0.0188504 3.72335 0.0295727 3.37454 0.149328C3.02573 0.269083 2.70454 0.457728 2.43007 0.704053C2.18319 0.980172 1.99427 1.30306 1.87452 1.65356C1.75477 2.00406 1.70663 2.37505 1.73295 2.7445V23.19H3.52001V2.79098C3.50174 2.6559 3.51491 2.51842 3.5585 2.38927C3.60209 2.26012 3.67491 2.14277 3.7713 2.04639C3.86769 1.95 3.98503 1.87718 4.11418 1.83359C4.24334 1.79 4.38081 1.77683 4.51589 1.7951H14.2302C14.3627 1.78615 14.4956 1.80397 14.6211 1.84751C14.7466 1.89104 14.862 1.9594 14.9605 2.04849C15.0504 2.14871 15.1193 2.26598 15.163 2.39334C15.2067 2.5207 15.2244 2.65555 15.215 2.78987V23.19H17.0131ZM0.000119503 23.0959C-0.0018524 23.2149 0.020598 23.3331 0.0660845 23.4431C0.111571 23.5531 0.179127 23.6526 0.264581 23.7355C0.3459 23.8202 0.44372 23.8874 0.552008 23.9329C0.660295 23.9784 0.776754 24.0012 0.8942 23.9999H17.8397C18.078 23.9999 18.3065 23.9053 18.475 23.7368C18.6435 23.5683 18.7382 23.3397 18.7382 23.1014C18.7382 22.8631 18.6435 22.6346 18.475 22.4661C18.3065 22.2976 18.078 22.2029 17.8397 22.2029H0.8942C0.657979 22.2052 0.432068 22.3 0.264923 22.467C0.0977786 22.6339 0.00271379 22.8597 0.000119503 23.0959ZM5.97099 11.8546H12.7762C13.079 11.8689 13.3757 11.7663 13.605 11.568C13.7086 11.4741 13.7905 11.3587 13.845 11.2299C13.8995 11.1011 13.9252 10.962 13.9203 10.8222V4.30361C13.9257 4.16231 13.9003 4.02152 13.8459 3.89101C13.7914 3.76051 13.7092 3.64341 13.605 3.54785C13.3759 3.34906 13.0791 3.24604 12.7762 3.26015H5.97099C5.66751 3.24617 5.37031 3.3496 5.14108 3.54896C5.03685 3.64452 4.95465 3.76161 4.9002 3.89212C4.84574 4.02262 4.82033 4.16341 4.82572 4.30472V10.8211C4.82089 10.9609 4.8466 11.1 4.90107 11.2288C4.95554 11.3576 5.03745 11.473 5.14108 11.5669C5.37054 11.7658 5.66768 11.8688 5.97099 11.8546ZM20.5529 20.9282C20.8783 20.942 21.2029 20.8877 21.506 20.7688C21.8092 20.6499 22.0842 20.469 22.3134 20.2377C22.5397 19.9927 22.7149 19.705 22.8289 19.3916C22.9428 19.0781 22.9933 18.7451 22.9773 18.4119V7.80469C23.0209 6.66199 22.7734 5.52696 22.2581 4.50611C21.7875 3.69811 21.0226 3.10337 20.1236 2.84631C20.0268 2.8156 19.9247 2.80535 19.8237 2.8162C19.7228 2.82706 19.6252 2.85879 19.5371 2.90938C19.4464 2.95571 19.3659 3.01986 19.3005 3.098C19.2351 3.17614 19.1861 3.26666 19.1565 3.36416C19.1257 3.46322 19.1151 3.56744 19.1254 3.67065C19.1356 3.77386 19.1665 3.87396 19.2162 3.96501C19.2626 4.05729 19.328 4.13872 19.4081 4.20394C19.4882 4.26916 19.5812 4.3167 19.681 4.34345C19.8901 4.40746 20.0893 4.50019 20.273 4.61898C20.5181 4.78313 20.7237 4.9997 20.8749 5.25302C21.0935 5.6233 21.2435 6.03003 21.3175 6.45361H19.9012C19.789 6.45151 19.6775 6.47205 19.5735 6.51402C19.4694 6.55598 19.3749 6.6185 19.2956 6.69783C19.2162 6.77717 19.1537 6.87169 19.1117 6.97575C19.0698 7.0798 19.0492 7.19125 19.0513 7.30343V11.3456C19.0519 11.5708 19.1417 11.7866 19.3009 11.9459C19.4601 12.1051 19.676 12.1948 19.9012 12.1954H21.4282V18.4086C21.4406 18.6594 21.3539 18.905 21.187 19.0925C21.1062 19.1774 21.0083 19.2441 20.8997 19.2882C20.7911 19.3322 20.6744 19.3527 20.5573 19.3481C20.2933 19.3609 20.0348 19.2691 19.8381 19.0925C19.7472 19.0041 19.676 18.8975 19.6293 18.7796C19.5825 18.6617 19.5613 18.5353 19.567 18.4086V16.6902C19.5891 16.32 19.5347 15.9492 19.4071 15.601C19.2796 15.2528 19.0816 14.9346 18.8256 14.6663C18.2624 14.1583 17.5205 13.8949 16.763 13.9338V15.5062C17.0986 15.4886 17.428 15.6012 17.6826 15.8204C17.7992 15.934 17.8902 16.0713 17.9492 16.2231C18.0082 16.3749 18.0338 16.5376 18.0245 16.7001V18.4075C18.0094 18.7432 18.0633 19.0784 18.1828 19.3924C18.3023 19.7064 18.4849 19.9926 18.7194 20.2333C18.962 20.4673 19.2496 20.6495 19.5648 20.7689C19.88 20.8884 20.2162 20.9426 20.5529 20.9282Z\" fill=\"%2314142B\"/>%0A</svg>%0A');-moz-mask-image:url('data:image/svg+xml,<svg width=\"23\" height=\"24\" viewBox=\"0 0 23 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.0131 23.19V2.74561C17.0387 2.3768 16.9901 2.00661 16.8701 1.65691C16.7502 1.3072 16.5614 0.985084 16.3149 0.709586C16.0394 0.4611 15.7166 0.270786 15.3658 0.150048C15.015 0.0293103 14.6434 -0.019366 14.2733 0.0069356H4.46056C4.09267 -0.0188504 3.72335 0.0295727 3.37454 0.149328C3.02573 0.269083 2.70454 0.457728 2.43007 0.704053C2.18319 0.980172 1.99427 1.30306 1.87452 1.65356C1.75477 2.00406 1.70663 2.37505 1.73295 2.7445V23.19H3.52001V2.79098C3.50174 2.6559 3.51491 2.51842 3.5585 2.38927C3.60209 2.26012 3.67491 2.14277 3.7713 2.04639C3.86769 1.95 3.98503 1.87718 4.11418 1.83359C4.24334 1.79 4.38081 1.77683 4.51589 1.7951H14.2302C14.3627 1.78615 14.4956 1.80397 14.6211 1.84751C14.7466 1.89104 14.862 1.9594 14.9605 2.04849C15.0504 2.14871 15.1193 2.26598 15.163 2.39334C15.2067 2.5207 15.2244 2.65555 15.215 2.78987V23.19H17.0131ZM0.000119503 23.0959C-0.0018524 23.2149 0.020598 23.3331 0.0660845 23.4431C0.111571 23.5531 0.179127 23.6526 0.264581 23.7355C0.3459 23.8202 0.44372 23.8874 0.552008 23.9329C0.660295 23.9784 0.776754 24.0012 0.8942 23.9999H17.8397C18.078 23.9999 18.3065 23.9053 18.475 23.7368C18.6435 23.5683 18.7382 23.3397 18.7382 23.1014C18.7382 22.8631 18.6435 22.6346 18.475 22.4661C18.3065 22.2976 18.078 22.2029 17.8397 22.2029H0.8942C0.657979 22.2052 0.432068 22.3 0.264923 22.467C0.0977786 22.6339 0.00271379 22.8597 0.000119503 23.0959ZM5.97099 11.8546H12.7762C13.079 11.8689 13.3757 11.7663 13.605 11.568C13.7086 11.4741 13.7905 11.3587 13.845 11.2299C13.8995 11.1011 13.9252 10.962 13.9203 10.8222V4.30361C13.9257 4.16231 13.9003 4.02152 13.8459 3.89101C13.7914 3.76051 13.7092 3.64341 13.605 3.54785C13.3759 3.34906 13.0791 3.24604 12.7762 3.26015H5.97099C5.66751 3.24617 5.37031 3.3496 5.14108 3.54896C5.03685 3.64452 4.95465 3.76161 4.9002 3.89212C4.84574 4.02262 4.82033 4.16341 4.82572 4.30472V10.8211C4.82089 10.9609 4.8466 11.1 4.90107 11.2288C4.95554 11.3576 5.03745 11.473 5.14108 11.5669C5.37054 11.7658 5.66768 11.8688 5.97099 11.8546ZM20.5529 20.9282C20.8783 20.942 21.2029 20.8877 21.506 20.7688C21.8092 20.6499 22.0842 20.469 22.3134 20.2377C22.5397 19.9927 22.7149 19.705 22.8289 19.3916C22.9428 19.0781 22.9933 18.7451 22.9773 18.4119V7.80469C23.0209 6.66199 22.7734 5.52696 22.2581 4.50611C21.7875 3.69811 21.0226 3.10337 20.1236 2.84631C20.0268 2.8156 19.9247 2.80535 19.8237 2.8162C19.7228 2.82706 19.6252 2.85879 19.5371 2.90938C19.4464 2.95571 19.3659 3.01986 19.3005 3.098C19.2351 3.17614 19.1861 3.26666 19.1565 3.36416C19.1257 3.46322 19.1151 3.56744 19.1254 3.67065C19.1356 3.77386 19.1665 3.87396 19.2162 3.96501C19.2626 4.05729 19.328 4.13872 19.4081 4.20394C19.4882 4.26916 19.5812 4.3167 19.681 4.34345C19.8901 4.40746 20.0893 4.50019 20.273 4.61898C20.5181 4.78313 20.7237 4.9997 20.8749 5.25302C21.0935 5.6233 21.2435 6.03003 21.3175 6.45361H19.9012C19.789 6.45151 19.6775 6.47205 19.5735 6.51402C19.4694 6.55598 19.3749 6.6185 19.2956 6.69783C19.2162 6.77717 19.1537 6.87169 19.1117 6.97575C19.0698 7.0798 19.0492 7.19125 19.0513 7.30343V11.3456C19.0519 11.5708 19.1417 11.7866 19.3009 11.9459C19.4601 12.1051 19.676 12.1948 19.9012 12.1954H21.4282V18.4086C21.4406 18.6594 21.3539 18.905 21.187 19.0925C21.1062 19.1774 21.0083 19.2441 20.8997 19.2882C20.7911 19.3322 20.6744 19.3527 20.5573 19.3481C20.2933 19.3609 20.0348 19.2691 19.8381 19.0925C19.7472 19.0041 19.676 18.8975 19.6293 18.7796C19.5825 18.6617 19.5613 18.5353 19.567 18.4086V16.6902C19.5891 16.32 19.5347 15.9492 19.4071 15.601C19.2796 15.2528 19.0816 14.9346 18.8256 14.6663C18.2624 14.1583 17.5205 13.8949 16.763 13.9338V15.5062C17.0986 15.4886 17.428 15.6012 17.6826 15.8204C17.7992 15.934 17.8902 16.0713 17.9492 16.2231C18.0082 16.3749 18.0338 16.5376 18.0245 16.7001V18.4075C18.0094 18.7432 18.0633 19.0784 18.1828 19.3924C18.3023 19.7064 18.4849 19.9926 18.7194 20.2333C18.962 20.4673 19.2496 20.6495 19.5648 20.7689C19.88 20.8884 20.2162 20.9426 20.5529 20.9282Z\" fill=\"%2314142B\"/>%0A</svg>%0A');-o-prop:url('data:image/svg+xml,<svg width=\"23\" height=\"24\" viewBox=\"0 0 23 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.0131 23.19V2.74561C17.0387 2.3768 16.9901 2.00661 16.8701 1.65691C16.7502 1.3072 16.5614 0.985084 16.3149 0.709586C16.0394 0.4611 15.7166 0.270786 15.3658 0.150048C15.015 0.0293103 14.6434 -0.019366 14.2733 0.0069356H4.46056C4.09267 -0.0188504 3.72335 0.0295727 3.37454 0.149328C3.02573 0.269083 2.70454 0.457728 2.43007 0.704053C2.18319 0.980172 1.99427 1.30306 1.87452 1.65356C1.75477 2.00406 1.70663 2.37505 1.73295 2.7445V23.19H3.52001V2.79098C3.50174 2.6559 3.51491 2.51842 3.5585 2.38927C3.60209 2.26012 3.67491 2.14277 3.7713 2.04639C3.86769 1.95 3.98503 1.87718 4.11418 1.83359C4.24334 1.79 4.38081 1.77683 4.51589 1.7951H14.2302C14.3627 1.78615 14.4956 1.80397 14.6211 1.84751C14.7466 1.89104 14.862 1.9594 14.9605 2.04849C15.0504 2.14871 15.1193 2.26598 15.163 2.39334C15.2067 2.5207 15.2244 2.65555 15.215 2.78987V23.19H17.0131ZM0.000119503 23.0959C-0.0018524 23.2149 0.020598 23.3331 0.0660845 23.4431C0.111571 23.5531 0.179127 23.6526 0.264581 23.7355C0.3459 23.8202 0.44372 23.8874 0.552008 23.9329C0.660295 23.9784 0.776754 24.0012 0.8942 23.9999H17.8397C18.078 23.9999 18.3065 23.9053 18.475 23.7368C18.6435 23.5683 18.7382 23.3397 18.7382 23.1014C18.7382 22.8631 18.6435 22.6346 18.475 22.4661C18.3065 22.2976 18.078 22.2029 17.8397 22.2029H0.8942C0.657979 22.2052 0.432068 22.3 0.264923 22.467C0.0977786 22.6339 0.00271379 22.8597 0.000119503 23.0959ZM5.97099 11.8546H12.7762C13.079 11.8689 13.3757 11.7663 13.605 11.568C13.7086 11.4741 13.7905 11.3587 13.845 11.2299C13.8995 11.1011 13.9252 10.962 13.9203 10.8222V4.30361C13.9257 4.16231 13.9003 4.02152 13.8459 3.89101C13.7914 3.76051 13.7092 3.64341 13.605 3.54785C13.3759 3.34906 13.0791 3.24604 12.7762 3.26015H5.97099C5.66751 3.24617 5.37031 3.3496 5.14108 3.54896C5.03685 3.64452 4.95465 3.76161 4.9002 3.89212C4.84574 4.02262 4.82033 4.16341 4.82572 4.30472V10.8211C4.82089 10.9609 4.8466 11.1 4.90107 11.2288C4.95554 11.3576 5.03745 11.473 5.14108 11.5669C5.37054 11.7658 5.66768 11.8688 5.97099 11.8546ZM20.5529 20.9282C20.8783 20.942 21.2029 20.8877 21.506 20.7688C21.8092 20.6499 22.0842 20.469 22.3134 20.2377C22.5397 19.9927 22.7149 19.705 22.8289 19.3916C22.9428 19.0781 22.9933 18.7451 22.9773 18.4119V7.80469C23.0209 6.66199 22.7734 5.52696 22.2581 4.50611C21.7875 3.69811 21.0226 3.10337 20.1236 2.84631C20.0268 2.8156 19.9247 2.80535 19.8237 2.8162C19.7228 2.82706 19.6252 2.85879 19.5371 2.90938C19.4464 2.95571 19.3659 3.01986 19.3005 3.098C19.2351 3.17614 19.1861 3.26666 19.1565 3.36416C19.1257 3.46322 19.1151 3.56744 19.1254 3.67065C19.1356 3.77386 19.1665 3.87396 19.2162 3.96501C19.2626 4.05729 19.328 4.13872 19.4081 4.20394C19.4882 4.26916 19.5812 4.3167 19.681 4.34345C19.8901 4.40746 20.0893 4.50019 20.273 4.61898C20.5181 4.78313 20.7237 4.9997 20.8749 5.25302C21.0935 5.6233 21.2435 6.03003 21.3175 6.45361H19.9012C19.789 6.45151 19.6775 6.47205 19.5735 6.51402C19.4694 6.55598 19.3749 6.6185 19.2956 6.69783C19.2162 6.77717 19.1537 6.87169 19.1117 6.97575C19.0698 7.0798 19.0492 7.19125 19.0513 7.30343V11.3456C19.0519 11.5708 19.1417 11.7866 19.3009 11.9459C19.4601 12.1051 19.676 12.1948 19.9012 12.1954H21.4282V18.4086C21.4406 18.6594 21.3539 18.905 21.187 19.0925C21.1062 19.1774 21.0083 19.2441 20.8997 19.2882C20.7911 19.3322 20.6744 19.3527 20.5573 19.3481C20.2933 19.3609 20.0348 19.2691 19.8381 19.0925C19.7472 19.0041 19.676 18.8975 19.6293 18.7796C19.5825 18.6617 19.5613 18.5353 19.567 18.4086V16.6902C19.5891 16.32 19.5347 15.9492 19.4071 15.601C19.2796 15.2528 19.0816 14.9346 18.8256 14.6663C18.2624 14.1583 17.5205 13.8949 16.763 13.9338V15.5062C17.0986 15.4886 17.428 15.6012 17.6826 15.8204C17.7992 15.934 17.8902 16.0713 17.9492 16.2231C18.0082 16.3749 18.0338 16.5376 18.0245 16.7001V18.4075C18.0094 18.7432 18.0633 19.0784 18.1828 19.3924C18.3023 19.7064 18.4849 19.9926 18.7194 20.2333C18.962 20.4673 19.2496 20.6495 19.5648 20.7689C19.88 20.8884 20.2162 20.9426 20.5529 20.9282Z\" fill=\"%2314142B\"/>%0A</svg>%0A')}nav .menu-sections .menu-section .admin{-webkit-mask-image:url('data:image/svg+xml,<svg width=\"26\" height=\"26\" viewBox=\"0 0 26 26\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<circle cx=\"13\" cy=\"13\" r=\"4\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A<path d=\"M11.2844 2.86293C12.061 1.56696 13.939 1.56696 14.7156 2.86293L15.4213 4.0407C15.8742 4.79649 16.7684 5.16686 17.6231 4.95268L18.9549 4.61892C20.4204 4.25166 21.7483 5.57958 21.3811 7.0451L21.0473 8.37695C20.8331 9.23162 21.2035 10.1258 21.9593 10.5787L23.1371 11.2844C24.433 12.061 24.433 13.939 23.1371 14.7156L21.9593 15.4213C21.2035 15.8742 20.8331 16.7684 21.0473 17.6231L21.3811 18.9549C21.7483 20.4204 20.4204 21.7483 18.9549 21.3811L17.6231 21.0473C16.7684 20.8331 15.8742 21.2035 15.4213 21.9593L14.7156 23.1371C13.939 24.433 12.061 24.433 11.2844 23.1371L10.5787 21.9593C10.1258 21.2035 9.23162 20.8331 8.37695 21.0473L7.04509 21.3811C5.57958 21.7483 4.25166 20.4204 4.61892 18.9549L4.95268 17.6231C5.16686 16.7684 4.79649 15.8742 4.04069 15.4213L2.86293 14.7156C1.56696 13.939 1.56696 12.061 2.86293 11.2844L4.0407 10.5787C4.79649 10.1258 5.16686 9.23162 4.95268 8.37695L4.61892 7.04509C4.25166 5.57958 5.57958 4.25166 7.0451 4.61892L8.37695 4.95268C9.23162 5.16686 10.1258 4.79649 10.5787 4.04069L11.2844 2.86293Z\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A</svg>%0A');-moz-mask-image:url('data:image/svg+xml,<svg width=\"26\" height=\"26\" viewBox=\"0 0 26 26\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<circle cx=\"13\" cy=\"13\" r=\"4\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A<path d=\"M11.2844 2.86293C12.061 1.56696 13.939 1.56696 14.7156 2.86293L15.4213 4.0407C15.8742 4.79649 16.7684 5.16686 17.6231 4.95268L18.9549 4.61892C20.4204 4.25166 21.7483 5.57958 21.3811 7.0451L21.0473 8.37695C20.8331 9.23162 21.2035 10.1258 21.9593 10.5787L23.1371 11.2844C24.433 12.061 24.433 13.939 23.1371 14.7156L21.9593 15.4213C21.2035 15.8742 20.8331 16.7684 21.0473 17.6231L21.3811 18.9549C21.7483 20.4204 20.4204 21.7483 18.9549 21.3811L17.6231 21.0473C16.7684 20.8331 15.8742 21.2035 15.4213 21.9593L14.7156 23.1371C13.939 24.433 12.061 24.433 11.2844 23.1371L10.5787 21.9593C10.1258 21.2035 9.23162 20.8331 8.37695 21.0473L7.04509 21.3811C5.57958 21.7483 4.25166 20.4204 4.61892 18.9549L4.95268 17.6231C5.16686 16.7684 4.79649 15.8742 4.04069 15.4213L2.86293 14.7156C1.56696 13.939 1.56696 12.061 2.86293 11.2844L4.0407 10.5787C4.79649 10.1258 5.16686 9.23162 4.95268 8.37695L4.61892 7.04509C4.25166 5.57958 5.57958 4.25166 7.0451 4.61892L8.37695 4.95268C9.23162 5.16686 10.1258 4.79649 10.5787 4.04069L11.2844 2.86293Z\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A</svg>%0A');-o-prop:url('data:image/svg+xml,<svg width=\"26\" height=\"26\" viewBox=\"0 0 26 26\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<circle cx=\"13\" cy=\"13\" r=\"4\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A<path d=\"M11.2844 2.86293C12.061 1.56696 13.939 1.56696 14.7156 2.86293L15.4213 4.0407C15.8742 4.79649 16.7684 5.16686 17.6231 4.95268L18.9549 4.61892C20.4204 4.25166 21.7483 5.57958 21.3811 7.0451L21.0473 8.37695C20.8331 9.23162 21.2035 10.1258 21.9593 10.5787L23.1371 11.2844C24.433 12.061 24.433 13.939 23.1371 14.7156L21.9593 15.4213C21.2035 15.8742 20.8331 16.7684 21.0473 17.6231L21.3811 18.9549C21.7483 20.4204 20.4204 21.7483 18.9549 21.3811L17.6231 21.0473C16.7684 20.8331 15.8742 21.2035 15.4213 21.9593L14.7156 23.1371C13.939 24.433 12.061 24.433 11.2844 23.1371L10.5787 21.9593C10.1258 21.2035 9.23162 20.8331 8.37695 21.0473L7.04509 21.3811C5.57958 21.7483 4.25166 20.4204 4.61892 18.9549L4.95268 17.6231C5.16686 16.7684 4.79649 15.8742 4.04069 15.4213L2.86293 14.7156C1.56696 13.939 1.56696 12.061 2.86293 11.2844L4.0407 10.5787C4.79649 10.1258 5.16686 9.23162 4.95268 8.37695L4.61892 7.04509C4.25166 5.57958 5.57958 4.25166 7.0451 4.61892L8.37695 4.95268C9.23162 5.16686 10.1258 4.79649 10.5787 4.04069L11.2844 2.86293Z\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A</svg>%0A')}nav .menu-sections .menu-section .selected-portal-item{-webkit-mask-size:contain;-moz-mask-size:contain;-o-prop:contain;background-color:var(--form-labels-color)}nav .menu-sections .menu-section .selected-portal-item:before{content:\"\";width:20px;height:20px;display:block}nav .menu-sections .menu-section .selected-portal{background-color:var(--gray-light);border-radius:15px}nav .menu-sections .menu-section .selected-portal .icon-container{-webkit-mask-size:contain;-moz-mask-size:contain;-o-prop:contain}nav .menu-sections .menu-section .selected-portal .icon-container .menu-icon{filter:invert(35%) sepia(100%) saturate(5659%) hue-rotate(210deg) brightness(87%) contrast(118%)}nav .menu-sections .menu-section .selected-portal .selected-portal-item{background-color:var(--theme-primary)}nav .menu-sections .menu-section .selected-portal .marketplace .menu-label{color:var(--success-color)}nav .menu-sections .menu-section .selected-portal .menu-label{color:var(--theme-primary)}nav .footer{display:flex;align-items:center;padding:10px;margin:0 10px;border-top:1px solid var(--gray-light);overflow:hidden;height:50px}nav .footer .footer-icon{width:50px}nav .footer .footer-content{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;font-size:.8em;text-overflow:hidden;white-space:nowrap}\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: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: SubMenusListComponent, selector: "vector-sub-menus-list", inputs: ["showList", "options", "childLevel", "submenuSelected"], outputs: ["submenuSelectedChange"] }], animations: [
             trigger('sideInOut', [state('in', style({ width: '60px' })), state('out', style({ width: '250px' }))]),
             trigger('fadeInOut', [
                 state('0', style({
@@ -4690,7 +4805,7 @@ class MenuComponent {
             ]),
         ] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MenuComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MenuComponent, decorators: [{
             type: Component,
             args: [{ selector: 'vector-menu', animations: [
                         trigger('sideInOut', [state('in', style({ width: '60px' })), state('out', style({ width: '250px' }))]),
@@ -4731,7 +4846,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
                             })),
                             transition('0 <=> 1', animate('350ms ease-in-out')),
                         ]),
-                    ], template: "<nav id=\"menu\" [ngStyle]=\"widthStyle\" [@sideInOut]=\"lastAnimation\">\r\n  <div class=\"header-menu\">\r\n    <div class=\"logo-container\">\r\n      <div class=\"logo\" [ngClass]=\"{ 'logo-small': !opened }\"></div>\r\n    </div>\r\n  </div>\r\n  <div class=\"menu-sections\">\r\n    <div class=\"menu-section\">\r\n      <span [ngStyle]=\"{ opacity: opened ? 1 : 0 }\" class=\"menu-section-title\">SELE\u00C7\u00C3O DE PORTAL</span>\r\n      <ul class=\"side-menu\">\r\n        <ng-container *ngIf=\"apps.length\">\r\n          <li *ngFor=\"let app of apps\">\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(app.appName) }\"\r\n              (click)=\"navigateToPortal(app)\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item {{ app.className }}\"></div>\r\n              <span class=\"menu-label\">{{ app.description }}</span>\r\n            </div>\r\n          </li>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!apps.length\">\r\n          <li>\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.LOGTECH) }\"\r\n              (click)=\"navigateToPortal({ appName: appsEnum.LOGTECH, isAdmin: false })\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item logtech\"></div>\r\n              <span class=\"menu-label\">Cargas</span>\r\n            </div>\r\n          </li>\r\n          <li *ngIf=\"hasAnyFintechPermission\">\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.FINTECH) }\"\r\n              (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: false })\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item fintech\"></div>\r\n              <span class=\"menu-label\">Conta digital</span>\r\n            </div>\r\n          </li>\r\n          <li *ngIf=\"!production\">\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.MARKETPLACE) }\"\r\n              (click)=\"navigateToPortal({ appName: appsEnum.MARKETPLACE, isAdmin: false })\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item marketplace\"></div>\r\n              <span class=\"menu-label\">Combust\u00EDvel</span>\r\n            </div>\r\n          </li>\r\n          <li *ngIf=\"adminOption && (hasFintechAdminPermission || hasMarketplaceAdminPermission)\">\r\n            <div\r\n              class=\"side-menu-item\"\r\n              [ngClass]=\"{ 'active-menu': activeOption?.id === adminOption.id }\"\r\n              (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: true })\"\r\n            >\r\n              <div class=\"icon-container selected-portal-item admin\"></div>\r\n              <span class=\"menu-label\">Admin Fintech</span>\r\n            </div>\r\n          </li>\r\n        </ng-container>\r\n      </ul>\r\n    </div>\r\n    <div class=\"menu-section\">\r\n      <span [ngStyle]=\"{ opacity: opened && options.length ? 1 : 0 }\" class=\"menu-section-title\">MENU</span>\r\n      <ul class=\"side-menu\">\r\n        <li *ngFor=\"let option of options\">\r\n          <div\r\n            class=\"side-menu-item\"\r\n            [ngClass]=\"{ 'active-menu': activeOption?.id === option.id, 'always-open': !!option.alwaysOpen }\"\r\n            [pTooltip]=\"option.label\"\r\n            tooltipPosition=\"right\"\r\n            (click)=\"onMenuClick(option)\"\r\n          >\r\n            <div class=\"icon-container\">\r\n              <img\r\n                *ngIf=\"option.iconFileName\"\r\n                [src]=\"'../../../../assets/icons/' + option.iconFileName + '.svg'\"\r\n                class=\"menu-icon\"\r\n              />\r\n              <i *ngIf=\"option.icon\" class=\"menu-icon {{ option.icon }}\"></i>\r\n              <span *ngIf=\"getMenuNotificationsCount(option)\" class=\"menu-notifications-count\">{{\r\n                getMenuNotificationsCount(option)\r\n              }}</span>\r\n            </div>\r\n            <span class=\"menu-label\">{{ option.label }}</span>\r\n            <i\r\n              *ngIf=\"opened && option.children?.length && !option.alwaysOpen\"\r\n              class=\"fas angle-icon\"\r\n              [ngClass]=\"{\r\n                'fa-angle-down': activeOption?.id !== option.id,\r\n                'fa-angle-up': activeOption?.id === option.id\r\n              }\"\r\n            ></i>\r\n          </div>\r\n          <vector-sub-menus-list\r\n            [options]=\"option.children\"\r\n            [showList]=\"activeOption?.id === option.id || (!!option.alwaysOpen && opened)\"\r\n            [submenuSelected]=\"activeSubmenuOption\"\r\n            (submenuSelectedChange)=\"onSubmenuClick($event)\"\r\n          ></vector-sub-menus-list>\r\n        </li>\r\n      </ul>\r\n    </div>\r\n  </div>\r\n  <div class=\"footer side-menu-item\">\r\n    <div class=\"icon-container\">\r\n      <a>\r\n        <img src=\"../../../../assets/icons/menu_footer_icon.svg\" (click)=\"openTermsOfUse()\" class=\"menu-icon\" />\r\n      </a>\r\n    </div>\r\n    <span class=\"menu-label footer-content\">\r\n      <span> Veja nosso <a (click)=\"openTermsOfUse()\">Termo de uso</a> </span>\r\n      <span>e <a (click)=\"openTermsOfUse()\">Pol\u00EDtica de privacidade</a></span>\r\n    </span>\r\n  </div>\r\n</nav>\r\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;margin-left:20px;min-width:175px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}nav{height:100vh;min-height:100vh;background-color:#fff;transition:width ease-in-out .2s;display:flex;flex-direction:column;z-index:500;position:sticky;box-shadow:2px 2px 4px #00000029}nav .header-menu{display:flex;justify-content:center;flex-direction:column;width:100%}nav .header-menu .logo-container{height:81px;padding:5px;display:flex;justify-content:center;align-items:center}nav .header-menu .logo-container .logo{background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-position:center;height:50px;width:150px}nav .header-menu .logo-container .logo-small{background-position-y:center;background-position-x:right}nav .menu-sections{display:flex;flex-direction:column;flex:1;overflow-y:overlay;overflow-x:hidden}nav .menu-sections::-webkit-scrollbar{width:4px}nav .menu-sections .menu-section{margin:5px 10px 0}nav .menu-sections .menu-section:first-child{border-bottom:1px solid var(--gray-light)}nav .menu-sections .menu-section .menu-section-title{color:var(--gray-dark);font-weight:500;font-size:.8em;padding-left:10px;white-space:nowrap;transition:opacity .2s ease-in-out}nav .menu-sections .menu-section .side-menu{padding:0;margin:0;list-style:none;overflow-x:hidden;overflow-y:scroll;-ms-overflow-style:none}nav .menu-sections .menu-section .side-menu::-webkit-scrollbar{display:none}@media screen and (max-width: 650px){nav .menu-sections .menu-section .side-menu{background-size:120px;background-position:20px}}nav .menu-sections .menu-section .side-menu-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}nav .menu-sections .menu-section .side-menu-item:not(.always-open){cursor:pointer}nav .menu-sections .menu-section .side-menu-item:hover{background-color:var(--gray-light)}nav .menu-sections .menu-section .side-menu-item.active{background-color:var(--gray-light)}nav .menu-sections .menu-section .side-menu-item.active span{color:#fff}nav .menu-sections .menu-section .side-menu-item.active i{color:#fff}nav .menu-sections .menu-section .fintech{-webkit-mask-image:url(../../../../assets/icons/vector_fintech_icon.svg);-moz-mask-image:url(../../../../assets/icons/vector_fintech_icon.svg);-o-prop:url(../../../../assets/icons/vector_fintech_icon.svg)}nav .menu-sections .menu-section .logtech{-webkit-mask-image:url(../../../../assets/icons/vector_logtech_icon.svg);-moz-mask-image:url(../../../../assets/icons/vector_logtech_icon.svg);-o-prop:url(../../../../assets/icons/vector_logtech_icon.svg)}nav .menu-sections .menu-section .marketplace{-webkit-mask-image:url(../../../../assets/icons/vector_marketplace_icon.svg);-moz-mask-image:url(../../../../assets/icons/vector_marketplace_icon.svg);-o-prop:url(../../../../assets/icons/vector_marketplace_icon.svg)}nav .menu-sections .menu-section .admin{-webkit-mask-image:url(../../../../assets/icons/vector_admin_icon.svg);-moz-mask-image:url(../../../../assets/icons/vector_admin_icon.svg);-o-prop:url(../../../../assets/icons/vector_admin_icon.svg)}nav .menu-sections .menu-section .selected-portal-item{-webkit-mask-size:contain;-moz-mask-size:contain;-o-prop:contain;background-color:var(--form-labels-color)}nav .menu-sections .menu-section .selected-portal-item:before{content:\"\";width:20px;height:20px;display:block}nav .menu-sections .menu-section .selected-portal{background-color:var(--gray-light);border-radius:15px}nav .menu-sections .menu-section .selected-portal .icon-container{-webkit-mask-size:contain;-moz-mask-size:contain;-o-prop:contain}nav .menu-sections .menu-section .selected-portal .icon-container .menu-icon{filter:invert(35%) sepia(100%) saturate(5659%) hue-rotate(210deg) brightness(87%) contrast(118%)}nav .menu-sections .menu-section .selected-portal .selected-portal-item{background-color:var(--theme-primary)}nav .menu-sections .menu-section .selected-portal .marketplace .menu-label{color:var(--success-color)}nav .menu-sections .menu-section .selected-portal .menu-label{color:var(--theme-primary)}nav .footer{display:flex;align-items:center;padding:10px;margin:0 10px;border-top:1px solid var(--gray-light);overflow:hidden;height:50px}nav .footer .footer-icon{width:50px}nav .footer .footer-content{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;font-size:.8em;text-overflow:hidden;white-space:nowrap}\n"] }]
+                    ], template: "<nav id=\"menu\" [ngStyle]=\"widthStyle\" [@sideInOut]=\"lastAnimation\">\n  <div class=\"header-menu\">\n    <div class=\"logo-container\">\n      <div class=\"logo\" [ngClass]=\"{ 'logo-small': !opened }\"></div>\n    </div>\n  </div>\n  <div class=\"menu-sections\">\n    <div class=\"menu-section\">\n      <span [ngStyle]=\"{ opacity: opened ? 1 : 0 }\" class=\"menu-section-title\">SELE\u00C7\u00C3O DE PORTAL</span>\n      <ul class=\"side-menu\">\n        <ng-container *ngIf=\"apps.length\">\n          <li *ngFor=\"let app of apps\">\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(app.appName) }\"\n              (click)=\"navigateToPortal(app)\"\n            >\n              <div class=\"icon-container selected-portal-item {{ app.className }}\"></div>\n              <span class=\"menu-label\">{{ app.description }}</span>\n            </div>\n          </li>\n        </ng-container>\n        <ng-container *ngIf=\"!apps.length\">\n          <li>\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.LOGTECH) }\"\n              (click)=\"navigateToPortal({ appName: appsEnum.LOGTECH, isAdmin: false })\"\n            >\n              <div class=\"icon-container selected-portal-item logtech\"></div>\n              <span class=\"menu-label\">Cargas</span>\n            </div>\n          </li>\n          <li *ngIf=\"hasAnyFintechPermission\">\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.FINTECH) }\"\n              (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: false })\"\n            >\n              <div class=\"icon-container selected-portal-item fintech\"></div>\n              <span class=\"menu-label\">Conta digital</span>\n            </div>\n          </li>\n          <li *ngIf=\"!production\">\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'selected-portal': isPortalSelected(appsEnum.MARKETPLACE) }\"\n              (click)=\"navigateToPortal({ appName: appsEnum.MARKETPLACE, isAdmin: false })\"\n            >\n              <div class=\"icon-container selected-portal-item marketplace\"></div>\n              <span class=\"menu-label\">Combust\u00EDvel</span>\n            </div>\n          </li>\n          <li *ngIf=\"adminOption && (hasFintechAdminPermission || hasMarketplaceAdminPermission)\">\n            <div\n              class=\"side-menu-item\"\n              [ngClass]=\"{ 'active-menu': activeOption?.id === adminOption.id }\"\n              (click)=\"navigateToPortal({ appName: appsEnum.FINTECH, isAdmin: true })\"\n            >\n              <div class=\"icon-container selected-portal-item admin\"></div>\n              <span class=\"menu-label\">Admin Fintech</span>\n            </div>\n          </li>\n        </ng-container>\n      </ul>\n    </div>\n    <div class=\"menu-section\">\n      <span [ngStyle]=\"{ opacity: opened && options.length ? 1 : 0 }\" class=\"menu-section-title\">MENU</span>\n      <ul class=\"side-menu\">\n        <li *ngFor=\"let option of options\">\n          <div\n            class=\"side-menu-item\"\n            [ngClass]=\"{ 'active-menu': activeOption?.id === option.id, 'always-open': !!option.alwaysOpen }\"\n            [pTooltip]=\"option.label\"\n            tooltipPosition=\"right\"\n            (click)=\"onMenuClick(option)\"\n          >\n            <div class=\"icon-container\">\n              <img\n                *ngIf=\"option.iconFileName\"\n                [src]=\"'../../../../assets/icons/' + option.iconFileName + '.svg'\"\n                class=\"menu-icon\"\n              />\n              <i *ngIf=\"option.icon\" class=\"menu-icon {{ option.icon }}\"></i>\n              <span *ngIf=\"getMenuNotificationsCount(option)\" class=\"menu-notifications-count\">{{\n                getMenuNotificationsCount(option)\n              }}</span>\n            </div>\n            <span class=\"menu-label\">{{ option.label }}</span>\n            <i\n              *ngIf=\"opened && option.children?.length && !option.alwaysOpen\"\n              class=\"fas angle-icon\"\n              [ngClass]=\"{\n                'fa-angle-down': activeOption?.id !== option.id,\n                'fa-angle-up': activeOption?.id === option.id\n              }\"\n            ></i>\n          </div>\n          <vector-sub-menus-list\n            [options]=\"option.children\"\n            [showList]=\"activeOption?.id === option.id || (!!option.alwaysOpen && opened)\"\n            [submenuSelected]=\"activeSubmenuOption\"\n            (submenuSelectedChange)=\"onSubmenuClick($event)\"\n          ></vector-sub-menus-list>\n        </li>\n      </ul>\n    </div>\n  </div>\n  <div class=\"footer side-menu-item\">\n    <div class=\"icon-container\">\n      <a>\n        <img src=\"../../../../assets/icons/menu_footer_icon.svg\" (click)=\"openTermsOfUse()\" class=\"menu-icon\" />\n      </a>\n    </div>\n    <span class=\"menu-label footer-content\">\n      <span> Veja nosso <a (click)=\"openTermsOfUse()\">Termo de uso</a> </span>\n      <span>e <a (click)=\"openTermsOfUse()\">Pol\u00EDtica de privacidade</a></span>\n    </span>\n  </div>\n</nav>\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;margin-left:20px;min-width:175px;white-space:normal;overflow:visible}.active-menu:not(.always-open){background-color:var(--gray-light)}nav{height:100vh;min-height:100vh;background-color:#fff;transition:width ease-in-out .2s;display:flex;flex-direction:column;z-index:500;position:sticky;box-shadow:2px 2px 4px #00000029}nav .header-menu{display:flex;justify-content:center;flex-direction:column;width:100%}nav .header-menu .logo-container{height:81px;padding:5px;display:flex;justify-content:center;align-items:center}nav .header-menu .logo-container .logo{background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-position:center;height:50px;width:150px}nav .header-menu .logo-container .logo-small{background-position-y:center;background-position-x:right}nav .menu-sections{display:flex;flex-direction:column;flex:1;overflow-y:overlay;overflow-x:hidden}nav .menu-sections::-webkit-scrollbar{width:4px}nav .menu-sections .menu-section{margin:5px 10px 0}nav .menu-sections .menu-section:first-child{border-bottom:1px solid var(--gray-light)}nav .menu-sections .menu-section .menu-section-title{color:var(--gray-dark);font-weight:500;font-size:.8em;padding-left:10px;white-space:nowrap;transition:opacity .2s ease-in-out}nav .menu-sections .menu-section .side-menu{padding:0;margin:0;list-style:none;overflow-x:hidden;overflow-y:scroll;-ms-overflow-style:none}nav .menu-sections .menu-section .side-menu::-webkit-scrollbar{display:none}@media screen and (max-width: 650px){nav .menu-sections .menu-section .side-menu{background-size:120px;background-position:20px}}nav .menu-sections .menu-section .side-menu-item{min-height:40px;display:flex;flex-direction:row;align-items:center;transition:background-color ease-in-out .1s;z-index:2;overflow:hidden;padding:0 10px;border-radius:15px;margin:5px 0;position:relative}nav .menu-sections .menu-section .side-menu-item:not(.always-open){cursor:pointer}nav .menu-sections .menu-section .side-menu-item:hover{background-color:var(--gray-light)}nav .menu-sections .menu-section .side-menu-item.active{background-color:var(--gray-light)}nav .menu-sections .menu-section .side-menu-item.active span{color:#fff}nav .menu-sections .menu-section .side-menu-item.active i{color:#fff}nav .menu-sections .menu-section .fintech{-webkit-mask-image:url('data:image/svg+xml,<svg width=\"35\" height=\"35\" viewBox=\"0 0 35 35\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.5 0C14.0388 0 10.6554 1.02636 7.77753 2.94928C4.89967 4.87221 2.65665 7.60533 1.33212 10.803C0.00758245 14.0007 -0.338976 17.5194 0.336265 20.9141C1.01151 24.3087 2.67822 27.4269 5.12564 29.8744C7.57306 32.3218 10.6913 33.9885 14.0859 34.6637C17.4806 35.339 20.9993 34.9924 24.197 33.6679C27.3947 32.3434 30.1278 30.1003 32.0507 27.2225C33.9736 24.3446 35 20.9612 35 17.5C34.9981 12.8593 33.1538 8.40918 29.8723 5.1277C26.5908 1.84622 22.1407 0.00187031 17.5 0ZM19.0402 27.5812V29.7512H15.9774V27.4929C14.7019 27.2047 13.5315 26.5677 12.5969 25.653C11.6623 24.7384 11.0002 23.582 10.6846 22.313L13.585 21.1415C13.7924 22.1249 14.3147 23.014 15.0727 23.6739C15.8307 24.3339 16.7832 24.7288 17.7858 24.7989C19.4143 24.7989 21.2509 23.9591 21.2509 21.976C21.2509 20.2964 20.0265 19.4213 17.2601 18.4227C15.3352 17.7399 11.3973 16.6196 11.3973 12.6306C11.4319 11.3659 11.9105 10.1538 12.7492 9.20665C13.5879 8.25952 14.7333 7.63784 15.9845 7.4506V5.25053H19.0473V7.42061C20.1005 7.59773 21.0873 8.05283 21.9059 8.7389C22.7244 9.42497 23.3449 10.3171 23.7033 11.3232L20.9386 12.4965C20.7138 11.7977 20.2678 11.191 19.6678 10.768C19.0679 10.345 18.3466 10.1287 17.6129 10.1517C16.3885 10.1517 14.4372 10.7992 14.4372 12.5847C14.4372 14.2466 15.9421 14.8783 19.0579 15.9104C23.2586 17.3624 24.326 19.4972 24.326 21.9478C24.2905 23.372 23.732 24.7333 22.7572 25.7723C21.7824 26.8112 20.4593 27.4551 19.0402 27.5812Z\" fill=\"%234E4B66\"/>%0A</svg>%0A');-moz-mask-image:url('data:image/svg+xml,<svg width=\"35\" height=\"35\" viewBox=\"0 0 35 35\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.5 0C14.0388 0 10.6554 1.02636 7.77753 2.94928C4.89967 4.87221 2.65665 7.60533 1.33212 10.803C0.00758245 14.0007 -0.338976 17.5194 0.336265 20.9141C1.01151 24.3087 2.67822 27.4269 5.12564 29.8744C7.57306 32.3218 10.6913 33.9885 14.0859 34.6637C17.4806 35.339 20.9993 34.9924 24.197 33.6679C27.3947 32.3434 30.1278 30.1003 32.0507 27.2225C33.9736 24.3446 35 20.9612 35 17.5C34.9981 12.8593 33.1538 8.40918 29.8723 5.1277C26.5908 1.84622 22.1407 0.00187031 17.5 0ZM19.0402 27.5812V29.7512H15.9774V27.4929C14.7019 27.2047 13.5315 26.5677 12.5969 25.653C11.6623 24.7384 11.0002 23.582 10.6846 22.313L13.585 21.1415C13.7924 22.1249 14.3147 23.014 15.0727 23.6739C15.8307 24.3339 16.7832 24.7288 17.7858 24.7989C19.4143 24.7989 21.2509 23.9591 21.2509 21.976C21.2509 20.2964 20.0265 19.4213 17.2601 18.4227C15.3352 17.7399 11.3973 16.6196 11.3973 12.6306C11.4319 11.3659 11.9105 10.1538 12.7492 9.20665C13.5879 8.25952 14.7333 7.63784 15.9845 7.4506V5.25053H19.0473V7.42061C20.1005 7.59773 21.0873 8.05283 21.9059 8.7389C22.7244 9.42497 23.3449 10.3171 23.7033 11.3232L20.9386 12.4965C20.7138 11.7977 20.2678 11.191 19.6678 10.768C19.0679 10.345 18.3466 10.1287 17.6129 10.1517C16.3885 10.1517 14.4372 10.7992 14.4372 12.5847C14.4372 14.2466 15.9421 14.8783 19.0579 15.9104C23.2586 17.3624 24.326 19.4972 24.326 21.9478C24.2905 23.372 23.732 24.7333 22.7572 25.7723C21.7824 26.8112 20.4593 27.4551 19.0402 27.5812Z\" fill=\"%234E4B66\"/>%0A</svg>%0A');-o-prop:url('data:image/svg+xml,<svg width=\"35\" height=\"35\" viewBox=\"0 0 35 35\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.5 0C14.0388 0 10.6554 1.02636 7.77753 2.94928C4.89967 4.87221 2.65665 7.60533 1.33212 10.803C0.00758245 14.0007 -0.338976 17.5194 0.336265 20.9141C1.01151 24.3087 2.67822 27.4269 5.12564 29.8744C7.57306 32.3218 10.6913 33.9885 14.0859 34.6637C17.4806 35.339 20.9993 34.9924 24.197 33.6679C27.3947 32.3434 30.1278 30.1003 32.0507 27.2225C33.9736 24.3446 35 20.9612 35 17.5C34.9981 12.8593 33.1538 8.40918 29.8723 5.1277C26.5908 1.84622 22.1407 0.00187031 17.5 0ZM19.0402 27.5812V29.7512H15.9774V27.4929C14.7019 27.2047 13.5315 26.5677 12.5969 25.653C11.6623 24.7384 11.0002 23.582 10.6846 22.313L13.585 21.1415C13.7924 22.1249 14.3147 23.014 15.0727 23.6739C15.8307 24.3339 16.7832 24.7288 17.7858 24.7989C19.4143 24.7989 21.2509 23.9591 21.2509 21.976C21.2509 20.2964 20.0265 19.4213 17.2601 18.4227C15.3352 17.7399 11.3973 16.6196 11.3973 12.6306C11.4319 11.3659 11.9105 10.1538 12.7492 9.20665C13.5879 8.25952 14.7333 7.63784 15.9845 7.4506V5.25053H19.0473V7.42061C20.1005 7.59773 21.0873 8.05283 21.9059 8.7389C22.7244 9.42497 23.3449 10.3171 23.7033 11.3232L20.9386 12.4965C20.7138 11.7977 20.2678 11.191 19.6678 10.768C19.0679 10.345 18.3466 10.1287 17.6129 10.1517C16.3885 10.1517 14.4372 10.7992 14.4372 12.5847C14.4372 14.2466 15.9421 14.8783 19.0579 15.9104C23.2586 17.3624 24.326 19.4972 24.326 21.9478C24.2905 23.372 23.732 24.7333 22.7572 25.7723C21.7824 26.8112 20.4593 27.4551 19.0402 27.5812Z\" fill=\"%234E4B66\"/>%0A</svg>%0A')}nav .menu-sections .menu-section .logtech{-webkit-mask-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<rect x=\"1\" y=\"3\" width=\"14\" height=\"13\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<path d=\"M15 8H19L23 12V16H15V8Z\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"5.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"17.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A</svg>%0A');-moz-mask-image:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<rect x=\"1\" y=\"3\" width=\"14\" height=\"13\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<path d=\"M15 8H19L23 12V16H15V8Z\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"5.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"17.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A</svg>%0A');-o-prop:url('data:image/svg+xml,<svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<rect x=\"1\" y=\"3\" width=\"14\" height=\"13\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<path d=\"M15 8H19L23 12V16H15V8Z\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"5.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A<circle cx=\"17.5\" cy=\"18.5\" r=\"2.5\" stroke=\"%2314142B\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>%0A</svg>%0A')}nav .menu-sections .menu-section .marketplace{-webkit-mask-image:url('data:image/svg+xml,<svg width=\"23\" height=\"24\" viewBox=\"0 0 23 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.0131 23.19V2.74561C17.0387 2.3768 16.9901 2.00661 16.8701 1.65691C16.7502 1.3072 16.5614 0.985084 16.3149 0.709586C16.0394 0.4611 15.7166 0.270786 15.3658 0.150048C15.015 0.0293103 14.6434 -0.019366 14.2733 0.0069356H4.46056C4.09267 -0.0188504 3.72335 0.0295727 3.37454 0.149328C3.02573 0.269083 2.70454 0.457728 2.43007 0.704053C2.18319 0.980172 1.99427 1.30306 1.87452 1.65356C1.75477 2.00406 1.70663 2.37505 1.73295 2.7445V23.19H3.52001V2.79098C3.50174 2.6559 3.51491 2.51842 3.5585 2.38927C3.60209 2.26012 3.67491 2.14277 3.7713 2.04639C3.86769 1.95 3.98503 1.87718 4.11418 1.83359C4.24334 1.79 4.38081 1.77683 4.51589 1.7951H14.2302C14.3627 1.78615 14.4956 1.80397 14.6211 1.84751C14.7466 1.89104 14.862 1.9594 14.9605 2.04849C15.0504 2.14871 15.1193 2.26598 15.163 2.39334C15.2067 2.5207 15.2244 2.65555 15.215 2.78987V23.19H17.0131ZM0.000119503 23.0959C-0.0018524 23.2149 0.020598 23.3331 0.0660845 23.4431C0.111571 23.5531 0.179127 23.6526 0.264581 23.7355C0.3459 23.8202 0.44372 23.8874 0.552008 23.9329C0.660295 23.9784 0.776754 24.0012 0.8942 23.9999H17.8397C18.078 23.9999 18.3065 23.9053 18.475 23.7368C18.6435 23.5683 18.7382 23.3397 18.7382 23.1014C18.7382 22.8631 18.6435 22.6346 18.475 22.4661C18.3065 22.2976 18.078 22.2029 17.8397 22.2029H0.8942C0.657979 22.2052 0.432068 22.3 0.264923 22.467C0.0977786 22.6339 0.00271379 22.8597 0.000119503 23.0959ZM5.97099 11.8546H12.7762C13.079 11.8689 13.3757 11.7663 13.605 11.568C13.7086 11.4741 13.7905 11.3587 13.845 11.2299C13.8995 11.1011 13.9252 10.962 13.9203 10.8222V4.30361C13.9257 4.16231 13.9003 4.02152 13.8459 3.89101C13.7914 3.76051 13.7092 3.64341 13.605 3.54785C13.3759 3.34906 13.0791 3.24604 12.7762 3.26015H5.97099C5.66751 3.24617 5.37031 3.3496 5.14108 3.54896C5.03685 3.64452 4.95465 3.76161 4.9002 3.89212C4.84574 4.02262 4.82033 4.16341 4.82572 4.30472V10.8211C4.82089 10.9609 4.8466 11.1 4.90107 11.2288C4.95554 11.3576 5.03745 11.473 5.14108 11.5669C5.37054 11.7658 5.66768 11.8688 5.97099 11.8546ZM20.5529 20.9282C20.8783 20.942 21.2029 20.8877 21.506 20.7688C21.8092 20.6499 22.0842 20.469 22.3134 20.2377C22.5397 19.9927 22.7149 19.705 22.8289 19.3916C22.9428 19.0781 22.9933 18.7451 22.9773 18.4119V7.80469C23.0209 6.66199 22.7734 5.52696 22.2581 4.50611C21.7875 3.69811 21.0226 3.10337 20.1236 2.84631C20.0268 2.8156 19.9247 2.80535 19.8237 2.8162C19.7228 2.82706 19.6252 2.85879 19.5371 2.90938C19.4464 2.95571 19.3659 3.01986 19.3005 3.098C19.2351 3.17614 19.1861 3.26666 19.1565 3.36416C19.1257 3.46322 19.1151 3.56744 19.1254 3.67065C19.1356 3.77386 19.1665 3.87396 19.2162 3.96501C19.2626 4.05729 19.328 4.13872 19.4081 4.20394C19.4882 4.26916 19.5812 4.3167 19.681 4.34345C19.8901 4.40746 20.0893 4.50019 20.273 4.61898C20.5181 4.78313 20.7237 4.9997 20.8749 5.25302C21.0935 5.6233 21.2435 6.03003 21.3175 6.45361H19.9012C19.789 6.45151 19.6775 6.47205 19.5735 6.51402C19.4694 6.55598 19.3749 6.6185 19.2956 6.69783C19.2162 6.77717 19.1537 6.87169 19.1117 6.97575C19.0698 7.0798 19.0492 7.19125 19.0513 7.30343V11.3456C19.0519 11.5708 19.1417 11.7866 19.3009 11.9459C19.4601 12.1051 19.676 12.1948 19.9012 12.1954H21.4282V18.4086C21.4406 18.6594 21.3539 18.905 21.187 19.0925C21.1062 19.1774 21.0083 19.2441 20.8997 19.2882C20.7911 19.3322 20.6744 19.3527 20.5573 19.3481C20.2933 19.3609 20.0348 19.2691 19.8381 19.0925C19.7472 19.0041 19.676 18.8975 19.6293 18.7796C19.5825 18.6617 19.5613 18.5353 19.567 18.4086V16.6902C19.5891 16.32 19.5347 15.9492 19.4071 15.601C19.2796 15.2528 19.0816 14.9346 18.8256 14.6663C18.2624 14.1583 17.5205 13.8949 16.763 13.9338V15.5062C17.0986 15.4886 17.428 15.6012 17.6826 15.8204C17.7992 15.934 17.8902 16.0713 17.9492 16.2231C18.0082 16.3749 18.0338 16.5376 18.0245 16.7001V18.4075C18.0094 18.7432 18.0633 19.0784 18.1828 19.3924C18.3023 19.7064 18.4849 19.9926 18.7194 20.2333C18.962 20.4673 19.2496 20.6495 19.5648 20.7689C19.88 20.8884 20.2162 20.9426 20.5529 20.9282Z\" fill=\"%2314142B\"/>%0A</svg>%0A');-moz-mask-image:url('data:image/svg+xml,<svg width=\"23\" height=\"24\" viewBox=\"0 0 23 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.0131 23.19V2.74561C17.0387 2.3768 16.9901 2.00661 16.8701 1.65691C16.7502 1.3072 16.5614 0.985084 16.3149 0.709586C16.0394 0.4611 15.7166 0.270786 15.3658 0.150048C15.015 0.0293103 14.6434 -0.019366 14.2733 0.0069356H4.46056C4.09267 -0.0188504 3.72335 0.0295727 3.37454 0.149328C3.02573 0.269083 2.70454 0.457728 2.43007 0.704053C2.18319 0.980172 1.99427 1.30306 1.87452 1.65356C1.75477 2.00406 1.70663 2.37505 1.73295 2.7445V23.19H3.52001V2.79098C3.50174 2.6559 3.51491 2.51842 3.5585 2.38927C3.60209 2.26012 3.67491 2.14277 3.7713 2.04639C3.86769 1.95 3.98503 1.87718 4.11418 1.83359C4.24334 1.79 4.38081 1.77683 4.51589 1.7951H14.2302C14.3627 1.78615 14.4956 1.80397 14.6211 1.84751C14.7466 1.89104 14.862 1.9594 14.9605 2.04849C15.0504 2.14871 15.1193 2.26598 15.163 2.39334C15.2067 2.5207 15.2244 2.65555 15.215 2.78987V23.19H17.0131ZM0.000119503 23.0959C-0.0018524 23.2149 0.020598 23.3331 0.0660845 23.4431C0.111571 23.5531 0.179127 23.6526 0.264581 23.7355C0.3459 23.8202 0.44372 23.8874 0.552008 23.9329C0.660295 23.9784 0.776754 24.0012 0.8942 23.9999H17.8397C18.078 23.9999 18.3065 23.9053 18.475 23.7368C18.6435 23.5683 18.7382 23.3397 18.7382 23.1014C18.7382 22.8631 18.6435 22.6346 18.475 22.4661C18.3065 22.2976 18.078 22.2029 17.8397 22.2029H0.8942C0.657979 22.2052 0.432068 22.3 0.264923 22.467C0.0977786 22.6339 0.00271379 22.8597 0.000119503 23.0959ZM5.97099 11.8546H12.7762C13.079 11.8689 13.3757 11.7663 13.605 11.568C13.7086 11.4741 13.7905 11.3587 13.845 11.2299C13.8995 11.1011 13.9252 10.962 13.9203 10.8222V4.30361C13.9257 4.16231 13.9003 4.02152 13.8459 3.89101C13.7914 3.76051 13.7092 3.64341 13.605 3.54785C13.3759 3.34906 13.0791 3.24604 12.7762 3.26015H5.97099C5.66751 3.24617 5.37031 3.3496 5.14108 3.54896C5.03685 3.64452 4.95465 3.76161 4.9002 3.89212C4.84574 4.02262 4.82033 4.16341 4.82572 4.30472V10.8211C4.82089 10.9609 4.8466 11.1 4.90107 11.2288C4.95554 11.3576 5.03745 11.473 5.14108 11.5669C5.37054 11.7658 5.66768 11.8688 5.97099 11.8546ZM20.5529 20.9282C20.8783 20.942 21.2029 20.8877 21.506 20.7688C21.8092 20.6499 22.0842 20.469 22.3134 20.2377C22.5397 19.9927 22.7149 19.705 22.8289 19.3916C22.9428 19.0781 22.9933 18.7451 22.9773 18.4119V7.80469C23.0209 6.66199 22.7734 5.52696 22.2581 4.50611C21.7875 3.69811 21.0226 3.10337 20.1236 2.84631C20.0268 2.8156 19.9247 2.80535 19.8237 2.8162C19.7228 2.82706 19.6252 2.85879 19.5371 2.90938C19.4464 2.95571 19.3659 3.01986 19.3005 3.098C19.2351 3.17614 19.1861 3.26666 19.1565 3.36416C19.1257 3.46322 19.1151 3.56744 19.1254 3.67065C19.1356 3.77386 19.1665 3.87396 19.2162 3.96501C19.2626 4.05729 19.328 4.13872 19.4081 4.20394C19.4882 4.26916 19.5812 4.3167 19.681 4.34345C19.8901 4.40746 20.0893 4.50019 20.273 4.61898C20.5181 4.78313 20.7237 4.9997 20.8749 5.25302C21.0935 5.6233 21.2435 6.03003 21.3175 6.45361H19.9012C19.789 6.45151 19.6775 6.47205 19.5735 6.51402C19.4694 6.55598 19.3749 6.6185 19.2956 6.69783C19.2162 6.77717 19.1537 6.87169 19.1117 6.97575C19.0698 7.0798 19.0492 7.19125 19.0513 7.30343V11.3456C19.0519 11.5708 19.1417 11.7866 19.3009 11.9459C19.4601 12.1051 19.676 12.1948 19.9012 12.1954H21.4282V18.4086C21.4406 18.6594 21.3539 18.905 21.187 19.0925C21.1062 19.1774 21.0083 19.2441 20.8997 19.2882C20.7911 19.3322 20.6744 19.3527 20.5573 19.3481C20.2933 19.3609 20.0348 19.2691 19.8381 19.0925C19.7472 19.0041 19.676 18.8975 19.6293 18.7796C19.5825 18.6617 19.5613 18.5353 19.567 18.4086V16.6902C19.5891 16.32 19.5347 15.9492 19.4071 15.601C19.2796 15.2528 19.0816 14.9346 18.8256 14.6663C18.2624 14.1583 17.5205 13.8949 16.763 13.9338V15.5062C17.0986 15.4886 17.428 15.6012 17.6826 15.8204C17.7992 15.934 17.8902 16.0713 17.9492 16.2231C18.0082 16.3749 18.0338 16.5376 18.0245 16.7001V18.4075C18.0094 18.7432 18.0633 19.0784 18.1828 19.3924C18.3023 19.7064 18.4849 19.9926 18.7194 20.2333C18.962 20.4673 19.2496 20.6495 19.5648 20.7689C19.88 20.8884 20.2162 20.9426 20.5529 20.9282Z\" fill=\"%2314142B\"/>%0A</svg>%0A');-o-prop:url('data:image/svg+xml,<svg width=\"23\" height=\"24\" viewBox=\"0 0 23 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M17.0131 23.19V2.74561C17.0387 2.3768 16.9901 2.00661 16.8701 1.65691C16.7502 1.3072 16.5614 0.985084 16.3149 0.709586C16.0394 0.4611 15.7166 0.270786 15.3658 0.150048C15.015 0.0293103 14.6434 -0.019366 14.2733 0.0069356H4.46056C4.09267 -0.0188504 3.72335 0.0295727 3.37454 0.149328C3.02573 0.269083 2.70454 0.457728 2.43007 0.704053C2.18319 0.980172 1.99427 1.30306 1.87452 1.65356C1.75477 2.00406 1.70663 2.37505 1.73295 2.7445V23.19H3.52001V2.79098C3.50174 2.6559 3.51491 2.51842 3.5585 2.38927C3.60209 2.26012 3.67491 2.14277 3.7713 2.04639C3.86769 1.95 3.98503 1.87718 4.11418 1.83359C4.24334 1.79 4.38081 1.77683 4.51589 1.7951H14.2302C14.3627 1.78615 14.4956 1.80397 14.6211 1.84751C14.7466 1.89104 14.862 1.9594 14.9605 2.04849C15.0504 2.14871 15.1193 2.26598 15.163 2.39334C15.2067 2.5207 15.2244 2.65555 15.215 2.78987V23.19H17.0131ZM0.000119503 23.0959C-0.0018524 23.2149 0.020598 23.3331 0.0660845 23.4431C0.111571 23.5531 0.179127 23.6526 0.264581 23.7355C0.3459 23.8202 0.44372 23.8874 0.552008 23.9329C0.660295 23.9784 0.776754 24.0012 0.8942 23.9999H17.8397C18.078 23.9999 18.3065 23.9053 18.475 23.7368C18.6435 23.5683 18.7382 23.3397 18.7382 23.1014C18.7382 22.8631 18.6435 22.6346 18.475 22.4661C18.3065 22.2976 18.078 22.2029 17.8397 22.2029H0.8942C0.657979 22.2052 0.432068 22.3 0.264923 22.467C0.0977786 22.6339 0.00271379 22.8597 0.000119503 23.0959ZM5.97099 11.8546H12.7762C13.079 11.8689 13.3757 11.7663 13.605 11.568C13.7086 11.4741 13.7905 11.3587 13.845 11.2299C13.8995 11.1011 13.9252 10.962 13.9203 10.8222V4.30361C13.9257 4.16231 13.9003 4.02152 13.8459 3.89101C13.7914 3.76051 13.7092 3.64341 13.605 3.54785C13.3759 3.34906 13.0791 3.24604 12.7762 3.26015H5.97099C5.66751 3.24617 5.37031 3.3496 5.14108 3.54896C5.03685 3.64452 4.95465 3.76161 4.9002 3.89212C4.84574 4.02262 4.82033 4.16341 4.82572 4.30472V10.8211C4.82089 10.9609 4.8466 11.1 4.90107 11.2288C4.95554 11.3576 5.03745 11.473 5.14108 11.5669C5.37054 11.7658 5.66768 11.8688 5.97099 11.8546ZM20.5529 20.9282C20.8783 20.942 21.2029 20.8877 21.506 20.7688C21.8092 20.6499 22.0842 20.469 22.3134 20.2377C22.5397 19.9927 22.7149 19.705 22.8289 19.3916C22.9428 19.0781 22.9933 18.7451 22.9773 18.4119V7.80469C23.0209 6.66199 22.7734 5.52696 22.2581 4.50611C21.7875 3.69811 21.0226 3.10337 20.1236 2.84631C20.0268 2.8156 19.9247 2.80535 19.8237 2.8162C19.7228 2.82706 19.6252 2.85879 19.5371 2.90938C19.4464 2.95571 19.3659 3.01986 19.3005 3.098C19.2351 3.17614 19.1861 3.26666 19.1565 3.36416C19.1257 3.46322 19.1151 3.56744 19.1254 3.67065C19.1356 3.77386 19.1665 3.87396 19.2162 3.96501C19.2626 4.05729 19.328 4.13872 19.4081 4.20394C19.4882 4.26916 19.5812 4.3167 19.681 4.34345C19.8901 4.40746 20.0893 4.50019 20.273 4.61898C20.5181 4.78313 20.7237 4.9997 20.8749 5.25302C21.0935 5.6233 21.2435 6.03003 21.3175 6.45361H19.9012C19.789 6.45151 19.6775 6.47205 19.5735 6.51402C19.4694 6.55598 19.3749 6.6185 19.2956 6.69783C19.2162 6.77717 19.1537 6.87169 19.1117 6.97575C19.0698 7.0798 19.0492 7.19125 19.0513 7.30343V11.3456C19.0519 11.5708 19.1417 11.7866 19.3009 11.9459C19.4601 12.1051 19.676 12.1948 19.9012 12.1954H21.4282V18.4086C21.4406 18.6594 21.3539 18.905 21.187 19.0925C21.1062 19.1774 21.0083 19.2441 20.8997 19.2882C20.7911 19.3322 20.6744 19.3527 20.5573 19.3481C20.2933 19.3609 20.0348 19.2691 19.8381 19.0925C19.7472 19.0041 19.676 18.8975 19.6293 18.7796C19.5825 18.6617 19.5613 18.5353 19.567 18.4086V16.6902C19.5891 16.32 19.5347 15.9492 19.4071 15.601C19.2796 15.2528 19.0816 14.9346 18.8256 14.6663C18.2624 14.1583 17.5205 13.8949 16.763 13.9338V15.5062C17.0986 15.4886 17.428 15.6012 17.6826 15.8204C17.7992 15.934 17.8902 16.0713 17.9492 16.2231C18.0082 16.3749 18.0338 16.5376 18.0245 16.7001V18.4075C18.0094 18.7432 18.0633 19.0784 18.1828 19.3924C18.3023 19.7064 18.4849 19.9926 18.7194 20.2333C18.962 20.4673 19.2496 20.6495 19.5648 20.7689C19.88 20.8884 20.2162 20.9426 20.5529 20.9282Z\" fill=\"%2314142B\"/>%0A</svg>%0A')}nav .menu-sections .menu-section .admin{-webkit-mask-image:url('data:image/svg+xml,<svg width=\"26\" height=\"26\" viewBox=\"0 0 26 26\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<circle cx=\"13\" cy=\"13\" r=\"4\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A<path d=\"M11.2844 2.86293C12.061 1.56696 13.939 1.56696 14.7156 2.86293L15.4213 4.0407C15.8742 4.79649 16.7684 5.16686 17.6231 4.95268L18.9549 4.61892C20.4204 4.25166 21.7483 5.57958 21.3811 7.0451L21.0473 8.37695C20.8331 9.23162 21.2035 10.1258 21.9593 10.5787L23.1371 11.2844C24.433 12.061 24.433 13.939 23.1371 14.7156L21.9593 15.4213C21.2035 15.8742 20.8331 16.7684 21.0473 17.6231L21.3811 18.9549C21.7483 20.4204 20.4204 21.7483 18.9549 21.3811L17.6231 21.0473C16.7684 20.8331 15.8742 21.2035 15.4213 21.9593L14.7156 23.1371C13.939 24.433 12.061 24.433 11.2844 23.1371L10.5787 21.9593C10.1258 21.2035 9.23162 20.8331 8.37695 21.0473L7.04509 21.3811C5.57958 21.7483 4.25166 20.4204 4.61892 18.9549L4.95268 17.6231C5.16686 16.7684 4.79649 15.8742 4.04069 15.4213L2.86293 14.7156C1.56696 13.939 1.56696 12.061 2.86293 11.2844L4.0407 10.5787C4.79649 10.1258 5.16686 9.23162 4.95268 8.37695L4.61892 7.04509C4.25166 5.57958 5.57958 4.25166 7.0451 4.61892L8.37695 4.95268C9.23162 5.16686 10.1258 4.79649 10.5787 4.04069L11.2844 2.86293Z\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A</svg>%0A');-moz-mask-image:url('data:image/svg+xml,<svg width=\"26\" height=\"26\" viewBox=\"0 0 26 26\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<circle cx=\"13\" cy=\"13\" r=\"4\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A<path d=\"M11.2844 2.86293C12.061 1.56696 13.939 1.56696 14.7156 2.86293L15.4213 4.0407C15.8742 4.79649 16.7684 5.16686 17.6231 4.95268L18.9549 4.61892C20.4204 4.25166 21.7483 5.57958 21.3811 7.0451L21.0473 8.37695C20.8331 9.23162 21.2035 10.1258 21.9593 10.5787L23.1371 11.2844C24.433 12.061 24.433 13.939 23.1371 14.7156L21.9593 15.4213C21.2035 15.8742 20.8331 16.7684 21.0473 17.6231L21.3811 18.9549C21.7483 20.4204 20.4204 21.7483 18.9549 21.3811L17.6231 21.0473C16.7684 20.8331 15.8742 21.2035 15.4213 21.9593L14.7156 23.1371C13.939 24.433 12.061 24.433 11.2844 23.1371L10.5787 21.9593C10.1258 21.2035 9.23162 20.8331 8.37695 21.0473L7.04509 21.3811C5.57958 21.7483 4.25166 20.4204 4.61892 18.9549L4.95268 17.6231C5.16686 16.7684 4.79649 15.8742 4.04069 15.4213L2.86293 14.7156C1.56696 13.939 1.56696 12.061 2.86293 11.2844L4.0407 10.5787C4.79649 10.1258 5.16686 9.23162 4.95268 8.37695L4.61892 7.04509C4.25166 5.57958 5.57958 4.25166 7.0451 4.61892L8.37695 4.95268C9.23162 5.16686 10.1258 4.79649 10.5787 4.04069L11.2844 2.86293Z\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A</svg>%0A');-o-prop:url('data:image/svg+xml,<svg width=\"26\" height=\"26\" viewBox=\"0 0 26 26\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<circle cx=\"13\" cy=\"13\" r=\"4\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A<path d=\"M11.2844 2.86293C12.061 1.56696 13.939 1.56696 14.7156 2.86293L15.4213 4.0407C15.8742 4.79649 16.7684 5.16686 17.6231 4.95268L18.9549 4.61892C20.4204 4.25166 21.7483 5.57958 21.3811 7.0451L21.0473 8.37695C20.8331 9.23162 21.2035 10.1258 21.9593 10.5787L23.1371 11.2844C24.433 12.061 24.433 13.939 23.1371 14.7156L21.9593 15.4213C21.2035 15.8742 20.8331 16.7684 21.0473 17.6231L21.3811 18.9549C21.7483 20.4204 20.4204 21.7483 18.9549 21.3811L17.6231 21.0473C16.7684 20.8331 15.8742 21.2035 15.4213 21.9593L14.7156 23.1371C13.939 24.433 12.061 24.433 11.2844 23.1371L10.5787 21.9593C10.1258 21.2035 9.23162 20.8331 8.37695 21.0473L7.04509 21.3811C5.57958 21.7483 4.25166 20.4204 4.61892 18.9549L4.95268 17.6231C5.16686 16.7684 4.79649 15.8742 4.04069 15.4213L2.86293 14.7156C1.56696 13.939 1.56696 12.061 2.86293 11.2844L4.0407 10.5787C4.79649 10.1258 5.16686 9.23162 4.95268 8.37695L4.61892 7.04509C4.25166 5.57958 5.57958 4.25166 7.0451 4.61892L8.37695 4.95268C9.23162 5.16686 10.1258 4.79649 10.5787 4.04069L11.2844 2.86293Z\" stroke=\"%2314142B\" stroke-width=\"2\"/>%0A</svg>%0A')}nav .menu-sections .menu-section .selected-portal-item{-webkit-mask-size:contain;-moz-mask-size:contain;-o-prop:contain;background-color:var(--form-labels-color)}nav .menu-sections .menu-section .selected-portal-item:before{content:\"\";width:20px;height:20px;display:block}nav .menu-sections .menu-section .selected-portal{background-color:var(--gray-light);border-radius:15px}nav .menu-sections .menu-section .selected-portal .icon-container{-webkit-mask-size:contain;-moz-mask-size:contain;-o-prop:contain}nav .menu-sections .menu-section .selected-portal .icon-container .menu-icon{filter:invert(35%) sepia(100%) saturate(5659%) hue-rotate(210deg) brightness(87%) contrast(118%)}nav .menu-sections .menu-section .selected-portal .selected-portal-item{background-color:var(--theme-primary)}nav .menu-sections .menu-section .selected-portal .marketplace .menu-label{color:var(--success-color)}nav .menu-sections .menu-section .selected-portal .menu-label{color:var(--theme-primary)}nav .footer{display:flex;align-items:center;padding:10px;margin:0 10px;border-top:1px solid var(--gray-light);overflow:hidden;height:50px}nav .footer .footer-icon{width:50px}nav .footer .footer-content{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;font-size:.8em;text-overflow:hidden;white-space:nowrap}\n"] }]
         }], ctorParameters: () => [{ type: MenuService }, { type: i1$1.Router }, { type: ProfileService }, { type: StorageService }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [ENVIRONMENT]
@@ -4753,11 +4868,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
             }] } });
 
 class MenuModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: MenuModule, declarations: [MenuComponent, SubMenusListComponent], imports: [SharedModule, OverlayPanelModule], exports: [MenuComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MenuModule, imports: [SharedModule, OverlayPanelModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: MenuModule, declarations: [MenuComponent, SubMenusListComponent], imports: [SharedModule, OverlayPanelModule], exports: [MenuComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MenuModule, imports: [SharedModule, OverlayPanelModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MenuModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MenuModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [MenuComponent, SubMenusListComponent],
@@ -4794,12 +4909,12 @@ class StepperComponent {
     onActiveIndexChange(index) {
         this.activeIndexChange.emit(index);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: StepperComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: StepperComponent, selector: "vector-stepper", inputs: { steps: "steps", navigable: "navigable", activeIndex: "activeIndex" }, outputs: { activeIndexChange: "activeIndexChange" }, ngImport: i0, template: "<div class=\"wrapper\">\r\n  <p-steps\r\n    [model]=\"steps\"\r\n    [readonly]=\"!navigable\"\r\n    [activeIndex]=\"activeIndex\"\r\n    (activeIndexChange)=\"onActiveIndexChange($event)\"\r\n  >\r\n    ></p-steps\r\n  >\r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$6.Steps, selector: "p-steps", inputs: ["activeIndex", "model", "readonly", "style", "styleClass", "exact"], outputs: ["activeIndexChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: StepperComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: StepperComponent, selector: "vector-stepper", inputs: { steps: "steps", navigable: "navigable", activeIndex: "activeIndex" }, outputs: { activeIndexChange: "activeIndexChange" }, ngImport: i0, template: "<div class=\"wrapper\">\n  <p-steps\n    [model]=\"steps\"\n    [readonly]=\"!navigable\"\n    [activeIndex]=\"activeIndex\"\n    (activeIndexChange)=\"onActiveIndexChange($event)\"\n  >\n    ></p-steps\n  >\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: i1$6.Steps, selector: "p-steps", inputs: ["activeIndex", "model", "readonly", "style", "styleClass", "exact"], outputs: ["activeIndexChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: StepperComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: StepperComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-stepper', template: "<div class=\"wrapper\">\r\n  <p-steps\r\n    [model]=\"steps\"\r\n    [readonly]=\"!navigable\"\r\n    [activeIndex]=\"activeIndex\"\r\n    (activeIndexChange)=\"onActiveIndexChange($event)\"\r\n  >\r\n    ></p-steps\r\n  >\r\n</div>\r\n" }]
+            args: [{ selector: 'vector-stepper', template: "<div class=\"wrapper\">\n  <p-steps\n    [model]=\"steps\"\n    [readonly]=\"!navigable\"\n    [activeIndex]=\"activeIndex\"\n    (activeIndexChange)=\"onActiveIndexChange($event)\"\n  >\n    ></p-steps\n  >\n</div>\n" }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { steps: [{
                 type: Input
             }], navigable: [{
@@ -4811,11 +4926,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
             }] } });
 
 class StepperModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: StepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: StepperModule, declarations: [StepperComponent], imports: [SharedModule, StepsModule], exports: [StepperComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: StepperModule, imports: [SharedModule, StepsModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: StepperModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: StepperModule, declarations: [StepperComponent], imports: [SharedModule, StepsModule], exports: [StepperComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: StepperModule, imports: [SharedModule, StepsModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: StepperModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: StepperModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [StepperComponent],
@@ -4939,12 +5054,12 @@ class TopBarComponent {
     handleClick(link) {
         this.onClick.emit(link || '');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TopBarComponent, deps: [{ token: MenuService }, { token: AuthService }, { token: i1$1.Router }, { token: ProfileService }, { token: StorageService }, { token: NotificationsService }, { token: ErrorMessageService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.0", type: TopBarComponent, selector: "vector-top-bar", inputs: { fintech: "fintech", accountService: "accountService", showHelpCentral: "showHelpCentral" }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<div class=\"top-bar-container\">\r\n  <div id=\"menu-toggle\" class=\"menu-toggle\" (click)=\"toggleMenu()\">\r\n    <div class=\"menu-icon\"></div>\r\n  </div>\r\n\r\n  <div class=\"left-items-container\" *ngIf=\"fintech && isDesktop() && !doingOnboarding && !isAdmin\">\r\n    <span>Banco {{ currentAccount?.bankCode }}</span>\r\n    <span class=\"separator\"></span>\r\n    <span>AG {{ currentAccount?.agency }}</span>\r\n    <span class=\"separator\"></span>\r\n    <span>CC {{ currentAccount?.accountNumber }}</span>\r\n    <span class=\"separator\"></span>\r\n    <span\r\n      >{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}\r\n      {{ maskUtil.formatDocument(currentAccount?.document) }}</span\r\n    >\r\n    <ng-container>\r\n      <span class=\"separator\"></span>\r\n      <div class=\"change-account-button cursor-pointer\" (click)=\"changeAccountMenu.toggle($event)\">\r\n        <span class=\"mr-2\">Alternar conta</span>\r\n        <span\r\n          class=\"fas\"\r\n          [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n        ></span>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n\r\n  <div class=\"right-items-container\" [ngClass]=\"{ 'hidden-items': hideElements }\" *ngIf=\"!isAdmin && !doingOnboarding\">\r\n    <div class=\"help-central\" *ngIf=\"showHelpCentral\">\r\n      <span>{{ 'app.label.help_central' | translate }}:</span>\r\n      <ng-container *ngFor=\"let item of helpCentralIcons\">\r\n        <a target=\"_blank\" [ngClass]=\"{ hidden: !item.active }\" [attr.href]=\"item.url\">\r\n          <i [class]=\"item.icon\"></i>\r\n        </a>\r\n      </ng-container>\r\n    </div>\r\n\r\n    <span *ngIf=\"!fintech\" (click)=\"notifications.toggle($event)\" class=\"fas fa-bell notifications-icon\">\r\n      <span *ngIf=\"(notificationsList | unreadNotifications).length\" class=\"notifications-indicator\"> </span>\r\n    </span>\r\n\r\n    <span class=\"separator\"></span>\r\n    <div\r\n      #menuContainer\r\n      class=\"menu-container\"\r\n      (click)=\"menu.toggle($event)\"\r\n      pTooltip=\"Enter your username\"\r\n      tooltipPosition=\"bottom\"\r\n      tooltipEvent=\"click\"\r\n    >\r\n      <span class=\"user-name\">{{ currentAccount?.name || vectorFirstName || '' }}</span>\r\n      <span class=\"fas\" [ngClass]=\"{ 'fa-angle-down': !openedMenu, 'fa-angle-up': openedMenu }\"></span>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n  <ng-template pTemplate>\r\n    <div class=\"account-info\" *ngIf=\"!isDesktop()\">\r\n      <div class=\"account-info-row\">\r\n        <div class=\"account-info-item\">\r\n          <span>Banco: </span>\r\n          <span class=\"account-info-value\">{{ currentAccount?.bank }}</span>\r\n        </div>\r\n\r\n        <span class=\"separator\"></span>\r\n        <div class=\"account-info-item\">\r\n          <span>AG: </span>\r\n          <span class=\"account-info-value\">{{ currentAccount?.agency }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"account-info-row\">\r\n        <div class=\"account-info-item\">\r\n          <span>CC: </span>\r\n          <span class=\"account-info-value\">{{ currentAccount?.accountNumber }}</span>\r\n        </div>\r\n        <span class=\"separator\"></span>\r\n        <div class=\"account-info-item\">\r\n          <span>{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n          <span class=\"account-info-value\"> {{ maskUtil.formatDocument(currentAccount?.document) }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"change-account-mobile\" (click)=\"changeAccountMenu.toggle($event)\" *ngIf=\"otherAccounts?.length\">\r\n        <span class=\"change-account-mobile-label\">Alternar conta</span>\r\n        <span\r\n          class=\"fas\"\r\n          [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n        ></span>\r\n      </div>\r\n    </div>\r\n    <ul class=\"user-menu\">\r\n      <li *ngIf=\"fintech\" (click)=\"goToTermsOfUse(); menu.hide()\">\r\n        <span class=\"terms-of-use user-menu-icon\"></span>\r\n        <span>Termos de Uso</span>\r\n      </li>\r\n      <li *ngIf=\"fintech\" (click)=\"goToPasswordChange(); menu.hide()\">\r\n        <span class=\"fintech-password user-menu-icon\"></span>\r\n        <span>Alterar Senha</span>\r\n      </li>\r\n      <li (click)=\"logout()\">\r\n        <span class=\"logout user-menu-icon\"></span>\r\n        <span>Sair</span>\r\n      </li>\r\n    </ul>\r\n  </ng-template>\r\n</p-overlayPanel>\r\n\r\n<p-overlayPanel #changeAccountMenu (onHide)=\"openedChangeAccountMenu = false\" (onShow)=\"openedChangeAccountMenu = true\">\r\n  <ng-template pTemplate>\r\n    <div\r\n      *ngFor=\"let account of otherAccounts\"\r\n      class=\"account-info change-account-info\"\r\n      (click)=\"changeAccount(account)\"\r\n    >\r\n      <div class=\"account-info-row\">\r\n        <div class=\"account-info-item\">\r\n          <span>Banco: </span>\r\n          <span class=\"account-info-value\">{{ account?.bank }}</span>\r\n        </div>\r\n\r\n        <span class=\"separator\"></span>\r\n        <div class=\"account-info-item\">\r\n          <span>AG: </span>\r\n          <span class=\"account-info-value\">{{ account?.agency }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"account-info-row\">\r\n        <div class=\"account-info-item\">\r\n          <span>CC: </span>\r\n          <span class=\"account-info-value\">{{ account?.accountNumber }}</span>\r\n        </div>\r\n        <span class=\"separator\"></span>\r\n        <div class=\"account-info-item\">\r\n          <span>{{ account?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n          <span class=\"account-info-value\"> {{ account?.document | formatDocument }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div>\r\n      <hr />\r\n      <p class=\"text-center add-account\" (click)=\"goToOnboarding(); changeAccountMenu.hide()\">\r\n        Adicionar uma nova conta\r\n      </p>\r\n    </div>\r\n  </ng-template>\r\n</p-overlayPanel>\r\n\r\n<p-overlayPanel\r\n  #notifications\r\n  (onHide)=\"showNotifications = false\"\r\n  (onShow)=\"showNotifications = true\"\r\n  styleClass=\"background-white\"\r\n>\r\n  <ng-template pTemplate>\r\n    <div class=\"notifications-header\">\r\n      <div class=\"notifications-vector-logo\"></div>\r\n      <span class=\"notifications-title\">\r\n        {{ 'app.label.notifications' | translate }}\r\n      </span>\r\n    </div>\r\n    <ul class=\"notifications-list\">\r\n      <li\r\n        (click)=\"handleClick(notification?.link)\"\r\n        class=\"notification-item\"\r\n        *ngFor=\"let notification of notificationsList | unreadNotifications\"\r\n      >\r\n        <span class=\"notification-title\">{{ notification.title }}</span>\r\n        <span>{{ notification.description }}</span>\r\n        <em class=\"fas fa-chevron-right\"></em>\r\n      </li>\r\n    </ul>\r\n  </ng-template>\r\n</p-overlayPanel>\r\n", styles: [".fas{color:#fff}.top-bar-container{height:81px;background-color:var(--theme-light);display:flex;flex:1;align-items:center;padding:15px;color:#fff;font-size:1em;font-weight:600;box-shadow:2px 2px 4px #00000029}.top-bar-container .menu-toggle{cursor:pointer;margin-right:10px;padding:8px}.top-bar-container .menu-toggle .menu-icon{background:url(../../../../assets/icons/menu_hamburguer_icon.svg);background-repeat:no-repeat;background-size:cover;width:20.77px;height:13.85px}.top-bar-container .menu-toggle span{font-size:1.3em}.top-bar-container .left-items-container{display:flex;align-items:center;flex-direction:row}.top-bar-container .right-items-container{flex:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.top-bar-container .right-items-container .help-central{display:flex;align-items:center;gap:20px;font-size:1rem;margin-right:35px}.top-bar-container .right-items-container .help-central em{font-size:1.3rem}.top-bar-container .right-items-container .help-central a{outline:none;border:none;text-decoration:none;color:transparent}.top-bar-container .right-items-container .help-central a i{color:#fff;font-size:1.1em}.top-bar-container .right-items-container .help-central a i:hover{color:#7de5ec}@media screen and (max-width: 441px){.top-bar-container .right-items-container .help-central span{display:none}.top-bar-container .right-items-container .help-central em{font-size:1rem}}.top-bar-container .right-items-container .menu-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;cursor:pointer}.top-bar-container .right-items-container .menu-container .user-name{margin-right:15px}.top-bar-container .right-items-container .notifications-icon{position:relative;cursor:pointer}.top-bar-container .right-items-container .notifications-indicator{position:absolute;right:-8px;top:-8px;width:12px;height:12px;border-radius:50%;background-color:var(--error-color)}.separator{height:100%;margin-left:15px;margin-right:15px}.separator:after{content:\"\";height:100%;border-right:2px solid #ffffff}.account-info{display:flex;flex-direction:column;background-color:var(--theme-primary);border-radius:var(--border-radius);color:#fff;padding:5px;width:300px}.account-info .account-info-row{display:flex;flex-direction:row;align-items:center}.account-info .account-info-row .account-info-item{flex:1}.account-info .account-info-row .account-info-item:first-child{flex:.6}.account-info .account-info-row .account-info-item .account-info-value{font-weight:200}.account-info .change-account-mobile{font-size:.8em;align-items:center;display:flex}.account-info .change-account-mobile .change-account-mobile-label{margin-right:5px}.change-account-info{background-color:unset;cursor:pointer}.change-account-info:hover{background-color:var(--theme-primary)}.user-menu{padding:0;margin:0;list-style:none;color:#fff}.user-menu li{display:flex;flex-direction:row;align-items:center;padding:4px;font-weight:200;cursor:pointer;border-radius:var(--border-radius)}.user-menu li:hover{background-color:var(--theme-primary)}.user-menu li .user-menu-icon{width:28px;height:25px;background-repeat:no-repeat}.user-menu li .logout{background-image:url(../../../../assets/icons/logout_icon.svg);background-position-y:3px}.add-account{color:#fff;font-size:1.1em;padding:10px;margin:0;font-weight:400;letter-spacing:.25px;cursor:pointer}@media screen and (max-width: 441px){.hidden-items{display:none!important}}.notifications-header{display:flex;align-items:center;gap:8px}.notifications-header .notifications-vector-logo{background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-position:right;background-size:cover;height:12px;width:30px}.notifications-header .notifications-title{text-transform:uppercase;color:var(--gray-dark)}.notifications-list{max-height:400px;overflow:auto;margin-top:10px}.notifications-list .notification-item{display:flex;flex-direction:column;cursor:pointer;position:relative;padding:5px 10px;border-radius:5px}.notifications-list .notification-item:hover{background-color:var(--gray-medium)}.notifications-list .notification-item .notification-title{font-weight:700;text-transform:uppercase}.notifications-list .notification-item span{font-weight:500;margin-right:20px}.notifications-list .notification-item em{position:absolute;right:10px;bottom:10px;color:var(--theme-primary)}\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: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i6.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "pipe", type: FormatDocumentPipe, name: "formatDocument" }, { kind: "pipe", type: UnreadNotificationsPipe, name: "unreadNotifications" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TopBarComponent, deps: [{ token: MenuService }, { token: AuthService }, { token: i1$1.Router }, { token: ProfileService }, { token: StorageService }, { token: NotificationsService }, { token: ErrorMessageService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TopBarComponent, selector: "vector-top-bar", inputs: { fintech: "fintech", accountService: "accountService", showHelpCentral: "showHelpCentral" }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<div class=\"top-bar-container\">\n  <div id=\"menu-toggle\" class=\"menu-toggle\" (click)=\"toggleMenu()\">\n    <div class=\"menu-icon\"></div>\n  </div>\n\n  <div class=\"left-items-container\" *ngIf=\"fintech && isDesktop() && !doingOnboarding && !isAdmin\">\n    <span>Banco {{ currentAccount?.bankCode }}</span>\n    <span class=\"separator\"></span>\n    <span>AG {{ currentAccount?.agency }}</span>\n    <span class=\"separator\"></span>\n    <span>CC {{ currentAccount?.accountNumber }}</span>\n    <span class=\"separator\"></span>\n    <span\n      >{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}\n      {{ maskUtil.formatDocument(currentAccount?.document) }}</span\n    >\n    <ng-container>\n      <span class=\"separator\"></span>\n      <div class=\"change-account-button cursor-pointer\" (click)=\"changeAccountMenu.toggle($event)\">\n        <span class=\"mr-2\">Alternar conta</span>\n        <span\n          class=\"fas\"\n          [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\n        ></span>\n      </div>\n    </ng-container>\n  </div>\n\n  <div class=\"right-items-container\" [ngClass]=\"{ 'hidden-items': hideElements }\" *ngIf=\"!isAdmin && !doingOnboarding\">\n    <div class=\"help-central\" *ngIf=\"showHelpCentral\">\n      <span>{{ 'app.label.help_central' | translate }}:</span>\n      <ng-container *ngFor=\"let item of helpCentralIcons\">\n        <a target=\"_blank\" [ngClass]=\"{ hidden: !item.active }\" [attr.href]=\"item.url\">\n          <i [class]=\"item.icon\"></i>\n        </a>\n      </ng-container>\n    </div>\n\n    <span *ngIf=\"!fintech\" (click)=\"notifications.toggle($event)\" class=\"fas fa-bell notifications-icon\">\n      <span *ngIf=\"(notificationsList | unreadNotifications).length\" class=\"notifications-indicator\"> </span>\n    </span>\n\n    <span class=\"separator\"></span>\n    <div\n      #menuContainer\n      class=\"menu-container\"\n      (click)=\"menu.toggle($event)\"\n      pTooltip=\"Enter your username\"\n      tooltipPosition=\"bottom\"\n      tooltipEvent=\"click\"\n    >\n      <span class=\"user-name\">{{ currentAccount?.name || vectorFirstName || '' }}</span>\n      <span class=\"fas\" [ngClass]=\"{ 'fa-angle-down': !openedMenu, 'fa-angle-up': openedMenu }\"></span>\n    </div>\n  </div>\n</div>\n\n<p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\n  <ng-template pTemplate>\n    <div class=\"account-info\" *ngIf=\"!isDesktop()\">\n      <div class=\"account-info-row\">\n        <div class=\"account-info-item\">\n          <span>Banco: </span>\n          <span class=\"account-info-value\">{{ currentAccount?.bank }}</span>\n        </div>\n\n        <span class=\"separator\"></span>\n        <div class=\"account-info-item\">\n          <span>AG: </span>\n          <span class=\"account-info-value\">{{ currentAccount?.agency }}</span>\n        </div>\n      </div>\n      <div class=\"account-info-row\">\n        <div class=\"account-info-item\">\n          <span>CC: </span>\n          <span class=\"account-info-value\">{{ currentAccount?.accountNumber }}</span>\n        </div>\n        <span class=\"separator\"></span>\n        <div class=\"account-info-item\">\n          <span>{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\n          <span class=\"account-info-value\"> {{ maskUtil.formatDocument(currentAccount?.document) }}</span>\n        </div>\n      </div>\n      <div class=\"change-account-mobile\" (click)=\"changeAccountMenu.toggle($event)\" *ngIf=\"otherAccounts?.length\">\n        <span class=\"change-account-mobile-label\">Alternar conta</span>\n        <span\n          class=\"fas\"\n          [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\n        ></span>\n      </div>\n    </div>\n    <ul class=\"user-menu\">\n      <li *ngIf=\"fintech\" (click)=\"goToTermsOfUse(); menu.hide()\">\n        <span class=\"terms-of-use user-menu-icon\"></span>\n        <span>Termos de Uso</span>\n      </li>\n      <li *ngIf=\"fintech\" (click)=\"goToPasswordChange(); menu.hide()\">\n        <span class=\"fintech-password user-menu-icon\"></span>\n        <span>Alterar Senha</span>\n      </li>\n      <li (click)=\"logout()\">\n        <span class=\"logout user-menu-icon\"></span>\n        <span>Sair</span>\n      </li>\n    </ul>\n  </ng-template>\n</p-overlayPanel>\n\n<p-overlayPanel #changeAccountMenu (onHide)=\"openedChangeAccountMenu = false\" (onShow)=\"openedChangeAccountMenu = true\">\n  <ng-template pTemplate>\n    <div\n      *ngFor=\"let account of otherAccounts\"\n      class=\"account-info change-account-info\"\n      (click)=\"changeAccount(account)\"\n    >\n      <div class=\"account-info-row\">\n        <div class=\"account-info-item\">\n          <span>Banco: </span>\n          <span class=\"account-info-value\">{{ account?.bank }}</span>\n        </div>\n\n        <span class=\"separator\"></span>\n        <div class=\"account-info-item\">\n          <span>AG: </span>\n          <span class=\"account-info-value\">{{ account?.agency }}</span>\n        </div>\n      </div>\n      <div class=\"account-info-row\">\n        <div class=\"account-info-item\">\n          <span>CC: </span>\n          <span class=\"account-info-value\">{{ account?.accountNumber }}</span>\n        </div>\n        <span class=\"separator\"></span>\n        <div class=\"account-info-item\">\n          <span>{{ account?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\n          <span class=\"account-info-value\"> {{ account?.document | formatDocument }}</span>\n        </div>\n      </div>\n    </div>\n    <div>\n      <hr />\n      <p class=\"text-center add-account\" (click)=\"goToOnboarding(); changeAccountMenu.hide()\">\n        Adicionar uma nova conta\n      </p>\n    </div>\n  </ng-template>\n</p-overlayPanel>\n\n<p-overlayPanel\n  #notifications\n  (onHide)=\"showNotifications = false\"\n  (onShow)=\"showNotifications = true\"\n  styleClass=\"background-white\"\n>\n  <ng-template pTemplate>\n    <div class=\"notifications-header\">\n      <div class=\"notifications-vector-logo\"></div>\n      <span class=\"notifications-title\">\n        {{ 'app.label.notifications' | translate }}\n      </span>\n    </div>\n    <ul class=\"notifications-list\">\n      <li\n        (click)=\"handleClick(notification?.link)\"\n        class=\"notification-item\"\n        *ngFor=\"let notification of notificationsList | unreadNotifications\"\n      >\n        <span class=\"notification-title\">{{ notification.title }}</span>\n        <span>{{ notification.description }}</span>\n        <em class=\"fas fa-chevron-right\"></em>\n      </li>\n    </ul>\n  </ng-template>\n</p-overlayPanel>\n", styles: [".fas{color:#fff}.top-bar-container{height:81px;background-color:var(--theme-light);display:flex;flex:1;align-items:center;padding:15px;color:#fff;font-size:1em;font-weight:600;box-shadow:2px 2px 4px #00000029}.top-bar-container .menu-toggle{cursor:pointer;margin-right:10px;padding:8px}.top-bar-container .menu-toggle .menu-icon{background:url('data:image/svg+xml,<svg width=\"21\" height=\"14\" viewBox=\"0 0 21 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M0 13.846H15V11.538H0V13.846ZM0 8.077H11.538V5.769H0V8.077ZM0 0V2.308H15V0H0ZM20.769 11.065L16.638 6.923L20.769 2.781L19.142 1.154L13.373 6.923L19.142 12.692L20.769 11.065Z\" fill=\"white\"/>%0A</svg>%0A');background-repeat:no-repeat;background-size:cover;width:20.77px;height:13.85px}.top-bar-container .menu-toggle span{font-size:1.3em}.top-bar-container .left-items-container{display:flex;align-items:center;flex-direction:row}.top-bar-container .right-items-container{flex:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.top-bar-container .right-items-container .help-central{display:flex;align-items:center;gap:20px;font-size:1rem;margin-right:35px}.top-bar-container .right-items-container .help-central em{font-size:1.3rem}.top-bar-container .right-items-container .help-central a{outline:none;border:none;text-decoration:none;color:transparent}.top-bar-container .right-items-container .help-central a i{color:#fff;font-size:1.1em}.top-bar-container .right-items-container .help-central a i:hover{color:#7de5ec}@media screen and (max-width: 441px){.top-bar-container .right-items-container .help-central span{display:none}.top-bar-container .right-items-container .help-central em{font-size:1rem}}.top-bar-container .right-items-container .menu-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;cursor:pointer}.top-bar-container .right-items-container .menu-container .user-name{margin-right:15px}.top-bar-container .right-items-container .notifications-icon{position:relative;cursor:pointer}.top-bar-container .right-items-container .notifications-indicator{position:absolute;right:-8px;top:-8px;width:12px;height:12px;border-radius:50%;background-color:var(--error-color)}.separator{height:100%;margin-left:15px;margin-right:15px}.separator:after{content:\"\";height:100%;border-right:2px solid #ffffff}.account-info{display:flex;flex-direction:column;background-color:var(--theme-primary);border-radius:var(--border-radius);color:#fff;padding:5px;width:300px}.account-info .account-info-row{display:flex;flex-direction:row;align-items:center}.account-info .account-info-row .account-info-item{flex:1}.account-info .account-info-row .account-info-item:first-child{flex:.6}.account-info .account-info-row .account-info-item .account-info-value{font-weight:200}.account-info .change-account-mobile{font-size:.8em;align-items:center;display:flex}.account-info .change-account-mobile .change-account-mobile-label{margin-right:5px}.change-account-info{background-color:unset;cursor:pointer}.change-account-info:hover{background-color:var(--theme-primary)}.user-menu{padding:0;margin:0;list-style:none;color:#fff}.user-menu li{display:flex;flex-direction:row;align-items:center;padding:4px;font-weight:200;cursor:pointer;border-radius:var(--border-radius)}.user-menu li:hover{background-color:var(--theme-primary)}.user-menu li .user-menu-icon{width:28px;height:25px;background-repeat:no-repeat}.user-menu li .logout{background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17.687\" height=\"17.686\" viewBox=\"0 0 17.687 17.686\">%0A  <g id=\"Grupo_8513\" data-name=\"Grupo 8513\" transform=\"translate(12.157)\">%0A    <g id=\"Grupo_1649\" data-name=\"Grupo 1649\">%0A      <g id=\"exit-to-app\">%0A        <path id=\"Caminho_706\" data-name=\"Caminho 706\" d=\"M1628.279,320.831l1.375,1.375,4.914-4.912-4.914-4.913-1.375,1.375,2.554,2.555H1621.3v1.965h9.531Zm8.745-12.381h-13.757a1.971,1.971,0,0,0-1.965,1.965v3.93h1.965v-3.93h13.757v13.756h-13.757v-3.93H1621.3v3.93a1.971,1.971,0,0,0,1.965,1.965h13.757a1.971,1.971,0,0,0,1.965-1.965V310.415A1.971,1.971,0,0,0,1637.024,308.45Z\" transform=\"translate(-1633.459 -308.45)\" fill=\"%23fff\"/>%0A      </g>%0A    </g>%0A  </g>%0A</svg>%0A');background-position-y:3px}.add-account{color:#fff;font-size:1.1em;padding:10px;margin:0;font-weight:400;letter-spacing:.25px;cursor:pointer}@media screen and (max-width: 441px){.hidden-items{display:none!important}}.notifications-header{display:flex;align-items:center;gap:8px}.notifications-header .notifications-vector-logo{background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-position:right;background-size:cover;height:12px;width:30px}.notifications-header .notifications-title{text-transform:uppercase;color:var(--gray-dark)}.notifications-list{max-height:400px;overflow:auto;margin-top:10px}.notifications-list .notification-item{display:flex;flex-direction:column;cursor:pointer;position:relative;padding:5px 10px;border-radius:5px}.notifications-list .notification-item:hover{background-color:var(--gray-medium)}.notifications-list .notification-item .notification-title{font-weight:700;text-transform:uppercase}.notifications-list .notification-item span{font-weight:500;margin-right:20px}.notifications-list .notification-item em{position:absolute;right:10px;bottom:10px;color:var(--theme-primary)}\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: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i6.OverlayPanel, selector: "p-overlayPanel", inputs: ["ariaLabel", "ariaLabelledBy", "dismissable", "showCloseIcon", "style", "styleClass", "appendTo", "autoZIndex", "ariaCloseLabel", "baseZIndex", "focusOnShow", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "directive", type: i2$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "pipe", type: FormatDocumentPipe, name: "formatDocument" }, { kind: "pipe", type: UnreadNotificationsPipe, name: "unreadNotifications" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TopBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TopBarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vector-top-bar', template: "<div class=\"top-bar-container\">\r\n  <div id=\"menu-toggle\" class=\"menu-toggle\" (click)=\"toggleMenu()\">\r\n    <div class=\"menu-icon\"></div>\r\n  </div>\r\n\r\n  <div class=\"left-items-container\" *ngIf=\"fintech && isDesktop() && !doingOnboarding && !isAdmin\">\r\n    <span>Banco {{ currentAccount?.bankCode }}</span>\r\n    <span class=\"separator\"></span>\r\n    <span>AG {{ currentAccount?.agency }}</span>\r\n    <span class=\"separator\"></span>\r\n    <span>CC {{ currentAccount?.accountNumber }}</span>\r\n    <span class=\"separator\"></span>\r\n    <span\r\n      >{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}\r\n      {{ maskUtil.formatDocument(currentAccount?.document) }}</span\r\n    >\r\n    <ng-container>\r\n      <span class=\"separator\"></span>\r\n      <div class=\"change-account-button cursor-pointer\" (click)=\"changeAccountMenu.toggle($event)\">\r\n        <span class=\"mr-2\">Alternar conta</span>\r\n        <span\r\n          class=\"fas\"\r\n          [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n        ></span>\r\n      </div>\r\n    </ng-container>\r\n  </div>\r\n\r\n  <div class=\"right-items-container\" [ngClass]=\"{ 'hidden-items': hideElements }\" *ngIf=\"!isAdmin && !doingOnboarding\">\r\n    <div class=\"help-central\" *ngIf=\"showHelpCentral\">\r\n      <span>{{ 'app.label.help_central' | translate }}:</span>\r\n      <ng-container *ngFor=\"let item of helpCentralIcons\">\r\n        <a target=\"_blank\" [ngClass]=\"{ hidden: !item.active }\" [attr.href]=\"item.url\">\r\n          <i [class]=\"item.icon\"></i>\r\n        </a>\r\n      </ng-container>\r\n    </div>\r\n\r\n    <span *ngIf=\"!fintech\" (click)=\"notifications.toggle($event)\" class=\"fas fa-bell notifications-icon\">\r\n      <span *ngIf=\"(notificationsList | unreadNotifications).length\" class=\"notifications-indicator\"> </span>\r\n    </span>\r\n\r\n    <span class=\"separator\"></span>\r\n    <div\r\n      #menuContainer\r\n      class=\"menu-container\"\r\n      (click)=\"menu.toggle($event)\"\r\n      pTooltip=\"Enter your username\"\r\n      tooltipPosition=\"bottom\"\r\n      tooltipEvent=\"click\"\r\n    >\r\n      <span class=\"user-name\">{{ currentAccount?.name || vectorFirstName || '' }}</span>\r\n      <span class=\"fas\" [ngClass]=\"{ 'fa-angle-down': !openedMenu, 'fa-angle-up': openedMenu }\"></span>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\r\n  <ng-template pTemplate>\r\n    <div class=\"account-info\" *ngIf=\"!isDesktop()\">\r\n      <div class=\"account-info-row\">\r\n        <div class=\"account-info-item\">\r\n          <span>Banco: </span>\r\n          <span class=\"account-info-value\">{{ currentAccount?.bank }}</span>\r\n        </div>\r\n\r\n        <span class=\"separator\"></span>\r\n        <div class=\"account-info-item\">\r\n          <span>AG: </span>\r\n          <span class=\"account-info-value\">{{ currentAccount?.agency }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"account-info-row\">\r\n        <div class=\"account-info-item\">\r\n          <span>CC: </span>\r\n          <span class=\"account-info-value\">{{ currentAccount?.accountNumber }}</span>\r\n        </div>\r\n        <span class=\"separator\"></span>\r\n        <div class=\"account-info-item\">\r\n          <span>{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n          <span class=\"account-info-value\"> {{ maskUtil.formatDocument(currentAccount?.document) }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"change-account-mobile\" (click)=\"changeAccountMenu.toggle($event)\" *ngIf=\"otherAccounts?.length\">\r\n        <span class=\"change-account-mobile-label\">Alternar conta</span>\r\n        <span\r\n          class=\"fas\"\r\n          [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\r\n        ></span>\r\n      </div>\r\n    </div>\r\n    <ul class=\"user-menu\">\r\n      <li *ngIf=\"fintech\" (click)=\"goToTermsOfUse(); menu.hide()\">\r\n        <span class=\"terms-of-use user-menu-icon\"></span>\r\n        <span>Termos de Uso</span>\r\n      </li>\r\n      <li *ngIf=\"fintech\" (click)=\"goToPasswordChange(); menu.hide()\">\r\n        <span class=\"fintech-password user-menu-icon\"></span>\r\n        <span>Alterar Senha</span>\r\n      </li>\r\n      <li (click)=\"logout()\">\r\n        <span class=\"logout user-menu-icon\"></span>\r\n        <span>Sair</span>\r\n      </li>\r\n    </ul>\r\n  </ng-template>\r\n</p-overlayPanel>\r\n\r\n<p-overlayPanel #changeAccountMenu (onHide)=\"openedChangeAccountMenu = false\" (onShow)=\"openedChangeAccountMenu = true\">\r\n  <ng-template pTemplate>\r\n    <div\r\n      *ngFor=\"let account of otherAccounts\"\r\n      class=\"account-info change-account-info\"\r\n      (click)=\"changeAccount(account)\"\r\n    >\r\n      <div class=\"account-info-row\">\r\n        <div class=\"account-info-item\">\r\n          <span>Banco: </span>\r\n          <span class=\"account-info-value\">{{ account?.bank }}</span>\r\n        </div>\r\n\r\n        <span class=\"separator\"></span>\r\n        <div class=\"account-info-item\">\r\n          <span>AG: </span>\r\n          <span class=\"account-info-value\">{{ account?.agency }}</span>\r\n        </div>\r\n      </div>\r\n      <div class=\"account-info-row\">\r\n        <div class=\"account-info-item\">\r\n          <span>CC: </span>\r\n          <span class=\"account-info-value\">{{ account?.accountNumber }}</span>\r\n        </div>\r\n        <span class=\"separator\"></span>\r\n        <div class=\"account-info-item\">\r\n          <span>{{ account?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\r\n          <span class=\"account-info-value\"> {{ account?.document | formatDocument }}</span>\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div>\r\n      <hr />\r\n      <p class=\"text-center add-account\" (click)=\"goToOnboarding(); changeAccountMenu.hide()\">\r\n        Adicionar uma nova conta\r\n      </p>\r\n    </div>\r\n  </ng-template>\r\n</p-overlayPanel>\r\n\r\n<p-overlayPanel\r\n  #notifications\r\n  (onHide)=\"showNotifications = false\"\r\n  (onShow)=\"showNotifications = true\"\r\n  styleClass=\"background-white\"\r\n>\r\n  <ng-template pTemplate>\r\n    <div class=\"notifications-header\">\r\n      <div class=\"notifications-vector-logo\"></div>\r\n      <span class=\"notifications-title\">\r\n        {{ 'app.label.notifications' | translate }}\r\n      </span>\r\n    </div>\r\n    <ul class=\"notifications-list\">\r\n      <li\r\n        (click)=\"handleClick(notification?.link)\"\r\n        class=\"notification-item\"\r\n        *ngFor=\"let notification of notificationsList | unreadNotifications\"\r\n      >\r\n        <span class=\"notification-title\">{{ notification.title }}</span>\r\n        <span>{{ notification.description }}</span>\r\n        <em class=\"fas fa-chevron-right\"></em>\r\n      </li>\r\n    </ul>\r\n  </ng-template>\r\n</p-overlayPanel>\r\n", styles: [".fas{color:#fff}.top-bar-container{height:81px;background-color:var(--theme-light);display:flex;flex:1;align-items:center;padding:15px;color:#fff;font-size:1em;font-weight:600;box-shadow:2px 2px 4px #00000029}.top-bar-container .menu-toggle{cursor:pointer;margin-right:10px;padding:8px}.top-bar-container .menu-toggle .menu-icon{background:url(../../../../assets/icons/menu_hamburguer_icon.svg);background-repeat:no-repeat;background-size:cover;width:20.77px;height:13.85px}.top-bar-container .menu-toggle span{font-size:1.3em}.top-bar-container .left-items-container{display:flex;align-items:center;flex-direction:row}.top-bar-container .right-items-container{flex:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.top-bar-container .right-items-container .help-central{display:flex;align-items:center;gap:20px;font-size:1rem;margin-right:35px}.top-bar-container .right-items-container .help-central em{font-size:1.3rem}.top-bar-container .right-items-container .help-central a{outline:none;border:none;text-decoration:none;color:transparent}.top-bar-container .right-items-container .help-central a i{color:#fff;font-size:1.1em}.top-bar-container .right-items-container .help-central a i:hover{color:#7de5ec}@media screen and (max-width: 441px){.top-bar-container .right-items-container .help-central span{display:none}.top-bar-container .right-items-container .help-central em{font-size:1rem}}.top-bar-container .right-items-container .menu-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;cursor:pointer}.top-bar-container .right-items-container .menu-container .user-name{margin-right:15px}.top-bar-container .right-items-container .notifications-icon{position:relative;cursor:pointer}.top-bar-container .right-items-container .notifications-indicator{position:absolute;right:-8px;top:-8px;width:12px;height:12px;border-radius:50%;background-color:var(--error-color)}.separator{height:100%;margin-left:15px;margin-right:15px}.separator:after{content:\"\";height:100%;border-right:2px solid #ffffff}.account-info{display:flex;flex-direction:column;background-color:var(--theme-primary);border-radius:var(--border-radius);color:#fff;padding:5px;width:300px}.account-info .account-info-row{display:flex;flex-direction:row;align-items:center}.account-info .account-info-row .account-info-item{flex:1}.account-info .account-info-row .account-info-item:first-child{flex:.6}.account-info .account-info-row .account-info-item .account-info-value{font-weight:200}.account-info .change-account-mobile{font-size:.8em;align-items:center;display:flex}.account-info .change-account-mobile .change-account-mobile-label{margin-right:5px}.change-account-info{background-color:unset;cursor:pointer}.change-account-info:hover{background-color:var(--theme-primary)}.user-menu{padding:0;margin:0;list-style:none;color:#fff}.user-menu li{display:flex;flex-direction:row;align-items:center;padding:4px;font-weight:200;cursor:pointer;border-radius:var(--border-radius)}.user-menu li:hover{background-color:var(--theme-primary)}.user-menu li .user-menu-icon{width:28px;height:25px;background-repeat:no-repeat}.user-menu li .logout{background-image:url(../../../../assets/icons/logout_icon.svg);background-position-y:3px}.add-account{color:#fff;font-size:1.1em;padding:10px;margin:0;font-weight:400;letter-spacing:.25px;cursor:pointer}@media screen and (max-width: 441px){.hidden-items{display:none!important}}.notifications-header{display:flex;align-items:center;gap:8px}.notifications-header .notifications-vector-logo{background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-position:right;background-size:cover;height:12px;width:30px}.notifications-header .notifications-title{text-transform:uppercase;color:var(--gray-dark)}.notifications-list{max-height:400px;overflow:auto;margin-top:10px}.notifications-list .notification-item{display:flex;flex-direction:column;cursor:pointer;position:relative;padding:5px 10px;border-radius:5px}.notifications-list .notification-item:hover{background-color:var(--gray-medium)}.notifications-list .notification-item .notification-title{font-weight:700;text-transform:uppercase}.notifications-list .notification-item span{font-weight:500;margin-right:20px}.notifications-list .notification-item em{position:absolute;right:10px;bottom:10px;color:var(--theme-primary)}\n"] }]
+            args: [{ selector: 'vector-top-bar', template: "<div class=\"top-bar-container\">\n  <div id=\"menu-toggle\" class=\"menu-toggle\" (click)=\"toggleMenu()\">\n    <div class=\"menu-icon\"></div>\n  </div>\n\n  <div class=\"left-items-container\" *ngIf=\"fintech && isDesktop() && !doingOnboarding && !isAdmin\">\n    <span>Banco {{ currentAccount?.bankCode }}</span>\n    <span class=\"separator\"></span>\n    <span>AG {{ currentAccount?.agency }}</span>\n    <span class=\"separator\"></span>\n    <span>CC {{ currentAccount?.accountNumber }}</span>\n    <span class=\"separator\"></span>\n    <span\n      >{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}\n      {{ maskUtil.formatDocument(currentAccount?.document) }}</span\n    >\n    <ng-container>\n      <span class=\"separator\"></span>\n      <div class=\"change-account-button cursor-pointer\" (click)=\"changeAccountMenu.toggle($event)\">\n        <span class=\"mr-2\">Alternar conta</span>\n        <span\n          class=\"fas\"\n          [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\n        ></span>\n      </div>\n    </ng-container>\n  </div>\n\n  <div class=\"right-items-container\" [ngClass]=\"{ 'hidden-items': hideElements }\" *ngIf=\"!isAdmin && !doingOnboarding\">\n    <div class=\"help-central\" *ngIf=\"showHelpCentral\">\n      <span>{{ 'app.label.help_central' | translate }}:</span>\n      <ng-container *ngFor=\"let item of helpCentralIcons\">\n        <a target=\"_blank\" [ngClass]=\"{ hidden: !item.active }\" [attr.href]=\"item.url\">\n          <i [class]=\"item.icon\"></i>\n        </a>\n      </ng-container>\n    </div>\n\n    <span *ngIf=\"!fintech\" (click)=\"notifications.toggle($event)\" class=\"fas fa-bell notifications-icon\">\n      <span *ngIf=\"(notificationsList | unreadNotifications).length\" class=\"notifications-indicator\"> </span>\n    </span>\n\n    <span class=\"separator\"></span>\n    <div\n      #menuContainer\n      class=\"menu-container\"\n      (click)=\"menu.toggle($event)\"\n      pTooltip=\"Enter your username\"\n      tooltipPosition=\"bottom\"\n      tooltipEvent=\"click\"\n    >\n      <span class=\"user-name\">{{ currentAccount?.name || vectorFirstName || '' }}</span>\n      <span class=\"fas\" [ngClass]=\"{ 'fa-angle-down': !openedMenu, 'fa-angle-up': openedMenu }\"></span>\n    </div>\n  </div>\n</div>\n\n<p-overlayPanel #menu (onHide)=\"openedMenu = false\" (onShow)=\"openedMenu = true\">\n  <ng-template pTemplate>\n    <div class=\"account-info\" *ngIf=\"!isDesktop()\">\n      <div class=\"account-info-row\">\n        <div class=\"account-info-item\">\n          <span>Banco: </span>\n          <span class=\"account-info-value\">{{ currentAccount?.bank }}</span>\n        </div>\n\n        <span class=\"separator\"></span>\n        <div class=\"account-info-item\">\n          <span>AG: </span>\n          <span class=\"account-info-value\">{{ currentAccount?.agency }}</span>\n        </div>\n      </div>\n      <div class=\"account-info-row\">\n        <div class=\"account-info-item\">\n          <span>CC: </span>\n          <span class=\"account-info-value\">{{ currentAccount?.accountNumber }}</span>\n        </div>\n        <span class=\"separator\"></span>\n        <div class=\"account-info-item\">\n          <span>{{ currentAccount?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\n          <span class=\"account-info-value\"> {{ maskUtil.formatDocument(currentAccount?.document) }}</span>\n        </div>\n      </div>\n      <div class=\"change-account-mobile\" (click)=\"changeAccountMenu.toggle($event)\" *ngIf=\"otherAccounts?.length\">\n        <span class=\"change-account-mobile-label\">Alternar conta</span>\n        <span\n          class=\"fas\"\n          [ngClass]=\"{ 'fa-angle-down': !openedChangeAccountMenu, 'fa-angle-up': openedChangeAccountMenu }\"\n        ></span>\n      </div>\n    </div>\n    <ul class=\"user-menu\">\n      <li *ngIf=\"fintech\" (click)=\"goToTermsOfUse(); menu.hide()\">\n        <span class=\"terms-of-use user-menu-icon\"></span>\n        <span>Termos de Uso</span>\n      </li>\n      <li *ngIf=\"fintech\" (click)=\"goToPasswordChange(); menu.hide()\">\n        <span class=\"fintech-password user-menu-icon\"></span>\n        <span>Alterar Senha</span>\n      </li>\n      <li (click)=\"logout()\">\n        <span class=\"logout user-menu-icon\"></span>\n        <span>Sair</span>\n      </li>\n    </ul>\n  </ng-template>\n</p-overlayPanel>\n\n<p-overlayPanel #changeAccountMenu (onHide)=\"openedChangeAccountMenu = false\" (onShow)=\"openedChangeAccountMenu = true\">\n  <ng-template pTemplate>\n    <div\n      *ngFor=\"let account of otherAccounts\"\n      class=\"account-info change-account-info\"\n      (click)=\"changeAccount(account)\"\n    >\n      <div class=\"account-info-row\">\n        <div class=\"account-info-item\">\n          <span>Banco: </span>\n          <span class=\"account-info-value\">{{ account?.bank }}</span>\n        </div>\n\n        <span class=\"separator\"></span>\n        <div class=\"account-info-item\">\n          <span>AG: </span>\n          <span class=\"account-info-value\">{{ account?.agency }}</span>\n        </div>\n      </div>\n      <div class=\"account-info-row\">\n        <div class=\"account-info-item\">\n          <span>CC: </span>\n          <span class=\"account-info-value\">{{ account?.accountNumber }}</span>\n        </div>\n        <span class=\"separator\"></span>\n        <div class=\"account-info-item\">\n          <span>{{ account?.accountType === 'CURRENT_ACCOUNT_PF' ? 'CPF' : 'CNPJ' }}: </span>\n          <span class=\"account-info-value\"> {{ account?.document | formatDocument }}</span>\n        </div>\n      </div>\n    </div>\n    <div>\n      <hr />\n      <p class=\"text-center add-account\" (click)=\"goToOnboarding(); changeAccountMenu.hide()\">\n        Adicionar uma nova conta\n      </p>\n    </div>\n  </ng-template>\n</p-overlayPanel>\n\n<p-overlayPanel\n  #notifications\n  (onHide)=\"showNotifications = false\"\n  (onShow)=\"showNotifications = true\"\n  styleClass=\"background-white\"\n>\n  <ng-template pTemplate>\n    <div class=\"notifications-header\">\n      <div class=\"notifications-vector-logo\"></div>\n      <span class=\"notifications-title\">\n        {{ 'app.label.notifications' | translate }}\n      </span>\n    </div>\n    <ul class=\"notifications-list\">\n      <li\n        (click)=\"handleClick(notification?.link)\"\n        class=\"notification-item\"\n        *ngFor=\"let notification of notificationsList | unreadNotifications\"\n      >\n        <span class=\"notification-title\">{{ notification.title }}</span>\n        <span>{{ notification.description }}</span>\n        <em class=\"fas fa-chevron-right\"></em>\n      </li>\n    </ul>\n  </ng-template>\n</p-overlayPanel>\n", styles: [".fas{color:#fff}.top-bar-container{height:81px;background-color:var(--theme-light);display:flex;flex:1;align-items:center;padding:15px;color:#fff;font-size:1em;font-weight:600;box-shadow:2px 2px 4px #00000029}.top-bar-container .menu-toggle{cursor:pointer;margin-right:10px;padding:8px}.top-bar-container .menu-toggle .menu-icon{background:url('data:image/svg+xml,<svg width=\"21\" height=\"14\" viewBox=\"0 0 21 14\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">%0A<path d=\"M0 13.846H15V11.538H0V13.846ZM0 8.077H11.538V5.769H0V8.077ZM0 0V2.308H15V0H0ZM20.769 11.065L16.638 6.923L20.769 2.781L19.142 1.154L13.373 6.923L19.142 12.692L20.769 11.065Z\" fill=\"white\"/>%0A</svg>%0A');background-repeat:no-repeat;background-size:cover;width:20.77px;height:13.85px}.top-bar-container .menu-toggle span{font-size:1.3em}.top-bar-container .left-items-container{display:flex;align-items:center;flex-direction:row}.top-bar-container .right-items-container{flex:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center}.top-bar-container .right-items-container .help-central{display:flex;align-items:center;gap:20px;font-size:1rem;margin-right:35px}.top-bar-container .right-items-container .help-central em{font-size:1.3rem}.top-bar-container .right-items-container .help-central a{outline:none;border:none;text-decoration:none;color:transparent}.top-bar-container .right-items-container .help-central a i{color:#fff;font-size:1.1em}.top-bar-container .right-items-container .help-central a i:hover{color:#7de5ec}@media screen and (max-width: 441px){.top-bar-container .right-items-container .help-central span{display:none}.top-bar-container .right-items-container .help-central em{font-size:1rem}}.top-bar-container .right-items-container .menu-container{display:flex;flex-direction:row;align-items:center;justify-content:flex-end;cursor:pointer}.top-bar-container .right-items-container .menu-container .user-name{margin-right:15px}.top-bar-container .right-items-container .notifications-icon{position:relative;cursor:pointer}.top-bar-container .right-items-container .notifications-indicator{position:absolute;right:-8px;top:-8px;width:12px;height:12px;border-radius:50%;background-color:var(--error-color)}.separator{height:100%;margin-left:15px;margin-right:15px}.separator:after{content:\"\";height:100%;border-right:2px solid #ffffff}.account-info{display:flex;flex-direction:column;background-color:var(--theme-primary);border-radius:var(--border-radius);color:#fff;padding:5px;width:300px}.account-info .account-info-row{display:flex;flex-direction:row;align-items:center}.account-info .account-info-row .account-info-item{flex:1}.account-info .account-info-row .account-info-item:first-child{flex:.6}.account-info .account-info-row .account-info-item .account-info-value{font-weight:200}.account-info .change-account-mobile{font-size:.8em;align-items:center;display:flex}.account-info .change-account-mobile .change-account-mobile-label{margin-right:5px}.change-account-info{background-color:unset;cursor:pointer}.change-account-info:hover{background-color:var(--theme-primary)}.user-menu{padding:0;margin:0;list-style:none;color:#fff}.user-menu li{display:flex;flex-direction:row;align-items:center;padding:4px;font-weight:200;cursor:pointer;border-radius:var(--border-radius)}.user-menu li:hover{background-color:var(--theme-primary)}.user-menu li .user-menu-icon{width:28px;height:25px;background-repeat:no-repeat}.user-menu li .logout{background-image:url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"17.687\" height=\"17.686\" viewBox=\"0 0 17.687 17.686\">%0A  <g id=\"Grupo_8513\" data-name=\"Grupo 8513\" transform=\"translate(12.157)\">%0A    <g id=\"Grupo_1649\" data-name=\"Grupo 1649\">%0A      <g id=\"exit-to-app\">%0A        <path id=\"Caminho_706\" data-name=\"Caminho 706\" d=\"M1628.279,320.831l1.375,1.375,4.914-4.912-4.914-4.913-1.375,1.375,2.554,2.555H1621.3v1.965h9.531Zm8.745-12.381h-13.757a1.971,1.971,0,0,0-1.965,1.965v3.93h1.965v-3.93h13.757v13.756h-13.757v-3.93H1621.3v3.93a1.971,1.971,0,0,0,1.965,1.965h13.757a1.971,1.971,0,0,0,1.965-1.965V310.415A1.971,1.971,0,0,0,1637.024,308.45Z\" transform=\"translate(-1633.459 -308.45)\" fill=\"%23fff\"/>%0A      </g>%0A    </g>%0A  </g>%0A</svg>%0A');background-position-y:3px}.add-account{color:#fff;font-size:1.1em;padding:10px;margin:0;font-weight:400;letter-spacing:.25px;cursor:pointer}@media screen and (max-width: 441px){.hidden-items{display:none!important}}.notifications-header{display:flex;align-items:center;gap:8px}.notifications-header .notifications-vector-logo{background-image:url(/assets/images/vector_logo_horizontal.svg);background-repeat:no-repeat;background-position:right;background-size:cover;height:12px;width:30px}.notifications-header .notifications-title{text-transform:uppercase;color:var(--gray-dark)}.notifications-list{max-height:400px;overflow:auto;margin-top:10px}.notifications-list .notification-item{display:flex;flex-direction:column;cursor:pointer;position:relative;padding:5px 10px;border-radius:5px}.notifications-list .notification-item:hover{background-color:var(--gray-medium)}.notifications-list .notification-item .notification-title{font-weight:700;text-transform:uppercase}.notifications-list .notification-item span{font-weight:500;margin-right:20px}.notifications-list .notification-item em{position:absolute;right:10px;bottom:10px;color:var(--theme-primary)}\n"] }]
         }], ctorParameters: () => [{ type: MenuService }, { type: AuthService }, { type: i1$1.Router }, { type: ProfileService }, { type: StorageService }, { type: NotificationsService }, { type: ErrorMessageService }], propDecorators: { fintech: [{
                 type: Input
             }], accountService: [{
@@ -4956,11 +5071,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImpor
             }] } });
 
 class TopBarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TopBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: TopBarModule, declarations: [TopBarComponent], imports: [SharedModule, OverlayPanelModule, TranslateModule, MenuModule], exports: [TopBarComponent] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TopBarModule, imports: [SharedModule, OverlayPanelModule, TranslateModule, MenuModule] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TopBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: TopBarModule, declarations: [TopBarComponent], imports: [SharedModule, OverlayPanelModule, TranslateModule, MenuModule], exports: [TopBarComponent] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TopBarModule, imports: [SharedModule, OverlayPanelModule, TranslateModule, MenuModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TopBarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TopBarModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [TopBarComponent],
@@ -5213,10 +5328,10 @@ class HttpInterceptorProvider {
         }
         return this.refreshTokenSubject.pipe(filter((token) => token !== null), take(1), switchMap((token) => next.handle(this.addTokenIfPresent(request))));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: HttpInterceptorProvider, deps: [{ token: StorageService }, { token: ErrorMessageService }, { token: LoadingService }, { token: AuthService }, { token: i2$1.MessageService }, { token: ENVIRONMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: HttpInterceptorProvider }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: HttpInterceptorProvider, deps: [{ token: StorageService }, { token: ErrorMessageService }, { token: LoadingService }, { token: AuthService }, { token: i2$1.MessageService }, { token: ENVIRONMENT }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: HttpInterceptorProvider }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: HttpInterceptorProvider, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: HttpInterceptorProvider, decorators: [{
             type: Injectable
         }], ctorParameters: () => [{ type: StorageService }, { type: ErrorMessageService }, { type: LoadingService }, { type: AuthService }, { type: i2$1.MessageService }, { type: undefined, decorators: [{
                     type: Inject,
@@ -5243,5 +5358,5 @@ const getSelectedCrudItemResolver = (routeSnapshot) => {
  * Generated bundle index. Do not edit.
  */
 
-export { APP_NAME, AppName, AuthService, BadgeComponent, BadgeModule, BooleanType, BreadcrumbComponent, BreadcrumbModule, ButtonComponent, CalendarComponent, CheckboxFieldComponent, CpfCnpjValidator, CrudBaseComponent, CrudBaseService, CrudFooterComponent, CrudHeaderComponent, CrudHeaderModule, CrudHistory, CrudHistoryComponent, CrudHistoryModule, CrudMode, CurrencyBrlPipe, CurrencyFieldComponent, DataTableComponent, DocumentType, DropdownFieldComponent, ENVIRONMENT, EnumService, ErrorMessageService, FieldErrorMessageComponent, FieldType, FieldsModule, FileUtil, FiltersComponent, FooterModule, FormatDocumentPipe, GenericErrorModalComponent, GenericErrorModalModule, GenericModalComponent, GenericModalModule, GeolocationService, HttpInterceptorProvider, InputNumberFieldComponent, InputSwitchFieldComponent, LoadingService, MENU_OPTIONS, MaskPipe, MaskUtil, MenuComponent, MenuModule, MenuService, MessageStatus, ModalService, MultiselectFieldComponent, NotHiddenPipe, NotificationsService, ObjectUtil, OnlyActivePipe, PanelComponent, PanelModule, PercentageFieldComponent, PipesModule, ProfileModuleActionType, ProfileModuleType, ProfileService, ProfileTypeEnum, RadioButtonFieldComponent, RangeValueComponent, RemoveLastChildPipe, Role, ScoreComponent, ScoreModule, SearchFieldComponent, SelectButtonFieldComponent, SelectionType, Status, StepperComponent, StepperModule, StorageService, StringUtil, SubMenusListComponent, TableColumnType, TextFieldComponent, TextareaFieldComponent, TopBarComponent, TopBarModule, UnreadNotificationsPipe, ValidationUtil, View, WindowUtil, crudListHasItemsGuard, getSelectedCrudItemResolver, getTokenByGuidGuard, hasPermissionGuard, roleGuard, tokenIsPresentGuard };
+export { APP_NAME, AppName, AuthService, BadgeComponent, BadgeModule, BooleanType, BreadcrumbComponent, BreadcrumbModule, ButtonComponent, CalendarComponent, CheckboxFieldComponent, CpfCnpjValidator, CrudBaseComponent, CrudBaseService, CrudFooterComponent, CrudHeaderComponent, CrudHeaderModule, CrudHistory, CrudHistoryComponent, CrudHistoryModule, CrudMode, CurrencyBrlPipe, CurrencyFieldComponent, DataTableComponent, DocumentType, DropdownFieldComponent, ENVIRONMENT, EnumService, ErrorMessageService, FieldErrorMessageComponent, FieldType, FieldsModule, FileUtil, FiltersComponent, FooterModule, FormatDocumentPipe, GenericErrorModalComponent, GenericErrorModalModule, GenericModalComponent, GenericModalModule, GeolocationService, HttpInterceptorProvider, InputNumberFieldComponent, InputOtpComponent, InputSwitchFieldComponent, LoadingService, MENU_OPTIONS, MaskPipe, MaskUtil, MenuComponent, MenuModule, MenuService, MessageStatus, ModalService, MultiselectFieldComponent, NotHiddenPipe, NotificationsService, ObjectUtil, OnlyActivePipe, PanelComponent, PanelModule, PercentageFieldComponent, PipesModule, ProfileModuleActionType, ProfileModuleType, ProfileService, ProfileTypeEnum, RadioButtonFieldComponent, RangeValueComponent, RemoveLastChildPipe, Role, ScoreComponent, ScoreModule, SearchFieldComponent, SelectButtonFieldComponent, SelectionType, Status, StepperComponent, StepperModule, StorageService, StringUtil, SubMenusListComponent, TableColumnType, TextFieldComponent, TextareaFieldComponent, TopBarComponent, TopBarModule, UnreadNotificationsPipe, ValidationUtil, View, WindowUtil, crudListHasItemsGuard, getSelectedCrudItemResolver, getTokenByGuidGuard, hasPermissionGuard, roleGuard, tokenIsPresentGuard };
 //# sourceMappingURL=ngx-vector-components.mjs.map