@yuuvis/client-shell 3.14.1 → 3.16.0

package/fesm2022/{yuuvis-client-shell-dashboard.component-C0X3JNTk.mjs → yuuvis-client-shell-dashboard.component-CZsvboQJ.mjs}

@@ -2,13 +2,13 @@ import * as i0 from '@angular/core';
 import { Component } from '@angular/core';
 
 class DashboardPageComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: DashboardPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: DashboardPageComponent, isStandalone: true, selector: "yuv-dashboard", ngImport: i0, template: "yuuvis Momentum\n", styles: [":host{display:grid;align-items:center;justify-content:center;height:100%;overflow:hidden}\n"] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: DashboardPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: DashboardPageComponent, isStandalone: true, selector: "yuv-dashboard", ngImport: i0, template: "yuuvis Momentum\n", styles: [":host{display:grid;align-items:center;justify-content:center;height:100%;overflow:hidden}\n"] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: DashboardPageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: DashboardPageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-dashboard', template: "yuuvis Momentum\n", styles: [":host{display:grid;align-items:center;justify-content:center;height:100%;overflow:hidden}\n"] }]
         }] });
 
 export { DashboardPageComponent };
-//# sourceMappingURL=yuuvis-client-shell-dashboard.component-C0X3JNTk.mjs.map
+//# sourceMappingURL=yuuvis-client-shell-dashboard.component-CZsvboQJ.mjs.map

package/fesm2022/{yuuvis-client-shell-dashboard.component-C0X3JNTk.mjs.map → yuuvis-client-shell-dashboard.component-CZsvboQJ.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"yuuvis-client-shell-dashboard.component-C0X3JNTk.mjs","sources":["../../../../../libs/yuuvis/client-shell/src/lib/pages/dashboard/dashboard.component.ts","../../../../../libs/yuuvis/client-shell/src/lib/pages/dashboard/dashboard.component.html"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n  selector: 'yuv-dashboard',\n  templateUrl: './dashboard.component.html',\n  styleUrls: ['./dashboard.component.scss']\n})\nexport class DashboardPageComponent {}\n","yuuvis Momentum\n"],"names":[],"mappings":";;;MAOa,sBAAsB,CAAA;+GAAtB,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,sBAAsB,yECPnC,mBACA,EAAA,MAAA,EAAA,CAAA,6FAAA,CAAA,EAAA,CAAA,CAAA;;4FDMa,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBALlC,SAAS;+BACE,eAAe,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,6FAAA,CAAA,EAAA;;;;;"}
+{"version":3,"file":"yuuvis-client-shell-dashboard.component-CZsvboQJ.mjs","sources":["../../../../../libs/yuuvis/client-shell/src/lib/pages/dashboard/dashboard.component.ts","../../../../../libs/yuuvis/client-shell/src/lib/pages/dashboard/dashboard.component.html"],"sourcesContent":["import { Component } from '@angular/core';\n\n@Component({\n  selector: 'yuv-dashboard',\n  templateUrl: './dashboard.component.html',\n  styleUrls: ['./dashboard.component.scss']\n})\nexport class DashboardPageComponent {}\n","yuuvis Momentum\n"],"names":[],"mappings":";;;MAOa,sBAAsB,CAAA;+GAAtB,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAtB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,sBAAsB,yECPnC,mBACA,EAAA,MAAA,EAAA,CAAA,6FAAA,CAAA,EAAA,CAAA,CAAA;;4FDMa,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBALlC,SAAS;+BACE,eAAe,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,6FAAA,CAAA,EAAA;;;;;"}

package/fesm2022/{yuuvis-client-shell-settings.component-DBAxwdjk.mjs → yuuvis-client-shell-settings.component-CF1lK9mL.mjs}

@@ -103,10 +103,10 @@ class SettingsPageComponent {
             error: (error) => console.log({ error })
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: SettingsPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: SettingsPageComponent, isStandalone: true, selector: "yuv-settings", ngImport: i0, template: "<header>\n  <h1>{{ 'yuv.shell.settings.title' | translate }}</h1>\n  <span class=\"subhead\">{{ 'yuv.shell.settings.client.version' | translate }}: {{ clientVersion() }}</span>\n</header>\n\n<main>\n  <div class=\"content-container\">\n    <!-- User Info -->\n    @let user = this.user();\n    @if (user) {\n      <section class=\"section user\">\n        <h2 class=\"section__title\">{{ user.title }}</h2>\n        <div class=\"section__body user__data grid\">\n          <div class=\"user__data-entry grid-row\">\n            <span class=\"user__data-entry-key grid-col grid-col-key\">\n              {{ 'yuv.shell.settings.user.email' | translate }}:\n            </span>\n            <span class=\"user__data-entry-value grid-col grid-col-value\">\n              {{ user.email }}\n            </span>\n          </div>\n          <div class=\"user__data-entry grid-row\">\n            <span class=\"user__data-entry-key grid-col grid-col-key\">\n              {{ 'yuv.shell.settings.tenant' | translate }}:\n            </span>\n            <span class=\"user__data-entry-value grid-col grid-col-value\">\n              {{ user.tenant }}\n            </span>\n          </div>\n\n          <!--<div class=\"user__data\">{{ 'yuv.shell.settings.user.name' | translate }}: {{ user.username }}</div>\n          <div class=\"user__data-entry\">{{ 'yuv.shell.settings.user.email' | translate }}: {{ user.email }}</div>\n          <div class=\"user__data-entry\">{{ 'yuv.shell.settings.tenant' | translate }}: {{ user.tenant }}</div>-->\n        </div>\n      </section>\n    }\n    <!-- Language Settings -->\n    <section yuvOfflineDisabled class=\"section\">\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.language' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"language\"\n          [value]=\"translate.currentLang\"\n          (valueChange)=\"changeClientLocale($event)\"\n          [attr.aria-label]=\"'yuv.shell.settings.language' | translate\"\n        >\n          @for (locale of clientLocales(); track locale.iso) {\n            <mat-button-toggle [value]=\"locale.iso\">{{ locale.label }}</mat-button-toggle>\n          }\n        </mat-button-toggle-group>\n      </div>\n    </section>\n\n    <!-- Mode -->\n    @let currentThemeMode = currentMode();\n    <section class=\"section\">\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.mode' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"mode\"\n          [value]=\"currentThemeMode\"\n          (change)=\"changeMode($event)\"\n          [disabled]=\"disableMode()\"\n          [attr.aria-label]=\"'yuv.shell.settings.mode' | translate\"\n        >\n          <mat-button-toggle value=\"light\">{{ 'yuv.shell.settings.mode.light' | translate }}</mat-button-toggle>\n          <mat-button-toggle value=\"dark\">{{ 'yuv.shell.settings.mode.dark' | translate }}</mat-button-toggle>\n          <mat-button-toggle value=\"system\">{{ 'yuv.shell.settings.mode.system' | translate }}</mat-button-toggle>\n        </mat-button-toggle-group>\n      </div>\n\n      <p></p>\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.custom.theme' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"custom-theme\"\n          [value]=\"currentTheme()\"\n          (change)=\"changeCustomTheme($event)\"\n          [attr.aria-label]=\"'yuv.shell.settings.custom.theme' | translate\"\n        >\n          <mat-button-toggle [value]=\"DEFAULT_THEME.key\" [matTooltip]=\"DEFAULT_THEME.description | translate\">\n            {{ DEFAULT_THEME.label | translate }}\n          </mat-button-toggle>\n          @for (theme of customThemes(); track theme.key) {\n            <mat-button-toggle [value]=\"theme.key\">{{ theme.label | translate }}</mat-button-toggle>\n          }\n        </mat-button-toggle-group>\n      </div>\n    </section>\n\n    <!-- app settings -->\n    @for (c of appSettings(); track $index) {\n      <section class=\"section\">\n        <h2 class=\"section__title\">{{ c._label }}</h2>\n        <div class=\"section__body\">\n          <ng-container *ngComponentOutlet=\"c.component\" />\n        </div>\n      </section>\n    }\n\n    <!-- About Info -->\n    @let libraries = this.clientAboutData()?.libraries;\n    @if (libraries) {\n      <section class=\"section about\">\n        <h2 class=\"section__title\">{{ 'yuv.shell.settings.about.title' | translate }}</h2>\n        <mat-expansion-panel class=\"about__panel\">\n          <mat-expansion-panel-header>\n            <mat-panel-title>{{ 'yuv.shell.settings.dependency-info.title' | translate }}</mat-panel-title>\n            <!--            <mat-panel-description>{{ '' | translate }}</mat-panel-description>-->\n          </mat-expansion-panel-header>\n\n          <ng-template matExpansionPanelContent>\n            <div class=\"about__panel-content\">\n              <table mat-table [dataSource]=\"libraries\">\n                <!-- Name Column -->\n                <ng-container matColumnDef=\"name\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.package' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">{{ element.name }}</td>\n                </ng-container>\n\n                <!-- Version Column -->\n                <ng-container matColumnDef=\"version\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.version' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">{{ element.version }}</td>\n                </ng-container>\n\n                <!-- License Column -->\n                <ng-container matColumnDef=\"license\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.license' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">\n                    @if (element.link) {\n                      <a href=\"{{ element.link }}\" target=\"_blank\">{{ element.license }}</a>\n                    } @else {\n                      {{ element.license }}\n                    }\n                  </td>\n                </ng-container>\n\n                <tr mat-header-row *matHeaderRowDef=\"['name', 'version', 'license']\"></tr>\n                <tr mat-row *matRowDef=\"let row; columns: ['name', 'version', 'license']\"></tr>\n              </table>\n            </div>\n          </ng-template>\n        </mat-expansion-panel>\n      </section>\n    }\n  </div>\n</main>\n", styles: [":host{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr;grid-template-areas:\"header\" \"settings\";height:100%;overflow:hidden;overflow-y:auto}:host header{grid-area:header;padding:var(--ymt-spacing-3xl)}:host header h1{margin:0}:host header .subhead{font:var(--ymt-font-subhead);color:var(--ymt-text-color-subtle)}:host main{grid-area:settings;padding:var(--ymt-spacing-m);padding-right:0;overflow-y:auto;scrollbar-gutter:stable}:host main .content-container{max-width:900px}:host main section{display:flex;flex-flow:column;padding:var(--ymt-spacing-m);margin-bottom:var(--ymt-spacing-l)}:host main .about__panel-content{overflow-x:auto}:host main .about__panel-content table{background-color:transparent}:host main .grid-row{display:grid;grid-template-columns:minmax(10ch,1fr) 11fr;grid-gap:var(--ymt-spacing-s);grid-template-areas:\"key value\";align-items:baseline}:host main .grid-col-key{font-weight:700;grid-area:key}:host main .grid-col-value{grid-area:value;word-break:break-all}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i2.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: SettingsPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: SettingsPageComponent, isStandalone: true, selector: "yuv-settings", ngImport: i0, template: "<header>\n  <h1>{{ 'yuv.shell.settings.title' | translate }}</h1>\n  <span class=\"subhead\">{{ 'yuv.shell.settings.client.version' | translate }}: {{ clientVersion() }}</span>\n</header>\n\n<main>\n  <div class=\"content-container\">\n    <!-- User Info -->\n    @let user = this.user();\n    @if (user) {\n      <section class=\"section user\">\n        <h2 class=\"section__title\">{{ user.title }}</h2>\n        <div class=\"section__body user__data grid\">\n          <div class=\"user__data-entry grid-row\">\n            <span class=\"user__data-entry-key grid-col grid-col-key\">\n              {{ 'yuv.shell.settings.user.email' | translate }}:\n            </span>\n            <span class=\"user__data-entry-value grid-col grid-col-value\">\n              {{ user.email }}\n            </span>\n          </div>\n          <div class=\"user__data-entry grid-row\">\n            <span class=\"user__data-entry-key grid-col grid-col-key\">\n              {{ 'yuv.shell.settings.tenant' | translate }}:\n            </span>\n            <span class=\"user__data-entry-value grid-col grid-col-value\">\n              {{ user.tenant }}\n            </span>\n          </div>\n\n          <!--<div class=\"user__data\">{{ 'yuv.shell.settings.user.name' | translate }}: {{ user.username }}</div>\n          <div class=\"user__data-entry\">{{ 'yuv.shell.settings.user.email' | translate }}: {{ user.email }}</div>\n          <div class=\"user__data-entry\">{{ 'yuv.shell.settings.tenant' | translate }}: {{ user.tenant }}</div>-->\n        </div>\n      </section>\n    }\n    <!-- Language Settings -->\n    <section yuvOfflineDisabled class=\"section\">\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.language' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"language\"\n          [value]=\"translate.currentLang\"\n          (valueChange)=\"changeClientLocale($event)\"\n          [attr.aria-label]=\"'yuv.shell.settings.language' | translate\"\n        >\n          @for (locale of clientLocales(); track locale.iso) {\n            <mat-button-toggle [value]=\"locale.iso\">{{ locale.label }}</mat-button-toggle>\n          }\n        </mat-button-toggle-group>\n      </div>\n    </section>\n\n    <!-- Mode -->\n    @let currentThemeMode = currentMode();\n    <section class=\"section\">\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.mode' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"mode\"\n          [value]=\"currentThemeMode\"\n          (change)=\"changeMode($event)\"\n          [disabled]=\"disableMode()\"\n          [attr.aria-label]=\"'yuv.shell.settings.mode' | translate\"\n        >\n          <mat-button-toggle value=\"light\">{{ 'yuv.shell.settings.mode.light' | translate }}</mat-button-toggle>\n          <mat-button-toggle value=\"dark\">{{ 'yuv.shell.settings.mode.dark' | translate }}</mat-button-toggle>\n          <mat-button-toggle value=\"system\">{{ 'yuv.shell.settings.mode.system' | translate }}</mat-button-toggle>\n        </mat-button-toggle-group>\n      </div>\n\n      <p></p>\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.custom.theme' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"custom-theme\"\n          [value]=\"currentTheme()\"\n          (change)=\"changeCustomTheme($event)\"\n          [attr.aria-label]=\"'yuv.shell.settings.custom.theme' | translate\"\n        >\n          <mat-button-toggle [value]=\"DEFAULT_THEME.key\" [matTooltip]=\"DEFAULT_THEME.description | translate\">\n            {{ DEFAULT_THEME.label | translate }}\n          </mat-button-toggle>\n          @for (theme of customThemes(); track theme.key) {\n            <mat-button-toggle [value]=\"theme.key\">{{ theme.label | translate }}</mat-button-toggle>\n          }\n        </mat-button-toggle-group>\n      </div>\n    </section>\n\n    <!-- app settings -->\n    @for (c of appSettings(); track $index) {\n      <section class=\"section\">\n        <h2 class=\"section__title\">{{ c._label }}</h2>\n        <div class=\"section__body\">\n          <ng-container *ngComponentOutlet=\"c.component\" />\n        </div>\n      </section>\n    }\n\n    <!-- About Info -->\n    @let libraries = this.clientAboutData()?.libraries;\n    @if (libraries) {\n      <section class=\"section about\">\n        <h2 class=\"section__title\">{{ 'yuv.shell.settings.about.title' | translate }}</h2>\n        <mat-expansion-panel class=\"about__panel\">\n          <mat-expansion-panel-header>\n            <mat-panel-title>{{ 'yuv.shell.settings.dependency-info.title' | translate }}</mat-panel-title>\n            <!--            <mat-panel-description>{{ '' | translate }}</mat-panel-description>-->\n          </mat-expansion-panel-header>\n\n          <ng-template matExpansionPanelContent>\n            <div class=\"about__panel-content\">\n              <table mat-table [dataSource]=\"libraries\">\n                <!-- Name Column -->\n                <ng-container matColumnDef=\"name\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.package' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">{{ element.name }}</td>\n                </ng-container>\n\n                <!-- Version Column -->\n                <ng-container matColumnDef=\"version\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.version' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">{{ element.version }}</td>\n                </ng-container>\n\n                <!-- License Column -->\n                <ng-container matColumnDef=\"license\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.license' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">\n                    @if (element.link) {\n                      <a href=\"{{ element.link }}\" target=\"_blank\">{{ element.license }}</a>\n                    } @else {\n                      {{ element.license }}\n                    }\n                  </td>\n                </ng-container>\n\n                <tr mat-header-row *matHeaderRowDef=\"['name', 'version', 'license']\"></tr>\n                <tr mat-row *matRowDef=\"let row; columns: ['name', 'version', 'license']\"></tr>\n              </table>\n            </div>\n          </ng-template>\n        </mat-expansion-panel>\n      </section>\n    }\n  </div>\n</main>\n", styles: [":host{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto 1fr;grid-template-areas:\"header\" \"settings\";height:100%;overflow:hidden;overflow-y:auto}:host header{grid-area:header;padding:var(--ymt-spacing-3xl)}:host header h1{margin:0}:host header .subhead{font:var(--ymt-font-subhead);color:var(--ymt-text-color-subtle)}:host main{grid-area:settings;padding:var(--ymt-spacing-m);padding-right:0;overflow-y:auto;scrollbar-gutter:stable}:host main .content-container{max-width:900px}:host main section{display:flex;flex-flow:column;padding:var(--ymt-spacing-m);margin-bottom:var(--ymt-spacing-l)}:host main .about__panel-content{overflow-x:auto}:host main .about__panel-content table{background-color:transparent}:host main .grid-row{display:grid;grid-template-columns:minmax(10ch,1fr) 11fr;grid-gap:var(--ymt-spacing-s);grid-template-areas:\"key value\";align-items:baseline}:host main .grid-col-key{font-weight:700;grid-area:key}:host main .grid-col-value{grid-area:value;word-break:break-all}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: MatButtonToggleGroup, selector: "mat-button-toggle-group", inputs: ["appearance", "name", "vertical", "value", "multiple", "disabled", "disabledInteractive", "hideSingleSelectionIndicator", "hideMultipleSelectionIndicator"], outputs: ["valueChange", "change"], exportAs: ["matButtonToggleGroup"] }, { kind: "component", type: MatButtonToggle, selector: "mat-button-toggle", inputs: ["aria-label", "aria-labelledby", "id", "name", "value", "tabIndex", "disableRipple", "appearance", "checked", "disabled", "disabledInteractive"], outputs: ["change"], exportAs: ["matButtonToggle"] }, { kind: "ngmodule", type: MatExpansionModule }, { kind: "component", type: i2.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i2.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i2.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "directive", type: i2.MatExpansionPanelContent, selector: "ng-template[matExpansionPanelContent]" }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: SettingsPageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: SettingsPageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-settings', standalone: true, imports: [
                         CommonModule,
@@ -122,4 +122,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
         }], ctorParameters: () => [] });
 
 export { SettingsPageComponent };
-//# sourceMappingURL=yuuvis-client-shell-settings.component-DBAxwdjk.mjs.map
+//# sourceMappingURL=yuuvis-client-shell-settings.component-CF1lK9mL.mjs.map

package/fesm2022/{yuuvis-client-shell-settings.component-DBAxwdjk.mjs.map → yuuvis-client-shell-settings.component-CF1lK9mL.mjs.map}

@@ -1 +1 @@
-{"version":3,"file":"yuuvis-client-shell-settings.component-DBAxwdjk.mjs","sources":["../../../../../libs/yuuvis/client-shell/src/lib/pages/settings/settings.component.ts","../../../../../libs/yuuvis/client-shell/src/lib/pages/settings/settings.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { HttpClient } from '@angular/common/http';\nimport { Component, computed, DOCUMENT, effect, inject, OnInit, Signal, signal } from '@angular/core';\nimport { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { MatButtonToggle, MatButtonToggleChange, MatButtonToggleGroup } from '@angular/material/button-toggle';\nimport { MatExpansionModule } from '@angular/material/expansion';\nimport { MatSelectModule } from '@angular/material/select';\nimport { MatTableModule } from '@angular/material/table';\nimport { MatTooltip } from '@angular/material/tooltip';\nimport {\n  ConfigService,\n  TranslatePipe,\n  TranslateService,\n  UserService,\n  YuvConfigLanguages,\n  YuvUser\n} from '@yuuvis/client-core';\nimport {\n  DEFAULT_THEME,\n  DEFAULT_THEME_KEY,\n  HIGH_CONTRAST_THEME_KEY,\n  ThemeService\n} from '@yuuvis/client-framework/common';\nimport { ShellAppSettings, ShellService } from '@yuuvis/client-shell-core';\nimport { map } from 'rxjs';\nimport { AboutData } from './settings.model';\n\n@Component({\n  selector: 'yuv-settings',\n  standalone: true,\n  imports: [\n    CommonModule,\n    TranslatePipe,\n    MatTooltip,\n    MatSelectModule,\n    ReactiveFormsModule,\n    MatButtonToggleGroup,\n    MatButtonToggle,\n    MatExpansionModule,\n    MatTableModule\n  ],\n  templateUrl: './settings.component.html',\n  styleUrls: ['./settings.component.scss']\n})\nexport class SettingsPageComponent implements OnInit {\n  private userService = inject(UserService);\n  private config = inject(ConfigService);\n  public translate = inject(TranslateService);\n  private shell = inject(ShellService);\n  readonly document = inject(DOCUMENT);\n  readonly #themeService = inject(ThemeService);\n  readonly #http = inject(HttpClient);\n\n  protected readonly DEFAULT_THEME_KEY = DEFAULT_THEME_KEY;\n  protected readonly HIGH_CONTRAST_THEME_KEY = HIGH_CONTRAST_THEME_KEY;\n  protected readonly DEFAULT_THEME = DEFAULT_THEME;\n  disableMode = this.#themeService.disableMode;\n  customThemes = this.#themeService.customThemes;\n  currentTheme = computed(() => {\n    const ct = this.#themeService.customTheme();\n    return ct ? ct.key : undefined;\n  });\n\n  clientLocales = signal<YuvConfigLanguages[]>([]);\n  clientVersion = signal<string | undefined>(undefined);\n  clientAboutData = signal<AboutData | undefined>(undefined);\n  currentMode = this.#themeService.mode;\n\n  user: Signal<YuvUser | undefined> = toSignal(this.userService.user$);\n  appSettings = signal<(ShellAppSettings & { _label: string })[]>([]);\n  #appSettings = this.shell.appSettings;\n  #appSettingsEffect = effect(() => {\n    const as = this.#appSettings();\n    this.#mapAppSettings(as);\n  });\n\n  constructor() {\n    this.translate.onLangChange.pipe(takeUntilDestroyed()).subscribe(() => {\n      this.#mapAppSettings(this.appSettings());\n    });\n  }\n\n  #mapAppSettings(as: ShellAppSettings[]) {\n    this.appSettings.set(\n      as.map((appSetting) => {\n        const translatedLabel = this.translate.instant(appSetting.label);\n        const label = translatedLabel && !translatedLabel.startsWith('!missing') ? translatedLabel : appSetting.label;\n        return {\n          ...appSetting,\n          _label: label\n        };\n      })\n    );\n  }\n\n  changeClientLocale(iso: string) {\n    this.userService.changeClientLocale(iso);\n  }\n\n  changeMode({ value }: MatButtonToggleChange) {\n    if (value && value !== this.currentMode()) {\n      this.#themeService.toggleTheme(value);\n    }\n  }\n\n  toggleDarkMode() {\n    const root = document.getElementsByTagName('body')[0];\n    root.classList.toggle('dark');\n  }\n\n  changeCustomTheme({ value }: MatButtonToggleChange) {\n    this.#themeService.setCustomTheme(value);\n  }\n\n  ngOnInit(): void {\n    this.clientVersion.set(this.document.body.getAttribute('data-version') ?? 'dev');\n\n    this.clientLocales.set(this.config.getClientLocales());\n    this.getAboutData();\n  }\n\n  getAboutData() {\n    this.#http\n      .get('assets/about.data.json')\n      .pipe(\n        map((response: AboutData) => ({\n          ...response,\n          libraries: response.libraries\n            ? response.libraries.map((lib) => ({\n                ...lib,\n                ...(lib.license !== 'SEE LICENSE IN LICENSE'\n                  ? { link: `https://opensource.org/license/${lib.license}` }\n                  : {})\n              }))\n            : undefined\n        }))\n      )\n      .subscribe({\n        next: (response: AboutData) => this.clientAboutData.set(response),\n        error: (error) => console.log({ error })\n      });\n  }\n}\n","<header>\n  <h1>{{ 'yuv.shell.settings.title' | translate }}</h1>\n  <span class=\"subhead\">{{ 'yuv.shell.settings.client.version' | translate }}: {{ clientVersion() }}</span>\n</header>\n\n<main>\n  <div class=\"content-container\">\n    <!-- User Info -->\n    @let user = this.user();\n    @if (user) {\n      <section class=\"section user\">\n        <h2 class=\"section__title\">{{ user.title }}</h2>\n        <div class=\"section__body user__data grid\">\n          <div class=\"user__data-entry grid-row\">\n            <span class=\"user__data-entry-key grid-col grid-col-key\">\n              {{ 'yuv.shell.settings.user.email' | translate }}:\n            </span>\n            <span class=\"user__data-entry-value grid-col grid-col-value\">\n              {{ user.email }}\n            </span>\n          </div>\n          <div class=\"user__data-entry grid-row\">\n            <span class=\"user__data-entry-key grid-col grid-col-key\">\n              {{ 'yuv.shell.settings.tenant' | translate }}:\n            </span>\n            <span class=\"user__data-entry-value grid-col grid-col-value\">\n              {{ user.tenant }}\n            </span>\n          </div>\n\n          <!--<div class=\"user__data\">{{ 'yuv.shell.settings.user.name' | translate }}: {{ user.username }}</div>\n          <div class=\"user__data-entry\">{{ 'yuv.shell.settings.user.email' | translate }}: {{ user.email }}</div>\n          <div class=\"user__data-entry\">{{ 'yuv.shell.settings.tenant' | translate }}: {{ user.tenant }}</div>-->\n        </div>\n      </section>\n    }\n    <!-- Language Settings -->\n    <section yuvOfflineDisabled class=\"section\">\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.language' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"language\"\n          [value]=\"translate.currentLang\"\n          (valueChange)=\"changeClientLocale($event)\"\n          [attr.aria-label]=\"'yuv.shell.settings.language' | translate\"\n        >\n          @for (locale of clientLocales(); track locale.iso) {\n            <mat-button-toggle [value]=\"locale.iso\">{{ locale.label }}</mat-button-toggle>\n          }\n        </mat-button-toggle-group>\n      </div>\n    </section>\n\n    <!-- Mode -->\n    @let currentThemeMode = currentMode();\n    <section class=\"section\">\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.mode' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"mode\"\n          [value]=\"currentThemeMode\"\n          (change)=\"changeMode($event)\"\n          [disabled]=\"disableMode()\"\n          [attr.aria-label]=\"'yuv.shell.settings.mode' | translate\"\n        >\n          <mat-button-toggle value=\"light\">{{ 'yuv.shell.settings.mode.light' | translate }}</mat-button-toggle>\n          <mat-button-toggle value=\"dark\">{{ 'yuv.shell.settings.mode.dark' | translate }}</mat-button-toggle>\n          <mat-button-toggle value=\"system\">{{ 'yuv.shell.settings.mode.system' | translate }}</mat-button-toggle>\n        </mat-button-toggle-group>\n      </div>\n\n      <p></p>\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.custom.theme' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"custom-theme\"\n          [value]=\"currentTheme()\"\n          (change)=\"changeCustomTheme($event)\"\n          [attr.aria-label]=\"'yuv.shell.settings.custom.theme' | translate\"\n        >\n          <mat-button-toggle [value]=\"DEFAULT_THEME.key\" [matTooltip]=\"DEFAULT_THEME.description | translate\">\n            {{ DEFAULT_THEME.label | translate }}\n          </mat-button-toggle>\n          @for (theme of customThemes(); track theme.key) {\n            <mat-button-toggle [value]=\"theme.key\">{{ theme.label | translate }}</mat-button-toggle>\n          }\n        </mat-button-toggle-group>\n      </div>\n    </section>\n\n    <!-- app settings -->\n    @for (c of appSettings(); track $index) {\n      <section class=\"section\">\n        <h2 class=\"section__title\">{{ c._label }}</h2>\n        <div class=\"section__body\">\n          <ng-container *ngComponentOutlet=\"c.component\" />\n        </div>\n      </section>\n    }\n\n    <!-- About Info -->\n    @let libraries = this.clientAboutData()?.libraries;\n    @if (libraries) {\n      <section class=\"section about\">\n        <h2 class=\"section__title\">{{ 'yuv.shell.settings.about.title' | translate }}</h2>\n        <mat-expansion-panel class=\"about__panel\">\n          <mat-expansion-panel-header>\n            <mat-panel-title>{{ 'yuv.shell.settings.dependency-info.title' | translate }}</mat-panel-title>\n            <!--            <mat-panel-description>{{ '' | translate }}</mat-panel-description>-->\n          </mat-expansion-panel-header>\n\n          <ng-template matExpansionPanelContent>\n            <div class=\"about__panel-content\">\n              <table mat-table [dataSource]=\"libraries\">\n                <!-- Name Column -->\n                <ng-container matColumnDef=\"name\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.package' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">{{ element.name }}</td>\n                </ng-container>\n\n                <!-- Version Column -->\n                <ng-container matColumnDef=\"version\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.version' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">{{ element.version }}</td>\n                </ng-container>\n\n                <!-- License Column -->\n                <ng-container matColumnDef=\"license\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.license' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">\n                    @if (element.link) {\n                      <a href=\"{{ element.link }}\" target=\"_blank\">{{ element.license }}</a>\n                    } @else {\n                      {{ element.license }}\n                    }\n                  </td>\n                </ng-container>\n\n                <tr mat-header-row *matHeaderRowDef=\"['name', 'version', 'license']\"></tr>\n                <tr mat-row *matRowDef=\"let row; columns: ['name', 'version', 'license']\"></tr>\n              </table>\n            </div>\n          </ng-template>\n        </mat-expansion-panel>\n      </section>\n    }\n  </div>\n</main>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"yuuvis-client-shell-settings.component-CF1lK9mL.mjs","sources":["../../../../../libs/yuuvis/client-shell/src/lib/pages/settings/settings.component.ts","../../../../../libs/yuuvis/client-shell/src/lib/pages/settings/settings.component.html"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { HttpClient } from '@angular/common/http';\nimport { Component, computed, DOCUMENT, effect, inject, OnInit, Signal, signal } from '@angular/core';\nimport { takeUntilDestroyed, toSignal } from '@angular/core/rxjs-interop';\nimport { ReactiveFormsModule } from '@angular/forms';\nimport { MatButtonToggle, MatButtonToggleChange, MatButtonToggleGroup } from '@angular/material/button-toggle';\nimport { MatExpansionModule } from '@angular/material/expansion';\nimport { MatSelectModule } from '@angular/material/select';\nimport { MatTableModule } from '@angular/material/table';\nimport { MatTooltip } from '@angular/material/tooltip';\nimport {\n  ConfigService,\n  TranslatePipe,\n  TranslateService,\n  UserService,\n  YuvConfigLanguages,\n  YuvUser\n} from '@yuuvis/client-core';\nimport {\n  DEFAULT_THEME,\n  DEFAULT_THEME_KEY,\n  HIGH_CONTRAST_THEME_KEY,\n  ThemeService\n} from '@yuuvis/client-framework/common';\nimport { ShellAppSettings, ShellService } from '@yuuvis/client-shell-core';\nimport { map } from 'rxjs';\nimport { AboutData } from './settings.model';\n\n@Component({\n  selector: 'yuv-settings',\n  standalone: true,\n  imports: [\n    CommonModule,\n    TranslatePipe,\n    MatTooltip,\n    MatSelectModule,\n    ReactiveFormsModule,\n    MatButtonToggleGroup,\n    MatButtonToggle,\n    MatExpansionModule,\n    MatTableModule\n  ],\n  templateUrl: './settings.component.html',\n  styleUrls: ['./settings.component.scss']\n})\nexport class SettingsPageComponent implements OnInit {\n  private userService = inject(UserService);\n  private config = inject(ConfigService);\n  public translate = inject(TranslateService);\n  private shell = inject(ShellService);\n  readonly document = inject(DOCUMENT);\n  readonly #themeService = inject(ThemeService);\n  readonly #http = inject(HttpClient);\n\n  protected readonly DEFAULT_THEME_KEY = DEFAULT_THEME_KEY;\n  protected readonly HIGH_CONTRAST_THEME_KEY = HIGH_CONTRAST_THEME_KEY;\n  protected readonly DEFAULT_THEME = DEFAULT_THEME;\n  disableMode = this.#themeService.disableMode;\n  customThemes = this.#themeService.customThemes;\n  currentTheme = computed(() => {\n    const ct = this.#themeService.customTheme();\n    return ct ? ct.key : undefined;\n  });\n\n  clientLocales = signal<YuvConfigLanguages[]>([]);\n  clientVersion = signal<string | undefined>(undefined);\n  clientAboutData = signal<AboutData | undefined>(undefined);\n  currentMode = this.#themeService.mode;\n\n  user: Signal<YuvUser | undefined> = toSignal(this.userService.user$);\n  appSettings = signal<(ShellAppSettings & { _label: string })[]>([]);\n  #appSettings = this.shell.appSettings;\n  #appSettingsEffect = effect(() => {\n    const as = this.#appSettings();\n    this.#mapAppSettings(as);\n  });\n\n  constructor() {\n    this.translate.onLangChange.pipe(takeUntilDestroyed()).subscribe(() => {\n      this.#mapAppSettings(this.appSettings());\n    });\n  }\n\n  #mapAppSettings(as: ShellAppSettings[]) {\n    this.appSettings.set(\n      as.map((appSetting) => {\n        const translatedLabel = this.translate.instant(appSetting.label);\n        const label = translatedLabel && !translatedLabel.startsWith('!missing') ? translatedLabel : appSetting.label;\n        return {\n          ...appSetting,\n          _label: label\n        };\n      })\n    );\n  }\n\n  changeClientLocale(iso: string) {\n    this.userService.changeClientLocale(iso);\n  }\n\n  changeMode({ value }: MatButtonToggleChange) {\n    if (value && value !== this.currentMode()) {\n      this.#themeService.toggleTheme(value);\n    }\n  }\n\n  toggleDarkMode() {\n    const root = document.getElementsByTagName('body')[0];\n    root.classList.toggle('dark');\n  }\n\n  changeCustomTheme({ value }: MatButtonToggleChange) {\n    this.#themeService.setCustomTheme(value);\n  }\n\n  ngOnInit(): void {\n    this.clientVersion.set(this.document.body.getAttribute('data-version') ?? 'dev');\n\n    this.clientLocales.set(this.config.getClientLocales());\n    this.getAboutData();\n  }\n\n  getAboutData() {\n    this.#http\n      .get('assets/about.data.json')\n      .pipe(\n        map((response: AboutData) => ({\n          ...response,\n          libraries: response.libraries\n            ? response.libraries.map((lib) => ({\n                ...lib,\n                ...(lib.license !== 'SEE LICENSE IN LICENSE'\n                  ? { link: `https://opensource.org/license/${lib.license}` }\n                  : {})\n              }))\n            : undefined\n        }))\n      )\n      .subscribe({\n        next: (response: AboutData) => this.clientAboutData.set(response),\n        error: (error) => console.log({ error })\n      });\n  }\n}\n","<header>\n  <h1>{{ 'yuv.shell.settings.title' | translate }}</h1>\n  <span class=\"subhead\">{{ 'yuv.shell.settings.client.version' | translate }}: {{ clientVersion() }}</span>\n</header>\n\n<main>\n  <div class=\"content-container\">\n    <!-- User Info -->\n    @let user = this.user();\n    @if (user) {\n      <section class=\"section user\">\n        <h2 class=\"section__title\">{{ user.title }}</h2>\n        <div class=\"section__body user__data grid\">\n          <div class=\"user__data-entry grid-row\">\n            <span class=\"user__data-entry-key grid-col grid-col-key\">\n              {{ 'yuv.shell.settings.user.email' | translate }}:\n            </span>\n            <span class=\"user__data-entry-value grid-col grid-col-value\">\n              {{ user.email }}\n            </span>\n          </div>\n          <div class=\"user__data-entry grid-row\">\n            <span class=\"user__data-entry-key grid-col grid-col-key\">\n              {{ 'yuv.shell.settings.tenant' | translate }}:\n            </span>\n            <span class=\"user__data-entry-value grid-col grid-col-value\">\n              {{ user.tenant }}\n            </span>\n          </div>\n\n          <!--<div class=\"user__data\">{{ 'yuv.shell.settings.user.name' | translate }}: {{ user.username }}</div>\n          <div class=\"user__data-entry\">{{ 'yuv.shell.settings.user.email' | translate }}: {{ user.email }}</div>\n          <div class=\"user__data-entry\">{{ 'yuv.shell.settings.tenant' | translate }}: {{ user.tenant }}</div>-->\n        </div>\n      </section>\n    }\n    <!-- Language Settings -->\n    <section yuvOfflineDisabled class=\"section\">\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.language' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"language\"\n          [value]=\"translate.currentLang\"\n          (valueChange)=\"changeClientLocale($event)\"\n          [attr.aria-label]=\"'yuv.shell.settings.language' | translate\"\n        >\n          @for (locale of clientLocales(); track locale.iso) {\n            <mat-button-toggle [value]=\"locale.iso\">{{ locale.label }}</mat-button-toggle>\n          }\n        </mat-button-toggle-group>\n      </div>\n    </section>\n\n    <!-- Mode -->\n    @let currentThemeMode = currentMode();\n    <section class=\"section\">\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.mode' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"mode\"\n          [value]=\"currentThemeMode\"\n          (change)=\"changeMode($event)\"\n          [disabled]=\"disableMode()\"\n          [attr.aria-label]=\"'yuv.shell.settings.mode' | translate\"\n        >\n          <mat-button-toggle value=\"light\">{{ 'yuv.shell.settings.mode.light' | translate }}</mat-button-toggle>\n          <mat-button-toggle value=\"dark\">{{ 'yuv.shell.settings.mode.dark' | translate }}</mat-button-toggle>\n          <mat-button-toggle value=\"system\">{{ 'yuv.shell.settings.mode.system' | translate }}</mat-button-toggle>\n        </mat-button-toggle-group>\n      </div>\n\n      <p></p>\n      <h2 class=\"section__title\">{{ 'yuv.shell.settings.custom.theme' | translate }}</h2>\n      <div class=\"section__body\">\n        <mat-button-toggle-group\n          name=\"custom-theme\"\n          [value]=\"currentTheme()\"\n          (change)=\"changeCustomTheme($event)\"\n          [attr.aria-label]=\"'yuv.shell.settings.custom.theme' | translate\"\n        >\n          <mat-button-toggle [value]=\"DEFAULT_THEME.key\" [matTooltip]=\"DEFAULT_THEME.description | translate\">\n            {{ DEFAULT_THEME.label | translate }}\n          </mat-button-toggle>\n          @for (theme of customThemes(); track theme.key) {\n            <mat-button-toggle [value]=\"theme.key\">{{ theme.label | translate }}</mat-button-toggle>\n          }\n        </mat-button-toggle-group>\n      </div>\n    </section>\n\n    <!-- app settings -->\n    @for (c of appSettings(); track $index) {\n      <section class=\"section\">\n        <h2 class=\"section__title\">{{ c._label }}</h2>\n        <div class=\"section__body\">\n          <ng-container *ngComponentOutlet=\"c.component\" />\n        </div>\n      </section>\n    }\n\n    <!-- About Info -->\n    @let libraries = this.clientAboutData()?.libraries;\n    @if (libraries) {\n      <section class=\"section about\">\n        <h2 class=\"section__title\">{{ 'yuv.shell.settings.about.title' | translate }}</h2>\n        <mat-expansion-panel class=\"about__panel\">\n          <mat-expansion-panel-header>\n            <mat-panel-title>{{ 'yuv.shell.settings.dependency-info.title' | translate }}</mat-panel-title>\n            <!--            <mat-panel-description>{{ '' | translate }}</mat-panel-description>-->\n          </mat-expansion-panel-header>\n\n          <ng-template matExpansionPanelContent>\n            <div class=\"about__panel-content\">\n              <table mat-table [dataSource]=\"libraries\">\n                <!-- Name Column -->\n                <ng-container matColumnDef=\"name\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.package' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">{{ element.name }}</td>\n                </ng-container>\n\n                <!-- Version Column -->\n                <ng-container matColumnDef=\"version\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.version' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">{{ element.version }}</td>\n                </ng-container>\n\n                <!-- License Column -->\n                <ng-container matColumnDef=\"license\">\n                  <th mat-header-cell *matHeaderCellDef>\n                    {{ 'yuv.shell.settings.dependency-info.license' | translate }}\n                  </th>\n                  <td mat-cell *matCellDef=\"let element\">\n                    @if (element.link) {\n                      <a href=\"{{ element.link }}\" target=\"_blank\">{{ element.license }}</a>\n                    } @else {\n                      {{ element.license }}\n                    }\n                  </td>\n                </ng-container>\n\n                <tr mat-header-row *matHeaderRowDef=\"['name', 'version', 'license']\"></tr>\n                <tr mat-row *matRowDef=\"let row; columns: ['name', 'version', 'license']\"></tr>\n              </table>\n            </div>\n          </ng-template>\n        </mat-expansion-panel>\n      </section>\n    }\n  </div>\n</main>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;MA6Ca,qBAAqB,CAAA;AAMvB,IAAA,aAAa;AACb,IAAA,KAAK;AAmBd,IAAA,YAAY;AACZ,IAAA,kBAAkB;AAKlB,IAAA,WAAA,GAAA;AA/BQ,QAAA,IAAA,CAAA,WAAW,GAAG,MAAM,CAAC,WAAW,CAAC;AACjC,QAAA,IAAA,CAAA,MAAM,GAAG,MAAM,CAAC,aAAa,CAAC;AAC/B,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAC,gBAAgB,CAAC;AACnC,QAAA,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,YAAY,CAAC;AAC3B,QAAA,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC;AAC3B,QAAA,IAAA,CAAA,aAAa,GAAG,MAAM,CAAC,YAAY,CAAC;AACpC,QAAA,IAAA,CAAA,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC;QAEhB,IAAA,CAAA,iBAAiB,GAAG,iBAAiB;QACrC,IAAA,CAAA,uBAAuB,GAAG,uBAAuB;QACjD,IAAA,CAAA,aAAa,GAAG,aAAa;AAChD,QAAA,IAAA,CAAA,WAAW,GAAG,IAAI,CAAC,aAAa,CAAC,WAAW;AAC5C,QAAA,IAAA,CAAA,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,YAAY;AAC9C,QAAA,IAAA,CAAA,YAAY,GAAG,QAAQ,CAAC,MAAK;YAC3B,MAAM,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC,WAAW,EAAE;YAC3C,OAAO,EAAE,GAAG,EAAE,CAAC,GAAG,GAAG,SAAS;AAChC,QAAA,CAAC,mFAAC;AAEF,QAAA,IAAA,CAAA,aAAa,GAAG,MAAM,CAAuB,EAAE,oFAAC;AAChD,QAAA,IAAA,CAAA,aAAa,GAAG,MAAM,CAAqB,SAAS,oFAAC;AACrD,QAAA,IAAA,CAAA,eAAe,GAAG,MAAM,CAAwB,SAAS,sFAAC;AAC1D,QAAA,IAAA,CAAA,WAAW,GAAG,IAAI,CAAC,aAAa,CAAC,IAAI;QAErC,IAAA,CAAA,IAAI,GAAgC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC;AACpE,QAAA,IAAA,CAAA,WAAW,GAAG,MAAM,CAA4C,EAAE,kFAAC;AACnE,QAAA,IAAA,CAAA,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW;AACrC,QAAA,IAAA,CAAA,kBAAkB,GAAG,MAAM,CAAC,MAAK;AAC/B,YAAA,MAAM,EAAE,GAAG,IAAI,CAAC,YAAY,EAAE;AAC9B,YAAA,IAAI,CAAC,eAAe,CAAC,EAAE,CAAC;AAC1B,QAAA,CAAC,yFAAC;AAGA,QAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,IAAI,CAAC,kBAAkB,EAAE,CAAC,CAAC,SAAS,CAAC,MAAK;YACpE,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;AAC1C,QAAA,CAAC,CAAC;IACJ;AAEA,IAAA,eAAe,CAAC,EAAsB,EAAA;AACpC,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAClB,EAAE,CAAC,GAAG,CAAC,CAAC,UAAU,KAAI;AACpB,YAAA,MAAM,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK,CAAC;YAChE,MAAM,KAAK,GAAG,eAAe,IAAI,CAAC,eAAe,CAAC,UAAU,CAAC,UAAU,CAAC,GAAG,eAAe,GAAG,UAAU,CAAC,KAAK;YAC7G,OAAO;AACL,gBAAA,GAAG,UAAU;AACb,gBAAA,MAAM,EAAE;aACT;QACH,CAAC,CAAC,CACH;IACH;AAEA,IAAA,kBAAkB,CAAC,GAAW,EAAA;AAC5B,QAAA,IAAI,CAAC,WAAW,CAAC,kBAAkB,CAAC,GAAG,CAAC;IAC1C;IAEA,UAAU,CAAC,EAAE,KAAK,EAAyB,EAAA;QACzC,IAAI,KAAK,IAAI,KAAK,KAAK,IAAI,CAAC,WAAW,EAAE,EAAE;AACzC,YAAA,IAAI,CAAC,aAAa,CAAC,WAAW,CAAC,KAAK,CAAC;QACvC;IACF;IAEA,cAAc,GAAA;QACZ,MAAM,IAAI,GAAG,QAAQ,CAAC,oBAAoB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;AACrD,QAAA,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC;IAC/B;IAEA,iBAAiB,CAAC,EAAE,KAAK,EAAyB,EAAA;AAChD,QAAA,IAAI,CAAC,aAAa,CAAC,cAAc,CAAC,KAAK,CAAC;IAC1C;IAEA,QAAQ,GAAA;AACN,QAAA,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,YAAY,CAAC,cAAc,CAAC,IAAI,KAAK,CAAC;AAEhF,QAAA,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,gBAAgB,EAAE,CAAC;QACtD,IAAI,CAAC,YAAY,EAAE;IACrB;IAEA,YAAY,GAAA;AACV,QAAA,IAAI,CAAC;aACF,GAAG,CAAC,wBAAwB;aAC5B,IAAI,CACH,GAAG,CAAC,CAAC,QAAmB,MAAM;AAC5B,YAAA,GAAG,QAAQ;YACX,SAAS,EAAE,QAAQ,CAAC;AAClB,kBAAE,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM;AAC/B,oBAAA,GAAG,GAAG;AACN,oBAAA,IAAI,GAAG,CAAC,OAAO,KAAK;0BAChB,EAAE,IAAI,EAAE,kCAAkC,GAAG,CAAC,OAAO,CAAA,CAAE;0BACvD,EAAE;AACP,iBAAA,CAAC;AACJ,kBAAE;AACL,SAAA,CAAC,CAAC;AAEJ,aAAA,SAAS,CAAC;AACT,YAAA,IAAI,EAAE,CAAC,QAAmB,KAAK,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,QAAQ,CAAC;AACjE,YAAA,KAAK,EAAE,CAAC,KAAK,KAAK,OAAO,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE;AACxC,SAAA,CAAC;IACN;+GAjGW,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAArB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,qBAAqB,wEC7ClC,6nNA0JA,EAAA,MAAA,EAAA,CAAA,u/BAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,ED1HI,YAAY,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,mBAAA,EAAA,yBAAA,EAAA,2BAAA,EAAA,sCAAA,EAAA,0BAAA,EAAA,2BAAA,CAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAEZ,UAAU,gRACV,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACf,mBAAmB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EACnB,oBAAoB,kTACpB,eAAe,EAAA,QAAA,EAAA,mBAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,MAAA,EAAA,OAAA,EAAA,UAAA,EAAA,eAAA,EAAA,YAAA,EAAA,SAAA,EAAA,UAAA,EAAA,qBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,QAAA,CAAA,EAAA,QAAA,EAAA,CAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EACf,kBAAkB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,iBAAA,EAAA,QAAA,EAAA,qBAAA,EAAA,MAAA,EAAA,CAAA,YAAA,EAAA,gBAAA,CAAA,EAAA,OAAA,EAAA,CAAA,aAAA,EAAA,eAAA,CAAA,EAAA,QAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,uBAAA,EAAA,QAAA,EAAA,4BAAA,EAAA,MAAA,EAAA,CAAA,gBAAA,EAAA,iBAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,sBAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,wBAAA,EAAA,QAAA,EAAA,uCAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAClB,cAAc,kgCAPd,aAAa,EAAA,IAAA,EAAA,WAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FAYJ,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBAjBjC,SAAS;+BACE,cAAc,EAAA,UAAA,EACZ,IAAI,EAAA,OAAA,EACP;wBACP,YAAY;wBACZ,aAAa;wBACb,UAAU;wBACV,eAAe;wBACf,mBAAmB;wBACnB,oBAAoB;wBACpB,eAAe;wBACf,kBAAkB;wBAClB;AACD,qBAAA,EAAA,QAAA,EAAA,6nNAAA,EAAA,MAAA,EAAA,CAAA,u/BAAA,CAAA,EAAA;;;;;"}

package/fesm2022/yuuvis-client-shell-widget-dashboard.mjs

@@ -31,10 +31,10 @@ class WidgetDashboardPageComponent {
     onEditModeChange(editMode) {
         // console.log('Edit mode changed:', editMode);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: WidgetDashboardPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: WidgetDashboardPageComponent, isStandalone: true, selector: "yuv-widget-dashboard", ngImport: i0, template: "<yuv-widget-grid-workspaces \n[workspaceConfig]=\"wsConfig()\"\n(gridItemEvent)=\"onGridItemEvent($event)\"\n(editModeChange)=\"onEditModeChange($event)\"\n(configChange)=\"onConfigChange($event)\"></yuv-widget-grid-workspaces>", styles: [":host{display:block;padding:var(--ymt-spacing-m);height:100%;box-sizing:border-box}\n"], dependencies: [{ kind: "ngmodule", type: YuvWidgetGridModule }, { kind: "component", type: i1.YuvWidgetGridWorkspacesComponent, selector: "yuv-widget-grid-workspaces", inputs: ["buckets", "options", "workspaceConfig"], outputs: ["configChange", "gridItemEvent", "editModeChange"] }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: WidgetDashboardPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: WidgetDashboardPageComponent, isStandalone: true, selector: "yuv-widget-dashboard", ngImport: i0, template: "<yuv-widget-grid-workspaces \n[workspaceConfig]=\"wsConfig()\"\n(gridItemEvent)=\"onGridItemEvent($event)\"\n(editModeChange)=\"onEditModeChange($event)\"\n(configChange)=\"onConfigChange($event)\"></yuv-widget-grid-workspaces>", styles: [":host{display:block;padding:var(--ymt-spacing-m);height:100%;box-sizing:border-box}\n"], dependencies: [{ kind: "ngmodule", type: YuvWidgetGridModule }, { kind: "component", type: i1.YuvWidgetGridWorkspacesComponent, selector: "yuv-widget-grid-workspaces", inputs: ["buckets", "options", "workspaceConfig"], outputs: ["configChange", "gridItemEvent", "editModeChange"] }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: WidgetDashboardPageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: WidgetDashboardPageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-widget-dashboard', imports: [YuvWidgetGridModule], template: "<yuv-widget-grid-workspaces \n[workspaceConfig]=\"wsConfig()\"\n(gridItemEvent)=\"onGridItemEvent($event)\"\n(editModeChange)=\"onEditModeChange($event)\"\n(configChange)=\"onConfigChange($event)\"></yuv-widget-grid-workspaces>", styles: [":host{display:block;padding:var(--ymt-spacing-m);height:100%;box-sizing:border-box}\n"] }]
         }], ctorParameters: () => [] });

package/fesm2022/yuuvis-client-shell.mjs

@@ -102,10 +102,10 @@ class ManageFlavorsComponent {
     ngOnInit() {
         this.#refreshDmsObject();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ManageFlavorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: ManageFlavorsComponent, isStandalone: true, selector: "yuv-manage-flavors", ngImport: i0, template: "<yuv-dialog [headertitel]=\"'yuv.shell.action.manage-flavors.title' | translate\">\n  <main [yuvBusyOverlay]=\"busy()\">\n    <p>{{ 'yuv.shell.action.manage-flavors.text' | translate }}</p>\n    @if (appliedFlavors.length) {\n      <h3>{{ 'yuv.shell.action.manage-flavors.applied.headline' | translate }}</h3>\n      <ul>\n        @for (f of appliedFlavors; track $index) {\n          <li>\n            <yuv-flavor-chip [flavor]=\"f\" yuvListItem></yuv-flavor-chip>\n            @if (!f.preventRemove) {\n              <button mat-icon-button [matTooltip]=\"'yuv.shell.action.manage-flavors.applicable.button.remove.tooltip' | translate\" (click)=\"removeFlavor(f)\">\n                <mat-icon>delete_forever</mat-icon>\n              </button>\n            }\n          </li>\n        }\n      </ul>\n    }\n    @if (applicableFlavors.length) {\n      <h3>{{ 'yuv.shell.action.manage-flavors.applicable.headline' | translate }}</h3>\n      <ul>\n        @for (f of applicableFlavors; track $index) {\n          <li>\n            <yuv-flavor-chip [flavor]=\"f\" yuvListItem></yuv-flavor-chip>\n            <button mat-icon-button [matTooltip]=\"'yuv.shell.action.manage-flavors.applied.button.apply.tooltip' | translate\" (click)=\"applyFlavor(f)\">\n              <mat-icon>add</mat-icon>\n            </button>\n          </li>\n        }\n      </ul>\n    }\n  </main>\n  <footer>\n    <button ymtButton=\"secondary\" (click)=\"cancel()\">{{ 'yuv.shell.action.manage-flavors.button.cancel' | translate }}</button>\n  </footer>\n</yuv-dialog>\n", styles: [":host main{display:flex;flex-flow:column;padding:var(--ymt-spacing-m);flex:1;overflow-y:auto}:host main yuv-flavor-chip{border-color:transparent;flex:1;overflow:hidden}:host main ul{padding:0;margin:0;list-style-type:none}:host main li{display:flex;gap:var(--ymt-spacing-xs);align-items:center;border:1px solid var(--ymt-outline-variant);margin-block-end:2px;padding:var(--ymt-spacing-2xs)}:host footer{flex:0 0 auto;margin-block-start:var(--ymt-spacing-m)}\n"], dependencies: [{ kind: "directive", type: BusyOverlayDirective, selector: "[yuvBusyOverlay]", inputs: ["yuvBusyOverlay", "yuvBusyOverlayConfig", "yuvBusyError"], outputs: ["yuvBusyErrorDismiss"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: ListItemDirective, selector: "[yuvListItem]", inputs: ["disabled", "active", "selected"] }, { kind: "component", type: FlavorChipComponent, selector: "yuv-flavor-chip", inputs: ["flavor", "enableRemove", "enableDescription"], outputs: ["flavorRemove"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ManageFlavorsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: ManageFlavorsComponent, isStandalone: true, selector: "yuv-manage-flavors", ngImport: i0, template: "<yuv-dialog [headertitel]=\"'yuv.shell.action.manage-flavors.title' | translate\">\n  <main [yuvBusyOverlay]=\"busy()\">\n    <p>{{ 'yuv.shell.action.manage-flavors.text' | translate }}</p>\n    @if (appliedFlavors.length) {\n      <h3>{{ 'yuv.shell.action.manage-flavors.applied.headline' | translate }}</h3>\n      <ul>\n        @for (f of appliedFlavors; track $index) {\n          <li>\n            <yuv-flavor-chip [flavor]=\"f\" yuvListItem></yuv-flavor-chip>\n            @if (!f.preventRemove) {\n              <button mat-icon-button [matTooltip]=\"'yuv.shell.action.manage-flavors.applicable.button.remove.tooltip' | translate\" (click)=\"removeFlavor(f)\">\n                <mat-icon>delete_forever</mat-icon>\n              </button>\n            }\n          </li>\n        }\n      </ul>\n    }\n    @if (applicableFlavors.length) {\n      <h3>{{ 'yuv.shell.action.manage-flavors.applicable.headline' | translate }}</h3>\n      <ul>\n        @for (f of applicableFlavors; track $index) {\n          <li>\n            <yuv-flavor-chip [flavor]=\"f\" yuvListItem></yuv-flavor-chip>\n            <button mat-icon-button [matTooltip]=\"'yuv.shell.action.manage-flavors.applied.button.apply.tooltip' | translate\" (click)=\"applyFlavor(f)\">\n              <mat-icon>add</mat-icon>\n            </button>\n          </li>\n        }\n      </ul>\n    }\n  </main>\n  <footer>\n    <button ymtButton=\"secondary\" (click)=\"cancel()\">{{ 'yuv.shell.action.manage-flavors.button.cancel' | translate }}</button>\n  </footer>\n</yuv-dialog>\n", styles: [":host main{display:flex;flex-flow:column;padding:var(--ymt-spacing-m);flex:1;overflow-y:auto}:host main yuv-flavor-chip{border-color:transparent;flex:1;overflow:hidden}:host main ul{padding:0;margin:0;list-style-type:none}:host main li{display:flex;gap:var(--ymt-spacing-xs);align-items:center;border:1px solid var(--ymt-outline-variant);margin-block-end:2px;padding:var(--ymt-spacing-2xs)}:host footer{flex:0 0 auto;margin-block-start:var(--ymt-spacing-m)}\n"], dependencies: [{ kind: "directive", type: BusyOverlayDirective, selector: "[yuvBusyOverlay]", inputs: ["yuvBusyOverlay", "yuvBusyOverlayConfig", "yuvBusyError"], outputs: ["yuvBusyErrorDismiss"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: ListItemDirective, selector: "[yuvListItem]", inputs: ["disabled", "active", "selected"] }, { kind: "component", type: FlavorChipComponent, selector: "yuv-flavor-chip", inputs: ["flavor", "enableRemove", "enableDescription"], outputs: ["flavorRemove"] }, { kind: "component", type: DialogComponent, selector: "yuv-dialog", inputs: ["headertitle", "headertitel"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: YmtButtonDirective, selector: "button[ymtButton], a[ymtButton]", inputs: ["ymtButton", "disabled", "aria-disabled", "disableRipple", "disabledInteractive", "button-size"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ManageFlavorsComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ManageFlavorsComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-manage-flavors', standalone: true, imports: [
                         BusyOverlayDirective,
@@ -207,10 +207,10 @@ class ClientShellService {
         const style = window.getComputedStyle(document.getElementsByTagName('body')[0]);
         return vars.reduce((prev, curr) => ({ ...prev, [curr]: style.getPropertyValue(curr) }), {});
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ClientShellService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ClientShellService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ClientShellService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ClientShellService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ClientShellService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ClientShellService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
@@ -218,10 +218,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
         }], ctorParameters: () => [] });
 
 class ShellLogoComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ShellLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: ShellLogoComponent, isStandalone: true, selector: "yuv-shell-logo", host: { classAttribute: "shell-logo" }, ngImport: i0, template: "<a halo-offset=\"0\" class=\"shell-logo__to-root\" routerLink=\"/\" [attr.aria-label]=\"'yuv.shell.logo.aria.label' | translate\">\n  <mat-icon class=\"shell-logo__icon\" svgIcon=\"shellIcons:app_logo\"></mat-icon>\n</a>\n", styles: [":host.shell-logo{display:block;aspect-ratio:1/1}.shell-logo__to-root{all:unset;cursor:pointer;display:block;height:100%}.shell-logo__icon{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ShellLogoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: ShellLogoComponent, isStandalone: true, selector: "yuv-shell-logo", host: { classAttribute: "shell-logo" }, ngImport: i0, template: "<a halo-offset=\"0\" class=\"shell-logo__to-root\" routerLink=\"/\" [attr.aria-label]=\"'yuv.shell.logo.aria.label' | translate\">\n  <mat-icon class=\"shell-logo__icon\" svgIcon=\"shellIcons:app_logo\"></mat-icon>\n</a>\n", styles: [":host.shell-logo{display:block;aspect-ratio:1/1}.shell-logo__to-root{all:unset;cursor:pointer;display:block;height:100%}.shell-logo__icon{width:100%;height:100%}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ShellLogoComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ShellLogoComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-shell-logo', standalone: true, imports: [MatIconModule, RouterModule, TranslatePipe], host: {
                         class: 'shell-logo'
@@ -252,10 +252,10 @@ class YuvAppHeaderComponent {
             this.notificationsSlot = slots['notifications'] || null;
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YuvAppHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: YuvAppHeaderComponent, isStandalone: true, selector: "yuv-app-header", host: { properties: { "class.small-screen": "smallScreenLayout()" } }, ngImport: i0, template: "@let a = app();\n@if (a) {\n  <header\n  class=\"app-header\"\n  [ngClass]=\"{\n      'has-actions': !!actionsSlot,\n      'has-search': !!searchSlot,\n      'has-notifications': !!notificationsSlot\n    }\"\n    aria-labelledby=\"yuv-app-header\"\n    >\n    @if (busy$ | async) {\n      <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n    }\n    <yuv-shell-logo />\n    <yuv-overflow-hidden>\n      <ng-template #yuvDefaultSlot>\n        <a class=\"name\" [routerLink]=\"['/', a.path]\">\n          <span class=\"title\" id=\"yuv-app-header\">\n            {{ a.title }}\n            <span class=\"claim\">{{ a.options?.appClaim }}</span>\n          </span>\n        </a>\n      </ng-template>\n    </yuv-overflow-hidden>\n    <div class=\"actions\">\n      <ng-container *ngTemplateOutlet=\"actionsSlot\"></ng-container>\n    </div>\n    <div class=\"search\">\n      <ng-container *ngTemplateOutlet=\"searchSlot\"></ng-container>\n    </div>\n    <div class=\"notifications\">\n      <ng-container *ngTemplateOutlet=\"notificationsSlot\"></ng-container>\n    </div>\n  </header>\n}\n", styles: [":host.small-screen .app-header{grid-template-areas:\"actions actions actions search notifications\"}:host.small-screen yuv-shell-logo,:host.small-screen .name{display:none}:host .app-header{position:relative;display:grid;grid-template-columns:var(--yuv-app-header-height, var(--ymt-sizing-6xl)) auto 1fr auto auto;grid-template-rows:var(--yuv-app-header-height, var(--ymt-sizing-6xl));grid-template-areas:\"logo name actions search notifications\";align-items:center;background-color:var(--ymt-bar-surface);color:var(--ymt-on-bar-surface);box-shadow:0 0 0 1px var(--ymt-outline-variant);box-sizing:border-box;padding-inline-end:var(--ymt-spacing-xl)}:host mat-progress-bar{position:absolute;inset-block-end:0}:host .name{grid-area:name;display:inline-block;padding-inline-end:var(--ymt-spacing-3xl);padding-inline-start:var(--ymt-spacing-m);color:currentColor;text-decoration:none;white-space:nowrap;min-width:128px}:host .name .title{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ymt-spacing-2xs);font:var(--ymt-font-app-name);letter-spacing:var(--ymt-font-app-name-tracking);margin:0;line-height:1}:host .name .claim{font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle)}:host .actions{grid-area:actions}:host .search{grid-area:search}:host .notifications{grid-area:notifications}:host .app-header.has-actions .actions{padding-inline-start:var(--ymt-spacing-xl);padding-inline-end:var(--ymt-spacing-l);border-inline-start:var(--ymt-outline-width) solid var(--ymt-outline-variant);border-inline-end:var(--ymt-outline-width) solid var(--ymt-outline-variant)}:host .app-header.has-search .search{padding-inline-start:var(--ymt-spacing-m)}:host .app-header.has-notifications .notifications{padding-inline-start:var(--ymt-spacing-xl)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: YuvOverflowHiddenModule }, { kind: "component", type: i2.OverflowHiddenComponent, selector: "yuv-overflow-hidden" }, { kind: "component", type: ShellLogoComponent, selector: "yuv-shell-logo" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: YuvAppHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: YuvAppHeaderComponent, isStandalone: true, selector: "yuv-app-header", host: { properties: { "class.small-screen": "smallScreenLayout()" } }, ngImport: i0, template: "@let a = app();\n@if (a) {\n  <header\n  class=\"app-header\"\n  [ngClass]=\"{\n      'has-actions': !!actionsSlot,\n      'has-search': !!searchSlot,\n      'has-notifications': !!notificationsSlot\n    }\"\n    aria-labelledby=\"yuv-app-header\"\n    >\n    @if (busy$ | async) {\n      <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n    }\n    <yuv-shell-logo />\n    <yuv-overflow-hidden>\n      <ng-template #yuvDefaultSlot>\n        <a class=\"name\" [routerLink]=\"['/', a.path]\">\n          <span class=\"title\" id=\"yuv-app-header\">\n            {{ a.title }}\n            <span class=\"claim\">{{ a.options?.appClaim }}</span>\n          </span>\n        </a>\n      </ng-template>\n    </yuv-overflow-hidden>\n    <div class=\"actions\">\n      <ng-container *ngTemplateOutlet=\"actionsSlot\"></ng-container>\n    </div>\n    <div class=\"search\">\n      <ng-container *ngTemplateOutlet=\"searchSlot\"></ng-container>\n    </div>\n    <div class=\"notifications\">\n      <ng-container *ngTemplateOutlet=\"notificationsSlot\"></ng-container>\n    </div>\n  </header>\n}\n", styles: [":host.small-screen .app-header{grid-template-areas:\"actions actions actions search notifications\"}:host.small-screen yuv-shell-logo,:host.small-screen .name{display:none}:host .app-header{position:relative;display:grid;grid-template-columns:var(--yuv-app-header-height, var(--ymt-sizing-6xl)) auto 1fr auto auto;grid-template-rows:var(--yuv-app-header-height, var(--ymt-sizing-6xl));grid-template-areas:\"logo name actions search notifications\";align-items:center;background-color:var(--ymt-bar-surface);color:var(--ymt-on-bar-surface);box-shadow:0 0 0 1px var(--ymt-outline-variant);box-sizing:border-box;padding-inline-end:var(--ymt-spacing-xl)}:host mat-progress-bar{position:absolute;inset-block-end:0}:host .name{grid-area:name;display:inline-block;padding-inline-end:var(--ymt-spacing-3xl);padding-inline-start:var(--ymt-spacing-m);color:currentColor;text-decoration:none;white-space:nowrap;min-width:128px}:host .name .title{display:flex;flex-direction:column;align-items:flex-start;gap:var(--ymt-spacing-2xs);font:var(--ymt-font-app-name);letter-spacing:var(--ymt-font-app-name-tracking);margin:0;line-height:1}:host .name .claim{font:var(--ymt-font-body-subtle);color:var(--ymt-text-color-subtle)}:host .actions{grid-area:actions}:host .search{grid-area:search}:host .notifications{grid-area:notifications}:host .app-header.has-actions .actions{padding-inline-start:var(--ymt-spacing-xl);padding-inline-end:var(--ymt-spacing-l);border-inline-start:var(--ymt-outline-width) solid var(--ymt-outline-variant);border-inline-end:var(--ymt-outline-width) solid var(--ymt-outline-variant)}:host .app-header.has-search .search{padding-inline-start:var(--ymt-spacing-m)}:host .app-header.has-notifications .notifications{padding-inline-start:var(--ymt-spacing-xl)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "ngmodule", type: YuvOverflowHiddenModule }, { kind: "component", type: i2.OverflowHiddenComponent, selector: "yuv-overflow-hidden" }, { kind: "component", type: ShellLogoComponent, selector: "yuv-shell-logo" }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YuvAppHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: YuvAppHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-app-header', imports: [CommonModule, MatProgressBar, MatIconModule, YuvOverflowHiddenModule, ShellLogoComponent, RouterModule], host: {
                         '[class.small-screen]': 'smallScreenLayout()'
@@ -383,10 +383,10 @@ class SidebarNavComponent {
     ngOnInit() {
         this._setCommands();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: SidebarNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: SidebarNavComponent, isStandalone: true, selector: "yuv-sidebar-nav", host: { properties: { "class.small-screen": "smallScreenLayout()" }, classAttribute: "sidenav" }, ngImport: i0, template: "<nav class=\"sidenav\" [attr.aria-label]=\"'yuv.shell.side-nav.aria.label' | translate\">\n  @let iconsRegistered = registerIcons();\n  @let showAppHeader = css.appHeader();\n\n  @let a = app();\n  @if (smallScreenLayout()) {\n    <div class=\"menu\">\n      <button mat-icon-button [matMenuTriggerFor]=\"menu\">\n        <mat-icon>menu</mat-icon>\n      </button>\n      @if (a) {\n        <span class=\"app-label\">{{ a.title }}</span>\n      }\n    </div>\n\n    @if (showNotifications()) {\n      <div class=\"notifications\">\n        <ng-container *ngTemplateOutlet=\"notificationButton; context: { $implicit: newNotifications() }\"></ng-container>\n      </div>\n    }\n    <mat-menu #menu=\"matMenu\" class=\"sort-menu\" [ariaLabel]=\"'yuv.sort.tooltip' | translate\">\n      @for (a of navApps(); track a.path) {\n        <button mat-menu-item [routerLink]=\"a.path\">\n          @if (a.svgIcon) {\n            @if (iconsRegistered) {\n              <mat-icon [svgIcon]=\"'shellIcons:' + a.iconName\"></mat-icon>\n            }\n          } @else {\n            <mat-icon>{{ a.iconName }}</mat-icon>\n          }\n          <span>{{ getAppTitle(a) }}</span>\n        </button>\n      }\n\n      <mat-divider></mat-divider>\n\n      @for (customButton of customActionButtons; track customButton.iconName) {\n        <button mat-menu-item (click)=\"handleCustomActionButtonClick(customButton)\">\n          <mat-icon>{{ customButton.iconName }}</mat-icon>\n          <span>{{ customButton.tooltip ? (customButton.tooltip | translate) : '' }}</span>\n        </button>\n      }\n      <button mat-menu-item [routerLink]=\"['/settings']\" routerLinkActive=\"active\">\n        <mat-icon>settings</mat-icon>\n        <span>{{ 'yuv.shell.settings.title' | translate }}</span>\n      </button>\n      <button mat-menu-item (click)=\"appLogout()\">\n        <mat-icon>power_settings_new</mat-icon>\n        <span>{{ 'yuv.shell.cmd.logout' | translate }}</span>\n      </button>\n    </mat-menu>\n  } @else {\n    <div class=\"logo-container\">\n      @if (iconsRegistered && !showAppHeader) {\n        <yuv-shell-logo slot=\"shell-logo\" class=\"shell-nav__shell-logo\" />\n      }\n    </div>\n    <div class=\"app-switcher-container\">\n      <yuv-overflow-menu [vertical]=\"true\" [menuItems]=\"navMenuItems()\" />\n    </div>\n    <div class=\"actions-container\">\n      @if (showNotifications()) {\n        <ng-container *ngTemplateOutlet=\"notificationButton; context: { $implicit: newNotifications() }\"></ng-container>\n      }\n      @for (customButton of customActionButtons; track customButton.iconName) {\n        <button\n          class=\"shell-nav__actions-button\"\n          ymt-icon-button\n          (click)=\"handleCustomActionButtonClick(customButton)\"\n          matTooltipPosition=\"after\"\n          [matTooltip]=\"customButton.tooltip ? (customButton.tooltip | translate) : ''\"\n        >\n          <mat-icon>{{ customButton.iconName }}</mat-icon>\n        </button>\n      }\n      <button\n        class=\"shell-nav__actions-button\"\n        ymt-icon-button\n        [routerLink]=\"['/settings']\"\n        routerLinkActive=\"active\"\n        [matTooltip]=\"'yuv.shell.settings.title' | translate\"\n      >\n        <mat-icon>settings</mat-icon>\n      </button>\n      <button class=\"shell-nav__actions-button\" ymt-icon-button (click)=\"appLogout()\" [matTooltip]=\"'yuv.shell.cmd.logout' | translate\">\n        <mat-icon>power_settings_new</mat-icon>\n      </button>\n    </div>\n  }\n</nav>\n\n<ng-template #notificationButton let-note>\n  <button\n    class=\"shell-nav__actions-button notes {{ note?.maxLevel }}\"\n    ymt-icon-button\n    [attr.data-count]=\"note ? (note.count < 100 ? note.count : '99+') : null\"\n    [ngClass]=\"{ badge: !!note }\"\n    [routerLink]=\"[{ outlets: { aside: 'notifications' } }]\"\n    routerLinkActive=\"active\"\n    matTooltipPosition=\"after\"\n    [matTooltip]=\"'yuv.shell.notifications.title' | translate\"\n  >\n    <mat-icon>notifications</mat-icon>\n  </button>\n</ng-template>\n", styles: [":host{display:block}:host button.badge{--badge-background: var(--mat-sys-primary-container);--badge-color: var(--mat-sys-on-primary-container)}:host button.badge.alert{--badge-background: var(--ymt-danger);--badge-color: var(--ymt-on-danger)}:host button.badge.warning{--badge-background: var(--ymt-warning);--badge-color: var(--ymt-on-warning)}:host button.badge.success{--badge-background: var(--ymt-success);--badge-color: var(--ymt-on-success)}:host button.badge:before{content:attr(data-count);background-color:var(--badge-background);color:var(--badge-color);outline:1px solid var(--badge-color);padding:0 .25em;position:absolute;inset-block-start:0;inset-inline-end:0;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:var(--ymt-font-body-subtle-size);z-index:10;border-radius:var(--ymt-corner-full);pointer-events:none}:host.small-screen nav{display:flex;align-items:center;justify-content:space-between;width:100vw;padding:var(--ymt-sizing-s) var(--ymt-sizing-m);gap:var(--ymt-spacing-s)}:host.small-screen nav .menu{display:flex;align-items:center;gap:var(--ymt-spacing-s);flex:1 1 auto;overflow:hidden}:host.small-screen nav .menu .app-label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}:host.small-screen nav .notifications{display:flex;align-items:center}:host:not(.small-screen) .sidenav{height:100%;width:var(--yuv-side-nav-width, var(--ymt-sizing-6xl));background:transparent;color:inherit;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:var(--ymt-spacing-m)}:host:not(.small-screen) .sidenav .logo-container{width:100%}:host:not(.small-screen) .sidenav .app-switcher-container{flex:1 1 0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--ymt-spacing-xs)}:host:not(.small-screen) .sidenav .app-switcher-container yuv-overflow-menu{height:100%;--menu-item-gap: 18px}:host:not(.small-screen) .sidenav .app-switcher-container{scrollbar-width:none;-ms-overflow-style:none}:host:not(.small-screen) .sidenav .app-switcher-container::-webkit-scrollbar{display:none}:host:not(.small-screen) .sidenav .actions-container{justify-self:flex-end;border-top:var(--ymt-outline-width) solid var(--ymt-outline-variant);display:flex;flex-direction:column;gap:var(--ymt-spacing-s);padding:var(--ymt-spacing-m) 0}\n"], dependencies: [{ kind: "component", type: ShellLogoComponent, selector: "yuv-shell-logo" }, { kind: "directive", type: YmtIconButtonDirective, selector: "button[ymtIconButton],button[ymt-icon-button],a[ymtIconButton],a[ymt-icon-button]", inputs: ["disabled", "disableRipple", "aria-disabled", "disabledInteractive", "icon-button-size"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i5.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: OverflowMenuComponent, selector: "yuv-overflow-menu", inputs: ["overflowIcon", "groupLabels", "menuItems", "vertical"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: SidebarNavComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: SidebarNavComponent, isStandalone: true, selector: "yuv-sidebar-nav", host: { properties: { "class.small-screen": "smallScreenLayout()" }, classAttribute: "sidenav" }, ngImport: i0, template: "<nav class=\"sidenav\" [attr.aria-label]=\"'yuv.shell.side-nav.aria.label' | translate\">\n  @let iconsRegistered = registerIcons();\n  @let showAppHeader = css.appHeader();\n\n  @let a = app();\n  @if (smallScreenLayout()) {\n    <div class=\"menu\">\n      <button mat-icon-button [matMenuTriggerFor]=\"menu\">\n        <mat-icon>menu</mat-icon>\n      </button>\n      @if (a) {\n        <span class=\"app-label\">{{ a.title }}</span>\n      }\n    </div>\n\n    @if (showNotifications()) {\n      <div class=\"notifications\">\n        <ng-container *ngTemplateOutlet=\"notificationButton; context: { $implicit: newNotifications() }\"></ng-container>\n      </div>\n    }\n    <mat-menu #menu=\"matMenu\" class=\"sort-menu\" [ariaLabel]=\"'yuv.sort.tooltip' | translate\">\n      @for (a of navApps(); track a.path) {\n        <button mat-menu-item [routerLink]=\"a.path\">\n          @if (a.svgIcon) {\n            @if (iconsRegistered) {\n              <mat-icon [svgIcon]=\"'shellIcons:' + a.iconName\"></mat-icon>\n            }\n          } @else {\n            <mat-icon>{{ a.iconName }}</mat-icon>\n          }\n          <span>{{ getAppTitle(a) }}</span>\n        </button>\n      }\n\n      <mat-divider></mat-divider>\n\n      @for (customButton of customActionButtons; track customButton.iconName) {\n        <button mat-menu-item (click)=\"handleCustomActionButtonClick(customButton)\">\n          <mat-icon>{{ customButton.iconName }}</mat-icon>\n          <span>{{ customButton.tooltip ? (customButton.tooltip | translate) : '' }}</span>\n        </button>\n      }\n      <button mat-menu-item [routerLink]=\"['/settings']\" routerLinkActive=\"active\">\n        <mat-icon>settings</mat-icon>\n        <span>{{ 'yuv.shell.settings.title' | translate }}</span>\n      </button>\n      <button mat-menu-item (click)=\"appLogout()\">\n        <mat-icon>power_settings_new</mat-icon>\n        <span>{{ 'yuv.shell.cmd.logout' | translate }}</span>\n      </button>\n    </mat-menu>\n  } @else {\n    <div class=\"logo-container\">\n      @if (iconsRegistered && !showAppHeader) {\n        <yuv-shell-logo slot=\"shell-logo\" class=\"shell-nav__shell-logo\" />\n      }\n    </div>\n    <div class=\"app-switcher-container\">\n      <yuv-overflow-menu [vertical]=\"true\" [menuItems]=\"navMenuItems()\" />\n    </div>\n    <div class=\"actions-container\">\n      @if (showNotifications()) {\n        <ng-container *ngTemplateOutlet=\"notificationButton; context: { $implicit: newNotifications() }\"></ng-container>\n      }\n      @for (customButton of customActionButtons; track customButton.iconName) {\n        <button\n          class=\"shell-nav__actions-button\"\n          ymt-icon-button\n          (click)=\"handleCustomActionButtonClick(customButton)\"\n          matTooltipPosition=\"after\"\n          [matTooltip]=\"customButton.tooltip ? (customButton.tooltip | translate) : ''\"\n        >\n          <mat-icon>{{ customButton.iconName }}</mat-icon>\n        </button>\n      }\n      <button\n        class=\"shell-nav__actions-button\"\n        ymt-icon-button\n        [routerLink]=\"['/settings']\"\n        routerLinkActive=\"active\"\n        [matTooltip]=\"'yuv.shell.settings.title' | translate\"\n      >\n        <mat-icon>settings</mat-icon>\n      </button>\n      <button class=\"shell-nav__actions-button\" ymt-icon-button (click)=\"appLogout()\" [matTooltip]=\"'yuv.shell.cmd.logout' | translate\">\n        <mat-icon>power_settings_new</mat-icon>\n      </button>\n    </div>\n  }\n</nav>\n\n<ng-template #notificationButton let-note>\n  <button\n    class=\"shell-nav__actions-button notes {{ note?.maxLevel }}\"\n    ymt-icon-button\n    [attr.data-count]=\"note ? (note.count < 100 ? note.count : '99+') : null\"\n    [ngClass]=\"{ badge: !!note }\"\n    [routerLink]=\"[{ outlets: { aside: 'notifications' } }]\"\n    routerLinkActive=\"active\"\n    matTooltipPosition=\"after\"\n    [matTooltip]=\"'yuv.shell.notifications.title' | translate\"\n  >\n    <mat-icon>notifications</mat-icon>\n  </button>\n</ng-template>\n", styles: [":host{display:block}:host button.badge{--badge-background: var(--mat-sys-primary-container);--badge-color: var(--mat-sys-on-primary-container)}:host button.badge.alert{--badge-background: var(--ymt-danger);--badge-color: var(--ymt-on-danger)}:host button.badge.warning{--badge-background: var(--ymt-warning);--badge-color: var(--ymt-on-warning)}:host button.badge.success{--badge-background: var(--ymt-success);--badge-color: var(--ymt-on-success)}:host button.badge:before{content:attr(data-count);background-color:var(--badge-background);color:var(--badge-color);outline:1px solid var(--badge-color);padding:0 .25em;position:absolute;inset-block-start:0;inset-inline-end:0;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:var(--ymt-font-body-subtle-size);z-index:10;border-radius:var(--ymt-corner-full);pointer-events:none}:host.small-screen nav{display:flex;align-items:center;justify-content:space-between;width:100vw;padding:var(--ymt-sizing-s) var(--ymt-sizing-m);gap:var(--ymt-spacing-s)}:host.small-screen nav .menu{display:flex;align-items:center;gap:var(--ymt-spacing-s);flex:1 1 auto;overflow:hidden}:host.small-screen nav .menu .app-label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}:host.small-screen nav .notifications{display:flex;align-items:center}:host:not(.small-screen) .sidenav{height:100%;width:var(--yuv-side-nav-width, var(--ymt-sizing-6xl));background:transparent;color:inherit;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:var(--ymt-spacing-m)}:host:not(.small-screen) .sidenav .logo-container{width:100%}:host:not(.small-screen) .sidenav .app-switcher-container{flex:1 1 0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--ymt-spacing-xs)}:host:not(.small-screen) .sidenav .app-switcher-container yuv-overflow-menu{height:100%;--menu-item-gap: 18px}:host:not(.small-screen) .sidenav .app-switcher-container{scrollbar-width:none;-ms-overflow-style:none}:host:not(.small-screen) .sidenav .app-switcher-container::-webkit-scrollbar{display:none}:host:not(.small-screen) .sidenav .actions-container{justify-self:flex-end;border-top:var(--ymt-outline-width) solid var(--ymt-outline-variant);display:flex;flex-direction:column;gap:var(--ymt-spacing-s);padding:var(--ymt-spacing-m) 0}\n"], dependencies: [{ kind: "component", type: ShellLogoComponent, selector: "yuv-shell-logo" }, { kind: "directive", type: YmtIconButtonDirective, selector: "button[ymtIconButton],button[ymt-icon-button],a[ymtIconButton],a[ymt-icon-button]", inputs: ["disabled", "disableRipple", "aria-disabled", "disabledInteractive", "icon-button-size"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i1$2.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i1$2.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i1$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i5.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "component", type: MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: OverflowMenuComponent, selector: "yuv-overflow-menu", inputs: ["overflowIcon", "groupLabels", "menuItems", "vertical"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: SidebarNavComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: SidebarNavComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-sidebar-nav', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
                         TranslatePipe,
@@ -461,10 +461,10 @@ class NotificationsPageComponent {
                 fc[0].focus();
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: NotificationsPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: NotificationsPageComponent, isStandalone: true, selector: "yuv-notifications", host: { listeners: { "keydown": "onKeydown($event)" } }, ngImport: i0, template: "<div class=\"notifications\" (yuvLightDismiss)=\"close()\" cdkTrapFocus>\n  <h2>{{ 'yuv.shell.notifications.title' | translate }}</h2>\n\n  @if (notifications()?.length) {\n    <yuv-list (itemSelect)=\"itemSelected($event)\" (itemFocus)=\"itemFocused($event)\">\n      @for (n of notifications(); track n.id) {\n        <div class=\"note {{ n.level }}\" [ngClass]=\"{ withRoute: n.targetRoute }\" yuvListItem>\n          <div class=\"icon\">\n            <mat-icon>{{ n.icon || 'notifications' }}</mat-icon>\n          </div>\n          <div class=\"received\">{{ n.timestamp | localeDate }}</div>\n          <div class=\"title\">{{ n.title }}</div>\n          <div class=\"description\">{{ n.description }}</div>\n          <div class=\"meta\"></div>\n\n          <button ymt-icon-button icon-button-size=\"small\" (click)=\"remove(n.id)\" matTooltip=\"{{ 'yuv.shell.notifications.button.remove' | translate }}\">\n            <mat-icon>delete</mat-icon>\n          </button>\n        </div>\n      }\n    </yuv-list>\n\n    <div class=\"actions\">\n      <button mat-button [hidden]=\"!notifications()?.length\" (click)=\"removeAll()\">\n        {{ 'yuv.shell.notifications.button.remove.all' | translate }}\n        <mat-icon>delete</mat-icon>\n      </button>\n    </div>\n  } @else {\n    <div class=\"empty\">\n      <p>{{ 'yuv.shell.notifications.empty' | translate }}</p>\n    </div>\n  }\n\n  <button mat-icon-button class=\"icon close\" (click)=\"close()\">\n    <mat-icon>close</mat-icon>\n  </button>\n</div>\n", styles: [":host{height:100%;display:flex}:host .notifications{background-color:var(--ymt-surface-panel);border-inline-end:1px solid var(--ymt-outline-variant);height:100%;overflow:hidden;box-sizing:border-box;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:1fr auto;grid-template-areas:\"title close\" \"list list\" \"actions actions\";gap:var(--ymt-spacing-m);max-width:30vw;min-width:300px;animation:dialogAppear .2s ease-in-out}:host .notifications h2{color:var(--ymt-text-color-subtle);grid-area:title;margin:0;padding:var(--ymt-spacing-m);align-self:center;text-overflow:ellipsis;overflow:hidden}:host .notifications .actions{grid-area:actions;display:flex;justify-content:start;padding:var(--ymt-spacing-xs) var(--ymt-spacing-m);border-block-start:1px solid var(--ymt-outline-variant)}:host .notifications .close{grid-area:close;margin:var(--ymt-spacing-m)}:host .notifications yuv-list,:host .notifications .empty{grid-area:list}:host .notifications .empty{display:grid;align-items:center;justify-content:center;color:var(--ymt-text-color-subtle)}:host .notifications .note{--level-background-color: transparent;--level-color: currentColor;display:grid;grid-template-rows:auto auto auto auto;grid-template-columns:auto 1fr auto;grid-template-areas:\". received actions\" \"icon title actions\" \". description description\" \". meta meta\";row-gap:var(--ymt-spacing-2xs);column-gap:var(--ymt-spacing-xs);align-items:center;padding:var(--ymt-spacing-s) var(--ymt-spacing-xs);padding-inline-start:var(--ymt-spacing-m);border-block-start:1px solid var(--ymt-outline-variant);cursor:default}:host .notifications .note.withRoute{cursor:pointer}:host .notifications .note.alert{--level-background-color: var(--ymt-danger);--level-color: var(--ymt-on-danger)}:host .notifications .note.warning{--level-background-color: var(--ymt-warning);--level-color: var(--ymt-on-warning)}:host .notifications .note.success{--level-background-color: var(--ymt-success);--level-color: var(--ymt-on-success)}:host .notifications .note:hover,:host .notifications .note[aria-current=true]{background-color:var(--ymt-focus-background)}:host .notifications .note:hover button,:host .notifications .note[aria-current=true] button{opacity:1}:host .notifications .note .icon{grid-area:icon;display:flex;background-color:var(--level-background-color);color:var(--level-color);border-radius:var(--ymt-corner-full);aspect-ratio:1/1;margin-inline-end:var(--ymt-spacing-s);box-shadow:0 0 0 4px var(--level-background-color)}:host .notifications .note .title{font-weight:700;grid-area:title;color:var(--ymt-text-color)}:host .notifications .note .description{grid-area:description;color:var(--ymt-text-color-subtle)}:host .notifications .note .meta{grid-area:meta}:host .notifications .note .received{grid-area:received;font-size:var(--ymt-font-body-subtle-size);color:var(--ymt-text-color-subtle)}:host .notifications .note button{grid-area:actions;color:var(--ymt-text-color-subtle)}@keyframes dialogAppear{0%{opacity:0;transform:translate(calc(var(--ymt-spacing-m) * -1))}to{opacity:1;transform:translate(0)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: LightDismissDirective, selector: "[yuvLightDismiss]", outputs: ["yuvLightDismiss"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: YmtIconButtonDirective, selector: "button[ymtIconButton],button[ymt-icon-button],a[ymtIconButton],a[ymt-icon-button]", inputs: ["disabled", "disableRipple", "aria-disabled", "disabledInteractive", "icon-button-size"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "ngmodule", type: YuvListModule }, { kind: "component", type: i5$1.ListComponent, selector: "yuv-list", inputs: ["preventChangeUntil", "multiselect", "selfHandleSelection", "externalSelectionVisuals", "selfHandleClick", "autoSelect", "disableSelection"], outputs: ["itemSelect", "itemFocus"] }, { kind: "directive", type: i5$1.ListItemDirective, selector: "[yuvListItem]", inputs: ["disabled", "active", "selected"] }, { kind: "pipe", type: LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: NotificationsPageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: NotificationsPageComponent, isStandalone: true, selector: "yuv-notifications", host: { listeners: { "keydown": "onKeydown($event)" } }, ngImport: i0, template: "<div class=\"notifications\" (yuvLightDismiss)=\"close()\" cdkTrapFocus>\n  <h2>{{ 'yuv.shell.notifications.title' | translate }}</h2>\n\n  @if (notifications()?.length) {\n    <yuv-list (itemSelect)=\"itemSelected($event)\" (itemFocus)=\"itemFocused($event)\">\n      @for (n of notifications(); track n.id) {\n        <div class=\"note {{ n.level }}\" [ngClass]=\"{ withRoute: n.targetRoute }\" yuvListItem>\n          <div class=\"icon\">\n            <mat-icon>{{ n.icon || 'notifications' }}</mat-icon>\n          </div>\n          <div class=\"received\">{{ n.timestamp | localeDate }}</div>\n          <div class=\"title\">{{ n.title }}</div>\n          <div class=\"description\">{{ n.description }}</div>\n          <div class=\"meta\"></div>\n\n          <button ymt-icon-button icon-button-size=\"small\" (click)=\"remove(n.id)\" matTooltip=\"{{ 'yuv.shell.notifications.button.remove' | translate }}\">\n            <mat-icon>delete</mat-icon>\n          </button>\n        </div>\n      }\n    </yuv-list>\n\n    <div class=\"actions\">\n      <button mat-button [hidden]=\"!notifications()?.length\" (click)=\"removeAll()\">\n        {{ 'yuv.shell.notifications.button.remove.all' | translate }}\n        <mat-icon>delete</mat-icon>\n      </button>\n    </div>\n  } @else {\n    <div class=\"empty\">\n      <p>{{ 'yuv.shell.notifications.empty' | translate }}</p>\n    </div>\n  }\n\n  <button mat-icon-button class=\"icon close\" (click)=\"close()\">\n    <mat-icon>close</mat-icon>\n  </button>\n</div>\n", styles: [":host{height:100%;display:flex}:host .notifications{background-color:var(--ymt-surface-panel);border-inline-end:1px solid var(--ymt-outline-variant);height:100%;overflow:hidden;box-sizing:border-box;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:1fr auto;grid-template-areas:\"title close\" \"list list\" \"actions actions\";gap:var(--ymt-spacing-m);max-width:30vw;min-width:300px;animation:dialogAppear .2s ease-in-out}:host .notifications h2{color:var(--ymt-text-color-subtle);grid-area:title;margin:0;padding:var(--ymt-spacing-m);align-self:center;text-overflow:ellipsis;overflow:hidden}:host .notifications .actions{grid-area:actions;display:flex;justify-content:start;padding:var(--ymt-spacing-xs) var(--ymt-spacing-m);border-block-start:1px solid var(--ymt-outline-variant)}:host .notifications .close{grid-area:close;margin:var(--ymt-spacing-m)}:host .notifications yuv-list,:host .notifications .empty{grid-area:list}:host .notifications .empty{display:grid;align-items:center;justify-content:center;color:var(--ymt-text-color-subtle)}:host .notifications .note{--level-background-color: transparent;--level-color: currentColor;display:grid;grid-template-rows:auto auto auto auto;grid-template-columns:auto 1fr auto;grid-template-areas:\". received actions\" \"icon title actions\" \". description description\" \". meta meta\";row-gap:var(--ymt-spacing-2xs);column-gap:var(--ymt-spacing-xs);align-items:center;padding:var(--ymt-spacing-s) var(--ymt-spacing-xs);padding-inline-start:var(--ymt-spacing-m);border-block-start:1px solid var(--ymt-outline-variant);cursor:default}:host .notifications .note.withRoute{cursor:pointer}:host .notifications .note.alert{--level-background-color: var(--ymt-danger);--level-color: var(--ymt-on-danger)}:host .notifications .note.warning{--level-background-color: var(--ymt-warning);--level-color: var(--ymt-on-warning)}:host .notifications .note.success{--level-background-color: var(--ymt-success);--level-color: var(--ymt-on-success)}:host .notifications .note:hover,:host .notifications .note[aria-current=true]{background-color:var(--ymt-focus-background)}:host .notifications .note:hover button,:host .notifications .note[aria-current=true] button{opacity:1}:host .notifications .note .icon{grid-area:icon;display:flex;background-color:var(--level-background-color);color:var(--level-color);border-radius:var(--ymt-corner-full);aspect-ratio:1/1;margin-inline-end:var(--ymt-spacing-s);box-shadow:0 0 0 4px var(--level-background-color)}:host .notifications .note .title{font-weight:700;grid-area:title;color:var(--ymt-text-color)}:host .notifications .note .description{grid-area:description;color:var(--ymt-text-color-subtle)}:host .notifications .note .meta{grid-area:meta}:host .notifications .note .received{grid-area:received;font-size:var(--ymt-font-body-subtle-size);color:var(--ymt-text-color-subtle)}:host .notifications .note button{grid-area:actions;color:var(--ymt-text-color-subtle)}@keyframes dialogAppear{0%{opacity:0;transform:translate(calc(var(--ymt-spacing-m) * -1))}to{opacity:1;transform:translate(0)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: LightDismissDirective, selector: "[yuvLightDismiss]", outputs: ["yuvLightDismiss"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatButton, selector: "    button[matButton], a[matButton], button[mat-button], button[mat-raised-button],    button[mat-flat-button], button[mat-stroked-button], a[mat-button], a[mat-raised-button],    a[mat-flat-button], a[mat-stroked-button]  ", inputs: ["matButton"], exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: YmtIconButtonDirective, selector: "button[ymtIconButton],button[ymt-icon-button],a[ymtIconButton],a[ymt-icon-button]", inputs: ["disabled", "disableRipple", "aria-disabled", "disabledInteractive", "icon-button-size"] }, { kind: "directive", type: CdkTrapFocus, selector: "[cdkTrapFocus]", inputs: ["cdkTrapFocus", "cdkTrapFocusAutoCapture"], exportAs: ["cdkTrapFocus"] }, { kind: "ngmodule", type: YuvListModule }, { kind: "component", type: i5$1.ListComponent, selector: "yuv-list", inputs: ["preventChangeUntil", "multiselect", "selfHandleSelection", "externalSelectionVisuals", "selfHandleClick", "autoSelect", "disableSelection"], outputs: ["itemSelect", "itemFocus"] }, { kind: "directive", type: i5$1.ListItemDirective, selector: "[yuvListItem]", inputs: ["disabled", "active", "selected"] }, { kind: "pipe", type: LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: TranslatePipe, name: "translate" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: NotificationsPageComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: NotificationsPageComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-notifications', standalone: true, imports: [
                         CommonModule,
@@ -487,10 +487,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
  * open dialogs.
  */
 class DialogTrackingComponent {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: DialogTrackingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: DialogTrackingComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: '', isInline: true }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: DialogTrackingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.20", type: DialogTrackingComponent, isStandalone: true, selector: "ng-component", ngImport: i0, template: '', isInline: true }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: DialogTrackingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: DialogTrackingComponent, decorators: [{
             type: Component,
             args: [{
                     template: ''
@@ -529,11 +529,11 @@ const closeDialogGuard = (component, currentRoute, nextState) => {
 };
 
 const clientShellRoutes = [
-    { path: 'dashboard', loadComponent: () => import('./yuuvis-client-shell-dashboard.component-C0X3JNTk.mjs').then((comp) => comp.DashboardPageComponent) },
+    { path: 'dashboard', loadComponent: () => import('./yuuvis-client-shell-dashboard.component-CZsvboQJ.mjs').then((comp) => comp.DashboardPageComponent) },
     { path: 'notifications', component: NotificationsPageComponent, outlet: 'aside' },
     // tracking outlet for dialogs
     { path: 'dialogs/:id', component: DialogTrackingComponent, outlet: 'dt', canDeactivate: [closeDialogGuard] },
-    { path: 'settings', loadComponent: () => import('./yuuvis-client-shell-settings.component-DBAxwdjk.mjs').then((comp) => comp.SettingsPageComponent) },
+    { path: 'settings', loadComponent: () => import('./yuuvis-client-shell-settings.component-CF1lK9mL.mjs').then((comp) => comp.SettingsPageComponent) },
     // default route
     { path: '', redirectTo: '/dashboard', pathMatch: 'full' },
     // redirecting route
@@ -681,10 +681,10 @@ class ClientShellComponent {
         this.router.resetConfig(this.router.config);
         this.requestSubscription();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ClientShellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: ClientShellComponent, isStandalone: true, selector: "yuv-client-shell", inputs: { apps: { classPropertyName: "apps", publicName: "apps", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, supportsSmallScreens: { classPropertyName: "supportsSmallScreens", publicName: "supportsSmallScreens", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "dragover": "onDragOver($event)" }, properties: { "class.small-screen": "smallScreenLayout()" } }, providers: [SafeHtmlPipe], ngImport: i0, template: "<yuv-metadata-default-templates></yuv-metadata-default-templates>\n\n<!-- @let iconsRegistered = registerIcons(); -->\n@let showAppHeader = css.appHeader();\n\n<!-- gloabl busy indicator if app header is present, it will deal with busy indication -->\n@if (!showAppHeader && (busy$ | async)) {\n  <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n}\n@if (showAppHeader) {\n  <yuv-app-header> </yuv-app-header>\n}\n<yuv-sidebar-nav></yuv-sidebar-nav>\n\n<main id=\"main-shell_content\" aria-label=\"main shell content\" [inert]=\"asideOutlet.isActivated\">\n  <router-outlet></router-outlet>\n</main>\n\n<!-- outlet for aside modals like notifications -->\n<div class=\"asideOutlet\" [hidden]=\"!asideOutlet.isActivated\">\n  <router-outlet name=\"aside\" #asideOutlet=\"outlet\"></router-outlet>\n</div>\n\n<div id=\"fi\" inert></div>\n<!-- dialog tracking outlet -->\n<router-outlet name=\"dt\"></router-outlet>\n", styles: [":host{display:block}:host button.badge{--badge-background: var(--mat-sys-primary-container);--badge-color: var(--mat-sys-on-primary-container)}:host button.badge.alert{--badge-background: var(--ymt-danger);--badge-color: var(--ymt-on-danger)}:host button.badge.warning{--badge-background: var(--ymt-warning);--badge-color: var(--ymt-on-warning)}:host button.badge.success{--badge-background: var(--ymt-success);--badge-color: var(--ymt-on-success)}:host button.badge:before{content:attr(data-count);background-color:var(--badge-background);color:var(--badge-color);outline:1px solid var(--badge-color);padding:0 .25em;position:absolute;inset-block-start:0;inset-inline-end:0;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:var(--ymt-font-body-subtle-size);z-index:10;border-radius:var(--ymt-corner-full);pointer-events:none}:host.small-screen nav{display:flex;align-items:center;justify-content:space-between;width:100vw;padding:var(--ymt-sizing-s) var(--ymt-sizing-m);gap:var(--ymt-spacing-s)}:host.small-screen nav .menu{display:flex;align-items:center;gap:var(--ymt-spacing-s);flex:1 1 auto;overflow:hidden}:host.small-screen nav .menu .app-label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}:host.small-screen nav .notifications{display:flex;align-items:center}:host:not(.small-screen) .sidenav{height:100%;width:var(--yuv-side-nav-width, var(--ymt-sizing-6xl));background:transparent;color:inherit;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:var(--ymt-spacing-m)}:host:not(.small-screen) .sidenav .logo-container{width:100%}:host:not(.small-screen) .sidenav .app-switcher-container{flex:1 1 0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--ymt-spacing-xs)}:host:not(.small-screen) .sidenav .app-switcher-container yuv-overflow-menu{height:100%;--menu-item-gap: 18px}:host:not(.small-screen) .sidenav .app-switcher-container{scrollbar-width:none;-ms-overflow-style:none}:host:not(.small-screen) .sidenav .app-switcher-container::-webkit-scrollbar{display:none}:host:not(.small-screen) .sidenav .actions-container{justify-self:flex-end;border-top:var(--ymt-outline-width) solid var(--ymt-outline-variant);display:flex;flex-direction:column;gap:var(--ymt-spacing-s);padding:var(--ymt-spacing-m) 0}:host{position:absolute;inset:0;overflow:hidden;background-color:var(--ymt-surface-app);display:grid;grid-template-rows:auto 1fr;grid-template-columns:auto 1fr;grid-template-areas:\"appheader appheader\" \"nav main\"}:host.small-screen{grid-template-rows:auto 1fr auto;grid-template-columns:1fr;grid-template-areas:\"appheader\" \"main\" \"nav\"}:host .progress-bar{position:absolute}:host yuv-app-header{grid-area:appheader}:host yuv-sidebar-nav{grid-area:nav}:host main{grid-area:main;overflow:hidden;color:var(--ymt-text-color)}:host .asideOutlet{position:absolute;inset:0;z-index:1000;background-color:var(--ymt-overlay-backdrop-color)}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: YuvMetadataFormDefaultsModule }, { kind: "component", type: i2$1.MetadataDefaultTemplatesComponent, selector: "yuv-metadata-default-templates" }, { kind: "component", type: YuvAppHeaderComponent, selector: "yuv-app-header" }, { kind: "component", type: SidebarNavComponent, selector: "yuv-sidebar-nav" }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ClientShellComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.20", type: ClientShellComponent, isStandalone: true, selector: "yuv-client-shell", inputs: { apps: { classPropertyName: "apps", publicName: "apps", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, supportsSmallScreens: { classPropertyName: "supportsSmallScreens", publicName: "supportsSmallScreens", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "dragover": "onDragOver($event)" }, properties: { "class.small-screen": "smallScreenLayout()" } }, providers: [SafeHtmlPipe], ngImport: i0, template: "<yuv-metadata-default-templates></yuv-metadata-default-templates>\n\n<!-- @let iconsRegistered = registerIcons(); -->\n@let showAppHeader = css.appHeader();\n\n<!-- gloabl busy indicator if app header is present, it will deal with busy indication -->\n@if (!showAppHeader && (busy$ | async)) {\n  <mat-progress-bar mode=\"indeterminate\" class=\"progress-bar\"></mat-progress-bar>\n}\n@if (showAppHeader) {\n  <yuv-app-header> </yuv-app-header>\n}\n<yuv-sidebar-nav></yuv-sidebar-nav>\n\n<main id=\"main-shell_content\" aria-label=\"main shell content\" [inert]=\"asideOutlet.isActivated\">\n  <router-outlet></router-outlet>\n</main>\n\n<!-- outlet for aside modals like notifications -->\n<div class=\"asideOutlet\" [hidden]=\"!asideOutlet.isActivated\">\n  <router-outlet name=\"aside\" #asideOutlet=\"outlet\"></router-outlet>\n</div>\n\n<div id=\"fi\" inert></div>\n<!-- dialog tracking outlet -->\n<router-outlet name=\"dt\"></router-outlet>\n", styles: [":host{display:block}:host button.badge{--badge-background: var(--mat-sys-primary-container);--badge-color: var(--mat-sys-on-primary-container)}:host button.badge.alert{--badge-background: var(--ymt-danger);--badge-color: var(--ymt-on-danger)}:host button.badge.warning{--badge-background: var(--ymt-warning);--badge-color: var(--ymt-on-warning)}:host button.badge.success{--badge-background: var(--ymt-success);--badge-color: var(--ymt-on-success)}:host button.badge:before{content:attr(data-count);background-color:var(--badge-background);color:var(--badge-color);outline:1px solid var(--badge-color);padding:0 .25em;position:absolute;inset-block-start:0;inset-inline-end:0;max-width:100%;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-size:var(--ymt-font-body-subtle-size);z-index:10;border-radius:var(--ymt-corner-full);pointer-events:none}:host.small-screen nav{display:flex;align-items:center;justify-content:space-between;width:100vw;padding:var(--ymt-sizing-s) var(--ymt-sizing-m);gap:var(--ymt-spacing-s)}:host.small-screen nav .menu{display:flex;align-items:center;gap:var(--ymt-spacing-s);flex:1 1 auto;overflow:hidden}:host.small-screen nav .menu .app-label{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}:host.small-screen nav .notifications{display:flex;align-items:center}:host:not(.small-screen) .sidenav{height:100%;width:var(--yuv-side-nav-width, var(--ymt-sizing-6xl));background:transparent;color:inherit;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:var(--ymt-spacing-m)}:host:not(.small-screen) .sidenav .logo-container{width:100%}:host:not(.small-screen) .sidenav .app-switcher-container{flex:1 1 0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--ymt-spacing-xs)}:host:not(.small-screen) .sidenav .app-switcher-container yuv-overflow-menu{height:100%;--menu-item-gap: 18px}:host:not(.small-screen) .sidenav .app-switcher-container{scrollbar-width:none;-ms-overflow-style:none}:host:not(.small-screen) .sidenav .app-switcher-container::-webkit-scrollbar{display:none}:host:not(.small-screen) .sidenav .actions-container{justify-self:flex-end;border-top:var(--ymt-outline-width) solid var(--ymt-outline-variant);display:flex;flex-direction:column;gap:var(--ymt-spacing-s);padding:var(--ymt-spacing-m) 0}:host{position:absolute;inset:0;overflow:hidden;background-color:var(--ymt-surface-app);display:grid;grid-template-rows:auto 1fr;grid-template-columns:auto 1fr;grid-template-areas:\"appheader appheader\" \"nav main\"}:host.small-screen{grid-template-rows:auto 1fr auto;grid-template-columns:1fr;grid-template-areas:\"appheader\" \"main\" \"nav\"}:host .progress-bar{position:absolute}:host yuv-app-header{grid-area:appheader}:host yuv-sidebar-nav{grid-area:nav}:host main{grid-area:main;overflow:hidden;color:var(--ymt-text-color)}:host .asideOutlet{position:absolute;inset:0;z-index:1000;background-color:var(--ymt-overlay-backdrop-color)}\n"], dependencies: [{ kind: "ngmodule", type: RouterModule }, { kind: "directive", type: i5.RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "ngmodule", type: YuvMetadataFormDefaultsModule }, { kind: "component", type: i2$1.MetadataDefaultTemplatesComponent, selector: "yuv-metadata-default-templates" }, { kind: "component", type: YuvAppHeaderComponent, selector: "yuv-app-header" }, { kind: "component", type: SidebarNavComponent, selector: "yuv-sidebar-nav" }, { kind: "component", type: MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ClientShellComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ClientShellComponent, decorators: [{
             type: Component,
             args: [{ selector: 'yuv-client-shell', standalone: true, imports: [
                         AsyncPipe,
@@ -720,10 +720,10 @@ class YuvAppHeaderSlotDirective {
     ngOnInit() {
         this.#clientShellService.addAppHeaderSlot(this.yuvAppHeaderSlot(), this.#tplRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YuvAppHeaderSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.12", type: YuvAppHeaderSlotDirective, isStandalone: true, selector: "ng-template[yuvAppHeaderSlot]", inputs: { yuvAppHeaderSlot: { classPropertyName: "yuvAppHeaderSlot", publicName: "yuvAppHeaderSlot", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: YuvAppHeaderSlotDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.20", type: YuvAppHeaderSlotDirective, isStandalone: true, selector: "ng-template[yuvAppHeaderSlot]", inputs: { yuvAppHeaderSlot: { classPropertyName: "yuvAppHeaderSlot", publicName: "yuvAppHeaderSlot", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YuvAppHeaderSlotDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: YuvAppHeaderSlotDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'ng-template[yuvAppHeaderSlot]'
@@ -734,11 +734,11 @@ const cmp = [
     YuvAppHeaderSlotDirective,
 ];
 class YuvClientShellModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YuvClientShellModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.12", ngImport: i0, type: YuvClientShellModule, imports: [YuvAppHeaderSlotDirective], exports: [YuvAppHeaderSlotDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YuvClientShellModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: YuvClientShellModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.20", ngImport: i0, type: YuvClientShellModule, imports: [YuvAppHeaderSlotDirective], exports: [YuvAppHeaderSlotDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: YuvClientShellModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: YuvClientShellModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: YuvClientShellModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [cmp],
@@ -758,10 +758,10 @@ class InertDirective {
                 el.removeAttribute('inert');
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: InertDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.12", type: InertDirective, isStandalone: true, selector: "[inert]", inputs: { inert: { classPropertyName: "inert", publicName: "inert", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: InertDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.2.20", type: InertDirective, isStandalone: true, selector: "[inert]", inputs: { inert: { classPropertyName: "inert", publicName: "inert", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: InertDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: InertDirective, decorators: [{
             type: Directive,
             args: [{
                     // eslint-disable-next-line @angular-eslint/directive-selector
@@ -779,10 +779,10 @@ class ShellWidgetsService {
     concealShellWidgets(ids) {
         ids.forEach((id) => this.#widgetGridRegistry.removeRegisteredWidget(id));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ShellWidgetsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
-    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ShellWidgetsService, providedIn: 'root' }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ShellWidgetsService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ShellWidgetsService, providedIn: 'root' }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ShellWidgetsService, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.20", ngImport: i0, type: ShellWidgetsService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@yuuvis/client-shell",
-  "version": "3.14.1",
+  "version": "3.16.0",
   "author": "OPTIMAL SYSTEMS GmbH <npm@optimal-systems.de>",
   "license": "MIT",
   "peerDependencies": {
-    "@angular/common": "^21.2.9",
-    "@angular/core": "^21.2.9",
-    "@angular/service-worker": "^21.2.9",
-    "@yuuvis/client-core": "^3.14.1",
-    "@yuuvis/client-shell-core": "^3.14.1",
-    "@yuuvis/client-framework": "^3.14.1"
+    "@angular/common": "^21.2.19",
+    "@angular/core": "^21.2.19",
+    "@angular/service-worker": "^21.2.19",
+    "@yuuvis/client-core": "^3.16.0",
+    "@yuuvis/client-shell-core": "^3.16.0",
+    "@yuuvis/client-framework": "^3.16.0"
   },
   "dependencies": {
     "tslib": "^2.3.0"