@koalarx/ui 14.0.7 → 15.0.0

package/core/fesm2020/koalarx-ui-core.mjs

@@ -8,16 +8,15 @@ import * as i2$1 from '@angular/router';
 import { NavigationError, NavigationEnd, NavigationCancel, NavigationStart, RouterModule } from '@angular/router';
 import * as i3 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import * as i4 from '@angular/material/button';
+import * as i11 from '@angular/material/button';
 import { MatButtonModule } from '@angular/material/button';
 import * as i5 from '@angular/material/icon';
 import { MatIconModule } from '@angular/material/icon';
 import * as i6 from '@angular/material/list';
 import { MatListModule } from '@angular/material/list';
-import * as i7 from '@angular/material/core';
 import { BehaviorSubject, interval, Observable, skipWhile } from 'rxjs';
 import jwt from 'jwt-decode';
-import * as i4$1 from '@koalarx/ui/menu';
+import * as i4 from '@koalarx/ui/menu';
 import { menuStateSubject } from '@koalarx/ui/menu';
 import jwtEncode from 'jwt-encode';
 import { koala } from '@koalarx/utils';
@@ -48,9 +47,9 @@ class LoaderBarPageComponent {
         this.typeLoader = 'indeterminate';
     }
 }
-LoaderBarPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: LoaderBarPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-LoaderBarPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: LoaderBarPageComponent, selector: "app-loader-page", inputs: { show: "show", progress: "progress", typeLoader: "typeLoader" }, ngImport: i0, template: "<div [ngClass]=\"{'bouncedInDown d-block': show}\" class=\"animated loader-bar-page\">\n  <mat-progress-bar\n    [bufferValue]=\"progress\"\n    [mode]=\"typeLoader\"\n    [value]=\"progress\"\n    color=\"primary\">\n  </mat-progress-bar>\n</div>\n", styles: [".loader-bar-page{position:absolute;display:none;top:0;left:0;width:100vw;height:100vh;z-index:100000}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: LoaderBarPageComponent, decorators: [{
+LoaderBarPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LoaderBarPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+LoaderBarPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: LoaderBarPageComponent, selector: "app-loader-page", inputs: { show: "show", progress: "progress", typeLoader: "typeLoader" }, ngImport: i0, template: "<div [ngClass]=\"{'bouncedInDown d-block': show}\" class=\"animated loader-bar-page\">\n  <mat-progress-bar\n    [bufferValue]=\"progress\"\n    [mode]=\"typeLoader\"\n    [value]=\"progress\"\n    color=\"primary\">\n  </mat-progress-bar>\n</div>\n", styles: [".loader-bar-page{position:absolute;display:none;top:0;left:0;width:100vw;height:100vh;z-index:100000}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: LoaderBarPageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'app-loader-page', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"{'bouncedInDown d-block': show}\" class=\"animated loader-bar-page\">\n  <mat-progress-bar\n    [bufferValue]=\"progress\"\n    [mode]=\"typeLoader\"\n    [value]=\"progress\"\n    color=\"primary\">\n  </mat-progress-bar>\n</div>\n", styles: [".loader-bar-page{position:absolute;display:none;top:0;left:0;width:100vw;height:100vh;z-index:100000}\n"] }]
         }], propDecorators: { show: [{
@@ -82,11 +81,11 @@ class NotificationComponent {
         this.delete.emit(notification);
     }
 }
-NotificationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: NotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-NotificationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: NotificationComponent, selector: "koala-notification-list", inputs: { notifications: "notifications" }, outputs: { deleteAll: "deleteAll", delete: "delete" }, usesOnChanges: true, ngImport: i0, template: "<div (click)=\"$event.stopPropagation()\" class=\"notifications-content\">\n  <div class=\"title\">\n    <mat-icon>info</mat-icon>\n    <h2>Notifica\u00E7\u00F5es</h2>\n    <span class=\"spacer\"></span>\n    <button (click)=\"deleteAllNotifications()\" *ngIf=\"notifications.length > 0\" class=\"btn-delete-all\"\n            mat-icon-button\n            matTooltip=\"Excluir Todas\" matTooltipPosition=\"above\">\n      <mat-icon>delete_sweep</mat-icon>\n    </button>\n  </div>\n  <mat-action-list *ngIf=\"notifications.length > 0 else noNotifications\">\n    <mat-list-item *ngFor=\"let notification of notifications\" [routerLink]=\"notification.redirectTo\" class=\"itemList\">\n      <button (click)=\"deleteNotification(notification)\" class=\"delete-notification\" color=\"warn\" mat-icon-button\n              matTooltip=\"Excluir\" matTooltipPosition=\"above\"\n              mat-list-icon>\n        <mat-icon>delete</mat-icon>\n      </button>\n      <mat-icon class=\"iconList\" mat-list-icon>announcement</mat-icon>\n      <h4 class=\"titleList\" mat-line>{{notification.title}}</h4>\n      <p [innerHTML]=\"notification.text\" class=\"textList\" mat-line></p>\n    </mat-list-item>\n  </mat-action-list>\n  <ng-template #noNotifications>\n    <div class=\"empty\">\n      <mat-icon>mood</mat-icon>\n      <p>Tudo certo por aqui!</p>\n    </div>\n  </ng-template>\n</div>\n", styles: [".title{color:#616161;padding:5px 20px 15px}.title h2{vertical-align:middle;display:inline-flex;padding:0 10px;margin:0;font-family:OpenSans,sans-serif;font-size:.8em}.title mat-icon{vertical-align:middle;display:inline-flex;width:22px;height:22px;font-size:22px;line-height:22px}.title .btn-delete-all{position:absolute;right:20px;top:5px}.iconList{color:#1976d2}.titleList{font-family:OpenSansLight,sans-serif;font-size:.7em!important;color:#616161}.textList{font-family:OpenSans,sans-serif;font-size:.9em!important;color:#212121;white-space:inherit!important}.itemList{height:-moz-fit-content!important;height:fit-content!important;padding:8px 0!important}.delete-notification{background:#b71c1c;border-radius:0!important;height:100%!important;margin-left:-75px;margin-right:10px;position:absolute;transition:.3s;width:50px!important}.delete-notification mat-icon{color:#fff;vertical-align:middle}mat-action-list{max-height:70vh;overflow-y:auto}mat-list-item:hover .delete-notification{margin-left:-15px}.empty{padding:50px;text-align:center;color:#616161}.empty mat-icon{width:40px;height:40px;font-size:40px;line-height:40px}.empty p{text-align:center;font-family:OpenSansLight,sans-serif;font-size:1em}\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: i2$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatList, selector: "mat-list, mat-action-list", inputs: ["disableRipple", "disabled"], exportAs: ["matList"] }, { kind: "component", type: i6.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["disableRipple", "disabled"], exportAs: ["matListItem"] }, { kind: "directive", type: i7.MatLine, selector: "[mat-line], [matLine]" }, { kind: "directive", type: i6.MatListIconCssMatStyler, selector: "[mat-list-icon], [matListIcon]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: NotificationComponent, decorators: [{
+NotificationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+NotificationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: NotificationComponent, selector: "koala-notification-list", inputs: { notifications: "notifications" }, outputs: { deleteAll: "deleteAll", delete: "delete" }, usesOnChanges: true, ngImport: i0, template: "<div (click)=\"$event.stopPropagation()\" class=\"notifications-content\">\n  <div class=\"title\">\n    <mat-icon>info</mat-icon>\n    <h2>Notifica\u00E7\u00F5es</h2>\n    <span class=\"spacer\"></span>\n    <button (click)=\"deleteAllNotifications()\" *ngIf=\"notifications.length > 0\" class=\"btn-delete-all\"\n            mat-icon-button\n            matTooltip=\"Excluir Todas\" matTooltipPosition=\"above\">\n      <mat-icon>delete_sweep</mat-icon>\n    </button>\n  </div>\n  <mat-action-list *ngIf=\"notifications.length > 0 else noNotifications\">\n    <mat-list-item *ngFor=\"let notification of notifications\" [routerLink]=\"notification.redirectTo\" class=\"itemList\">\n      <button (click)=\"deleteNotification(notification)\" class=\"delete-notification\" color=\"warn\" mat-icon-button\n              matTooltip=\"Excluir\" matTooltipPosition=\"above\"\n              mat-list-icon>\n        <mat-icon>delete</mat-icon>\n      </button>\n      <mat-icon class=\"iconList\" mat-list-icon>announcement</mat-icon>\n      <h4 class=\"titleList\" mat-line>{{notification.title}}</h4>\n      <p [innerHTML]=\"notification.text\" class=\"textList\" mat-line></p>\n    </mat-list-item>\n  </mat-action-list>\n  <ng-template #noNotifications>\n    <div class=\"empty\">\n      <mat-icon>mood</mat-icon>\n      <p>Tudo certo por aqui!</p>\n    </div>\n  </ng-template>\n</div>\n", styles: [".title{color:#616161;padding:5px 20px 15px}.title h2{vertical-align:middle;display:inline-flex;padding:0 10px;margin:0;font-family:OpenSans,sans-serif;font-size:.8em}.title mat-icon{vertical-align:middle;display:inline-flex;width:22px;height:22px;font-size:22px;line-height:22px}.title .btn-delete-all{position:absolute;right:20px;top:5px}.iconList{color:#1976d2}.titleList{font-family:OpenSansLight,sans-serif;font-size:.7em!important;color:#616161}.textList{font-family:OpenSans,sans-serif;font-size:.9em!important;color:#212121;white-space:unset!important}.itemList{height:-moz-fit-content!important;height:fit-content!important;padding:8px 0!important}.delete-notification{background:#b71c1c;border-radius:0!important;height:100%!important;margin-left:-75px;margin-right:10px;position:absolute;transition:.3s;width:50px!important}.delete-notification mat-icon{color:#fff;vertical-align:middle}mat-action-list{max-height:70vh;overflow-y:auto}mat-list-item:hover .delete-notification{margin-left:-15px}.empty{padding:50px;text-align:center;color:#616161}.empty mat-icon{width:40px;height:40px;font-size:40px;line-height:40px}.empty p{text-align:center;font-family:OpenSansLight,sans-serif;font-size:1em}\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: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i11.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i6.MatActionList, selector: "mat-action-list", exportAs: ["matActionList"] }, { kind: "component", type: i6.MatListItem, selector: "mat-list-item, a[mat-list-item], button[mat-list-item]", inputs: ["activated"], exportAs: ["matListItem"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NotificationComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'koala-notification-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div (click)=\"$event.stopPropagation()\" class=\"notifications-content\">\n  <div class=\"title\">\n    <mat-icon>info</mat-icon>\n    <h2>Notifica\u00E7\u00F5es</h2>\n    <span class=\"spacer\"></span>\n    <button (click)=\"deleteAllNotifications()\" *ngIf=\"notifications.length > 0\" class=\"btn-delete-all\"\n            mat-icon-button\n            matTooltip=\"Excluir Todas\" matTooltipPosition=\"above\">\n      <mat-icon>delete_sweep</mat-icon>\n    </button>\n  </div>\n  <mat-action-list *ngIf=\"notifications.length > 0 else noNotifications\">\n    <mat-list-item *ngFor=\"let notification of notifications\" [routerLink]=\"notification.redirectTo\" class=\"itemList\">\n      <button (click)=\"deleteNotification(notification)\" class=\"delete-notification\" color=\"warn\" mat-icon-button\n              matTooltip=\"Excluir\" matTooltipPosition=\"above\"\n              mat-list-icon>\n        <mat-icon>delete</mat-icon>\n      </button>\n      <mat-icon class=\"iconList\" mat-list-icon>announcement</mat-icon>\n      <h4 class=\"titleList\" mat-line>{{notification.title}}</h4>\n      <p [innerHTML]=\"notification.text\" class=\"textList\" mat-line></p>\n    </mat-list-item>\n  </mat-action-list>\n  <ng-template #noNotifications>\n    <div class=\"empty\">\n      <mat-icon>mood</mat-icon>\n      <p>Tudo certo por aqui!</p>\n    </div>\n  </ng-template>\n</div>\n", styles: [".title{color:#616161;padding:5px 20px 15px}.title h2{vertical-align:middle;display:inline-flex;padding:0 10px;margin:0;font-family:OpenSans,sans-serif;font-size:.8em}.title mat-icon{vertical-align:middle;display:inline-flex;width:22px;height:22px;font-size:22px;line-height:22px}.title .btn-delete-all{position:absolute;right:20px;top:5px}.iconList{color:#1976d2}.titleList{font-family:OpenSansLight,sans-serif;font-size:.7em!important;color:#616161}.textList{font-family:OpenSans,sans-serif;font-size:.9em!important;color:#212121;white-space:inherit!important}.itemList{height:-moz-fit-content!important;height:fit-content!important;padding:8px 0!important}.delete-notification{background:#b71c1c;border-radius:0!important;height:100%!important;margin-left:-75px;margin-right:10px;position:absolute;transition:.3s;width:50px!important}.delete-notification mat-icon{color:#fff;vertical-align:middle}mat-action-list{max-height:70vh;overflow-y:auto}mat-list-item:hover .delete-notification{margin-left:-15px}.empty{padding:50px;text-align:center;color:#616161}.empty mat-icon{width:40px;height:40px;font-size:40px;line-height:40px}.empty p{text-align:center;font-family:OpenSansLight,sans-serif;font-size:1em}\n"] }]
+            args: [{ selector: 'koala-notification-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div (click)=\"$event.stopPropagation()\" class=\"notifications-content\">\n  <div class=\"title\">\n    <mat-icon>info</mat-icon>\n    <h2>Notifica\u00E7\u00F5es</h2>\n    <span class=\"spacer\"></span>\n    <button (click)=\"deleteAllNotifications()\" *ngIf=\"notifications.length > 0\" class=\"btn-delete-all\"\n            mat-icon-button\n            matTooltip=\"Excluir Todas\" matTooltipPosition=\"above\">\n      <mat-icon>delete_sweep</mat-icon>\n    </button>\n  </div>\n  <mat-action-list *ngIf=\"notifications.length > 0 else noNotifications\">\n    <mat-list-item *ngFor=\"let notification of notifications\" [routerLink]=\"notification.redirectTo\" class=\"itemList\">\n      <button (click)=\"deleteNotification(notification)\" class=\"delete-notification\" color=\"warn\" mat-icon-button\n              matTooltip=\"Excluir\" matTooltipPosition=\"above\"\n              mat-list-icon>\n        <mat-icon>delete</mat-icon>\n      </button>\n      <mat-icon class=\"iconList\" mat-list-icon>announcement</mat-icon>\n      <h4 class=\"titleList\" mat-line>{{notification.title}}</h4>\n      <p [innerHTML]=\"notification.text\" class=\"textList\" mat-line></p>\n    </mat-list-item>\n  </mat-action-list>\n  <ng-template #noNotifications>\n    <div class=\"empty\">\n      <mat-icon>mood</mat-icon>\n      <p>Tudo certo por aqui!</p>\n    </div>\n  </ng-template>\n</div>\n", styles: [".title{color:#616161;padding:5px 20px 15px}.title h2{vertical-align:middle;display:inline-flex;padding:0 10px;margin:0;font-family:OpenSans,sans-serif;font-size:.8em}.title mat-icon{vertical-align:middle;display:inline-flex;width:22px;height:22px;font-size:22px;line-height:22px}.title .btn-delete-all{position:absolute;right:20px;top:5px}.iconList{color:#1976d2}.titleList{font-family:OpenSansLight,sans-serif;font-size:.7em!important;color:#616161}.textList{font-family:OpenSans,sans-serif;font-size:.9em!important;color:#212121;white-space:unset!important}.itemList{height:-moz-fit-content!important;height:fit-content!important;padding:8px 0!important}.delete-notification{background:#b71c1c;border-radius:0!important;height:100%!important;margin-left:-75px;margin-right:10px;position:absolute;transition:.3s;width:50px!important}.delete-notification mat-icon{color:#fff;vertical-align:middle}mat-action-list{max-height:70vh;overflow-y:auto}mat-list-item:hover .delete-notification{margin-left:-15px}.empty{padding:50px;text-align:center;color:#616161}.empty mat-icon{width:40px;height:40px;font-size:40px;line-height:40px}.empty p{text-align:center;font-family:OpenSansLight,sans-serif;font-size:1em}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { notifications: [{
                 type: Input
             }], deleteAll: [{
@@ -298,9 +297,9 @@ class KoalaTokenService {
         });
     }
 }
-KoalaTokenService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaTokenService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-KoalaTokenService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaTokenService, providedIn: "any" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaTokenService, decorators: [{
+KoalaTokenService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaTokenService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+KoalaTokenService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaTokenService, providedIn: "any" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaTokenService, decorators: [{
             type: Injectable,
             args: [{ providedIn: "any" }]
         }], ctorParameters: function () { return []; } });
@@ -357,9 +356,9 @@ class KoalaLoaderService {
         });
     }
 }
-KoalaLoaderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaLoaderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-KoalaLoaderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaLoaderService, providedIn: "any" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaLoaderService, decorators: [{
+KoalaLoaderService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaLoaderService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+KoalaLoaderService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaLoaderService, providedIn: "any" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaLoaderService, decorators: [{
             type: Injectable,
             args: [{ providedIn: "any" }]
         }] });
@@ -536,9 +535,9 @@ class KoalaOAuth2Service {
             });
     }
 }
-KoalaOAuth2Service.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaOAuth2Service, deps: [{ token: i1$1.HttpClient }, { token: i2$1.Router }, { token: KoalaTokenService }], target: i0.ɵɵFactoryTarget.Injectable });
-KoalaOAuth2Service.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaOAuth2Service });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaOAuth2Service, decorators: [{
+KoalaOAuth2Service.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaOAuth2Service, deps: [{ token: i1$1.HttpClient }, { token: i2$1.Router }, { token: KoalaTokenService }], target: i0.ɵɵFactoryTarget.Injectable });
+KoalaOAuth2Service.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaOAuth2Service });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaOAuth2Service, decorators: [{
             type: Injectable
         }], ctorParameters: function () { return [{ type: i1$1.HttpClient }, { type: i2$1.Router }, { type: KoalaTokenService }]; } });
 
@@ -728,52 +727,64 @@ input:-webkit-autofill, input:-webkit-autofill:focus, input:-webkit-autofill:hov
 .menu-container,
 body {background: ${this.palletColors.bodyBackground}!important;}
 input:-webkit-autofill, input:-webkit-autofill:focus, input:-webkit-autofill:hover {-webkit-box-shadow: 0 0 0 1000px ${this.palletColors.firstColor} inset !important;}
-.mat-button-disabled,
+.mat-mdc-button-disabled,
 input::placeholder,
-.mat-form-field-appearance-outline .mat-form-field-outline {color: ${this.palletColors.fontColor}!important;opacity: .6;}
-.mat-hint,
+.mat-mdc-form-field-appearance-outline .mat-mdc-form-field-outline {color: ${this.palletColors.fontColor}!important;opacity: .6;}
+.mat-mdc-form-field-hint-wrapper,
 .mat-expansion-indicator::after,
 .more-items-content .items .titleForm,
 fieldset legend,
-.mat-paginator-container,
-.mat-form-field-flex mat-icon {color: ${this.palletColors.fontColor}!important;}
-.mat-paginator-container,
-.mat-card,
+.mat-mdc-paginator-container,
+.mat-mdc-form-field-flex mat-icon,
+.mat-mdc-menu-item .mdc-list-item__primary-text,
+button:disabled,
+.mat-mdc-paginator-range-actions button {color: ${this.palletColors.fontColor}!important;}
+.mat-mdc-paginator-range-actions button svg {fill: ${this.palletColors.fontColor}!important;}
+.mat-mdc-paginator-container,
+.mat-mdc-card,
 .mat-expansion-panel,
-.mat-select-panel,
-.mat-autocomplete-panel,
-.mat-menu-panel {background: ${this.palletColors.firstColor}}
-.mat-selected {background-color: rgba(0,0,0,.3)!important;}
+.mat-mdc-select-panel,
+.mat-mdc-autocomplete-panel,
+.mat-mdc-menu-panel {background: ${this.palletColors.firstColor}}
+.mat-mdc-selected {background-color: rgba(0,0,0,.3)!important;}
+input:-webkit-autofill,
+input:-webkit-autofill:focus,
+input:-webkit-autofill:hover {-webkit-box-shadow: 0 0 0 1000px ${this.palletColors.fontColor} inset !important;}
+.mat-mdc-progress-spinner circle {stroke: ${this.palletColors.fontColor};}
 .question p,
 .alert-message,
-.mat-action-row,
-.mat-option,
-.mat-menu-item,
-.mat-menu-item mat-icon {color: ${this.palletColors.fontColor}!important}
-.mat-select-value,
-.mat-select-arrow,
-.mat-form-field input,
-.mat-form-field textarea,
-.mat-form-field-appearance-outline:not(.mat-form-field-invalid) .mat-form-field-outline-thick,
-.mat-form-field label,
+.mat-mdc-action-row,
+.mat-mdc-option .mdc-list-item__primary-text,
+.mat-mdc-menu-item,
+.mat-mdc-menu-item mat-icon {color: ${this.palletColors.fontColor}!important}
+.mdc-notched-outline div {border-color: ${this.palletColors.fontColor}!important;}
+.mat-mdc-select-value,
+.mat-mdc-select-arrow,
+.mat-mdc-form-field input,
+.mat-mdc-form-field textarea,
+.mat-mdc-form-field-appearance-outline:not(.mat-mdc-form-field-invalid) .mat-mdc-form-field-outline-thick,
+.mat-mdc-form-field label,
 .select-multiple-native select {color: ${this.palletColors.fontColor}!important;caret-color: ${this.palletColors.fontColor}!important;}
-.mat-form-field-underline,
-.mat-form-field-appearance-fill .mat-form-field-underline::before,
-.mat-form-field-ripple {background: ${this.palletColors.fontColor}!important;}
-.mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background,
-.mat-checkbox:not(.mat-checkbox-disabled).mat-accent .mat-checkbox-ripple .mat-ripple-element {background-color: ${this.palletColors.checkboxBackground} !important;}
-.mat-checkbox-checkmark-path {stroke: ${this.palletColors.checkboxColor} !important;}
-.mat-checkbox-checkmark {fill: ${this.palletColors.checkboxColor} !important;}
-.mat-checkbox-mixedmark {background-color: ${this.palletColors.checkboxColor} !important;}
-.mat-checkbox-frame {border-color: ${this.palletColors.checkboxOutlineColor}!important;}
-.mat-checkbox-label {color: ${this.palletColors.fontColor}!important;}
-.mat-radio-outer-circle {border-color: ${this.palletColors.checkboxBackground}!important;}
-.mat-radio-ripple .mat-ripple-element, .mat-radio-inner-circle {background-color: ${this.palletColors.checkboxBackground} !important;}
-.home-list-cards .list .mat-list-item-content .mat-icon {color: ${this.palletColors.fontColor};}
-.home-list-cards .list button .mat-badge-content {background: ${this.palletColors.fontColor};}
-.koala-dialog .mat-dialog-title h2 {color: ${this.palletColors.fontColor};}
-.koala-dialog .mat-dialog-title mat-icon {color: ${this.palletColors.fontColor}!important;}
-.koala-dialog .mat-dialog-container {background: ${this.palletColors.firstColor}}
+.mat-mdc-form-field-underline,
+.mat-mdc-form-field-appearance-fill .mat-mdc-form-field-underline::before,
+.mat-mdc-form-field-ripple {background: ${this.palletColors.fontColor}!important;}
+.mat-mdc-checkbox .mdc-form-field {color: ${this.palletColors.fontColor}!important;}
+.mat-mdc-checkbox-checked.mat-accent .mat-mdc-checkbox-background, .mat-mdc-checkbox-indeterminate.mat-accent .mat-mdc-checkbox-background,
+.mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background {background-color: ${this.palletColors.checkboxBackground} !important;border-color: ${this.palletColors.checkboxOutlineColor}!important;}
+.mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__checkmark {color: ${this.palletColors.checkboxColor} !important;}
+.mat-mdc-checkbox.mat-accent .mdc-checkbox--selected~.mdc-checkbox__ripple, .mat-mdc-checkbox.mat-accent .mdc-checkbox--selected~.mdc-checkbox__ripple div {background-color: ${this.palletColors.checkboxBackground} !important;}
+.mat-mdc-checkbox-checkmark {fill: ${this.palletColors.checkboxColor} !important;}
+.mat-mdc-checkbox-mixedmark {background-color: ${this.palletColors.checkboxColor} !important;}
+.mat-mdc-checkbox .mdc-checkbox .mdc-checkbox__native-control:enabled:not(:checked):not(:indeterminate):not([data-indeterminate=true])~.mdc-checkbox__background {border-color: ${this.palletColors.checkboxOutlineColor}!important;}
+.mat-mdc-radio-button .mdc-form-field {color: ${this.palletColors.fontColor}!important;}
+.mat-mdc-radio-button .mdc-radio__outer-circle,
+.mat-mdc-radio-button .mdc-radio__inner-circle {border-color: ${this.palletColors.checkboxBackground}!important;}
+.mat-mdc-radio-ripple .mat-ripple-element, .mat-mdc-radio-button .mdc-radio__background::before, .mat-mdc-radio-button.mat-mdc-radio-checked .mat-ripple-element {background-color: ${this.palletColors.checkboxBackground} !important;}
+.home-list-cards .list .mat-mdc-list-item-content .mat-mdc-icon {color: ${this.palletColors.fontColor};}
+.home-list-cards .list button .mat-mdc-badge-content {background: ${this.palletColors.fontColor};}
+.koala-dialog .mat-mdc-dialog-title h2 {color: ${this.palletColors.fontColor};}
+.koala-dialog .mat-mdc-dialog-title mat-icon {color: ${this.palletColors.fontColor}!important;}
+.koala-dialog .mat-mdc-dialog-surface {background-color: ${this.palletColors.firstColor}!important;}
 .list-filter mat-icon {color: ${this.palletColors.filterIconColor}!important;}
 koala-page .menu-options {background: ${this.palletColors.menuBackground};}
 koala-page .toolbar {background: ${this.palletColors.toolbarBackground};}
@@ -820,10 +831,10 @@ koala-menu ul li li.active a koala-icon * {fill: ${this.palletColors.menuOptions
 .content {background: ${this.palletColors.listContentBackground};}
 .mat-tab-group .mat-tab-label {color: ${this.palletColors.fontColor};}
 .mat-tab-group .mat-ink-bar {background-color: ${this.palletColors.fontColor}!important;}
-.mat-table {background: ${this.palletColors.listBackground};color: ${this.palletColors.fontColor};}
-.mat-table th {color: ${this.palletColors.listTitleItemColor}!important;}
-.mat-sort-header-arrow {color: ${this.palletColors.listItemColor}!important;}
-.mat-table td {color: ${this.palletColors.listItemColor}!important;}`;
+.mat-mdc-table {background: ${this.palletColors.listBackground};color: ${this.palletColors.fontColor};}
+.mat-mdc-table th {color: ${this.palletColors.listTitleItemColor}!important;}
+.mat-mdc-sort-header-arrow {color: ${this.palletColors.listItemColor}!important;}
+.mat-mdc-table td {color: ${this.palletColors.listItemColor}!important;}`;
         const head = document.head || document.getElementsByTagName('head')[0];
         const style = document.createElement('style');
         head.appendChild(style);
@@ -877,12 +888,12 @@ koala-menu ul li li.active a koala-icon * {fill: ${this.palletColors.menuOptions
         }
     }
 }
-PageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: PageComponent, deps: [{ token: KoalaTokenService }, { token: i2$1.Router }, { token: KoalaLoaderService }, { token: i4$1.KoalaMenuService }, { token: KoalaOAuth2Service }, { token: i6$1.DeviceDetectorService }], target: i0.ɵɵFactoryTarget.Component });
-PageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.11", type: PageComponent, selector: "koala-page", inputs: { showMenu: "showMenu", color: "color", logo: "logo", startMenuOpened: "startMenuOpened", showLoaderPage: "showLoaderPage", messageLoaderPage: "messageLoaderPage", defaultPage: "defaultPage", openPages: "openPages", notifications: "notifications", userMenuOptions: "userMenuOptions", palletColors: "palletColors", language: "language" }, outputs: { validatingScope: "validatingScope", logoutEmitter: "logoutEmitter", deleteAllNotifications: "deleteAllNotifications", deleteNotification: "deleteNotification" }, providers: [KoalaTokenService], viewQueries: [{ propertyName: "menu", first: true, predicate: ["drawer"], descendants: true, static: true }], ngImport: i0, template: "<div *ngIf=\"showLoaderPage | async\" class=\"koala-loader-pg\">\n  <div class=\"loader-content\">\n    <figure>\n      <img [src]=\"logo\" alt=\"Logotipo\"/>\n      <figcaption *ngIf=\"(messageLoaderPage | async) as messageLoader\" [innerHTML]=\"messageLoader\"></figcaption>\n    </figure>\n    <mat-spinner></mat-spinner>\n  </div>\n</div>\n<app-loader-page *ngIf=\"(loaderSubject | async) as loader\" [progress]=\"loader.progress\" [show]=\"loader.show\"\n                 [typeLoader]=\"loader.typeLoader\"></app-loader-page>\n<mat-drawer-container autosize class=\"menu-container\">\n  <mat-drawer #drawer class=\"menu-options\" [mode]=\"isMobile ? 'push' : 'side'\">\n    <img [src]=\"logo\" alt=\"Logotipo\" id=\"logotipo\"/>\n    <ng-content *ngIf=\"showMenu\" select=\"[menu-options]\"></ng-content>\n  </mat-drawer>\n\n  <mat-toolbar *ngIf=\"!!(logged$ | async) && (username$ | async)\" class=\"toolbar\">\n    <img *ngIf=\"!showMenu\" [src]=\"logo\" alt=\"Logotipo Toolbar\" id=\"logotipo-toolbar\"/>\n    <button (click)=\"toogleMenu()\" *ngIf=\"showMenu\" [color]=\"color\" class=\"btn-collapse-menu\" mat-icon-button>\n      <mat-icon>menu</mat-icon>\n    </button>\n    <span class=\"spacer\"></span>\n\t  <div class=\"menu-toolbar\">\n\t\t  <ng-content select=\"[menu-toolbar]\"></ng-content>\n\t  </div>\n    <div *ngIf=\"(notifications | async) as notificationList\">\n      <button *ngIf=\"notifications\" [color]=\"color\" [matMenuTriggerFor]=\"notificationsMenu\" class=\"btn-toolbar\"\n              mat-icon-button>\n        <mat-icon\n\t        [matBadgeHidden]=\"notificationList.length === 0\"\n\t        [matBadge]=\"notificationList.length.toString()\"\n\t        matBadgeColor=\"warn\">notifications\n        </mat-icon>\n      </button>\n      <mat-menu #notificationsMenu=\"matMenu\" class=\"menu-list\" yPosition=\"below\">\n        <koala-notification-list\n          (delete)=\"deleteNotification.emit($event)\"\n          (deleteAll)=\"deleteAllNotifications.emit($event)\"\n          [notifications]=\"notificationList\">\n        </koala-notification-list>\n      </mat-menu>\n    </div>\n    <button [color]=\"color\" [matMenuTriggerFor]=\"userOptions\" class=\"btn-toolbar\" mat-button>\n      <span>{{username$ | async}}</span>\n      <span class=\"icon-user\">{{firstUserLetter$ | async}}</span>\n    </button>\n    <mat-menu #userOptions=\"matMenu\" class=\"user-menu menu-list\" yPosition=\"below\">\n      <div class=\"user-presentation\">\n        <span class=\"icon-user\">{{firstUserLetter$ | async}}</span><br/>\n        <span class=\"username\">{{username$ | async}}</span>\n      </div>\n      <button (click)=\"btn.action()\" *ngFor=\"let btn of userMenuOptions\" mat-menu-item>\n        <mat-icon>{{btn.icon}}</mat-icon>\n        <span>{{btn.name}}</span>\n      </button>\n      <button (click)=\"logout()\" mat-menu-item>\n        <mat-icon>exit_to_app</mat-icon>\n        <span>{{language === 'ptBr' ? 'Sair' : 'Logout'}}</span>\n      </button>\n    </mat-menu>\n  </mat-toolbar>\n\n  <ng-content class=\"page-content\" select=\"[page-content]\"></ng-content>\n\n</mat-drawer-container>\n\n<ng-content class=\"loading-info-content\" select=\"[loading-info-content]\"></ng-content>\n", styles: [".menu-container{height:100vh;width:100vw}.menu-options{border:none;padding:20px 0 0;width:250px}.page-content{align-items:center;display:flex;height:100%;justify-content:center}img#logotipo,img#logotipo-toolbar{display:block;height:auto;margin:0 auto 25px;position:relative;width:120px}.toolbar{box-shadow:none;padding:0 7px 0 13px}.toolbar img#logotipo-toolbar{margin:0;padding:0 10px}.menu-toolbar{margin:0 10px}.spacer{flex:1 1 auto}.btn-toolbar{display:inline-block;margin-right:10px;position:relative}.btn-toolbar span{padding:0 10px 0 0}.btn-toolbar span.icon-user,.user-presentation span.icon-user{border-radius:50%;display:inline-block;height:10px;line-height:10px;padding:5px;width:10px}.user-presentation{min-width:260px;padding:50px 10px;text-align:center}.user-presentation span.icon-user{font-size:30px;height:30px;line-height:30px;margin-bottom:10px;width:30px}.user-presentation span.username{font-family:OpenSansLight,sans-serif;word-break:break-all}@media (max-width: 900px){.btn-toolbar span:first-child{display:none}.btn-toolbar span.icon-user,.user-presentation span.icon-user{height:20px;line-height:20px;width:20px}}\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: i8.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgeColor", "matBadgeOverlap", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i9.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i10.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i13.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i13.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i14.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i14.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i14.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: NotificationComponent, selector: "koala-notification-list", inputs: ["notifications"], outputs: ["deleteAll", "delete"] }, { kind: "component", type: LoaderBarPageComponent, selector: "app-loader-page", inputs: ["show", "progress", "typeLoader"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: PageComponent, decorators: [{
+PageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageComponent, deps: [{ token: KoalaTokenService }, { token: i2$1.Router }, { token: KoalaLoaderService }, { token: i4.KoalaMenuService }, { token: KoalaOAuth2Service }, { token: i6$1.DeviceDetectorService }], target: i0.ɵɵFactoryTarget.Component });
+PageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: PageComponent, selector: "koala-page", inputs: { showMenu: "showMenu", color: "color", logo: "logo", startMenuOpened: "startMenuOpened", showLoaderPage: "showLoaderPage", messageLoaderPage: "messageLoaderPage", defaultPage: "defaultPage", openPages: "openPages", notifications: "notifications", userMenuOptions: "userMenuOptions", palletColors: "palletColors", language: "language" }, outputs: { validatingScope: "validatingScope", logoutEmitter: "logoutEmitter", deleteAllNotifications: "deleteAllNotifications", deleteNotification: "deleteNotification" }, providers: [KoalaTokenService], viewQueries: [{ propertyName: "menu", first: true, predicate: ["drawer"], descendants: true, static: true }], ngImport: i0, template: "<div *ngIf=\"showLoaderPage | async\" class=\"koala-loader-pg\">\n  <div class=\"loader-content\">\n    <figure>\n      <img [src]=\"logo\" alt=\"Logotipo\"/>\n      <figcaption *ngIf=\"(messageLoaderPage | async) as messageLoader\" [innerHTML]=\"messageLoader\"></figcaption>\n    </figure>\n    <mat-spinner></mat-spinner>\n  </div>\n</div>\n<app-loader-page *ngIf=\"(loaderSubject | async) as loader\" [progress]=\"loader.progress\" [show]=\"loader.show\"\n                 [typeLoader]=\"loader.typeLoader\"></app-loader-page>\n<mat-drawer-container autosize class=\"menu-container\">\n  <mat-drawer #drawer class=\"menu-options\" [mode]=\"isMobile ? 'push' : 'side'\">\n    <img [src]=\"logo\" alt=\"Logotipo\" id=\"logotipo\"/>\n    <ng-content *ngIf=\"showMenu\" select=\"[menu-options]\"></ng-content>\n  </mat-drawer>\n\n  <mat-toolbar *ngIf=\"!!(logged$ | async) && (username$ | async)\" class=\"toolbar\">\n    <img *ngIf=\"!showMenu\" [src]=\"logo\" alt=\"Logotipo Toolbar\" id=\"logotipo-toolbar\"/>\n    <button (click)=\"toogleMenu()\" *ngIf=\"showMenu\" [color]=\"color\" class=\"btn-collapse-menu\" mat-icon-button>\n      <mat-icon>menu</mat-icon>\n    </button>\n    <span class=\"spacer\"></span>\n\t  <div class=\"menu-toolbar\">\n\t\t  <ng-content select=\"[menu-toolbar]\"></ng-content>\n\t  </div>\n    <div *ngIf=\"(notifications | async) as notificationList\">\n      <button *ngIf=\"notifications\" [color]=\"color\" [matMenuTriggerFor]=\"notificationsMenu\" class=\"btn-toolbar\"\n              mat-icon-button>\n        <mat-icon\n\t        [matBadgeHidden]=\"notificationList.length === 0\"\n\t        [matBadge]=\"notificationList.length.toString()\"\n\t        matBadgeColor=\"warn\">notifications\n        </mat-icon>\n      </button>\n      <mat-menu #notificationsMenu=\"matMenu\" class=\"menu-list\" yPosition=\"below\">\n        <koala-notification-list\n          (delete)=\"deleteNotification.emit($event)\"\n          (deleteAll)=\"deleteAllNotifications.emit($event)\"\n          [notifications]=\"notificationList\">\n        </koala-notification-list>\n      </mat-menu>\n    </div>\n    <button [color]=\"color\" [matMenuTriggerFor]=\"userOptions\" class=\"btn-toolbar\" mat-button>\n      <span>{{username$ | async}}</span>\n      <span class=\"icon-user\">{{firstUserLetter$ | async}}</span>\n    </button>\n    <mat-menu #userOptions=\"matMenu\" class=\"user-menu menu-list\" yPosition=\"below\">\n      <div class=\"user-presentation\">\n        <span class=\"icon-user\">{{firstUserLetter$ | async}}</span><br/>\n        <span class=\"username\">{{username$ | async}}</span>\n      </div>\n      <button (click)=\"btn.action()\" *ngFor=\"let btn of userMenuOptions\" mat-menu-item>\n        <mat-icon>{{btn.icon}}</mat-icon>\n        <span>{{btn.name}}</span>\n      </button>\n      <button (click)=\"logout()\" mat-menu-item>\n        <mat-icon>exit_to_app</mat-icon>\n        <span>{{language === 'ptBr' ? 'Sair' : 'Logout'}}</span>\n      </button>\n    </mat-menu>\n  </mat-toolbar>\n\n  <ng-content class=\"page-content\" select=\"[page-content]\"></ng-content>\n\n</mat-drawer-container>\n\n<ng-content class=\"loading-info-content\" select=\"[loading-info-content]\"></ng-content>\n", styles: [".menu-container{height:100vh;width:100vw}.menu-options{border:none;padding:20px 0 0;width:250px}.page-content{align-items:center;display:flex;height:100%;justify-content:center}img#logotipo,img#logotipo-toolbar{display:block;height:auto;margin:0 auto 25px;position:relative;width:120px}.toolbar{box-shadow:none;padding:0 7px 0 13px}.toolbar img#logotipo-toolbar{margin:0;padding:0 10px}.menu-toolbar{margin:0 10px}.spacer{flex:1 1 auto}.btn-toolbar{display:inline-block;margin-right:10px;position:relative}.btn-toolbar span{padding:0 10px 0 0}.btn-toolbar span.icon-user,.user-presentation span.icon-user{border-radius:50%;display:inline-block;height:10px;line-height:10px;padding:5px;width:10px}.user-presentation{min-width:260px;padding:50px 10px;text-align:center}.user-presentation span.icon-user{font-size:30px;height:30px;line-height:30px;margin-bottom:10px;width:30px}.user-presentation span.username{font-family:OpenSansLight,sans-serif;word-break:break-all}@media (max-width: 900px){.btn-toolbar span:first-child{display:none}.btn-toolbar span.icon-user,.user-presentation span.icon-user{height:20px;line-height:20px;width:20px}}\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: i8.MatBadge, selector: "[matBadge]", inputs: ["matBadgeDisabled", "matBadgeColor", "matBadgeOverlap", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: i9.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "component", type: i10.MatToolbar, selector: "mat-toolbar", inputs: ["color"], exportAs: ["matToolbar"] }, { kind: "component", type: i11.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i11.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i13.MatDrawer, selector: "mat-drawer", inputs: ["position", "mode", "disableClose", "autoFocus", "opened"], outputs: ["openedChange", "opened", "openedStart", "closed", "closedStart", "positionChanged"], exportAs: ["matDrawer"] }, { kind: "component", type: i13.MatDrawerContainer, selector: "mat-drawer-container", inputs: ["autosize", "hasBackdrop"], outputs: ["backdropClick"], exportAs: ["matDrawerContainer"] }, { kind: "component", type: i14.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i14.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i14.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: NotificationComponent, selector: "koala-notification-list", inputs: ["notifications"], outputs: ["deleteAll", "delete"] }, { kind: "component", type: LoaderBarPageComponent, selector: "app-loader-page", inputs: ["show", "progress", "typeLoader"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: PageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'koala-page', providers: [KoalaTokenService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div *ngIf=\"showLoaderPage | async\" class=\"koala-loader-pg\">\n  <div class=\"loader-content\">\n    <figure>\n      <img [src]=\"logo\" alt=\"Logotipo\"/>\n      <figcaption *ngIf=\"(messageLoaderPage | async) as messageLoader\" [innerHTML]=\"messageLoader\"></figcaption>\n    </figure>\n    <mat-spinner></mat-spinner>\n  </div>\n</div>\n<app-loader-page *ngIf=\"(loaderSubject | async) as loader\" [progress]=\"loader.progress\" [show]=\"loader.show\"\n                 [typeLoader]=\"loader.typeLoader\"></app-loader-page>\n<mat-drawer-container autosize class=\"menu-container\">\n  <mat-drawer #drawer class=\"menu-options\" [mode]=\"isMobile ? 'push' : 'side'\">\n    <img [src]=\"logo\" alt=\"Logotipo\" id=\"logotipo\"/>\n    <ng-content *ngIf=\"showMenu\" select=\"[menu-options]\"></ng-content>\n  </mat-drawer>\n\n  <mat-toolbar *ngIf=\"!!(logged$ | async) && (username$ | async)\" class=\"toolbar\">\n    <img *ngIf=\"!showMenu\" [src]=\"logo\" alt=\"Logotipo Toolbar\" id=\"logotipo-toolbar\"/>\n    <button (click)=\"toogleMenu()\" *ngIf=\"showMenu\" [color]=\"color\" class=\"btn-collapse-menu\" mat-icon-button>\n      <mat-icon>menu</mat-icon>\n    </button>\n    <span class=\"spacer\"></span>\n\t  <div class=\"menu-toolbar\">\n\t\t  <ng-content select=\"[menu-toolbar]\"></ng-content>\n\t  </div>\n    <div *ngIf=\"(notifications | async) as notificationList\">\n      <button *ngIf=\"notifications\" [color]=\"color\" [matMenuTriggerFor]=\"notificationsMenu\" class=\"btn-toolbar\"\n              mat-icon-button>\n        <mat-icon\n\t        [matBadgeHidden]=\"notificationList.length === 0\"\n\t        [matBadge]=\"notificationList.length.toString()\"\n\t        matBadgeColor=\"warn\">notifications\n        </mat-icon>\n      </button>\n      <mat-menu #notificationsMenu=\"matMenu\" class=\"menu-list\" yPosition=\"below\">\n        <koala-notification-list\n          (delete)=\"deleteNotification.emit($event)\"\n          (deleteAll)=\"deleteAllNotifications.emit($event)\"\n          [notifications]=\"notificationList\">\n        </koala-notification-list>\n      </mat-menu>\n    </div>\n    <button [color]=\"color\" [matMenuTriggerFor]=\"userOptions\" class=\"btn-toolbar\" mat-button>\n      <span>{{username$ | async}}</span>\n      <span class=\"icon-user\">{{firstUserLetter$ | async}}</span>\n    </button>\n    <mat-menu #userOptions=\"matMenu\" class=\"user-menu menu-list\" yPosition=\"below\">\n      <div class=\"user-presentation\">\n        <span class=\"icon-user\">{{firstUserLetter$ | async}}</span><br/>\n        <span class=\"username\">{{username$ | async}}</span>\n      </div>\n      <button (click)=\"btn.action()\" *ngFor=\"let btn of userMenuOptions\" mat-menu-item>\n        <mat-icon>{{btn.icon}}</mat-icon>\n        <span>{{btn.name}}</span>\n      </button>\n      <button (click)=\"logout()\" mat-menu-item>\n        <mat-icon>exit_to_app</mat-icon>\n        <span>{{language === 'ptBr' ? 'Sair' : 'Logout'}}</span>\n      </button>\n    </mat-menu>\n  </mat-toolbar>\n\n  <ng-content class=\"page-content\" select=\"[page-content]\"></ng-content>\n\n</mat-drawer-container>\n\n<ng-content class=\"loading-info-content\" select=\"[loading-info-content]\"></ng-content>\n", styles: [".menu-container{height:100vh;width:100vw}.menu-options{border:none;padding:20px 0 0;width:250px}.page-content{align-items:center;display:flex;height:100%;justify-content:center}img#logotipo,img#logotipo-toolbar{display:block;height:auto;margin:0 auto 25px;position:relative;width:120px}.toolbar{box-shadow:none;padding:0 7px 0 13px}.toolbar img#logotipo-toolbar{margin:0;padding:0 10px}.menu-toolbar{margin:0 10px}.spacer{flex:1 1 auto}.btn-toolbar{display:inline-block;margin-right:10px;position:relative}.btn-toolbar span{padding:0 10px 0 0}.btn-toolbar span.icon-user,.user-presentation span.icon-user{border-radius:50%;display:inline-block;height:10px;line-height:10px;padding:5px;width:10px}.user-presentation{min-width:260px;padding:50px 10px;text-align:center}.user-presentation span.icon-user{font-size:30px;height:30px;line-height:30px;margin-bottom:10px;width:30px}.user-presentation span.username{font-family:OpenSansLight,sans-serif;word-break:break-all}@media (max-width: 900px){.btn-toolbar span:first-child{display:none}.btn-toolbar span.icon-user,.user-presentation span.icon-user{height:20px;line-height:20px;width:20px}}\n"] }]
-        }], ctorParameters: function () { return [{ type: KoalaTokenService }, { type: i2$1.Router }, { type: KoalaLoaderService }, { type: i4$1.KoalaMenuService }, { type: KoalaOAuth2Service }, { type: i6$1.DeviceDetectorService }]; }, propDecorators: { showMenu: [{
+        }], ctorParameters: function () { return [{ type: KoalaTokenService }, { type: i2$1.Router }, { type: KoalaLoaderService }, { type: i4.KoalaMenuService }, { type: KoalaOAuth2Service }, { type: i6$1.DeviceDetectorService }]; }, propDecorators: { showMenu: [{
                 type: Input
             }], color: [{
                 type: Input
@@ -921,8 +932,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImpo
 
 class KoalaPageModule {
 }
-KoalaPageModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaPageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-KoalaPageModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.11", ngImport: i0, type: KoalaPageModule, declarations: [PageComponent,
+KoalaPageModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaPageModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+KoalaPageModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: KoalaPageModule, declarations: [PageComponent,
         NotificationComponent,
         LoaderBarPageComponent], imports: [CommonModule,
         RouterModule,
@@ -937,7 +948,7 @@ KoalaPageModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version
         MatListModule,
         MatMenuModule], exports: [PageComponent,
         RouterModule] });
-KoalaPageModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaPageModule, imports: [CommonModule,
+KoalaPageModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaPageModule, imports: [CommonModule,
         RouterModule,
         MatBadgeModule,
         MatProgressSpinnerModule,
@@ -949,7 +960,7 @@ KoalaPageModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version
         MatSidenavModule,
         MatListModule,
         MatMenuModule, RouterModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaPageModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaPageModule, decorators: [{
             type: NgModule,
             args: [{
                     declarations: [
@@ -986,9 +997,9 @@ class KoalaParameterHashLocationStrategy extends HashLocationStrategy {
             super.prepareExternalUrl(internal);
     }
 }
-KoalaParameterHashLocationStrategy.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaParameterHashLocationStrategy, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-KoalaParameterHashLocationStrategy.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaParameterHashLocationStrategy });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaParameterHashLocationStrategy, decorators: [{
+KoalaParameterHashLocationStrategy.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaParameterHashLocationStrategy, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+KoalaParameterHashLocationStrategy.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaParameterHashLocationStrategy });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaParameterHashLocationStrategy, decorators: [{
             type: Injectable
         }] });
 
@@ -1234,11 +1245,11 @@ class KoalaApiRequesterService {
         }
     }
 }
-KoalaApiRequesterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaApiRequesterService, deps: [{ token: i1$1.HttpClient }, { token: KoalaOAuth2Service }], target: i0.ɵɵFactoryTarget.Injectable });
-KoalaApiRequesterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaApiRequesterService, providedIn: "root" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaApiRequesterService, decorators: [{
+KoalaApiRequesterService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaApiRequesterService, deps: [{ token: i1$1.HttpClient }, { token: KoalaOAuth2Service }], target: i0.ɵɵFactoryTarget.Injectable });
+KoalaApiRequesterService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaApiRequesterService, providedIn: "any" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaApiRequesterService, decorators: [{
             type: Injectable,
-            args: [{ providedIn: "root" }]
+            args: [{ providedIn: "any" }]
         }], ctorParameters: function () { return [{ type: i1$1.HttpClient }, { type: KoalaOAuth2Service }]; } });
 
 class KoalaApiRequesterCache {
@@ -1400,9 +1411,9 @@ class KoalaRequestService {
         });
     }
 }
-KoalaRequestService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaRequestService, deps: [{ token: i1$2.KoalaAlertService }], target: i0.ɵɵFactoryTarget.Injectable });
-KoalaRequestService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaRequestService, providedIn: "any" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: KoalaRequestService, decorators: [{
+KoalaRequestService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaRequestService, deps: [{ token: i1$2.KoalaAlertService }], target: i0.ɵɵFactoryTarget.Injectable });
+KoalaRequestService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaRequestService, providedIn: "any" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: KoalaRequestService, decorators: [{
             type: Injectable,
             args: [{ providedIn: "any" }]
         }], ctorParameters: function () { return [{ type: i1$2.KoalaAlertService }]; } });
@@ -1418,18 +1429,18 @@ class NgxKoalaModule {
         };
     }
 }
-NgxKoalaModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: NgxKoalaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-NgxKoalaModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.11", ngImport: i0, type: NgxKoalaModule, imports: [CommonModule,
+NgxKoalaModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NgxKoalaModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+NgxKoalaModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.4", ngImport: i0, type: NgxKoalaModule, imports: [CommonModule,
         HttpClientModule,
         KoalaPageModule], exports: [HttpClientModule,
         KoalaPageModule] });
-NgxKoalaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: NgxKoalaModule, providers: [
+NgxKoalaModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NgxKoalaModule, providers: [
         KoalaOAuth2Service
     ], imports: [CommonModule,
         HttpClientModule,
         KoalaPageModule, HttpClientModule,
         KoalaPageModule] });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.11", ngImport: i0, type: NgxKoalaModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: NgxKoalaModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [