barsa-tiles 2.2.48 → 2.2.49

package/fesm2022/barsa-tiles.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, Component, ChangeDetectionStrategy, Input, Directive, inject, ChangeDetectorRef, HostListener, Pipe, HostBinding, EventEmitter, Output, ElementRef, ViewChild, signal, TemplateRef, Inject, ViewContainerRef, NgModule, APP_INITIALIZER, NO_ERRORS_SCHEMA } from '@angular/core';
+import { Injectable, Component, ChangeDetectionStrategy, Input, Directive, inject, ChangeDetectorRef, ViewContainerRef, HostListener, Pipe, HostBinding, EventEmitter, Output, ElementRef, ViewChild, signal, TemplateRef, Inject, NgModule, APP_INITIALIZER, NO_ERRORS_SCHEMA } from '@angular/core';
 import * as i1 from 'barsa-novin-ray-core';
 import { BarsaApi, TilePropsComponent, BaseComponent, BaseDirective, LocalStorageService, PreventDefaulEvent, getDeviceIsMobile, fromIntersectionObserver, IntersectionStatus, GroupByService, APP_VERSION, getDeviceIsDesktop, getDeviceIsTablet, LogService, BreadcrumbService, PortalService, RoutingService, EmptyPageComponent, AuthGuard, PortalPageResolver, TileGroupBreadcrumResolver, BaseModule, BarsaNovinRayCoreModule } from 'barsa-novin-ray-core';
 import { Subject, BehaviorSubject, of, from, takeUntil as takeUntil$1, filter as filter$1, interval, combineLatest, forkJoin } from 'rxjs';
@@ -10,35 +10,35 @@ import * as i1$3 from '@fundamental-ngx/core/tile';
 import * as i1$4 from '@angular/common';
 import { DOCUMENT, CommonModule, LowerCasePipe } from '@angular/common';
 import * as i2 from '@fundamental-ngx/core/button';
-import * as i4 from '@fundamental-ngx/core/list';
-import * as i4$1 from '@fundamental-ngx/core/menu';
+import * as i4$1 from '@fundamental-ngx/core/list';
+import * as i4$2 from '@fundamental-ngx/core/menu';
 import * as i1$2 from '@fundamental-ngx/core/icon';
-import * as i7 from 'barsa-sap-ui';
-import { BarsaTreeItemComponent, ReportNavigatorComponent, BarsaSapUiModule } from 'barsa-sap-ui';
+import * as i4 from 'barsa-sap-ui';
+import { MaskComponent, BarsaTreeItemComponent, ReportNavigatorComponent, BarsaSapUiModule } from 'barsa-sap-ui';
 import * as i1$5 from '@angular/router';
 import { Router, ActivatedRoute, RouterModule } from '@angular/router';
 import * as i3 from '@angular/cdk/drag-drop';
 import { moveItemInArray, transferArrayItem, DragDropModule } from '@angular/cdk/drag-drop';
-import * as i4$2 from '@fundamental-ngx/core/busy-indicator';
-import * as i7$1 from '@fundamental-ngx/core/layout-panel';
+import * as i4$3 from '@fundamental-ngx/core/busy-indicator';
+import * as i7 from '@fundamental-ngx/core/layout-panel';
 import * as i8 from '@fundamental-ngx/core/title';
 import * as i9 from '@fundamental-ngx/core/panel';
 import * as i5 from '@fundamental-ngx/core/toolbar';
 import * as i1$6 from '@fundamental-ngx/core/avatar';
 import * as i1$7 from '@fundamental-ngx/core/card';
-import * as i4$3 from '@fundamental-ngx/core/fixed-card-layout';
+import * as i4$4 from '@fundamental-ngx/core/fixed-card-layout';
 import * as i1$8 from '@angular/forms';
 import { UntypedFormControl, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i6 from '@fundamental-ngx/core/input-group';
-import * as i4$4 from '@fundamental-ngx/core/bar';
+import * as i4$5 from '@fundamental-ngx/core/bar';
 import * as i5$1 from '@fundamental-ngx/core/form';
-import * as i7$2 from '@fundamental-ngx/core/dialog';
+import * as i7$1 from '@fundamental-ngx/core/dialog';
 import * as i9$1 from '@fundamental-ngx/cdk/utils';
 import * as i9$2 from '@fundamental-ngx/platform';
 import { IconTabBarComponent, IconTabBarTabComponent, IconTabBarTabContentDirective } from '@fundamental-ngx/platform';
 import * as i2$1 from '@angular/cdk/scrolling';
 import * as i5$2 from '@fundamental-ngx/core/dynamic-page';
-import * as i7$3 from '@fundamental-ngx/core/switch';
+import * as i7$2 from '@fundamental-ngx/core/switch';
 import * as i2$2 from 'barsa-echarts';
 import { BarsaEchartsModule } from 'barsa-echarts';
 import * as i2$3 from '@fundamental-ngx/core/carousel';
@@ -48,7 +48,7 @@ import * as i8$1 from '@fundamental-ngx/core/product-switch';
 import * as i9$3 from '@fundamental-ngx/core/popover';
 import * as i10 from '@fundamental-ngx/core/shellbar';
 import * as i3$2 from '@fundamental-ngx/core/breadcrumb';
-import * as i4$5 from '@fundamental-ngx/core/dynamic-side-content';
+import * as i4$6 from '@fundamental-ngx/core/dynamic-side-content';
 import * as i5$4 from '@fundamental-ngx/core/message-page';
 import { CdkTableModule } from '@angular/cdk/table';
 import { SplitterModule } from '@fundamental-ngx/btp/splitter';
@@ -741,7 +741,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class FooterTileComponent extends BaseComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FooterTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FooterTileComponent, selector: "bt-footer-tile,div[bt-footer-tile]", inputs: { firstSection: "firstSection", secondSection: "secondSection", twoColumn: "twoColumn" }, usesInheritance: true, ngImport: i0, template: "@if (twoColumn) {\r\n<div fd-tile-section>\r\n    <fd-icon fd-tile-refresh [font]=\"firstSection.Icon | sapFont\" [glyph]=\"firstSection.Icon\"></fd-icon>\r\n    <span fd-tile-footer-text>{{ firstSection.Text | bbbTranslate }}</span>\r\n</div>\r\n<div fd-tile-section>\r\n    <fd-icon fd-tile-refresh [font]=\"secondSection.Icon | sapFont\" [glyph]=\"secondSection.Icon\"></fd-icon>\r\n    <span fd-tile-footer-text>{{ secondSection.Text | bbbTranslate }}</span>\r\n</div>\r\n} @else {\r\n<fd-icon fd-tile-refresh [font]=\"firstSection.Icon | sapFont\" [glyph]=\"firstSection.Icon\"></fd-icon>\r\n<span fd-tile-footer-text>{{ firstSection.Text | bbbTranslate }}</span>\r\n}\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: i1$3.TileSectionDirective, selector: "[fdTileSection], [fd-tile-section]" }, { kind: "directive", type: i1$3.TileRefreshDirective, selector: "[fdTileRefresh], [fd-tile-refresh]", inputs: ["glyph", "glyphFont", "class", "ariaLabel"] }, { kind: "directive", type: i1$3.TileFooterTextDirective, selector: "[fdTileFooterText], [fd-tile-footer-text]" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i7.SapFontPipe, name: "sapFont" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FooterTileComponent, selector: "bt-footer-tile,div[bt-footer-tile]", inputs: { firstSection: "firstSection", secondSection: "secondSection", twoColumn: "twoColumn" }, usesInheritance: true, ngImport: i0, template: "@if (twoColumn) {\r\n<div fd-tile-section>\r\n    <fd-icon fd-tile-refresh [font]=\"firstSection.Icon | sapFont\" [glyph]=\"firstSection.Icon\"></fd-icon>\r\n    <span fd-tile-footer-text>{{ firstSection.Text | bbbTranslate }}</span>\r\n</div>\r\n<div fd-tile-section>\r\n    <fd-icon fd-tile-refresh [font]=\"secondSection.Icon | sapFont\" [glyph]=\"secondSection.Icon\"></fd-icon>\r\n    <span fd-tile-footer-text>{{ secondSection.Text | bbbTranslate }}</span>\r\n</div>\r\n} @else {\r\n<fd-icon fd-tile-refresh [font]=\"firstSection.Icon | sapFont\" [glyph]=\"firstSection.Icon\"></fd-icon>\r\n<span fd-tile-footer-text>{{ firstSection.Text | bbbTranslate }}</span>\r\n}\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: i1$3.TileSectionDirective, selector: "[fdTileSection], [fd-tile-section]" }, { kind: "directive", type: i1$3.TileRefreshDirective, selector: "[fdTileRefresh], [fd-tile-refresh]", inputs: ["glyph", "glyphFont", "class", "ariaLabel"] }, { kind: "directive", type: i1$3.TileFooterTextDirective, selector: "[fdTileFooterText], [fd-tile-footer-text]" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i4.SapFontPipe, name: "sapFont" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FooterTileComponent, decorators: [{
             type: Component,
@@ -781,12 +781,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Input
             }] } });
 
-class TileDynamicCommandDirective {
+class TileDynamicCommandDirective extends BaseDirective {
     constructor() {
+        super(...arguments);
         this.runningCommand = false;
         this._localStorage = inject(LocalStorageService);
         this._router = inject(Router);
         this._cdr = inject(ChangeDetectorRef);
+        this._viewContainerRef = inject(ViewContainerRef);
     }
     onClick(ev) {
         if (this.edit || this.disableClick || this.runningCommand || !this.dynamicCommand) {
@@ -799,7 +801,7 @@ class TileDynamicCommandDirective {
         const command = this.dynamicCommand;
         const e = { command, DynamicSetting: null };
         this.runningCommand = true;
-        BarsaApi.Bw.Msg.Wait();
+        this._viewContainerRef.createComponent(MaskComponent);
         if (this.navigateBackOnClick) {
             this._router.navigate(['../']);
             setTimeout(() => {
@@ -809,11 +811,15 @@ class TileDynamicCommandDirective {
         }
         return this.executeCommand(command, e);
     }
+    ngOnInit() {
+        super.ngOnInit();
+    }
     executeCommand(command, e) {
         this._cdr.detectChanges();
         BarsaApi.Common.CustomCodeManager.RunDynamicCommand(command.Id, e, (res) => {
             this.runningCommand = false;
-            BarsaApi.Bw.Msg.Hide();
+            this._viewContainerRef.clear();
+            // BarsaApi.Bw.Msg.Hide();
             if (res && typeof res.Detail !== 'undefined') {
                 BarsaApi.Bw.Msg.Error(res.message || res.Text);
             }
@@ -821,8 +827,8 @@ class TileDynamicCommandDirective {
         });
         return false;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TileDynamicCommandDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: TileDynamicCommandDirective, selector: "[tileDynCommand]", inputs: { disableClick: "disableClick", edit: "edit", dynamicCommand: "dynamicCommand", title: "title", setToStorage: "setToStorage", navigateBackOnClick: "navigateBackOnClick" }, host: { listeners: { "click": "onClick($event)" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TileDynamicCommandDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.13", type: TileDynamicCommandDirective, selector: "[tileDynCommand]", inputs: { disableClick: "disableClick", edit: "edit", dynamicCommand: "dynamicCommand", title: "title", setToStorage: "setToStorage", navigateBackOnClick: "navigateBackOnClick" }, host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TileDynamicCommandDirective, decorators: [{
             type: Directive,
@@ -849,7 +855,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class TileComponent extends TilePropsComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TileComponent, selector: "bt-tile", inputs: { type: "type", footerTemplate: "footerTemplate", footer: "footer", title: "title", icon: "icon", subtitle: "subtitle", isDouble: "isDouble", disableClick: "disableClick", edit: "edit", dynamicCommand: "dynamicCommand", backColor: "backColor", hideHeader: "hideHeader", setToStorage: "setToStorage", listMode: "listMode", navigateBackOnClick: "navigateBackOnClick" }, usesInheritance: true, ngImport: i0, template: "@if(!listMode) {\r\n<fd-tile\r\n    [type]=\"type\"\r\n    [double]=\"isDouble\"\r\n    [action]=\"edit\"\r\n    tileStyle\r\n    [backColor]=\"backColor\"\r\n    [size]=\"'s'\"\r\n    tileDynCommand\r\n    [edit]=\"edit\"\r\n    [navigateBackOnClick]=\"navigateBackOnClick\"\r\n    [title]=\"title\"\r\n    [setToStorage]=\"setToStorage\"\r\n    [dynamicCommand]=\"dynamicCommand\"\r\n>\r\n    @if (edit && !data.Locked) {\r\n    <button fd-button fd-tile-action-close fdType=\"transparent\" (click)=\"hideClick.emit()\"></button>\r\n    } @if (edit && !data.Locked) {\r\n    <button fd-button fd-tile-action-indicator fdType=\"transparent\" [fdMenuTrigger]=\"menu\"></button>\r\n    } @if(!hideHeader){\r\n    <div fd-tile-header>\r\n        <h1 fd-tile-title>\r\n            {{ title | bbbTranslate }}\r\n        </h1>\r\n        <h2 fd-tile-subtitle>\r\n            {{ subtitle | bbbTranslate }}\r\n        </h2>\r\n    </div>\r\n    }\r\n    <ng-content></ng-content>\r\n    <ng-container [ngTemplateOutlet]=\"footerTemplate ? footerTemplate : defaultFooter\"></ng-container>\r\n</fd-tile>\r\n}@else{\r\n<span fd-list-title> {{ title | bbbTranslate }} </span>\r\n<span fd-list-secondary> {{ subtitle | bbbTranslate }} </span>\r\n@if(icon){ <i fd-list-icon [glyph]=\"icon\"></i>} }\r\n<ng-template #defaultFooter>\r\n    @if (footer) {\r\n    <div\r\n        fd-tile-footer\r\n        bt-footer-tile\r\n        [secondSection]=\"footer.SecondSection\"\r\n        [twoColumn]=\"footer.twoColumn\"\r\n        [firstSection]=\"footer.FirstSection\"\r\n    ></div>\r\n\r\n    }\r\n</ng-template>\r\n<fd-menu #menu>\r\n    <li fd-menu-item>\r\n        <a (click)=\"menu.close(); renameClick.emit()\" fd-menu-interactive>\r\n            <span fd-menu-title>{{ 'Rename' | bbbTranslate }}</span>\r\n        </a>\r\n    </li>\r\n</fd-menu>\r\n", styles: [":host,fd-tile{display:block}\n"], dependencies: [{ kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i4.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i4.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i4.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "component", type: i4$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i4$1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i4$1.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i4$1.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i4$1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i1$3.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "directive", type: i1$3.TileHeaderDirective, selector: "[fdTileHeader], [fd-tile-header]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.TileFooterDirective, selector: "[fdTileFooter], [fd-tile-footer]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.TileTitleDirective, selector: "[fdTileTitle], [fd-tile-title]" }, { kind: "directive", type: i1$3.TileSubtitleDirective, selector: "[fdTileTitle], [fd-tile-subtitle]" }, { kind: "directive", type: i1$3.TileActionCloseDirective, selector: "[fdTileActionClose], [fd-tile-action-close]", inputs: ["class"] }, { kind: "directive", type: i1$3.TileActionIndicatorDirective, selector: "[fdTileActionIndicator], [fd-tile-action-indicator]", inputs: ["class"] }, { kind: "component", type: FooterTileComponent, selector: "bt-footer-tile,div[bt-footer-tile]", inputs: ["firstSection", "secondSection", "twoColumn"] }, { kind: "directive", type: TileStyleDirective, selector: "[tileStyle]", inputs: ["backColor"] }, { kind: "directive", type: TileDynamicCommandDirective, selector: "[tileDynCommand]", inputs: ["disableClick", "edit", "dynamicCommand", "title", "setToStorage", "navigateBackOnClick"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TileComponent, selector: "bt-tile", inputs: { type: "type", footerTemplate: "footerTemplate", footer: "footer", title: "title", icon: "icon", subtitle: "subtitle", isDouble: "isDouble", disableClick: "disableClick", edit: "edit", dynamicCommand: "dynamicCommand", backColor: "backColor", hideHeader: "hideHeader", setToStorage: "setToStorage", listMode: "listMode", navigateBackOnClick: "navigateBackOnClick" }, usesInheritance: true, ngImport: i0, template: "@if(!listMode) {\r\n<fd-tile\r\n    [type]=\"type\"\r\n    [double]=\"isDouble\"\r\n    [action]=\"edit\"\r\n    tileStyle\r\n    [backColor]=\"backColor\"\r\n    [size]=\"'s'\"\r\n    tileDynCommand\r\n    [edit]=\"edit\"\r\n    [navigateBackOnClick]=\"navigateBackOnClick\"\r\n    [title]=\"title\"\r\n    [setToStorage]=\"setToStorage\"\r\n    [dynamicCommand]=\"dynamicCommand\"\r\n>\r\n    @if (edit && !data.Locked) {\r\n    <button fd-button fd-tile-action-close fdType=\"transparent\" (click)=\"hideClick.emit()\"></button>\r\n    } @if (edit && !data.Locked) {\r\n    <button fd-button fd-tile-action-indicator fdType=\"transparent\" [fdMenuTrigger]=\"menu\"></button>\r\n    } @if(!hideHeader){\r\n    <div fd-tile-header>\r\n        <h1 fd-tile-title>\r\n            {{ title | bbbTranslate }}\r\n        </h1>\r\n        <h2 fd-tile-subtitle>\r\n            {{ subtitle | bbbTranslate }}\r\n        </h2>\r\n    </div>\r\n    }\r\n    <ng-content></ng-content>\r\n    <ng-container [ngTemplateOutlet]=\"footerTemplate ? footerTemplate : defaultFooter\"></ng-container>\r\n</fd-tile>\r\n}@else{\r\n<span fd-list-title> {{ title | bbbTranslate }} </span>\r\n<span fd-list-secondary> {{ subtitle | bbbTranslate }} </span>\r\n@if(icon){ <i fd-list-icon [glyph]=\"icon\"></i>} }\r\n<ng-template #defaultFooter>\r\n    @if (footer) {\r\n    <div\r\n        fd-tile-footer\r\n        bt-footer-tile\r\n        [secondSection]=\"footer.SecondSection\"\r\n        [twoColumn]=\"footer.twoColumn\"\r\n        [firstSection]=\"footer.FirstSection\"\r\n    ></div>\r\n\r\n    }\r\n</ng-template>\r\n<fd-menu #menu>\r\n    <li fd-menu-item>\r\n        <a (click)=\"menu.close(); renameClick.emit()\" fd-menu-interactive>\r\n            <span fd-menu-title>{{ 'Rename' | bbbTranslate }}</span>\r\n        </a>\r\n    </li>\r\n</fd-menu>\r\n", styles: [":host,fd-tile{display:block}\n"], dependencies: [{ kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: i4$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i4$1.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i4$1.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "component", type: i4$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i4$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i4$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i4$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i4$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i1$3.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "directive", type: i1$3.TileHeaderDirective, selector: "[fdTileHeader], [fd-tile-header]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.TileFooterDirective, selector: "[fdTileFooter], [fd-tile-footer]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.TileTitleDirective, selector: "[fdTileTitle], [fd-tile-title]" }, { kind: "directive", type: i1$3.TileSubtitleDirective, selector: "[fdTileTitle], [fd-tile-subtitle]" }, { kind: "directive", type: i1$3.TileActionCloseDirective, selector: "[fdTileActionClose], [fd-tile-action-close]", inputs: ["class"] }, { kind: "directive", type: i1$3.TileActionIndicatorDirective, selector: "[fdTileActionIndicator], [fd-tile-action-indicator]", inputs: ["class"] }, { kind: "component", type: FooterTileComponent, selector: "bt-footer-tile,div[bt-footer-tile]", inputs: ["firstSection", "secondSection", "twoColumn"] }, { kind: "directive", type: TileStyleDirective, selector: "[tileStyle]", inputs: ["backColor"] }, { kind: "directive", type: TileDynamicCommandDirective, selector: "[tileDynCommand]", inputs: ["disableClick", "edit", "dynamicCommand", "title", "setToStorage", "navigateBackOnClick"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TileComponent, decorators: [{
             type: Component,
@@ -962,7 +968,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class ActionItemComponent extends TileComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActionItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ActionItemComponent, selector: "bt-action-item", usesInheritance: true, ngImport: i0, template: "<div [class.action-item-edit-mode]=\"edit\" class=\"action-item s\">\r\n    @if (icon) {\r\n    <fd-icon [glyph]=\"icon\"></fd-icon>\r\n    }\r\n    <h1 fd-tile-title>{{ title }}</h1>\r\n\r\n    @if (subtitle) {\r\n    <h2 fd-tile-subtitle>{{ subtitle }}</h2>\r\n    } @if (edit && !data.Locked) {\r\n    <div class=\"buttons\">\r\n        <button fd-button fd-tile-action-close fdType=\"transparent\" (click)=\"hideClick.emit()\"></button>\r\n        <button fd-button fd-tile-action-indicator fdType=\"transparent\" [fdMenuTrigger]=\"menu\"></button>\r\n    </div>\r\n    }\r\n    <fd-menu #menu>\r\n        <li fd-menu-item>\r\n            <a (click)=\"menu.close(); renameClick.emit()\" fd-menu-interactive>\r\n                <span fd-menu-title>{{ 'Rename' | bbbTranslate }}</span>\r\n            </a>\r\n        </li>\r\n    </fd-menu>\r\n</div>\r\n", styles: [".action-item{display:flex;justify-content:space-between;height:100%;align-items:center;column-gap:10px;padding:7px;background-color:var(--sapTile_Background, #fff);cursor:pointer;box-shadow:var(--sapContent_Shadow0, 0 0 0 .0625rem rgba(0, 0, 0, .1), 0 .125rem .5rem 0 rgba(0, 0, 0, .1));border-radius:var(--sapElement_BorderCornerRadius, .25rem);border:.0625rem solid var(--sapTile_BorderColor, transparent)}.action-item:hover{background-color:var(--sapBackgroundColor);border-color:var(--sapTile_Interactive_BorderColor)}.action-item fd-icon{color:var(--sapLinkColor, #0a6ed1);font-size:1.3rem;line-height:0}.action-item.s .fd-tile__title{font-size:var(--sapFontHeader6Size)}.action-item.s .fd-tile__subtitle{font-size:var(--sapFontSmallSize)}.action-item-edit-mode h1,.action-item-edit-mode h2{opacity:.3}.action-item-edit-mode .buttons{display:flex;column-gap:2px}.action-item-edit-mode .buttons button{display:flex}h1{text-decoration:none;color:var(--sapLinkColor, #0a6ed1);text-shadow:var(--sapContent_TextShadow, 0 0 .125rem #fff)}\n"], dependencies: [{ kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i4$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i4$1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i4$1.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i4$1.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i4$1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "directive", type: i1$3.TileTitleDirective, selector: "[fdTileTitle], [fd-tile-title]" }, { kind: "directive", type: i1$3.TileSubtitleDirective, selector: "[fdTileTitle], [fd-tile-subtitle]" }, { kind: "directive", type: i1$3.TileActionCloseDirective, selector: "[fdTileActionClose], [fd-tile-action-close]", inputs: ["class"] }, { kind: "directive", type: i1$3.TileActionIndicatorDirective, selector: "[fdTileActionIndicator], [fd-tile-action-indicator]", inputs: ["class"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ActionItemComponent, selector: "bt-action-item", usesInheritance: true, ngImport: i0, template: "<div [class.action-item-edit-mode]=\"edit\" class=\"action-item s\">\r\n    @if (icon) {\r\n    <fd-icon [glyph]=\"icon\"></fd-icon>\r\n    }\r\n    <h1 fd-tile-title>{{ title }}</h1>\r\n\r\n    @if (subtitle) {\r\n    <h2 fd-tile-subtitle>{{ subtitle }}</h2>\r\n    } @if (edit && !data.Locked) {\r\n    <div class=\"buttons\">\r\n        <button fd-button fd-tile-action-close fdType=\"transparent\" (click)=\"hideClick.emit()\"></button>\r\n        <button fd-button fd-tile-action-indicator fdType=\"transparent\" [fdMenuTrigger]=\"menu\"></button>\r\n    </div>\r\n    }\r\n    <fd-menu #menu>\r\n        <li fd-menu-item>\r\n            <a (click)=\"menu.close(); renameClick.emit()\" fd-menu-interactive>\r\n                <span fd-menu-title>{{ 'Rename' | bbbTranslate }}</span>\r\n            </a>\r\n        </li>\r\n    </fd-menu>\r\n</div>\r\n", styles: [".action-item{display:flex;justify-content:space-between;height:100%;align-items:center;column-gap:10px;padding:7px;background-color:var(--sapTile_Background, #fff);cursor:pointer;box-shadow:var(--sapContent_Shadow0, 0 0 0 .0625rem rgba(0, 0, 0, .1), 0 .125rem .5rem 0 rgba(0, 0, 0, .1));border-radius:var(--sapElement_BorderCornerRadius, .25rem);border:.0625rem solid var(--sapTile_BorderColor, transparent)}.action-item:hover{background-color:var(--sapBackgroundColor);border-color:var(--sapTile_Interactive_BorderColor)}.action-item fd-icon{color:var(--sapLinkColor, #0a6ed1);font-size:1.3rem;line-height:0}.action-item.s .fd-tile__title{font-size:var(--sapFontHeader6Size)}.action-item.s .fd-tile__subtitle{font-size:var(--sapFontSmallSize)}.action-item-edit-mode h1,.action-item-edit-mode h2{opacity:.3}.action-item-edit-mode .buttons{display:flex;column-gap:2px}.action-item-edit-mode .buttons button{display:flex}h1{text-decoration:none;color:var(--sapLinkColor, #0a6ed1);text-shadow:var(--sapContent_TextShadow, 0 0 .125rem #fff)}\n"], dependencies: [{ kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i4$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i4$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i4$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i4$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i4$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "directive", type: i1$3.TileTitleDirective, selector: "[fdTileTitle], [fd-tile-title]" }, { kind: "directive", type: i1$3.TileSubtitleDirective, selector: "[fdTileTitle], [fd-tile-subtitle]" }, { kind: "directive", type: i1$3.TileActionCloseDirective, selector: "[fdTileActionClose], [fd-tile-action-close]", inputs: ["class"] }, { kind: "directive", type: i1$3.TileActionIndicatorDirective, selector: "[fdTileActionIndicator], [fd-tile-action-indicator]", inputs: ["class"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ActionItemComponent, decorators: [{
             type: Component,
@@ -1131,7 +1137,7 @@ class TilesViewerGroupComponent extends BaseComponent {
         this.resetGroup.emit(appTileGroup);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TilesViewerGroupComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: { appTileGroup: "appTileGroup", stackContent: "stackContent", edit: "edit", rtl: "rtl", isAppTileSubGroup: "isAppTileSubGroup", deviceSize: "deviceSize" }, outputs: { tilesDropped: "tilesDropped", hideAppTileClick: "hideAppTileClick", renameAppTileClick: "renameAppTileClick", toggleGroup: "toggleGroup", resetGroup: "resetGroup", deleteGroup: "deleteGroup" }, usesInheritance: true, ngImport: i0, template: "<fd-layout-panel\r\n    [fixed]=\"true\"\r\n    [attr.editHome]=\"edit\"\r\n    cdkDrag\r\n    [cdkDragDisabled]=\"!edit || !stackContent\"\r\n    [class.empty-tiles-group]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n>\r\n    @if (edit || stackContent || isAppTileSubGroup || appTileGroup.HideHeader) {\r\n    <fd-layout-panel-header>\r\n        <fd-layout-panel-head>\r\n            <h5 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h5>\r\n        </fd-layout-panel-head>\r\n        @if (edit) {\r\n        <fd-layout-panel-actions class=\"group-btns\">\r\n            <fd-toolbar [shouldOverflow]=\"false\" [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n                <button\r\n                    fd-button\r\n                    fd-toolbar-item\r\n                    [label]=\"!appTileGroup.navigatorVisible ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n                    (click)=\"onToggleShowHide(appTileGroup)\"\r\n                ></button>\r\n                @if (appTileGroup.Predefined && appTileGroup.$TileSettingChanged) {\r\n                <button fd-button [label]=\"'Refresh' | bbbTranslate\" (click)=\"onReset(appTileGroup)\"></button>\r\n                } @if (!appTileGroup.Predefined) {\r\n                <button\r\n                    fd-button\r\n                    [label]=\"'Delete' | bbbTranslate\"\r\n                    [fdType]=\"'negative'\"\r\n                    (click)=\"onDelete(appTileGroup)\"\r\n                ></button>\r\n                }\r\n            </fd-toolbar>\r\n        </fd-layout-panel-actions>\r\n        }\r\n    </fd-layout-panel-header>\r\n    }\r\n    <fd-layout-panel-body [bleed]=\"!stackContent\" [class.small-size]=\"deviceSize === 's'\">\r\n        <div\r\n            class=\"tile-wrapper\"\r\n            [ngClass]=\"{ rtl: rtl, ltr: !rtl, s: deviceSize === 's' }\"\r\n            fd-panel-content\r\n            #tiles=\"cdkDropList\"\r\n            cdkDropList\r\n            cdkDropListOrientation=\"horizontal\"\r\n            (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n            [cdkDropListConnectedTo]=\"actionLinks\"\r\n            [cdkDropListData]=\"{\r\n                isTile: true,\r\n                items: appTileGroup.navigatorTiles || []\r\n            }\"\r\n        >\r\n            @if (!edit) { @if (!appTileGroup.$TilesLoaded) {\r\n            <fd-busy-indicator [loading]=\"true\"></fd-busy-indicator>\r\n            } @else if (!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded) {\r\n            <h5 fd-title></h5>\r\n            } } @for (appTile of appTileGroup?.navigatorTiles; track appTile.Id; let k = $index) {\r\n            <div\r\n                [class.edit-home]=\"edit\"\r\n                [class.isdouble]=\"appTile.Component?.Settings?.TileSetting?.IsDouble\"\r\n                cdkDrag\r\n                [cdkDragDisabled]=\"!edit || appTileGroup.Locked\"\r\n            >\r\n                <span\r\n                    [dynamicCommand]=\"appTile.DynamicCommand\"\r\n                    [setToStorage]=\"true\"\r\n                    [enableCommand]=\"!edit && appTile.Component\"\r\n                    tileRenderer\r\n                    [deviceSize]=\"deviceSize\"\r\n                    [data]=\"appTile\"\r\n                    [edit]=\"edit\"\r\n                    [component]=\"appTile.Component\"\r\n                    (hideClick)=\"onAppTileHideClick(appTile)\"\r\n                    (renameClick)=\"onAppTileRenameClick(appTile)\"\r\n                ></span>\r\n            </div>\r\n            } @if (edit) {\r\n            <fd-tile class=\"add-tile\" [routerLink]=\"['/home/appfinder']\">\r\n                <div style=\"margin: 0\">\r\n                    <fd-icon glyph=\"add\"></fd-icon>\r\n                </div>\r\n            </fd-tile>\r\n            }\r\n        </div>\r\n    </fd-layout-panel-body>\r\n</fd-layout-panel>\r\n\r\n<bt-actions-link\r\n    [class.actions-link-edit-home]=\"edit\"\r\n    [actionsLink]=\"appTileGroup.navigatorActionLinks\"\r\n    [edit]=\"edit\"\r\n    [deviceSize]=\"deviceSize\"\r\n    [style.min-height]=\"edit ? '4rem' : 'auto'\"\r\n    cdkDropList\r\n    #actionLinks=\"cdkDropList\"\r\n    cdkDropListOrientation=\"horizontal\"\r\n    [cdkDropListConnectedTo]=\"tiles\"\r\n    (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n    [cdkDropListData]=\"{\r\n        isTile: false,\r\n        items: appTileGroup.navigatorActionLinks || []\r\n    }\"\r\n>\r\n</bt-actions-link>\r\n@for (appTileSubGroup of appTileGroup.$Children; track appTileSubGroup.Id) {\r\n<bt-tiles-viewer-group\r\n    [class]=\"deviceSize\"\r\n    [appTileGroup]=\"appTileSubGroup\"\r\n    [edit]=\"edit\"\r\n    [rtl]=\"rtl\"\r\n    [stackContent]=\"stackContent\"\r\n    [cssStyle]=\"appTileSubGroup.CssStyles\"\r\n    [isAppTileSubGroup]=\"true\"\r\n    [deviceSize]=\"deviceSize\"\r\n    (tilesDropped)=\"tilesDropped.emit($event)\"\r\n    (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\r\n    (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\r\n    (resetGroup)=\"resetGroup.emit($event)\"\r\n    (deleteGroup)=\"deleteGroup.emit($event)\"\r\n    (toggleGroup)=\"toggleGroup.emit($event)\"\r\n></bt-tiles-viewer-group>\r\n}\r\n", styles: [":host{display:block}fd-layout-panel{box-shadow:none;border-radius:0!important}fd-layout-panel.empty-tiles-group:not([edithome=true]){display:none}fd-layout-panel fd-layout-panel-header fd-layout-panel-head h5{font-weight:500}fd-layout-panel fd-layout-panel-body:not(.small-size){margin-top:1rem}fd-layout-panel fd-layout-panel-body.small-size{padding:1rem .5rem}fd-layout-panel[editHome=false]{background:transparent}::ng-deep .fd-panel__header{border:none;padding-left:0;padding-right:0}::ng-deep fd-panel[edithome=false] .fd-panel__header:first-child{display:none}::ng-deep .fd-panel__content{border-bottom:none;padding:1px}.tile-wrapper{column-gap:.5rem;row-gap:1rem;display:inline-flex;flex-wrap:wrap;align-items:center}.actions-link-edit-home{background-color:var(--sapGroup_ContentBackground, #fff);border-color:var(--sapGroup_ContentBorderColor, #d9d9d9);border-width:var(--sapElement_BorderWidth, .0625rem);border-style:solid}.add-tile{background-color:transparent!important}.add-tile ::ng-deep div{background-color:transparent!important;margin:10px 0}.add-tile div:first-child{display:flex;align-items:center;justify-content:center;height:100%;width:100%}.add-tile fd-icon{font-size:1.5rem;color:#3c4043}fd-layout-panel-body.small-size{display:flex;justify-content:center}fd-layout-panel-body.small-size .tile-wrapper{display:grid;grid-template-columns:154px 154px;gap:1rem}fd-layout-panel-body.small-size .tile-wrapper .isdouble{grid-column-start:1;grid-column-end:3}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$1.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7$1.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i7$1.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i7$1.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i7$1.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i7$1.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i9.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "component", type: i1$3.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i5.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i1.DynamicStyleDirective, selector: "[cssStyle]", inputs: ["cssStyle"] }, { kind: "component", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: ["actionsLink", "edit", "deviceSize"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "edit", "rtl", "isAppTileSubGroup", "deviceSize"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "directive", type: TileRendererDirective, selector: "[tileRenderer]", inputs: ["component", "data", "edit", "deviceSize", "setToStorage", "listMode", "navigateBackOnClick"], outputs: ["hideClick", "renameClick"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: { appTileGroup: "appTileGroup", stackContent: "stackContent", edit: "edit", rtl: "rtl", isAppTileSubGroup: "isAppTileSubGroup", deviceSize: "deviceSize" }, outputs: { tilesDropped: "tilesDropped", hideAppTileClick: "hideAppTileClick", renameAppTileClick: "renameAppTileClick", toggleGroup: "toggleGroup", resetGroup: "resetGroup", deleteGroup: "deleteGroup" }, usesInheritance: true, ngImport: i0, template: "<fd-layout-panel\r\n    [fixed]=\"true\"\r\n    [attr.editHome]=\"edit\"\r\n    cdkDrag\r\n    [cdkDragDisabled]=\"!edit || !stackContent\"\r\n    [class.empty-tiles-group]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n>\r\n    @if (edit || stackContent || isAppTileSubGroup || appTileGroup.HideHeader) {\r\n    <fd-layout-panel-header>\r\n        <fd-layout-panel-head>\r\n            <h5 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h5>\r\n        </fd-layout-panel-head>\r\n        @if (edit) {\r\n        <fd-layout-panel-actions class=\"group-btns\">\r\n            <fd-toolbar [shouldOverflow]=\"false\" [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n                <button\r\n                    fd-button\r\n                    fd-toolbar-item\r\n                    [label]=\"!appTileGroup.navigatorVisible ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n                    (click)=\"onToggleShowHide(appTileGroup)\"\r\n                ></button>\r\n                @if (appTileGroup.Predefined && appTileGroup.$TileSettingChanged) {\r\n                <button fd-button [label]=\"'Refresh' | bbbTranslate\" (click)=\"onReset(appTileGroup)\"></button>\r\n                } @if (!appTileGroup.Predefined) {\r\n                <button\r\n                    fd-button\r\n                    [label]=\"'Delete' | bbbTranslate\"\r\n                    [fdType]=\"'negative'\"\r\n                    (click)=\"onDelete(appTileGroup)\"\r\n                ></button>\r\n                }\r\n            </fd-toolbar>\r\n        </fd-layout-panel-actions>\r\n        }\r\n    </fd-layout-panel-header>\r\n    }\r\n    <fd-layout-panel-body [bleed]=\"!stackContent\" [class.small-size]=\"deviceSize === 's'\">\r\n        <div\r\n            class=\"tile-wrapper\"\r\n            [ngClass]=\"{ rtl: rtl, ltr: !rtl, s: deviceSize === 's' }\"\r\n            fd-panel-content\r\n            #tiles=\"cdkDropList\"\r\n            cdkDropList\r\n            cdkDropListOrientation=\"horizontal\"\r\n            (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n            [cdkDropListConnectedTo]=\"actionLinks\"\r\n            [cdkDropListData]=\"{\r\n                isTile: true,\r\n                items: appTileGroup.navigatorTiles || []\r\n            }\"\r\n        >\r\n            @if (!edit) { @if (!appTileGroup.$TilesLoaded) {\r\n            <fd-busy-indicator [loading]=\"true\"></fd-busy-indicator>\r\n            } @else if (!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded) {\r\n            <h5 fd-title></h5>\r\n            } } @for (appTile of appTileGroup?.navigatorTiles; track appTile.Id; let k = $index) {\r\n            <div\r\n                [class.edit-home]=\"edit\"\r\n                [class.isdouble]=\"appTile.Component?.Settings?.TileSetting?.IsDouble\"\r\n                cdkDrag\r\n                [cdkDragDisabled]=\"!edit || appTileGroup.Locked\"\r\n            >\r\n                <span\r\n                    [dynamicCommand]=\"appTile.DynamicCommand\"\r\n                    [setToStorage]=\"true\"\r\n                    [enableCommand]=\"!edit && appTile.Component\"\r\n                    tileRenderer\r\n                    [deviceSize]=\"deviceSize\"\r\n                    [data]=\"appTile\"\r\n                    [edit]=\"edit\"\r\n                    [component]=\"appTile.Component\"\r\n                    (hideClick)=\"onAppTileHideClick(appTile)\"\r\n                    (renameClick)=\"onAppTileRenameClick(appTile)\"\r\n                ></span>\r\n            </div>\r\n            } @if (edit) {\r\n            <fd-tile class=\"add-tile\" [routerLink]=\"['/home/appfinder']\">\r\n                <div style=\"margin: 0\">\r\n                    <fd-icon glyph=\"add\"></fd-icon>\r\n                </div>\r\n            </fd-tile>\r\n            }\r\n        </div>\r\n    </fd-layout-panel-body>\r\n</fd-layout-panel>\r\n\r\n<bt-actions-link\r\n    [class.actions-link-edit-home]=\"edit\"\r\n    [actionsLink]=\"appTileGroup.navigatorActionLinks\"\r\n    [edit]=\"edit\"\r\n    [deviceSize]=\"deviceSize\"\r\n    [style.min-height]=\"edit ? '4rem' : 'auto'\"\r\n    cdkDropList\r\n    #actionLinks=\"cdkDropList\"\r\n    cdkDropListOrientation=\"horizontal\"\r\n    [cdkDropListConnectedTo]=\"tiles\"\r\n    (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n    [cdkDropListData]=\"{\r\n        isTile: false,\r\n        items: appTileGroup.navigatorActionLinks || []\r\n    }\"\r\n>\r\n</bt-actions-link>\r\n@for (appTileSubGroup of appTileGroup.$Children; track appTileSubGroup.Id) {\r\n<bt-tiles-viewer-group\r\n    [class]=\"deviceSize\"\r\n    [appTileGroup]=\"appTileSubGroup\"\r\n    [edit]=\"edit\"\r\n    [rtl]=\"rtl\"\r\n    [stackContent]=\"stackContent\"\r\n    [cssStyle]=\"appTileSubGroup.CssStyles\"\r\n    [isAppTileSubGroup]=\"true\"\r\n    [deviceSize]=\"deviceSize\"\r\n    (tilesDropped)=\"tilesDropped.emit($event)\"\r\n    (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\r\n    (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\r\n    (resetGroup)=\"resetGroup.emit($event)\"\r\n    (deleteGroup)=\"deleteGroup.emit($event)\"\r\n    (toggleGroup)=\"toggleGroup.emit($event)\"\r\n></bt-tiles-viewer-group>\r\n}\r\n", styles: [":host{display:block}fd-layout-panel{box-shadow:none;border-radius:0!important}fd-layout-panel.empty-tiles-group:not([edithome=true]){display:none}fd-layout-panel fd-layout-panel-header fd-layout-panel-head h5{font-weight:500}fd-layout-panel fd-layout-panel-body:not(.small-size){margin-top:1rem}fd-layout-panel fd-layout-panel-body.small-size{padding:1rem .5rem}fd-layout-panel[editHome=false]{background:transparent}::ng-deep .fd-panel__header{border:none;padding-left:0;padding-right:0}::ng-deep fd-panel[edithome=false] .fd-panel__header:first-child{display:none}::ng-deep .fd-panel__content{border-bottom:none;padding:1px}.tile-wrapper{column-gap:.5rem;row-gap:1rem;display:inline-flex;flex-wrap:wrap;align-items:center}.actions-link-edit-home{background-color:var(--sapGroup_ContentBackground, #fff);border-color:var(--sapGroup_ContentBorderColor, #d9d9d9);border-width:var(--sapElement_BorderWidth, .0625rem);border-style:solid}.add-tile{background-color:transparent!important}.add-tile ::ng-deep div{background-color:transparent!important;margin:10px 0}.add-tile div:first-child{display:flex;align-items:center;justify-content:center;height:100%;width:100%}.add-tile fd-icon{font-size:1.5rem;color:#3c4043}fd-layout-panel-body.small-size{display:flex;justify-content:center}fd-layout-panel-body.small-size .tile-wrapper{display:grid;grid-template-columns:154px 154px;gap:1rem}fd-layout-panel-body.small-size .tile-wrapper .isdouble{grid-column-start:1;grid-column-end:3}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i4$3.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i7.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i7.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i7.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i7.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i9.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "component", type: i1$3.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i5.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i1.DynamicStyleDirective, selector: "[cssStyle]", inputs: ["cssStyle"] }, { kind: "component", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: ["actionsLink", "edit", "deviceSize"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "edit", "rtl", "isAppTileSubGroup", "deviceSize"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "directive", type: TileRendererDirective, selector: "[tileRenderer]", inputs: ["component", "data", "edit", "deviceSize", "setToStorage", "listMode", "navigateBackOnClick"], outputs: ["hideClick", "renameClick"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TilesViewerGroupComponent, decorators: [{
             type: Component,
@@ -1206,7 +1212,7 @@ class AppFinderAppListComponent extends BaseComponent {
         this.pinClick.emit(app);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFinderAppListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AppFinderAppListComponent, selector: "bt-app-finder-app-list", inputs: { appGroup: "appGroup", mobile: "mobile", searchTerm: "searchTerm", pinnedAppInAppTileGroups: "pinnedAppInAppTileGroups" }, outputs: { pinClick: "pinClick", appTileGroupsPinChange: "appTileGroupsPinChange" }, usesInheritance: true, ngImport: i0, template: "@if (appGroup) {\r\n<h5 fd-title *emptyList=\"appGroup.Apps\"></h5>\r\n@if ((appGroup.Apps | filterStr: { Title: searchTerm, mode: 'contains' }).length > 0) {\r\n<fd-fixed-card-layout [disableDragDrop]=\"true\">\r\n    @for (app of appGroup.Apps | filterStr: { Title: searchTerm, mode: 'contains' }; track app; let i = $index) {\r\n    <fd-card *fdCardDef=\"i\">\r\n        <fd-card-header [dynCommand]=\"app.DynamicCommand\" [mo]=\"app\">\r\n            <fd-card-main-header>\r\n                @if (app.Icon) {\r\n                <fd-avatar [glyph]=\"app.Icon\" size=\"s\" [title]=\"app.Title\"></fd-avatar>\r\n                }\r\n                <h2 fd-card-title class=\"header-title\">\r\n                    {{ app.Title }}\r\n                </h2>\r\n                <h3 fd-card-subtitle></h3>\r\n            </fd-card-main-header>\r\n        </fd-card-header>\r\n        <fd-card-content>\r\n            <button\r\n                fd-button\r\n                [glyph]=\"'pushpin-off'\"\r\n                [fdType]=\"\r\n                    pinnedAppInAppTileGroups[app.Id]\r\n                        ? pinnedAppInAppTileGroups[app.Id].length\r\n                            ? 'emphasized'\r\n                            : 'standard'\r\n                        : app.$HasPinned\r\n                        ? 'emphasized'\r\n                        : 'standard'\r\n                \"\r\n                (click)=\"onPinTap(app)\"\r\n            ></button>\r\n        </fd-card-content>\r\n    </fd-card>\r\n    }\r\n</fd-fixed-card-layout>\r\n} }\r\n", styles: [":host{display:block;flex-grow:1;padding:1rem}button{cursor:pointer}h3{padding-bottom:.5rem}fd-fixed-card-layout,h5{padding-bottom:2rem;display:block}.header-title{padding-bottom:30px}fd-card-content{padding:10px;cursor:default}@media (max-width: 767px){:host{padding:0 1rem}}\n"], dependencies: [{ kind: "component", type: i1$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$7.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i1$7.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i1$7.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i1$7.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i1$7.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i1$7.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "component", type: i4$3.FixedCardLayoutComponent, selector: "fd-fixed-card-layout", inputs: ["disableDragDrop", "dragStartDelay", "cardMinimumWidth", "columnsWidthConfig", "maxColumns"], outputs: ["layoutChange", "cardDraggedDropped"] }, { kind: "directive", type: i4$3.CardDefinitionDirective, selector: "[fdCardDef]", inputs: ["fdCardDef"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i1.DynamicCommandDirective, selector: "[dynCommand]", inputs: ["dynCommand", "mo", "enableCommand"], outputs: ["commandClick"] }, { kind: "directive", type: EmptyListDirective, selector: "[emptyList]", inputs: ["emptyList"] }, { kind: "pipe", type: i1.FilterStringPipe, name: "filterStr" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AppFinderAppListComponent, selector: "bt-app-finder-app-list", inputs: { appGroup: "appGroup", mobile: "mobile", searchTerm: "searchTerm", pinnedAppInAppTileGroups: "pinnedAppInAppTileGroups" }, outputs: { pinClick: "pinClick", appTileGroupsPinChange: "appTileGroupsPinChange" }, usesInheritance: true, ngImport: i0, template: "@if (appGroup) {\r\n<h5 fd-title *emptyList=\"appGroup.Apps\"></h5>\r\n@if ((appGroup.Apps | filterStr: { Title: searchTerm, mode: 'contains' }).length > 0) {\r\n<fd-fixed-card-layout [disableDragDrop]=\"true\">\r\n    @for (app of appGroup.Apps | filterStr: { Title: searchTerm, mode: 'contains' }; track app; let i = $index) {\r\n    <fd-card *fdCardDef=\"i\">\r\n        <fd-card-header [dynCommand]=\"app.DynamicCommand\" [mo]=\"app\">\r\n            <fd-card-main-header>\r\n                @if (app.Icon) {\r\n                <fd-avatar [glyph]=\"app.Icon\" size=\"s\" [title]=\"app.Title\"></fd-avatar>\r\n                }\r\n                <h2 fd-card-title class=\"header-title\">\r\n                    {{ app.Title }}\r\n                </h2>\r\n                <h3 fd-card-subtitle></h3>\r\n            </fd-card-main-header>\r\n        </fd-card-header>\r\n        <fd-card-content>\r\n            <button\r\n                fd-button\r\n                [glyph]=\"'pushpin-off'\"\r\n                [fdType]=\"\r\n                    pinnedAppInAppTileGroups[app.Id]\r\n                        ? pinnedAppInAppTileGroups[app.Id].length\r\n                            ? 'emphasized'\r\n                            : 'standard'\r\n                        : app.$HasPinned\r\n                        ? 'emphasized'\r\n                        : 'standard'\r\n                \"\r\n                (click)=\"onPinTap(app)\"\r\n            ></button>\r\n        </fd-card-content>\r\n    </fd-card>\r\n    }\r\n</fd-fixed-card-layout>\r\n} }\r\n", styles: [":host{display:block;flex-grow:1;padding:1rem}button{cursor:pointer}h3{padding-bottom:.5rem}fd-fixed-card-layout,h5{padding-bottom:2rem;display:block}.header-title{padding-bottom:30px}fd-card-content{padding:10px;cursor:default}@media (max-width: 767px){:host{padding:0 1rem}}\n"], dependencies: [{ kind: "component", type: i1$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$7.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i1$7.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i1$7.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i1$7.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i1$7.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i1$7.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "component", type: i4$4.FixedCardLayoutComponent, selector: "fd-fixed-card-layout", inputs: ["disableDragDrop", "dragStartDelay", "cardMinimumWidth", "columnsWidthConfig", "maxColumns"], outputs: ["layoutChange", "cardDraggedDropped"] }, { kind: "directive", type: i4$4.CardDefinitionDirective, selector: "[fdCardDef]", inputs: ["fdCardDef"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i1.DynamicCommandDirective, selector: "[dynCommand]", inputs: ["dynCommand", "mo", "enableCommand"], outputs: ["commandClick"] }, { kind: "directive", type: EmptyListDirective, selector: "[emptyList]", inputs: ["emptyList"] }, { kind: "pipe", type: i1.FilterStringPipe, name: "filterStr" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFinderAppListComponent, decorators: [{
             type: Component,
@@ -1246,7 +1252,7 @@ class AppFinderGroupComponent extends BaseComponent {
         this.selectedIdChange.emit(group.Id);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFinderGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AppFinderGroupComponent, selector: "bt-app-finder-group", inputs: { appGroups: "appGroups", selectedId: "selectedId", listMode: "listMode" }, outputs: { selectedIdChange: "selectedIdChange" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (listMode) {\r\n<div class=\"app-groups\">\r\n    <ul fd-list [selection]=\"true\">\r\n        @for (group of appGroups; track group; let i = $index) {\r\n        <li fd-list-item [selected]=\"group.Id === selectedId\" (click)=\"OnGroupClick(group)\">\r\n            <span fd-list-title>\r\n                {{ group.Title }}\r\n            </span>\r\n        </li>\r\n        }\r\n    </ul>\r\n</div>\r\n} @else { @for (group of appGroups; track group; let i = $index) {\r\n<li fd-menu-item [selected]=\"group.Id === selectedId\">\r\n    <a fd-menu-interactive (click)=\"OnMenuGroupClick(group)\">\r\n        <span fd-menu-title>\r\n            {{ group.Title }}\r\n        </span>\r\n    </a>\r\n</li>\r\n} }\r\n", styles: [".app-groups{width:25vw;border-left:.0625rem solid var(--sapGroup_TitleBorderColor, #d9d9d9)}\n"], dependencies: [{ kind: "component", type: i4.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "directive", type: i4.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: i4$1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i4$1.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i4$1.MenuTitleDirective, selector: "[fd-menu-title]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AppFinderGroupComponent, selector: "bt-app-finder-group", inputs: { appGroups: "appGroups", selectedId: "selectedId", listMode: "listMode" }, outputs: { selectedIdChange: "selectedIdChange" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (listMode) {\r\n<div class=\"app-groups\">\r\n    <ul fd-list [selection]=\"true\">\r\n        @for (group of appGroups; track group; let i = $index) {\r\n        <li fd-list-item [selected]=\"group.Id === selectedId\" (click)=\"OnGroupClick(group)\">\r\n            <span fd-list-title>\r\n                {{ group.Title }}\r\n            </span>\r\n        </li>\r\n        }\r\n    </ul>\r\n</div>\r\n} @else { @for (group of appGroups; track group; let i = $index) {\r\n<li fd-menu-item [selected]=\"group.Id === selectedId\">\r\n    <a fd-menu-interactive (click)=\"OnMenuGroupClick(group)\">\r\n        <span fd-menu-title>\r\n            {{ group.Title }}\r\n        </span>\r\n    </a>\r\n</li>\r\n} }\r\n", styles: [".app-groups{width:25vw;border-left:.0625rem solid var(--sapGroup_TitleBorderColor, #d9d9d9)}\n"], dependencies: [{ kind: "component", type: i4$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "directive", type: i4$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: i4$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i4$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i4$2.MenuTitleDirective, selector: "[fd-menu-title]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFinderGroupComponent, decorators: [{
             type: Component,
@@ -1272,7 +1278,7 @@ class AppFinderComponent extends BaseComponent {
         this.searchTerm = this.searchTerm2;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFinderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AppFinderComponent, selector: "bt-app-finder", inputs: { appGroups: "appGroups", deviceSize: "deviceSize", sideContentSize: "sideContentSize", selectedAppGroup: "selectedAppGroup", selectedAppGroupId: "selectedAppGroupId", mobile: "mobile", contentDensity: "contentDensity", contentHeight: "contentHeight", pinnedAppInAppTileGroups: "pinnedAppInAppTileGroups" }, outputs: { pinClick: "pinClick", selectedAppGroupIdChange: "selectedAppGroupIdChange" }, usesInheritance: true, ngImport: i0, template: "<div class=\"wrapper\">\r\n    @if (appGroups) {\r\n    <fd-toolbar [fdType]=\"'solid'\">\r\n        @if (deviceSize === 's') {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [fdMenu]=\"true\"\r\n            [glyph]=\"'menu2'\"\r\n            [fdType]=\"'transparent'\"\r\n            [fdMenuTrigger]=\"menu\"\r\n            [label]=\"selectedAppGroup?.Title\"\r\n        ></button>\r\n        }\r\n        <fd-toolbar-spacer></fd-toolbar-spacer>\r\n        <fd-input-group\r\n            fd-toolbar-item\r\n            type=\"search\"\r\n            glyph=\"search\"\r\n            [glyphAriaLabel]=\"'Search' | bbbTranslate\"\r\n            [placeholder]=\"'Search' | bbbTranslate\"\r\n            [button]=\"true\"\r\n            [disabled]=\"false\"\r\n            [(ngModel)]=\"searchTerm2\"\r\n            (addOnButtonClicked)=\"onSearchSubmit()\"\r\n            (keydown.enter)=\"onSearchSubmit()\"\r\n        >\r\n        </fd-input-group>\r\n    </fd-toolbar>\r\n    <div style=\"display: flex; overflow-y: auto\" [style.height]=\"contentHeight\">\r\n        <div class=\"app-groups\">\r\n            @if (deviceSize !== 's') {\r\n            <bt-app-finder-group\r\n                [appGroups]=\"appGroups\"\r\n                [listMode]=\"true\"\r\n                [selectedId]=\"selectedAppGroupId\"\r\n                (selectedIdChange)=\"selectedAppGroupIdChange.emit($event)\"\r\n            >\r\n            </bt-app-finder-group>\r\n            }\r\n        </div>\r\n        <bt-app-finder-app-list\r\n            [appGroup]=\"selectedAppGroup\"\r\n            [mobile]=\"mobile\"\r\n            [searchTerm]=\"searchTerm\"\r\n            [pinnedAppInAppTileGroups]=\"pinnedAppInAppTileGroups\"\r\n            (pinClick)=\"pinClick.emit($event)\"\r\n        ></bt-app-finder-app-list>\r\n    </div>\r\n    <fd-menu\r\n        #menu\r\n        [mobile]=\"deviceSize === 's'\"\r\n        [mobileConfig]=\"{ title: 'Groups' | bbbTranslate, hasCloseButton: true }\"\r\n    >\r\n        @if (deviceSize === 's') {\r\n        <bt-app-finder-group\r\n            [appGroups]=\"appGroups\"\r\n            [selectedId]=\"selectedAppGroupId\"\r\n            (selectedIdChange)=\"menu.close(); selectedAppGroupIdChange.emit($event)\"\r\n        >\r\n        </bt-app-finder-group>\r\n        }\r\n    </fd-menu>\r\n    } @else {\r\n    <bsu-mask></bsu-mask>\r\n    }\r\n</div>\r\n", styles: [":host{display:block;background-color:var(--sapBackgroundColor, #f7f7f7);color:var(--sapTextColor, #32363a)}:host ::ng-deep .fd-list__title{line-height:1.5rem}.wrapper{display:flex;flex-direction:column}fd-toolbar{width:100%}::ng-deep span.fd-toolbar__spacer{display:none}\n"], dependencies: [{ kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i4$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i4$1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i5.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i5.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "directive", type: i1.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i7.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: AppFinderGroupComponent, selector: "bt-app-finder-group", inputs: ["appGroups", "selectedId", "listMode"], outputs: ["selectedIdChange"] }, { kind: "component", type: AppFinderAppListComponent, selector: "bt-app-finder-app-list", inputs: ["appGroup", "mobile", "searchTerm", "pinnedAppInAppTileGroups"], outputs: ["pinClick", "appTileGroupsPinChange"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: AppFinderComponent, selector: "bt-app-finder", inputs: { appGroups: "appGroups", deviceSize: "deviceSize", sideContentSize: "sideContentSize", selectedAppGroup: "selectedAppGroup", selectedAppGroupId: "selectedAppGroupId", mobile: "mobile", contentDensity: "contentDensity", contentHeight: "contentHeight", pinnedAppInAppTileGroups: "pinnedAppInAppTileGroups" }, outputs: { pinClick: "pinClick", selectedAppGroupIdChange: "selectedAppGroupIdChange" }, usesInheritance: true, ngImport: i0, template: "<div class=\"wrapper\">\r\n    @if (appGroups) {\r\n    <fd-toolbar [fdType]=\"'solid'\">\r\n        @if (deviceSize === 's') {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [fdMenu]=\"true\"\r\n            [glyph]=\"'menu2'\"\r\n            [fdType]=\"'transparent'\"\r\n            [fdMenuTrigger]=\"menu\"\r\n            [label]=\"selectedAppGroup?.Title\"\r\n        ></button>\r\n        }\r\n        <fd-toolbar-spacer></fd-toolbar-spacer>\r\n        <fd-input-group\r\n            fd-toolbar-item\r\n            type=\"search\"\r\n            glyph=\"search\"\r\n            [glyphAriaLabel]=\"'Search' | bbbTranslate\"\r\n            [placeholder]=\"'Search' | bbbTranslate\"\r\n            [button]=\"true\"\r\n            [disabled]=\"false\"\r\n            [(ngModel)]=\"searchTerm2\"\r\n            (addOnButtonClicked)=\"onSearchSubmit()\"\r\n            (keydown.enter)=\"onSearchSubmit()\"\r\n        >\r\n        </fd-input-group>\r\n    </fd-toolbar>\r\n    <div style=\"display: flex; overflow-y: auto\" [style.height]=\"contentHeight\">\r\n        <div class=\"app-groups\">\r\n            @if (deviceSize !== 's') {\r\n            <bt-app-finder-group\r\n                [appGroups]=\"appGroups\"\r\n                [listMode]=\"true\"\r\n                [selectedId]=\"selectedAppGroupId\"\r\n                (selectedIdChange)=\"selectedAppGroupIdChange.emit($event)\"\r\n            >\r\n            </bt-app-finder-group>\r\n            }\r\n        </div>\r\n        <bt-app-finder-app-list\r\n            [appGroup]=\"selectedAppGroup\"\r\n            [mobile]=\"mobile\"\r\n            [searchTerm]=\"searchTerm\"\r\n            [pinnedAppInAppTileGroups]=\"pinnedAppInAppTileGroups\"\r\n            (pinClick)=\"pinClick.emit($event)\"\r\n        ></bt-app-finder-app-list>\r\n    </div>\r\n    <fd-menu\r\n        #menu\r\n        [mobile]=\"deviceSize === 's'\"\r\n        [mobileConfig]=\"{ title: 'Groups' | bbbTranslate, hasCloseButton: true }\"\r\n    >\r\n        @if (deviceSize === 's') {\r\n        <bt-app-finder-group\r\n            [appGroups]=\"appGroups\"\r\n            [selectedId]=\"selectedAppGroupId\"\r\n            (selectedIdChange)=\"menu.close(); selectedAppGroupIdChange.emit($event)\"\r\n        >\r\n        </bt-app-finder-group>\r\n        }\r\n    </fd-menu>\r\n    } @else {\r\n    <bsu-mask></bsu-mask>\r\n    }\r\n</div>\r\n", styles: [":host{display:block;background-color:var(--sapBackgroundColor, #f7f7f7);color:var(--sapTextColor, #32363a)}:host ::ng-deep .fd-list__title{line-height:1.5rem}.wrapper{display:flex;flex-direction:column}fd-toolbar{width:100%}::ng-deep span.fd-toolbar__spacer{display:none}\n"], dependencies: [{ kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i4$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i4$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i5.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i5.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "directive", type: i1.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i4.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: AppFinderGroupComponent, selector: "bt-app-finder-group", inputs: ["appGroups", "selectedId", "listMode"], outputs: ["selectedIdChange"] }, { kind: "component", type: AppFinderAppListComponent, selector: "bt-app-finder-app-list", inputs: ["appGroup", "mobile", "searchTerm", "pinnedAppInAppTileGroups"], outputs: ["pinClick", "appTileGroupsPinChange"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AppFinderComponent, decorators: [{
             type: Component,
@@ -1327,7 +1333,7 @@ class ChangeAppTileComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChangeAppTileComponent, deps: [{ token: i1$8.UntypedFormBuilder }, { token: i1$1.DialogRef }, { token: i1.BbbTranslatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ChangeAppTileComponent, selector: "bt-change-app-tile", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <h1 fd-title>{{ dialogRef.data.$Caption }}</h1>\r\n        <button fd-dialog-close-button (click)=\"dialogRef.dismiss()\"></button>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body [formGroup]=\"appGroupForm\">\r\n        <div fd-form-item>\r\n            <label fd-form-label [required]=\"true\">{{ 'Title' | bbbTranslate }}</label>\r\n            <fd-form-input-message-group>\r\n                <fd-input-group\r\n                    class=\"form-control\"\r\n                    formControlName=\"title\"\r\n                    form-control\r\n                    [button]=\"true\"\r\n                    [(ngModel)]=\"title\"\r\n                    [state]=\"submitted && appGroupForm.controls.title.errors ? 'error' : 'information'\"\r\n                >\r\n                </fd-input-group>\r\n                @if (submitted && appGroupForm.controls.title.errors) {\r\n                <fd-form-message type=\"error\">\r\n                    {{ RequiredText }}\r\n                </fd-form-message>\r\n                }\r\n            </fd-form-input-message-group>\r\n        </div>\r\n        <br />\r\n        <div fd-form-item>\r\n            <label fd-form-label>{{ 'Subtitle' | bbbTranslate }}</label>\r\n            <fd-form-input-message-group>\r\n                <fd-input-group formControlName=\"subtitle\" form-control [button]=\"true\" [(ngModel)]=\"subtitle\">\r\n                </fd-input-group>\r\n            </fd-form-input-message-group>\r\n        </div>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-button-bar [label]=\"'Save' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onSave()\"> </fd-button-bar>\r\n        <fd-button-bar\r\n            [label]=\"'Cancel' | bbbTranslate\"\r\n            fdkInitialFocus\r\n            fdType=\"transparent\"\r\n            (click)=\"this.dialogRef.close()\"\r\n        >\r\n        </fd-button-bar>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4$4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i5$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i5$1.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i5$1.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen", "preventSpaceKeyScroll"], outputs: ["isOpenChange"] }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i7$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$2.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i7$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i7$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i9$1.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ChangeAppTileComponent, selector: "bt-change-app-tile", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <h1 fd-title>{{ dialogRef.data.$Caption }}</h1>\r\n        <button fd-dialog-close-button (click)=\"dialogRef.dismiss()\"></button>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body [formGroup]=\"appGroupForm\">\r\n        <div fd-form-item>\r\n            <label fd-form-label [required]=\"true\">{{ 'Title' | bbbTranslate }}</label>\r\n            <fd-form-input-message-group>\r\n                <fd-input-group\r\n                    class=\"form-control\"\r\n                    formControlName=\"title\"\r\n                    form-control\r\n                    [button]=\"true\"\r\n                    [(ngModel)]=\"title\"\r\n                    [state]=\"submitted && appGroupForm.controls.title.errors ? 'error' : 'information'\"\r\n                >\r\n                </fd-input-group>\r\n                @if (submitted && appGroupForm.controls.title.errors) {\r\n                <fd-form-message type=\"error\">\r\n                    {{ RequiredText }}\r\n                </fd-form-message>\r\n                }\r\n            </fd-form-input-message-group>\r\n        </div>\r\n        <br />\r\n        <div fd-form-item>\r\n            <label fd-form-label>{{ 'Subtitle' | bbbTranslate }}</label>\r\n            <fd-form-input-message-group>\r\n                <fd-input-group formControlName=\"subtitle\" form-control [button]=\"true\" [(ngModel)]=\"subtitle\">\r\n                </fd-input-group>\r\n            </fd-form-input-message-group>\r\n        </div>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-button-bar [label]=\"'Save' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onSave()\"> </fd-button-bar>\r\n        <fd-button-bar\r\n            [label]=\"'Cancel' | bbbTranslate\"\r\n            fdkInitialFocus\r\n            fdType=\"transparent\"\r\n            (click)=\"this.dialogRef.close()\"\r\n        >\r\n        </fd-button-bar>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4$5.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i5$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i5$1.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i5$1.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen", "preventSpaceKeyScroll"], outputs: ["isOpenChange"] }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i7$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$1.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i7$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i7$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i9$1.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ChangeAppTileComponent, decorators: [{
             type: Component,
@@ -1569,7 +1575,7 @@ class TilesViewerComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TilesViewerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.SaveScrollPositionService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TilesViewerComponent, selector: "bt-tiles-viewer", inputs: { appTileGroups: "appTileGroups", loading: "loading", edit: "edit", rtl: "rtl", defaultTab: "defaultTab", stackContent: "stackContent", deviceSize: "deviceSize", selectedAppGroupId: "selectedAppGroupId", hideTabs: "hideTabs", DynamicComponents: "DynamicComponents" }, outputs: { stackContentChange: "stackContentChange", closeEditHome: "closeEditHome", save: "save", listDropped: "listDropped", tabChanged: "tabChanged", toggleGroup: "toggleGroup", resetGroup: "resetGroup", deleteGroup: "deleteGroup", hideAppTileClick: "hideAppTileClick", renameAppTileClick: "renameAppTileClick", tilesDropped: "tilesDropped" }, host: { properties: { "class.page-content": "this.pageContentClass", "attr.rtl": "this._rtl" } }, viewQueries: [{ propertyName: "tabListComponent", first: true, predicate: IconTabBarComponent, descendants: true }, { propertyName: "contentPageRef", first: true, predicate: ["contentPage"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-dynamic-page size=\"large\" [autoResponsive]=\"true\" [class.hideTabs]=\"hideTabs\">\r\n    <fd-dynamic-page-header [class.hide]=\"!edit\" [title]=\"'HomeEdit' | bbbTranslate\">\r\n        <fd-dynamic-page-global-actions>\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <label fd-form-label fd-toolbar-item>Stacked Content </label>\r\n                <fd-switch\r\n                    fd-toolbar-item\r\n                    [checked]=\"stackContent\"\r\n                    (checkedChange)=\"onStackContentChanged($event)\"\r\n                ></fd-switch>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <button fd-button fdType=\"transparent\" aria-label=\"Close\" title=\"Close\" (click)=\"onCloseEditHome()\">\r\n                    <i class=\"sap-icon--decline\"></i>\r\n                </button>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n\r\n    <fdp-icon-tab-bar\r\n        [stackContent]=\"stackContent\"\r\n        maxContentHeight=\"auto\"\r\n        ariaRoledescription=\"Tiles Container\"\r\n        (iconTabSelected)=\"onSelectedTabChange($event)\"\r\n    >\r\n        @for (appTileGroup of appTileGroups; track _trackById(i, appTileGroup); let i = $index) { @if (edit ||\r\n        appTileGroup.navigatorVisible) {\r\n\r\n        <fdp-icon-tab-bar-tab\r\n            [id]=\"appTileGroup.Id\"\r\n            [color]=\"color\"\r\n            [label]=\"appTileGroup.navigatorTitle | bbbTranslate\"\r\n            [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\r\n        >\r\n            <fd-dynamic-page-content [id]=\"appTileGroup.Id\" cdkScrollable>\r\n                <bt-tiles-viewer-group\r\n                    [class]=\"deviceSize\"\r\n                    [appTileGroup]=\"appTileGroup\"\r\n                    [edit]=\"edit\"\r\n                    [rtl]=\"rtl\"\r\n                    [cssStyle]=\"appTileGroup.CssStyles\"\r\n                    [deviceSize]=\"deviceSize\"\r\n                    [stackContent]=\"stackContent\"\r\n                    [isAppTileSubGroup]=\"(false || hideTabs) && i>0\"\r\n                    (tilesDropped)=\"onDrop($event)\"\r\n                    (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\r\n                    (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\r\n                    (resetGroup)=\"resetGroup.emit($event)\"\r\n                    (deleteGroup)=\"deleteGroup.emit($event)\"\r\n                    (toggleGroup)=\"toggleGroup.emit($event)\"\r\n                ></bt-tiles-viewer-group>\r\n            </fd-dynamic-page-content>\r\n        </fdp-icon-tab-bar-tab>\r\n\r\n        } }\r\n    </fdp-icon-tab-bar>\r\n\r\n    <fd-dynamic-page-footer>\r\n        @if (edit) {\r\n        <div fd-bar barDesign=\"footer\">\r\n            <div fd-bar-right>\r\n                <fd-button-bar\r\n                    [label]=\"'SaveAndClose' | bbbTranslate\"\r\n                    fdType=\"emphasized\"\r\n                    (click)=\"onExitEditHome(appTileGroups)\"\r\n                ></fd-button-bar>\r\n            </div>\r\n        </div>\r\n        }\r\n    </fd-dynamic-page-footer>\r\n</fd-dynamic-page>\r\n", styles: [":host{display:block}:host ::ng-deep .fd-panel__header{border:none;padding-left:0;padding-right:0}:host ::ng-deep fd-panel[edithome=false] .fd-panel__header:first-child{display:none}:host ::ng-deep .fd-panel__content{border-bottom:none;padding:1px}:host ::ng-deep fd-tab-list[noSpy] .fd-tabs__content{overflow-y:initial}:host ::ng-deep fd-dynamic-page article{height:calc(100vh - 44px)!important}:host ::ng-deep .footer-spacer{height:0}.fd-tabs__panel:not(.is-expanded){display:none}fd-dynamic-page.stack-mode fd-dynamic-page-content{overflow-y:hidden}fd-dynamic-page.hideTabs ::ng-deep fdp-icon-tab-bar-text-type{display:none}@media (max-width: 599px){bnrc-dynamic-component{margin-right:0!important;margin-left:0!important}}\n"], dependencies: [{ kind: "directive", type: i2$1.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i4$4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4$4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4$4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i5$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i5$2.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i5$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i5$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i5$2.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i5$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i7$3.SwitchComponent, selector: "fd-switch", inputs: ["activeText", "inactiveText", "id", "required", "checked", "semantic", "ariaLabel", "ariaLabelledBy"], outputs: ["checkedChange"] }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i5.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i1.DynamicStyleDirective, selector: "[cssStyle]", inputs: ["cssStyle"] }, { kind: "component", type: i9$2.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i9$2.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "edit", "rtl", "isAppTileSubGroup", "deviceSize"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TilesViewerComponent, selector: "bt-tiles-viewer", inputs: { appTileGroups: "appTileGroups", loading: "loading", edit: "edit", rtl: "rtl", defaultTab: "defaultTab", stackContent: "stackContent", deviceSize: "deviceSize", selectedAppGroupId: "selectedAppGroupId", hideTabs: "hideTabs", DynamicComponents: "DynamicComponents" }, outputs: { stackContentChange: "stackContentChange", closeEditHome: "closeEditHome", save: "save", listDropped: "listDropped", tabChanged: "tabChanged", toggleGroup: "toggleGroup", resetGroup: "resetGroup", deleteGroup: "deleteGroup", hideAppTileClick: "hideAppTileClick", renameAppTileClick: "renameAppTileClick", tilesDropped: "tilesDropped" }, host: { properties: { "class.page-content": "this.pageContentClass", "attr.rtl": "this._rtl" } }, viewQueries: [{ propertyName: "tabListComponent", first: true, predicate: IconTabBarComponent, descendants: true }, { propertyName: "contentPageRef", first: true, predicate: ["contentPage"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-dynamic-page size=\"large\" [autoResponsive]=\"true\" [class.hideTabs]=\"hideTabs\">\r\n    <fd-dynamic-page-header [class.hide]=\"!edit\" [title]=\"'HomeEdit' | bbbTranslate\">\r\n        <fd-dynamic-page-global-actions>\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <label fd-form-label fd-toolbar-item>Stacked Content </label>\r\n                <fd-switch\r\n                    fd-toolbar-item\r\n                    [checked]=\"stackContent\"\r\n                    (checkedChange)=\"onStackContentChanged($event)\"\r\n                ></fd-switch>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <button fd-button fdType=\"transparent\" aria-label=\"Close\" title=\"Close\" (click)=\"onCloseEditHome()\">\r\n                    <i class=\"sap-icon--decline\"></i>\r\n                </button>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n\r\n    <fdp-icon-tab-bar\r\n        [stackContent]=\"stackContent\"\r\n        maxContentHeight=\"auto\"\r\n        ariaRoledescription=\"Tiles Container\"\r\n        (iconTabSelected)=\"onSelectedTabChange($event)\"\r\n    >\r\n        @for (appTileGroup of appTileGroups; track _trackById(i, appTileGroup); let i = $index) { @if (edit ||\r\n        appTileGroup.navigatorVisible) {\r\n\r\n        <fdp-icon-tab-bar-tab\r\n            [id]=\"appTileGroup.Id\"\r\n            [color]=\"color\"\r\n            [label]=\"appTileGroup.navigatorTitle | bbbTranslate\"\r\n            [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\r\n        >\r\n            <fd-dynamic-page-content [id]=\"appTileGroup.Id\" cdkScrollable>\r\n                <bt-tiles-viewer-group\r\n                    [class]=\"deviceSize\"\r\n                    [appTileGroup]=\"appTileGroup\"\r\n                    [edit]=\"edit\"\r\n                    [rtl]=\"rtl\"\r\n                    [cssStyle]=\"appTileGroup.CssStyles\"\r\n                    [deviceSize]=\"deviceSize\"\r\n                    [stackContent]=\"stackContent\"\r\n                    [isAppTileSubGroup]=\"(false || hideTabs) && i>0\"\r\n                    (tilesDropped)=\"onDrop($event)\"\r\n                    (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\r\n                    (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\r\n                    (resetGroup)=\"resetGroup.emit($event)\"\r\n                    (deleteGroup)=\"deleteGroup.emit($event)\"\r\n                    (toggleGroup)=\"toggleGroup.emit($event)\"\r\n                ></bt-tiles-viewer-group>\r\n            </fd-dynamic-page-content>\r\n        </fdp-icon-tab-bar-tab>\r\n\r\n        } }\r\n    </fdp-icon-tab-bar>\r\n\r\n    <fd-dynamic-page-footer>\r\n        @if (edit) {\r\n        <div fd-bar barDesign=\"footer\">\r\n            <div fd-bar-right>\r\n                <fd-button-bar\r\n                    [label]=\"'SaveAndClose' | bbbTranslate\"\r\n                    fdType=\"emphasized\"\r\n                    (click)=\"onExitEditHome(appTileGroups)\"\r\n                ></fd-button-bar>\r\n            </div>\r\n        </div>\r\n        }\r\n    </fd-dynamic-page-footer>\r\n</fd-dynamic-page>\r\n", styles: [":host{display:block}:host ::ng-deep .fd-panel__header{border:none;padding-left:0;padding-right:0}:host ::ng-deep fd-panel[edithome=false] .fd-panel__header:first-child{display:none}:host ::ng-deep .fd-panel__content{border-bottom:none;padding:1px}:host ::ng-deep fd-tab-list[noSpy] .fd-tabs__content{overflow-y:initial}:host ::ng-deep fd-dynamic-page article{height:calc(100vh - 44px)!important}:host ::ng-deep .footer-spacer{height:0}.fd-tabs__panel:not(.is-expanded){display:none}fd-dynamic-page.stack-mode fd-dynamic-page-content{overflow-y:hidden}fd-dynamic-page.hideTabs ::ng-deep fdp-icon-tab-bar-text-type{display:none}@media (max-width: 599px){bnrc-dynamic-component{margin-right:0!important;margin-left:0!important}}\n"], dependencies: [{ kind: "directive", type: i2$1.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i4$5.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4$5.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4$5.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i5$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i5$2.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i5$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i5$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i5$2.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i5$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i7$2.SwitchComponent, selector: "fd-switch", inputs: ["activeText", "inactiveText", "id", "required", "checked", "semantic", "ariaLabel", "ariaLabelledBy"], outputs: ["checkedChange"] }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i5.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i1.DynamicStyleDirective, selector: "[cssStyle]", inputs: ["cssStyle"] }, { kind: "component", type: i9$2.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i9$2.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "edit", "rtl", "isAppTileSubGroup", "deviceSize"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TilesViewerComponent, decorators: [{
             type: Component,
@@ -1783,7 +1789,7 @@ class TilesViewerContainerComponent extends BaseComponent {
         this._tilesService.saveOrderAppTiles(appTileGroup, actionLinks, true, appTileIdTransferedId);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TilesViewerContainerComponent, deps: [{ token: i1.PortalService }, { token: TilesService }, { token: TilesViewerService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TilesViewerContainerComponent, selector: "bt-tiles-viewer-container", providers: [TilesViewerService], usesInheritance: true, ngImport: i0, template: "@if (appTileGroups$ | async; as appTileGroups) { @if (appTileGroups) {\r\n<bt-tiles-viewer\r\n    [class.edit]=\"(edit$ | async)!!\"\r\n    [appTileGroups]=\"appTileGroups\"\r\n    [loading]=\"(viewLoading$ | async)!!\"\r\n    [hideTabs]=\"settings?.HideTabs\"\r\n    [edit]=\"(edit$ | async)!!\"\r\n    [rtl]=\"(rtl$ | async)!!\"\r\n    [stackContent]=\"(stackContent$ | async)!!\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\r\n    [defaultTab]=\"selectedAppGroupId\"\r\n    (stackContentChange)=\"onStackContentChanged($event)\"\r\n    (closeEditHome)=\"onCloseEditHome()\"\r\n    (save)=\"onExitEditHome($event)\"\r\n    (listDropped)=\"onDropGroup($event)\"\r\n    (tabChanged)=\"onSelectedTabChange($event)\"\r\n    (toggleGroup)=\"onToggleShowHide($event)\"\r\n    (resetGroup)=\"onReset($event)\"\r\n    (deleteGroup)=\"onDelete($event)\"\r\n    (tilesDropped)=\"onDrop($event)\"\r\n    (hideAppTileClick)=\"onHideAppTile($event)\"\r\n    (renameAppTileClick)=\"onRenameAppTile($event)\"\r\n></bt-tiles-viewer>\r\n} @else {\r\n<bsu-no-data></bsu-no-data>\r\n} } @else {\r\n<bsu-mask></bsu-mask>\r\n}\r\n\r\n<ng-template #loading>\r\n    <bsu-mask></bsu-mask>\r\n</ng-template>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: i7.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: i7.NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: TilesViewerComponent, selector: "bt-tiles-viewer", inputs: ["appTileGroups", "loading", "edit", "rtl", "defaultTab", "stackContent", "deviceSize", "selectedAppGroupId", "hideTabs", "DynamicComponents"], outputs: ["stackContentChange", "closeEditHome", "save", "listDropped", "tabChanged", "toggleGroup", "resetGroup", "deleteGroup", "hideAppTileClick", "renameAppTileClick", "tilesDropped"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TilesViewerContainerComponent, selector: "bt-tiles-viewer-container", providers: [TilesViewerService], usesInheritance: true, ngImport: i0, template: "@if (appTileGroups$ | async; as appTileGroups) { @if (appTileGroups) {\r\n<bt-tiles-viewer\r\n    [class.edit]=\"(edit$ | async)!!\"\r\n    [appTileGroups]=\"appTileGroups\"\r\n    [loading]=\"(viewLoading$ | async)!!\"\r\n    [hideTabs]=\"settings?.HideTabs\"\r\n    [edit]=\"(edit$ | async)!!\"\r\n    [rtl]=\"(rtl$ | async)!!\"\r\n    [stackContent]=\"(stackContent$ | async)!!\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\r\n    [defaultTab]=\"selectedAppGroupId\"\r\n    (stackContentChange)=\"onStackContentChanged($event)\"\r\n    (closeEditHome)=\"onCloseEditHome()\"\r\n    (save)=\"onExitEditHome($event)\"\r\n    (listDropped)=\"onDropGroup($event)\"\r\n    (tabChanged)=\"onSelectedTabChange($event)\"\r\n    (toggleGroup)=\"onToggleShowHide($event)\"\r\n    (resetGroup)=\"onReset($event)\"\r\n    (deleteGroup)=\"onDelete($event)\"\r\n    (tilesDropped)=\"onDrop($event)\"\r\n    (hideAppTileClick)=\"onHideAppTile($event)\"\r\n    (renameAppTileClick)=\"onRenameAppTile($event)\"\r\n></bt-tiles-viewer>\r\n} @else {\r\n<bsu-no-data></bsu-no-data>\r\n} } @else {\r\n<bsu-mask></bsu-mask>\r\n}\r\n\r\n<ng-template #loading>\r\n    <bsu-mask></bsu-mask>\r\n</ng-template>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: i4.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: i4.NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: TilesViewerComponent, selector: "bt-tiles-viewer", inputs: ["appTileGroups", "loading", "edit", "rtl", "defaultTab", "stackContent", "deviceSize", "selectedAppGroupId", "hideTabs", "DynamicComponents"], outputs: ["stackContentChange", "closeEditHome", "save", "listDropped", "tabChanged", "toggleGroup", "resetGroup", "deleteGroup", "hideAppTileClick", "renameAppTileClick", "tilesDropped"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TilesViewerContainerComponent, decorators: [{
             type: Component,
@@ -1997,7 +2003,7 @@ class CreateAppGroupComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CreateAppGroupComponent, deps: [{ token: i1$8.UntypedFormBuilder }, { token: i1$1.DialogRef }, { token: i1.BbbTranslatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CreateAppGroupComponent, selector: "bt-create-app-group", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <h1 fd-title>{{ dialogRef.data.title }}</h1>\r\n        <button fd-dialog-close-button (click)=\"dialogRef.dismiss()\"></button>\r\n    </fd-dialog-header>\r\n\r\n    <fd-dialog-body>\r\n        <div fd-form-item [formGroup]=\"appGroupForm\">\r\n            <label fd-form-label [required]=\"true\"> {{ 'Title' | bbbTranslate }}</label>\r\n            <fd-form-input-message-group>\r\n                <fd-input-group\r\n                    class=\"form-control\"\r\n                    formControlName=\"title\"\r\n                    form-control\r\n                    [button]=\"true\"\r\n                    [(ngModel)]=\"title\"\r\n                    [state]=\"submitted && appGroupForm.controls.title.errors ? 'error' : 'information'\"\r\n                >\r\n                </fd-input-group>\r\n                @if (submitted && appGroupForm.controls.title.errors) {\r\n                <fd-form-message type=\"error\">\r\n                    {{ RequiredText }}\r\n                </fd-form-message>\r\n                }\r\n            </fd-form-input-message-group>\r\n        </div>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-button-bar [label]=\"'Save' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onSave()\"> </fd-button-bar>\r\n        <fd-button-bar\r\n            [label]=\"'Cancel' | bbbTranslate\"\r\n            fdkInitialFocus\r\n            fdType=\"transparent\"\r\n            (click)=\"this.dialogRef.dismiss()\"\r\n        >\r\n        </fd-button-bar>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4$4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i5$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i5$1.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i5$1.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen", "preventSpaceKeyScroll"], outputs: ["isOpenChange"] }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i7$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$2.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i7$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i7$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i9$1.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CreateAppGroupComponent, selector: "bt-create-app-group", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <h1 fd-title>{{ dialogRef.data.title }}</h1>\r\n        <button fd-dialog-close-button (click)=\"dialogRef.dismiss()\"></button>\r\n    </fd-dialog-header>\r\n\r\n    <fd-dialog-body>\r\n        <div fd-form-item [formGroup]=\"appGroupForm\">\r\n            <label fd-form-label [required]=\"true\"> {{ 'Title' | bbbTranslate }}</label>\r\n            <fd-form-input-message-group>\r\n                <fd-input-group\r\n                    class=\"form-control\"\r\n                    formControlName=\"title\"\r\n                    form-control\r\n                    [button]=\"true\"\r\n                    [(ngModel)]=\"title\"\r\n                    [state]=\"submitted && appGroupForm.controls.title.errors ? 'error' : 'information'\"\r\n                >\r\n                </fd-input-group>\r\n                @if (submitted && appGroupForm.controls.title.errors) {\r\n                <fd-form-message type=\"error\">\r\n                    {{ RequiredText }}\r\n                </fd-form-message>\r\n                }\r\n            </fd-form-input-message-group>\r\n        </div>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <fd-button-bar [label]=\"'Save' | bbbTranslate\" fdType=\"emphasized\" (click)=\"onSave()\"> </fd-button-bar>\r\n        <fd-button-bar\r\n            [label]=\"'Cancel' | bbbTranslate\"\r\n            fdkInitialFocus\r\n            fdType=\"transparent\"\r\n            (click)=\"this.dialogRef.dismiss()\"\r\n        >\r\n        </fd-button-bar>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4$5.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i5$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i5$1.FormMessageComponent, selector: "fd-form-message", inputs: ["type", "static", "embedded", "class"] }, { kind: "component", type: i5$1.FormInputMessageGroupComponent, selector: "fd-form-input-message-group", inputs: ["triggers", "closeOnOutsideClick", "fillControlMode", "noArrow", "closeOnEscapeKey", "placement", "placementContainer", "isOpen", "preventSpaceKeyScroll"], outputs: ["isOpenChange"] }, { kind: "component", type: i6.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i7$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$1.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i7$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i7$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i9$1.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "directive", type: i1$8.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$8.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CreateAppGroupComponent, decorators: [{
             type: Component,
@@ -2085,7 +2091,7 @@ class PinTileComponent extends BaseComponent {
         this._dialogRef.close(result);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PinTileComponent, deps: [{ token: i1$1.DialogService }, { token: i1$1.DialogRef }, { token: i1.BbbTranslatePipe }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: PinTileComponent, selector: "bt-pin-tile", inputs: { app: "app", appTileGroups: "appTileGroups", mobile: "mobile", pin: "pin" }, usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <h1 fd-title>{{ 'AddToList' | bbbTranslate }}</h1>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body>\r\n        <ul fd-list [navigationIndicator]=\"true\" style=\"margin-bottom: 1rem\">\r\n            <li fd-list-item [navigationIndicator]=\"true\" (click)=\"onNewGroup()\">\r\n                <fd-icon glyph=\"add\"></fd-icon><span fd-list-title>{{ newGroupText }}</span>\r\n            </li>\r\n            @for (appTileGroup of appTileGroups; track appTileGroup) { @if (!appTileGroup.$Disabledpin) {\r\n            <li fd-list-item [selected]=\"appTileGroup.$PinTile\">\r\n                <fd-checkbox [(ngModel)]=\"appTileGroup.$PinTile\"></fd-checkbox>\r\n                <span fd-list-title>{{ appTileGroup.navigatorTitle || appTileGroup.Title }}</span>\r\n            </li>\r\n            } @for (subGroup of appTileGroup.$Children; track subGroup) { @if (!subGroup.$Disabledpin) {\r\n            <li fd-list-item [selected]=\"subGroup.$PinTile\">\r\n                <fd-checkbox [(ngModel)]=\"subGroup.$PinTile\"></fd-checkbox>\r\n                <span fd-list-title>{{ subGroup.navigatorTitle || subGroup.Title }}</span>\r\n            </li>\r\n            } } }\r\n        </ul>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <ng-template fdkTemplate=\"footer\">\r\n            <div fd-bar-left></div>\r\n            <div fd-bar-right>\r\n                <fd-button-bar fdkInitialFocus fdType=\"emphasized\" [label]=\"'OK' | bbbTranslate\" (click)=\"onAccept()\">\r\n                </fd-button-bar>\r\n                <fd-button-bar\r\n                    fdkInitialFocus\r\n                    fdType=\"transparent\"\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                    (click)=\"onClose()\"\r\n                >\r\n                </fd-button-bar>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [":host ::ng-deep .cdk-drag{cursor:default!important}:host *{cursor:default!important}li{cursor:pointer}fd-dialog-body,fd-dialog-footer,fd-dialog-header{cursor:default}fd-icon{padding:0 5px}\n"], dependencies: [{ kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4$4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4$4.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4$4.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$3.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i4.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "directive", type: i4.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: i7$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$2.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$2.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i7$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i9$1.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i9$1.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: PinTileComponent, selector: "bt-pin-tile", inputs: { app: "app", appTileGroups: "appTileGroups", mobile: "mobile", pin: "pin" }, usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <h1 fd-title>{{ 'AddToList' | bbbTranslate }}</h1>\r\n    </fd-dialog-header>\r\n    <fd-dialog-body>\r\n        <ul fd-list [navigationIndicator]=\"true\" style=\"margin-bottom: 1rem\">\r\n            <li fd-list-item [navigationIndicator]=\"true\" (click)=\"onNewGroup()\">\r\n                <fd-icon glyph=\"add\"></fd-icon><span fd-list-title>{{ newGroupText }}</span>\r\n            </li>\r\n            @for (appTileGroup of appTileGroups; track appTileGroup) { @if (!appTileGroup.$Disabledpin) {\r\n            <li fd-list-item [selected]=\"appTileGroup.$PinTile\">\r\n                <fd-checkbox [(ngModel)]=\"appTileGroup.$PinTile\"></fd-checkbox>\r\n                <span fd-list-title>{{ appTileGroup.navigatorTitle || appTileGroup.Title }}</span>\r\n            </li>\r\n            } @for (subGroup of appTileGroup.$Children; track subGroup) { @if (!subGroup.$Disabledpin) {\r\n            <li fd-list-item [selected]=\"subGroup.$PinTile\">\r\n                <fd-checkbox [(ngModel)]=\"subGroup.$PinTile\"></fd-checkbox>\r\n                <span fd-list-title>{{ subGroup.navigatorTitle || subGroup.Title }}</span>\r\n            </li>\r\n            } } }\r\n        </ul>\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <ng-template fdkTemplate=\"footer\">\r\n            <div fd-bar-left></div>\r\n            <div fd-bar-right>\r\n                <fd-button-bar fdkInitialFocus fdType=\"emphasized\" [label]=\"'OK' | bbbTranslate\" (click)=\"onAccept()\">\r\n                </fd-button-bar>\r\n                <fd-button-bar\r\n                    fdkInitialFocus\r\n                    fdType=\"transparent\"\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                    (click)=\"onClose()\"\r\n                >\r\n                </fd-button-bar>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [":host ::ng-deep .cdk-drag{cursor:default!important}:host *{cursor:default!important}li{cursor:pointer}fd-dialog-body,fd-dialog-footer,fd-dialog-header{cursor:default}fd-icon{padding:0 5px}\n"], dependencies: [{ kind: "directive", type: i1$8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4$5.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i4$5.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i4$5.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$3.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i4$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "directive", type: i4$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "component", type: i7$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$1.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$1.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i7$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i9$1.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i9$1.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: PinTileComponent, decorators: [{
             type: Component,
@@ -2292,7 +2298,7 @@ class FormAppFinderComponent extends BaseComponent {
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormAppFinderComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$1.DialogService }, { token: AppFinderService }, { token: i0.ElementRef }, { token: i1$1.ContentDensityService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FormAppFinderComponent, selector: "bt-form-app-finder", usesInheritance: true, ngImport: i0, template: "<bt-app-finder\r\n    [appGroups]=\"(appGroups$ | async)!!\"\r\n    [selectedAppGroupId]=\"(selectedAppGroupId$ | async)!!\"\r\n    [selectedAppGroup]=\"(selectedAppGroup$ | async)!!\"\r\n    [mobile]=\"(mobile$ | async)!!\"\r\n    [sideContentSize]=\"(sideContentSize$ | async)!!\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\r\n    [contentDensity]=\"(contentDensity$ | async) ?? 'compact'\"\r\n    [pinnedAppInAppTileGroups]=\"(pinnedAppInAppTileGroups$ | async)!!\"\r\n    [contentHeight]=\"contentHeight\"\r\n    (selectedAppGroupIdChange)=\"onSelectedAppGroupChange($event)\"\r\n    (pinClick)=\"onPinClick($event)\"\r\n>\r\n</bt-app-finder>\r\n", styles: [":host{display:block;min-height:100vh}\n"], dependencies: [{ kind: "directive", type: i1.MobileDirective, selector: "[mobile]" }, { kind: "component", type: AppFinderComponent, selector: "bt-app-finder", inputs: ["appGroups", "deviceSize", "sideContentSize", "selectedAppGroup", "selectedAppGroupId", "mobile", "contentDensity", "contentHeight", "pinnedAppInAppTileGroups"], outputs: ["pinClick", "selectedAppGroupIdChange"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: FormAppFinderComponent, selector: "bt-form-app-finder", usesInheritance: true, ngImport: i0, template: "<bt-app-finder\r\n    [appGroups]=\"(appGroups$ | async)!!\"\r\n    [selectedAppGroupId]=\"(selectedAppGroupId$ | async)!!\"\r\n    [selectedAppGroup]=\"(selectedAppGroup$ | async)!!\"\r\n    [mobile]=\"(mobile$ | async)!!\"\r\n    [sideContentSize]=\"(sideContentSize$ | async)!!\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\r\n    [contentDensity]=\"(contentDensity$ | async) ?? 'compact'\"\r\n    [pinnedAppInAppTileGroups]=\"(pinnedAppInAppTileGroups$ | async)!!\"\r\n    [contentHeight]=\"contentHeight\"\r\n    (selectedAppGroupIdChange)=\"onSelectedAppGroupChange($event)\"\r\n    (pinClick)=\"onPinClick($event)\"\r\n>\r\n</bt-app-finder>\r\n", styles: [":host{display:block;min-height:100vh}\n"], dependencies: [{ kind: "directive", type: i1.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i4.ContentDensityDirective, selector: "[contentDensity]" }, { kind: "component", type: AppFinderComponent, selector: "bt-app-finder", inputs: ["appGroups", "deviceSize", "sideContentSize", "selectedAppGroup", "selectedAppGroupId", "mobile", "contentDensity", "contentHeight", "pinnedAppInAppTileGroups"], outputs: ["pinClick", "selectedAppGroupIdChange"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FormAppFinderComponent, decorators: [{
             type: Component,
@@ -2358,7 +2364,7 @@ class NumericTileComponent extends BaseBtTileComponent {
         return this.settings.ScaleArrowIcon;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NumericTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NumericTileComponent, selector: "bt-numeric-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [edit]=\"edit\"\r\n    [backColor]=\"backColor\"\r\n    [setToStorage]=\"setToStorage\"\r\n    [listMode]=\"listMode\"\r\n    [deviceSize]=\"deviceSize\"\r\n    [navigateBackOnClick]=\"navigateBackOnClick\"\r\n    [title]=\"data | tileProp: 'Title':parameters\"\r\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\r\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\r\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\r\n    [footer]=\"data | tileProp: 'Footer':parameters\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n    (click)=\"onTileClick()\"\r\n>\r\n    <div fd-tile-content>\r\n        <div fd-numeric-content>\r\n            <div fd-numeric-content-launch-icon-container>\r\n                <i fd-numeric-content-launch-icon [glyph]=\"launchIcon\" [class]=\"launchIcon | sapFontClass\"></i>\r\n            </div>\r\n            <div fd-numeric-content-kpi-container>\r\n                <div fd-numeric-content-kpi [state]=\"kpiState\" [style.color]=\"kpiStateIsColor ? kpiState : null\">\r\n                    {{ kpi }}\r\n                </div>\r\n            </div>\r\n            <div fd-numeric-content-scale-container style=\"padding-top: 0.2rem\">\r\n                <div\r\n                    fd-numeric-content-scale\r\n                    [state]=\"scaleState\"\r\n                    [style.color]=\"scalseStateIsColor ? scaleState : null\"\r\n                >\r\n                    <span\r\n                        fd-numeric-content-scale-arrow\r\n                        [glyph]=\"scaleArrowIcon\"\r\n                        [class]=\"scaleArrowIcon | sapFontClass\"\r\n                        [style.color]=\"scalseStateIsColor ? scaleState : null\"\r\n                    ></span>\r\n                    <span fd-numeric-content-scale-text [style.color]=\"scalseStateIsColor ? scaleState : null\">{{\r\n                        scaleText\r\n                    }}</span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</bt-tile>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.NumericContentDirective, selector: "[fd-numeric-content]", inputs: ["class", "size"] }, { kind: "directive", type: i1$3.NumericContentKpiContainerDirective, selector: "[fd-numeric-content-kpi-container]" }, { kind: "directive", type: i1$3.NumericContentKpiDirective, selector: "[fd-numeric-content-kpi]", inputs: ["state", "class", "glyph"] }, { kind: "directive", type: i1$3.NumericContentLaunchIconContainerDirective, selector: "[fd-numeric-content-launch-icon-container]" }, { kind: "directive", type: i1$3.NumericContentLaunchIconDirective, selector: "[fd-numeric-content-launch-icon]", inputs: ["class", "glyph", "glyphFont"] }, { kind: "directive", type: i1$3.NumericContentScaleArrowDirective, selector: "[fd-numeric-content-scale-arrow]", inputs: ["class", "glyph", "glyphFont"] }, { kind: "directive", type: i1$3.NumericContentScaleContainerDirective, selector: "[fd-numeric-content-scale-container]" }, { kind: "directive", type: i1$3.NumericContentScaleDirective, selector: "[fd-numeric-content-scale]", inputs: ["state", "class"] }, { kind: "directive", type: i1$3.NumericContentScaleTextDirective, selector: "[fd-numeric-content-scale-text]" }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "title", "icon", "subtitle", "isDouble", "disableClick", "edit", "dynamicCommand", "backColor", "hideHeader", "setToStorage", "listMode", "navigateBackOnClick"] }, { kind: "pipe", type: i7.SapFontClassPipe, name: "sapFontClass" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: NumericTileComponent, selector: "bt-numeric-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [edit]=\"edit\"\r\n    [backColor]=\"backColor\"\r\n    [setToStorage]=\"setToStorage\"\r\n    [listMode]=\"listMode\"\r\n    [deviceSize]=\"deviceSize\"\r\n    [navigateBackOnClick]=\"navigateBackOnClick\"\r\n    [title]=\"data | tileProp: 'Title':parameters\"\r\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\r\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\r\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\r\n    [footer]=\"data | tileProp: 'Footer':parameters\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n    (click)=\"onTileClick()\"\r\n>\r\n    <div fd-tile-content>\r\n        <div fd-numeric-content>\r\n            <div fd-numeric-content-launch-icon-container>\r\n                <i fd-numeric-content-launch-icon [glyph]=\"launchIcon\" [class]=\"launchIcon | sapFontClass\"></i>\r\n            </div>\r\n            <div fd-numeric-content-kpi-container>\r\n                <div fd-numeric-content-kpi [state]=\"kpiState\" [style.color]=\"kpiStateIsColor ? kpiState : null\">\r\n                    {{ kpi }}\r\n                </div>\r\n            </div>\r\n            <div fd-numeric-content-scale-container style=\"padding-top: 0.2rem\">\r\n                <div\r\n                    fd-numeric-content-scale\r\n                    [state]=\"scaleState\"\r\n                    [style.color]=\"scalseStateIsColor ? scaleState : null\"\r\n                >\r\n                    <span\r\n                        fd-numeric-content-scale-arrow\r\n                        [glyph]=\"scaleArrowIcon\"\r\n                        [class]=\"scaleArrowIcon | sapFontClass\"\r\n                        [style.color]=\"scalseStateIsColor ? scaleState : null\"\r\n                    ></span>\r\n                    <span fd-numeric-content-scale-text [style.color]=\"scalseStateIsColor ? scaleState : null\">{{\r\n                        scaleText\r\n                    }}</span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</bt-tile>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$3.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.NumericContentDirective, selector: "[fd-numeric-content]", inputs: ["class", "size"] }, { kind: "directive", type: i1$3.NumericContentKpiContainerDirective, selector: "[fd-numeric-content-kpi-container]" }, { kind: "directive", type: i1$3.NumericContentKpiDirective, selector: "[fd-numeric-content-kpi]", inputs: ["state", "class", "glyph"] }, { kind: "directive", type: i1$3.NumericContentLaunchIconContainerDirective, selector: "[fd-numeric-content-launch-icon-container]" }, { kind: "directive", type: i1$3.NumericContentLaunchIconDirective, selector: "[fd-numeric-content-launch-icon]", inputs: ["class", "glyph", "glyphFont"] }, { kind: "directive", type: i1$3.NumericContentScaleArrowDirective, selector: "[fd-numeric-content-scale-arrow]", inputs: ["class", "glyph", "glyphFont"] }, { kind: "directive", type: i1$3.NumericContentScaleContainerDirective, selector: "[fd-numeric-content-scale-container]" }, { kind: "directive", type: i1$3.NumericContentScaleDirective, selector: "[fd-numeric-content-scale]", inputs: ["state", "class"] }, { kind: "directive", type: i1$3.NumericContentScaleTextDirective, selector: "[fd-numeric-content-scale-text]" }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "title", "icon", "subtitle", "isDouble", "disableClick", "edit", "dynamicCommand", "backColor", "hideHeader", "setToStorage", "listMode", "navigateBackOnClick"] }, { kind: "pipe", type: i4.SapFontClassPipe, name: "sapFontClass" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: NumericTileComponent, decorators: [{
             type: Component,
@@ -2417,7 +2423,7 @@ class SimpleTileComponent extends BaseBtTileComponent {
         this.iconColor = this.settings.IconColor;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SimpleTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SimpleTileComponent, selector: "bt-simple-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [edit]=\"edit\"\r\n    [navigateBackOnClick]=\"navigateBackOnClick\"\r\n    [title]=\"data | tileProp: 'Title':parameters\"\r\n    [setToStorage]=\"setToStorage\"\r\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\r\n    [listMode]=\"listMode\"\r\n    [backColor]=\"backColor\"\r\n    [deviceSize]=\"deviceSize\"\r\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\r\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\r\n    [footer]=\"data | tileProp: 'Footer':parameters\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n    (click)=\"onTileClick()\"\r\n>\r\n    <div fd-tile-content [class.picture-icon]=\"pictureIcon || iconCalc\">\r\n        @if(pictureIcon || iconCalc){\r\n        <span\r\n            class=\"tile-picture-icon\"\r\n            [class.circle]=\"isCircle\"\r\n            fd-tile-profile-img\r\n            [backgroundImage]=\"iconCalc || (pictureIcon.FileId | picFieldSrc: 'GetPictureFromFileInfo':null)\"\r\n        ></span>\r\n        } @else if (icon) {\r\n        <div class=\"fd-numeric-content__launch-icon-container\" style=\"justify-content: center\">\r\n            <fd-icon\r\n                class=\"fd-numeric-content__launch-icon\"\r\n                fd-numeric-content-launch-icon\r\n                [glyph]=\"icon\"\r\n                [font]=\"icon | sapFont\"\r\n                [style.color]=\"iconColor\"\r\n            ></fd-icon>\r\n        </div>\r\n        }\r\n    </div>\r\n</bt-tile>\r\n", styles: ["fd-icon{font-size:2rem}.tile-picture-icon{background-size:contain;background-position:center;background-repeat:no-repeat;border-radius:0}.tile-picture-icon.circle{border-radius:50%}\n"], dependencies: [{ kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: i1$3.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.TileProfileImgDirective, selector: "[fdTileProfileImg], [fd-tile-profile-img]", inputs: ["id", "ariaLabel", "ariaLabelledby", "backgroundImage"] }, { kind: "directive", type: i1$3.NumericContentLaunchIconDirective, selector: "[fd-numeric-content-launch-icon]", inputs: ["class", "glyph", "glyphFont"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "title", "icon", "subtitle", "isDouble", "disableClick", "edit", "dynamicCommand", "backColor", "hideHeader", "setToStorage", "listMode", "navigateBackOnClick"] }, { kind: "pipe", type: i1.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i7.SapFontPipe, name: "sapFont" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: SimpleTileComponent, selector: "bt-simple-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [edit]=\"edit\"\r\n    [navigateBackOnClick]=\"navigateBackOnClick\"\r\n    [title]=\"data | tileProp: 'Title':parameters\"\r\n    [setToStorage]=\"setToStorage\"\r\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\r\n    [listMode]=\"listMode\"\r\n    [backColor]=\"backColor\"\r\n    [deviceSize]=\"deviceSize\"\r\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\r\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\r\n    [footer]=\"data | tileProp: 'Footer':parameters\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n    (click)=\"onTileClick()\"\r\n>\r\n    <div fd-tile-content [class.picture-icon]=\"pictureIcon || iconCalc\">\r\n        @if(pictureIcon || iconCalc){\r\n        <span\r\n            class=\"tile-picture-icon\"\r\n            [class.circle]=\"isCircle\"\r\n            fd-tile-profile-img\r\n            [backgroundImage]=\"iconCalc || (pictureIcon.FileId | picFieldSrc: 'GetPictureFromFileInfo':null)\"\r\n        ></span>\r\n        } @else if (icon) {\r\n        <div class=\"fd-numeric-content__launch-icon-container\" style=\"justify-content: center\">\r\n            <fd-icon\r\n                class=\"fd-numeric-content__launch-icon\"\r\n                fd-numeric-content-launch-icon\r\n                [glyph]=\"icon\"\r\n                [font]=\"icon | sapFont\"\r\n                [style.color]=\"iconColor\"\r\n            ></fd-icon>\r\n        </div>\r\n        }\r\n    </div>\r\n</bt-tile>\r\n", styles: ["fd-icon{font-size:2rem}.tile-picture-icon{background-size:contain;background-position:center;background-repeat:no-repeat;border-radius:0}.tile-picture-icon.circle{border-radius:50%}\n"], dependencies: [{ kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: i1$3.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.TileProfileImgDirective, selector: "[fdTileProfileImg], [fd-tile-profile-img]", inputs: ["id", "ariaLabel", "ariaLabelledby", "backgroundImage"] }, { kind: "directive", type: i1$3.NumericContentLaunchIconDirective, selector: "[fd-numeric-content-launch-icon]", inputs: ["class", "glyph", "glyphFont"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "title", "icon", "subtitle", "isDouble", "disableClick", "edit", "dynamicCommand", "backColor", "hideHeader", "setToStorage", "listMode", "navigateBackOnClick"] }, { kind: "pipe", type: i1.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i4.SapFontPipe, name: "sapFont" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: SimpleTileComponent, decorators: [{
             type: Component,
@@ -2476,7 +2482,7 @@ class ProfileTileComponent extends BaseBtTileComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProfileTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ProfileTileComponent, selector: "bt-profile-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [edit]=\"edit\"\r\n    [backColor]=\"backColor\"\r\n    [setToStorage]=\"setToStorage\"\r\n    [listMode]=\"listMode\"\r\n    [deviceSize]=\"deviceSize\"\r\n    [navigateBackOnClick]=\"navigateBackOnClick\"\r\n    [title]=\"data | tileProp: 'Title':parameters\"\r\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\r\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\r\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\r\n    [footer]=\"data | tileProp: 'Footer':parameters\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n    (click)=\"onTileClick()\"\r\n>\r\n    <div fd-tile-content>\r\n        @if (fileId2 || calcImage) {\r\n        <span\r\n            class=\"profile\"\r\n            fd-tile-profile-img\r\n            [backgroundImage]=\"calcImage || (fileId2 | picFieldSrc: 'GetPictureFromFileInfo':null)\"\r\n        ></span>\r\n        } @else if(icon){\r\n        <fd-icon [font]=\"icon | sapFont\" fd-tile-profile-img style=\"font-size: 2rem\" [glyph]=\"icon\"></fd-icon>\r\n        } @else {\r\n        <fd-icon font=\"SAP-icons-TNT\" fd-tile-profile-img style=\"font-size: 2rem\" glyph=\"user\"></fd-icon>\r\n        }\r\n    </div>\r\n</bt-tile>\r\n", styles: [".profile{background-size:contain;background-repeat:no-repeat}\n"], dependencies: [{ kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: i1$3.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.TileProfileImgDirective, selector: "[fdTileProfileImg], [fd-tile-profile-img]", inputs: ["id", "ariaLabel", "ariaLabelledby", "backgroundImage"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "title", "icon", "subtitle", "isDouble", "disableClick", "edit", "dynamicCommand", "backColor", "hideHeader", "setToStorage", "listMode", "navigateBackOnClick"] }, { kind: "pipe", type: i1.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i7.SapFontPipe, name: "sapFont" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: ProfileTileComponent, selector: "bt-profile-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [edit]=\"edit\"\r\n    [backColor]=\"backColor\"\r\n    [setToStorage]=\"setToStorage\"\r\n    [listMode]=\"listMode\"\r\n    [deviceSize]=\"deviceSize\"\r\n    [navigateBackOnClick]=\"navigateBackOnClick\"\r\n    [title]=\"data | tileProp: 'Title':parameters\"\r\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\r\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\r\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\r\n    [footer]=\"data | tileProp: 'Footer':parameters\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n    (click)=\"onTileClick()\"\r\n>\r\n    <div fd-tile-content>\r\n        @if (fileId2 || calcImage) {\r\n        <span\r\n            class=\"profile\"\r\n            fd-tile-profile-img\r\n            [backgroundImage]=\"calcImage || (fileId2 | picFieldSrc: 'GetPictureFromFileInfo':null)\"\r\n        ></span>\r\n        } @else if(icon){\r\n        <fd-icon [font]=\"icon | sapFont\" fd-tile-profile-img style=\"font-size: 2rem\" [glyph]=\"icon\"></fd-icon>\r\n        } @else {\r\n        <fd-icon font=\"SAP-icons-TNT\" fd-tile-profile-img style=\"font-size: 2rem\" glyph=\"user\"></fd-icon>\r\n        }\r\n    </div>\r\n</bt-tile>\r\n", styles: [".profile{background-size:contain;background-repeat:no-repeat}\n"], dependencies: [{ kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: i1$3.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$3.TileProfileImgDirective, selector: "[fdTileProfileImg], [fd-tile-profile-img]", inputs: ["id", "ariaLabel", "ariaLabelledby", "backgroundImage"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "title", "icon", "subtitle", "isDouble", "disableClick", "edit", "dynamicCommand", "backColor", "hideHeader", "setToStorage", "listMode", "navigateBackOnClick"] }, { kind: "pipe", type: i1.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i4.SapFontPipe, name: "sapFont" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: ProfileTileComponent, decorators: [{
             type: Component,
@@ -2666,7 +2672,7 @@ class BarsaShellbarComponent extends BaseComponent {
         this.cultureChanged.emit(culture);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaShellbarComponent, deps: [{ token: i1$1.DialogService }, { token: DOCUMENT }, { token: APP_VERSION }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaShellbarComponent, selector: "bt-barsa-shellbar", inputs: { cssCustomUrl: "cssCustomUrl", cssUrl: "cssUrl", cssVariableUrl: "cssVariableUrl", multiLanguages: "multiLanguages", userLoggedIn: "userLoggedIn", settings: "settings", productMenuControl: "productMenuControl", deviceSize: "deviceSize", cultures: "cultures", shellbarData: "shellbarData", notificationsUnreadCount: "notificationsUnreadCount", productMenuItems1: "productMenuItems1", bodyClick: "bodyClick", logo: "logo", actions: "actions", userMenu: "userMenu", productSwitcher: "productSwitcher", subtitle: "subtitle", isMobile: "isMobile", hideShellbarActions: "hideShellbarActions", showExtraButton: "showExtraButton", isTablet: "isTablet", userProfileImageUrl: "userProfileImageUrl", isDesktop: "isDesktop", isServiceDesk: "isServiceDesk", isOpenQuickAccess: "isOpenQuickAccess", sideMenuTemplate: "sideMenuTemplate", notificationReport: "notificationReport" }, outputs: { isOpenQuickAccessChanged: "isOpenQuickAccessChanged", openNotificationPanel: "openNotificationPanel", openQuickAccessPanel: "openQuickAccessPanel", cultureChanged: "cultureChanged", notifiationActionClick: "notifiationActionClick" }, viewQueries: [{ propertyName: "comboboxComponent", first: true, predicate: ComboboxComponent, descendants: true }, { propertyName: "popoverComponent", first: true, predicate: ["popoverComponent"], descendants: true }, { propertyName: "_notificationsDialog", first: true, predicate: ["notificationsDialog"], descendants: true, read: TemplateRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (cssVariableUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssVariableUrl\" />\r\n} @if (cssUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssUrl\" />\r\n} @if (cssCustomUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssCustomUrl\" />\r\n}\r\n<fd-shellbar\r\n    [size]=\"deviceSize\"\r\n    [ngClass]=\"deviceSize\"\r\n    routeFormChange\r\n    (stateChanged)=\"onRouteFormStateChange()\"\r\n    [handleBodyClick]=\"true\"\r\n>\r\n    @if (sideMenuTemplate) {\r\n    <fd-shellbar-action\r\n        [glyph]=\"'apps'\"\r\n        [label]=\"'Quick Access' | bbbTranslate\"\r\n        [notificationCount]=\"notificationsUnreadCount\"\r\n        [notificationLabel]=\"'Quick Access' | bbbTranslate\"\r\n        [callback]=\"onOpenQuickAccess\"\r\n    >\r\n    </fd-shellbar-action>\r\n    } @if (sideMenuTemplate) {\r\n    <button\r\n        fd-shellbar-side-nav\r\n        fd-button\r\n        fdType=\"transparent\"\r\n        glyph=\"menu2\"\r\n        style=\"width: 2.75rem\"\r\n        (click)=\"$event.stopPropagation(); isOpenQuickAccessChanged.emit(!isOpenQuickAccess)\"\r\n    ></button>\r\n    } @if (logo) {\r\n    <fd-shellbar-logo>\r\n        <a\r\n            [style.backgroundImage]=\"'url(' + (logo?.FileId | picFieldSrc: 'GetPictureFromFileInfo':null) + ')'\"\r\n            href=\"/\"\r\n            class=\"fd-shellbar__logo fd-shellbar__logo--image-replaced\"\r\n            aria-label=\"Barsa Novin Ray\"\r\n        ></a>\r\n    </fd-shellbar-logo>\r\n    } @if (!settings?.HideProductMenu && productMenuItems1 && productMenuItems1.length > 0) {\r\n    <fd-product-menu [control]=\"productMenuControl\" [closePopoverOnSelect]=\"true\" [items]=\"productMenuItems1\">\r\n    </fd-product-menu>\r\n    }\r\n    <fd-shellbar-subtitle> {{ subtitle | bbbTranslate }}{{ showVersion ? appVersion : '' }}</fd-shellbar-subtitle>\r\n    @if (!hideShellbarActions&& user && (userMenu?.length || !settings?.HideLanguage)) {\r\n    <fd-shellbar-actions [user]=\"user\" [userMenu]=\"userMenu\" #langRef>\r\n        @for (action of actions; track action) {\r\n        <fd-shellbar-action\r\n            [glyph]=\"action.Icon\"\r\n            [callback]=\"action.Callback\"\r\n            [label]=\"action.Label\"\r\n            notificationLabel=\"login\"\r\n        >\r\n        </fd-shellbar-action>\r\n        } @if (deviceSize === 's' && userLoggedIn && !settings?.HideNotifications) {\r\n        <fd-shellbar-action\r\n            [glyph]=\"'bell'\"\r\n            [label]=\"'Notifications' | bbbTranslate\"\r\n            [notificationCount]=\"notificationsUnreadCount\"\r\n            [notificationLabel]=\"'Notifications' | bbbTranslate\"\r\n            [callback]=\"onBellNotification\"\r\n        >\r\n        </fd-shellbar-action>\r\n        } @if (!settings?.HideNotifications && userLoggedIn) {\r\n        <fd-popover\r\n            [(isOpen)]=\"isOpenNotificatoin\"\r\n            [triggers]=\"[]\"\r\n            [focusTrapped]=\"true\"\r\n            [noArrow]=\"true\"\r\n            placement=\"bottom\"\r\n            title=\"Notification Popover\"\r\n            [focusAutoCapture]=\"true\"\r\n            [mobile]=\"deviceSize === 's'\"\r\n            #popoverComponent\r\n        >\r\n            <fd-popover-control>\r\n                <fd-shellbar-action\r\n                    [glyph]=\"'bell'\"\r\n                    [label]=\"'Notification'\"\r\n                    [notificationCount]=\"notificationsUnreadCount\"\r\n                    [notificationLabel]=\"'Notification Label'\"\r\n                    [callback]=\"onOpenNotification\"\r\n                >\r\n                </fd-shellbar-action>\r\n            </fd-popover-control>\r\n            <fd-popover-body style=\"min-width: 320px; overflow-x: auto; box-shadow: var(--sapContent_Shadow0)\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n                ></ng-container>\r\n            </fd-popover-body>\r\n        </fd-popover>\r\n        } @if (!settings?.HideLanguage && deviceSize !== 's' && multiLanguages) {\r\n        <fd-shellbar-action [glyph]=\"'world'\" [label]=\"'language'\" [fdMenuTrigger]=\"menu\" (callback)=\"(onLanguage)\">\r\n        </fd-shellbar-action>\r\n        } @if (!settings?.HideLanguage && deviceSize === 's' && multiLanguages) { @for (culture of cultures | keyvalue;\r\n        track culture) {\r\n        <fd-shellbar-action\r\n            [label]=\"culture.value\"\r\n            [callback]=\"onLanguage\"\r\n            class=\"culture-abbrivation\"\r\n            [glyph]=\"culture.key\"\r\n            [ngClass]=\"'flags'\"\r\n        >\r\n        </fd-shellbar-action>\r\n        } } @if (productSwitcher?.length) {\r\n        <fd-product-switch>\r\n            <fd-product-switch-body [products]=\"productSwitcher\" [forceListMode]=\"deviceSize === 's'\">\r\n            </fd-product-switch-body>\r\n        </fd-product-switch>\r\n        }\r\n    </fd-shellbar-actions>\r\n    }\r\n</fd-shellbar>\r\n@if(showExtraButton){\r\n<div\r\n    [class.fd-shellbar--xl]=\"isDesktop\"\r\n    [class.fd-shellbar--m]=\"isTablet\"\r\n    [class.fd-shellbar--s]=\"isMobile\"\r\n    class=\"extra-button-wrapper\"\r\n    [class.service-desk]=\"isServiceDesk\"\r\n>\r\n    <ng-content select=\"button\"></ng-content>\r\n</div>\r\n}\r\n<ng-template #loading>\r\n    <bsu-mask></bsu-mask>\r\n</ng-template>\r\n\r\n<div\r\n    *ngIf=\"sideMenuTemplate\"\r\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\r\n    [class.tw-w-screen]=\"isMobile\"\r\n    [class.-tw-right-full]=\"isMobile\"\r\n    [class.tw-w-96]=\"!isMobile\"\r\n    [class.-tw-right-96]=\"!isMobile\"\r\n    [class.!tw-right-0]=\"isOpenQuickAccess\"\r\n    (click)=\"$event.stopPropagation()\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"sideMenuTemplate\"></ng-container>\r\n</div>\r\n\r\n@if(isOpenQuickAccess) {\r\n<div\r\n    class=\"sidemenu-h tw-fixed tw-right-0 tw-bg-slate-800/[.5] tw-z-[90] tw-w-screen tw-backdrop-blur-sm\"\r\n    (click)=\"isOpenQuickAccessChanged.emit(false)\"\r\n></div>\r\n}\r\n<fd-menu #menu>\r\n    <ul fd-list>\r\n        @for (culture of cultures | keyvalue; track culture) {\r\n        <li fd-list-item>\r\n            <a fd-list-link (click)=\"onCultureChange(culture.value)\">\r\n                <span fd-list-title>\r\n                    <img width=\"14px\" height=\"12px\" [src]=\"'/assets/flags/' + culture.key + '.png'\" />\r\n                    <span class=\"culture-abbrivation\" [ngClass]=\"culture.key\"> {{ culture.key }}</span>\r\n                </span>\r\n            </a>\r\n        </li>\r\n        }\r\n    </ul>\r\n</fd-menu>\r\n<ng-template #notificationGroupTpl let-notificationCount=\"notificationCount\">\r\n    <bt-notification-group\r\n        [notificationReport]=\"notificationReport\"\r\n        [notificationCount]=\"notificationCount\"\r\n        (actionClick)=\"popoverComponent.close(); onNotificationAction($event)\"\r\n        [deviceSize]=\"deviceSize\"\r\n    ></bt-notification-group>\r\n</ng-template>\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #notificationsDialog>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Notification' | bbbTranslate }}</h1>\r\n            <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body class=\"mobile\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n            ></ng-container>\r\n        </fd-dialog-body>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;position:relative}:host ::ng-deep fd-shellbar-actions fd-avatar{background-color:transparent!important;color:var(--sapShell_InteractiveTextColor, #d1e8ff)}:host ::ng-deep fd-combobox .fd-input-group input{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}:host ::ng-deep fd-combobox .fd-input-group span{min-width:2rem;min-height:1.625rem}:host ::ng-deep .fd-shellbar__subtitle{font-size:1rem}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__subtitle{display:block;overflow:hidden;text-wrap:wrap;width:100%;word-break:break-all}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--product{flex:1}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--actions{max-width:120px}.fd-shellbar__logo{min-height:3rem;height:3rem;width:3rem}.extra-button-wrapper{display:flex;height:100%;align-items:center;position:absolute;left:10px;top:0;gap:.285rem}.sidemenu-h{top:var(--fdShellbar_Height);height:calc(100vh - var(--fdShellbar_Height))}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "directive", type: i4.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i4.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i4$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i4$1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$2.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$2.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$2.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i7$2.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8$1.ProductSwitchComponent, selector: "fd-product-switch", inputs: ["placement", "disabled"] }, { kind: "component", type: i8$1.ProductSwitchBodyComponent, selector: "fd-product-switch-body", inputs: ["dragAndDropEnabled", "products", "forceListMode"], outputs: ["productsChange", "itemClicked"] }, { kind: "component", type: i9$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i9$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i9$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i10.ShellbarComponent, selector: "fd-shellbar", inputs: ["size", "breakpoints", "sideNav", "groupFlex"] }, { kind: "component", type: i10.ProductMenuComponent, selector: "fd-product-menu", inputs: ["closeOnEscapeKey", "closeOnOutsideClick", "triggers", "placement", "disabled", "fillControlMode", "control", "items", "closePopoverOnSelect"] }, { kind: "component", type: i10.ShellbarSubtitleComponent, selector: "fd-shellbar-subtitle" }, { kind: "component", type: i10.ShellbarActionsComponent, selector: "fd-shellbar-actions", inputs: ["user", "userMenu", "closePopoverOnSelect"], outputs: ["searchOpen"] }, { kind: "component", type: i10.ShellbarActionComponent, selector: "fd-shellbar-action", inputs: ["glyph", "glyphFont", "callback", "label", "notificationLabel", "notificationCount"] }, { kind: "component", type: i10.ShellbarLogoComponent, selector: "fd-shellbar-logo" }, { kind: "directive", type: i10.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "directive", type: i1.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i1.RouteFormChangeDirective, selector: "[routeFormChange]", inputs: ["handleBodyClick"], outputs: ["stateChanged"] }, { kind: "component", type: i7.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: NotificationGroupComponent, selector: "bt-notification-group", inputs: ["notifications", "loading", "deviceSize", "notificationCount", "notificationReport"], outputs: ["viewed", "remove", "actionClick", "showEvent", "loadMore"] }, { kind: "pipe", type: i1$4.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i1.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaShellbarComponent, selector: "bt-barsa-shellbar", inputs: { cssCustomUrl: "cssCustomUrl", cssUrl: "cssUrl", cssVariableUrl: "cssVariableUrl", multiLanguages: "multiLanguages", userLoggedIn: "userLoggedIn", settings: "settings", productMenuControl: "productMenuControl", deviceSize: "deviceSize", cultures: "cultures", shellbarData: "shellbarData", notificationsUnreadCount: "notificationsUnreadCount", productMenuItems1: "productMenuItems1", bodyClick: "bodyClick", logo: "logo", actions: "actions", userMenu: "userMenu", productSwitcher: "productSwitcher", subtitle: "subtitle", isMobile: "isMobile", hideShellbarActions: "hideShellbarActions", showExtraButton: "showExtraButton", isTablet: "isTablet", userProfileImageUrl: "userProfileImageUrl", isDesktop: "isDesktop", isServiceDesk: "isServiceDesk", isOpenQuickAccess: "isOpenQuickAccess", sideMenuTemplate: "sideMenuTemplate", notificationReport: "notificationReport" }, outputs: { isOpenQuickAccessChanged: "isOpenQuickAccessChanged", openNotificationPanel: "openNotificationPanel", openQuickAccessPanel: "openQuickAccessPanel", cultureChanged: "cultureChanged", notifiationActionClick: "notifiationActionClick" }, viewQueries: [{ propertyName: "comboboxComponent", first: true, predicate: ComboboxComponent, descendants: true }, { propertyName: "popoverComponent", first: true, predicate: ["popoverComponent"], descendants: true }, { propertyName: "_notificationsDialog", first: true, predicate: ["notificationsDialog"], descendants: true, read: TemplateRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (cssVariableUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssVariableUrl\" />\r\n} @if (cssUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssUrl\" />\r\n} @if (cssCustomUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssCustomUrl\" />\r\n}\r\n<fd-shellbar\r\n    [size]=\"deviceSize\"\r\n    [ngClass]=\"deviceSize\"\r\n    routeFormChange\r\n    (stateChanged)=\"onRouteFormStateChange()\"\r\n    [handleBodyClick]=\"true\"\r\n>\r\n    @if (sideMenuTemplate) {\r\n    <fd-shellbar-action\r\n        [glyph]=\"'apps'\"\r\n        [label]=\"'Quick Access' | bbbTranslate\"\r\n        [notificationCount]=\"notificationsUnreadCount\"\r\n        [notificationLabel]=\"'Quick Access' | bbbTranslate\"\r\n        [callback]=\"onOpenQuickAccess\"\r\n    >\r\n    </fd-shellbar-action>\r\n    } @if (sideMenuTemplate) {\r\n    <button\r\n        fd-shellbar-side-nav\r\n        fd-button\r\n        fdType=\"transparent\"\r\n        glyph=\"menu2\"\r\n        style=\"width: 2.75rem\"\r\n        (click)=\"$event.stopPropagation(); isOpenQuickAccessChanged.emit(!isOpenQuickAccess)\"\r\n    ></button>\r\n    } @if (logo) {\r\n    <fd-shellbar-logo>\r\n        <a\r\n            [style.backgroundImage]=\"'url(' + (logo?.FileId | picFieldSrc: 'GetPictureFromFileInfo':null) + ')'\"\r\n            href=\"/\"\r\n            class=\"fd-shellbar__logo fd-shellbar__logo--image-replaced\"\r\n            aria-label=\"Barsa Novin Ray\"\r\n        ></a>\r\n    </fd-shellbar-logo>\r\n    } @if (!settings?.HideProductMenu && productMenuItems1 && productMenuItems1.length > 0) {\r\n    <fd-product-menu [control]=\"productMenuControl\" [closePopoverOnSelect]=\"true\" [items]=\"productMenuItems1\">\r\n    </fd-product-menu>\r\n    }\r\n    <fd-shellbar-subtitle> {{ subtitle | bbbTranslate }}{{ showVersion ? appVersion : '' }}</fd-shellbar-subtitle>\r\n    @if (!hideShellbarActions&& user && (userMenu?.length || !settings?.HideLanguage)) {\r\n    <fd-shellbar-actions [user]=\"user\" [userMenu]=\"userMenu\" #langRef>\r\n        @for (action of actions; track action) {\r\n        <fd-shellbar-action\r\n            [glyph]=\"action.Icon\"\r\n            [callback]=\"action.Callback\"\r\n            [label]=\"action.Label\"\r\n            notificationLabel=\"login\"\r\n        >\r\n        </fd-shellbar-action>\r\n        } @if (deviceSize === 's' && userLoggedIn && !settings?.HideNotifications) {\r\n        <fd-shellbar-action\r\n            [glyph]=\"'bell'\"\r\n            [label]=\"'Notifications' | bbbTranslate\"\r\n            [notificationCount]=\"notificationsUnreadCount\"\r\n            [notificationLabel]=\"'Notifications' | bbbTranslate\"\r\n            [callback]=\"onBellNotification\"\r\n        >\r\n        </fd-shellbar-action>\r\n        } @if (!settings?.HideNotifications && userLoggedIn) {\r\n        <fd-popover\r\n            [(isOpen)]=\"isOpenNotificatoin\"\r\n            [triggers]=\"[]\"\r\n            [focusTrapped]=\"true\"\r\n            [noArrow]=\"true\"\r\n            placement=\"bottom\"\r\n            title=\"Notification Popover\"\r\n            [focusAutoCapture]=\"true\"\r\n            [mobile]=\"deviceSize === 's'\"\r\n            #popoverComponent\r\n        >\r\n            <fd-popover-control>\r\n                <fd-shellbar-action\r\n                    [glyph]=\"'bell'\"\r\n                    [label]=\"'Notification'\"\r\n                    [notificationCount]=\"notificationsUnreadCount\"\r\n                    [notificationLabel]=\"'Notification Label'\"\r\n                    [callback]=\"onOpenNotification\"\r\n                >\r\n                </fd-shellbar-action>\r\n            </fd-popover-control>\r\n            <fd-popover-body style=\"min-width: 320px; overflow-x: auto; box-shadow: var(--sapContent_Shadow0)\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n                ></ng-container>\r\n            </fd-popover-body>\r\n        </fd-popover>\r\n        } @if (!settings?.HideLanguage && deviceSize !== 's' && multiLanguages) {\r\n        <fd-shellbar-action [glyph]=\"'world'\" [label]=\"'language'\" [fdMenuTrigger]=\"menu\" (callback)=\"(onLanguage)\">\r\n        </fd-shellbar-action>\r\n        } @if (!settings?.HideLanguage && deviceSize === 's' && multiLanguages) { @for (culture of cultures | keyvalue;\r\n        track culture) {\r\n        <fd-shellbar-action\r\n            [label]=\"culture.value\"\r\n            [callback]=\"onLanguage\"\r\n            class=\"culture-abbrivation\"\r\n            [glyph]=\"culture.key\"\r\n            [ngClass]=\"'flags'\"\r\n        >\r\n        </fd-shellbar-action>\r\n        } } @if (productSwitcher?.length) {\r\n        <fd-product-switch>\r\n            <fd-product-switch-body [products]=\"productSwitcher\" [forceListMode]=\"deviceSize === 's'\">\r\n            </fd-product-switch-body>\r\n        </fd-product-switch>\r\n        }\r\n    </fd-shellbar-actions>\r\n    }\r\n</fd-shellbar>\r\n@if(showExtraButton){\r\n<div\r\n    [class.fd-shellbar--xl]=\"isDesktop\"\r\n    [class.fd-shellbar--m]=\"isTablet\"\r\n    [class.fd-shellbar--s]=\"isMobile\"\r\n    class=\"extra-button-wrapper\"\r\n    [class.service-desk]=\"isServiceDesk\"\r\n>\r\n    <ng-content select=\"button\"></ng-content>\r\n</div>\r\n}\r\n<ng-template #loading>\r\n    <bsu-mask></bsu-mask>\r\n</ng-template>\r\n\r\n<div\r\n    *ngIf=\"sideMenuTemplate\"\r\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\r\n    [class.tw-w-screen]=\"isMobile\"\r\n    [class.-tw-right-full]=\"isMobile\"\r\n    [class.tw-w-96]=\"!isMobile\"\r\n    [class.-tw-right-96]=\"!isMobile\"\r\n    [class.!tw-right-0]=\"isOpenQuickAccess\"\r\n    (click)=\"$event.stopPropagation()\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"sideMenuTemplate\"></ng-container>\r\n</div>\r\n\r\n@if(isOpenQuickAccess) {\r\n<div\r\n    class=\"sidemenu-h tw-fixed tw-right-0 tw-bg-slate-800/[.5] tw-z-[90] tw-w-screen tw-backdrop-blur-sm\"\r\n    (click)=\"isOpenQuickAccessChanged.emit(false)\"\r\n></div>\r\n}\r\n<fd-menu #menu>\r\n    <ul fd-list>\r\n        @for (culture of cultures | keyvalue; track culture) {\r\n        <li fd-list-item>\r\n            <a fd-list-link (click)=\"onCultureChange(culture.value)\">\r\n                <span fd-list-title>\r\n                    <img width=\"14px\" height=\"12px\" [src]=\"'/assets/flags/' + culture.key + '.png'\" />\r\n                    <span class=\"culture-abbrivation\" [ngClass]=\"culture.key\"> {{ culture.key }}</span>\r\n                </span>\r\n            </a>\r\n        </li>\r\n        }\r\n    </ul>\r\n</fd-menu>\r\n<ng-template #notificationGroupTpl let-notificationCount=\"notificationCount\">\r\n    <bt-notification-group\r\n        [notificationReport]=\"notificationReport\"\r\n        [notificationCount]=\"notificationCount\"\r\n        (actionClick)=\"popoverComponent.close(); onNotificationAction($event)\"\r\n        [deviceSize]=\"deviceSize\"\r\n    ></bt-notification-group>\r\n</ng-template>\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #notificationsDialog>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Notification' | bbbTranslate }}</h1>\r\n            <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body class=\"mobile\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n            ></ng-container>\r\n        </fd-dialog-body>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;position:relative}:host ::ng-deep fd-shellbar-actions fd-avatar{background-color:transparent!important;color:var(--sapShell_InteractiveTextColor, #d1e8ff)}:host ::ng-deep fd-combobox .fd-input-group input{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}:host ::ng-deep fd-combobox .fd-input-group span{min-width:2rem;min-height:1.625rem}:host ::ng-deep .fd-shellbar__subtitle{font-size:1rem}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__subtitle{display:block;overflow:hidden;text-wrap:wrap;width:100%;word-break:break-all}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--product{flex:1}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--actions{max-width:120px}.fd-shellbar__logo{min-height:3rem;height:3rem;width:3rem}.extra-button-wrapper{display:flex;height:100%;align-items:center;position:absolute;left:10px;top:0;gap:.285rem}.sidemenu-h{top:var(--fdShellbar_Height);height:calc(100vh - var(--fdShellbar_Height))}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4$1.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "directive", type: i4$1.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i4$1.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i4$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i4$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$1.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i7$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8$1.ProductSwitchComponent, selector: "fd-product-switch", inputs: ["placement", "disabled"] }, { kind: "component", type: i8$1.ProductSwitchBodyComponent, selector: "fd-product-switch-body", inputs: ["dragAndDropEnabled", "products", "forceListMode"], outputs: ["productsChange", "itemClicked"] }, { kind: "component", type: i9$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i9$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i9$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i10.ShellbarComponent, selector: "fd-shellbar", inputs: ["size", "breakpoints", "sideNav", "groupFlex"] }, { kind: "component", type: i10.ProductMenuComponent, selector: "fd-product-menu", inputs: ["closeOnEscapeKey", "closeOnOutsideClick", "triggers", "placement", "disabled", "fillControlMode", "control", "items", "closePopoverOnSelect"] }, { kind: "component", type: i10.ShellbarSubtitleComponent, selector: "fd-shellbar-subtitle" }, { kind: "component", type: i10.ShellbarActionsComponent, selector: "fd-shellbar-actions", inputs: ["user", "userMenu", "closePopoverOnSelect"], outputs: ["searchOpen"] }, { kind: "component", type: i10.ShellbarActionComponent, selector: "fd-shellbar-action", inputs: ["glyph", "glyphFont", "callback", "label", "notificationLabel", "notificationCount"] }, { kind: "component", type: i10.ShellbarLogoComponent, selector: "fd-shellbar-logo" }, { kind: "directive", type: i10.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "directive", type: i1.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i1.RouteFormChangeDirective, selector: "[routeFormChange]", inputs: ["handleBodyClick"], outputs: ["stateChanged"] }, { kind: "component", type: i4.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: NotificationGroupComponent, selector: "bt-notification-group", inputs: ["notifications", "loading", "deviceSize", "notificationCount", "notificationReport"], outputs: ["viewed", "remove", "actionClick", "showEvent", "loadMore"] }, { kind: "pipe", type: i1$4.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i1.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaShellbarComponent, decorators: [{
             type: Component,
@@ -3179,7 +3185,7 @@ class BarsaTileGroupPageComponent extends BaseComponent {
         this._router.navigate(['../']);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTileGroupPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTileGroupPageComponent, selector: "bt-barsa-tile-group-page", host: { properties: { "style.position": "this._position" } }, providers: [RoutingService], viewQueries: [{ propertyName: "_containerRef", first: true, predicate: ["containerRef"], descendants: true, read: ViewContainerRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(!isSimple ){\r\n<fd-dynamic-page [autoResponsive]=\"true\">\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"true\"\r\n        [title]=\"title | bbbTranslate\"\r\n        [class.p-b0]=\"true\"\r\n        [class.hide-title]=\"false\"\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n            <fd-breadcrumb>\r\n                @if (breadcrumbs$ | async; as breadCrumbs) { @for ( breadCrumb of breadCrumbs | slice:\r\n                0:breadCrumbs.length; track breadCrumb.url; let i = $index; let last = $last) {\r\n                <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <fd-dynamic-page-layout-actions>\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"onClose()\" title=\"Close\">\r\n                    <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n                </button>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n\r\n    <fd-dynamic-page-content cdkScrollable>\r\n        <ng-container *ngTemplateOutlet=\"tilesTpl\"> </ng-container>\r\n    </fd-dynamic-page-content>\r\n</fd-dynamic-page>\r\n} @else {\r\n<ng-container *ngTemplateOutlet=\"tilesTpl\"> </ng-container>\r\n}\r\n<ng-template #loadingTpl>\r\n    <bsu-mask></bsu-mask>\r\n</ng-template>\r\n<ng-template #tilesTpl>\r\n    <div class=\"tw-flex tw-gap-1 tw-flex-wrap\">\r\n        @for(app of moList();track app.Id){\r\n        <ng-container *ngTemplateOutlet=\"tile; context: { $implicit: app, deviceSize: deviceSize }\"></ng-container>\r\n        }\r\n    </div>\r\n</ng-template>\r\n<ng-template #tile let-app let-listMode=\"listMode\" let-navigateBack=\"navigateBack\" let-deviceSize=\"deviceSize\">\r\n    <span\r\n        [dynamicCommand]=\"app.DynamicCommand\"\r\n        [setToStorage]=\"false\"\r\n        [listMode]=\"false\"\r\n        [navigateBackOnClick]=\"listMode ? false : isSimple ? true : false\"\r\n        [enableCommand]=\"app.Component\"\r\n        tileRenderer\r\n        [data]=\"app\"\r\n        [edit]=\"false\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [component]=\"app.Component\"\r\n    >\r\n    </span>\r\n</ng-template>\r\n", styles: [":host{width:100%;display:block}.app-groups{width:25vw;border-left:.0625rem solid var(--sapGroup_TitleBorderColor, #d9d9d9)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$2.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i3$2.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i5$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i5$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i5$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i5$2.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i7.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: i7.BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "directive", type: TileRendererDirective, selector: "[tileRenderer]", inputs: ["component", "data", "edit", "deviceSize", "setToStorage", "listMode", "navigateBackOnClick"], outputs: ["hideClick", "renameClick"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$4.SlicePipe, name: "slice" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTileGroupPageComponent, selector: "bt-barsa-tile-group-page", host: { properties: { "style.position": "this._position" } }, providers: [RoutingService], viewQueries: [{ propertyName: "_containerRef", first: true, predicate: ["containerRef"], descendants: true, read: ViewContainerRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(!isSimple ){\r\n<fd-dynamic-page [autoResponsive]=\"true\">\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"true\"\r\n        [title]=\"title | bbbTranslate\"\r\n        [class.p-b0]=\"true\"\r\n        [class.hide-title]=\"false\"\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n            <fd-breadcrumb>\r\n                @if (breadcrumbs$ | async; as breadCrumbs) { @for ( breadCrumb of breadCrumbs | slice:\r\n                0:breadCrumbs.length; track breadCrumb.url; let i = $index; let last = $last) {\r\n                <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <fd-dynamic-page-layout-actions>\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"onClose()\" title=\"Close\">\r\n                    <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n                </button>\r\n            </fd-toolbar>\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n\r\n    <fd-dynamic-page-content cdkScrollable>\r\n        <ng-container *ngTemplateOutlet=\"tilesTpl\"> </ng-container>\r\n    </fd-dynamic-page-content>\r\n</fd-dynamic-page>\r\n} @else {\r\n<ng-container *ngTemplateOutlet=\"tilesTpl\"> </ng-container>\r\n}\r\n<ng-template #loadingTpl>\r\n    <bsu-mask></bsu-mask>\r\n</ng-template>\r\n<ng-template #tilesTpl>\r\n    <div class=\"tw-flex tw-gap-1 tw-flex-wrap\">\r\n        @for(app of moList();track app.Id){\r\n        <ng-container *ngTemplateOutlet=\"tile; context: { $implicit: app, deviceSize: deviceSize }\"></ng-container>\r\n        }\r\n    </div>\r\n</ng-template>\r\n<ng-template #tile let-app let-listMode=\"listMode\" let-navigateBack=\"navigateBack\" let-deviceSize=\"deviceSize\">\r\n    <span\r\n        [dynamicCommand]=\"app.DynamicCommand\"\r\n        [setToStorage]=\"false\"\r\n        [listMode]=\"false\"\r\n        [navigateBackOnClick]=\"listMode ? false : isSimple ? true : false\"\r\n        [enableCommand]=\"app.Component\"\r\n        tileRenderer\r\n        [data]=\"app\"\r\n        [edit]=\"false\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [component]=\"app.Component\"\r\n    >\r\n    </span>\r\n</ng-template>\r\n", styles: [":host{width:100%;display:block}.app-groups{width:25vw;border-left:.0625rem solid var(--sapGroup_TitleBorderColor, #d9d9d9)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$2.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i3$2.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i5$2.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i5$2.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i5$2.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i5$2.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i4.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: i4.BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "directive", type: TileRendererDirective, selector: "[tileRenderer]", inputs: ["component", "data", "edit", "deviceSize", "setToStorage", "listMode", "navigateBackOnClick"], outputs: ["hideClick", "renameClick"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1$4.SlicePipe, name: "slice" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTileGroupPageComponent, decorators: [{
             type: Component,
@@ -3217,7 +3223,7 @@ class BarsaTileSidebarPageComponent extends EmptyPageComponent {
         this._router.navigate(['../']);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTileSidebarPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTileSidebarPageComponent, selector: "bt-barsa-tile-sidebar-page", providers: [RoutingService], usesInheritance: true, ngImport: i0, template: "<div fd-bar>\r\n    <div fd-bar-left style=\"flex: 1; width: 100%\">\r\n        <fd-breadcrumb style=\"width: 100%\">\r\n            @if (breadcrumbs$ | async; as breadCrumbs) { @for ( breadCrumb of breadCrumbs ;track breadCrumb.url; let i =\r\n            $index; let last = $last) {\r\n            <fd-breadcrumb-item>\r\n                <bsu-breadcrumb\r\n                    [index]=\"i\"\r\n                    [isLast]=\"last\"\r\n                    [breadCrumb]=\"breadCrumb\"\r\n                    [allBreadCrumb]=\"breadCrumbs\"\r\n                ></bsu-breadcrumb>\r\n            </fd-breadcrumb-item>\r\n            } }\r\n        </fd-breadcrumb>\r\n    </div>\r\n</div>\r\n\r\n<fd-dynamic-side-content class=\"tiles-sidebar-wrapper\" fillEmptySpace style=\"overflow: auto\">\r\n    <fd-dynamic-side-content-side>\r\n        <ng-container #containerRef></ng-container>\r\n    </fd-dynamic-side-content-side>\r\n    <fd-dynamic-side-content-main style=\"margin: 2rem\">\r\n        @if(firstReportLoaded()===false){\r\n        <fd-message-page type=\"no-items\" style=\"align-self: center; background: transparent\">\r\n            <fd-message-page-title>{{ 'SearchInReports' | bbbTranslate }}</fd-message-page-title>\r\n        </fd-message-page>\r\n        }\r\n        <router-outlet name=\"mainside\"> </router-outlet>\r\n    </fd-dynamic-side-content-main>\r\n</fd-dynamic-side-content>\r\n<div class=\"sidbar-outlet\">\r\n    <router-outlet></router-outlet>\r\n</div>\r\n", styles: [":host{width:100%;display:block}fd-dynamic-page ::ng-deep article fd-dynamic-page-content{padding:0}fd-dynamic-page ::ng-deep article fd-layout-panel{background-color:var(--sapBackgroundColor)}fd-dynamic-page ::ng-deep article li{border:none}.tiles-sidebar-wrapper>fd-dynamic-side-content-side{max-width:20svw;width:20svw;overflow-y:auto;padding:0;background-color:var(--sapBaseColor);border:.0625rem solid var(--sapTile_SeparatorColor, #ccc);border-top:none}.tiles-sidebar-wrapper>fd-dynamic-side-content-side ::ng-deep li span.haschildren{font-family:B-Font Medium}.tiles-sidebar-wrapper>fd-dynamic-side-content-side ::ng-deep bsu-barsa-ulv-main,.tiles-sidebar-wrapper>fd-dynamic-side-content-main ::ng-deep bsu-barsa-ulv-main{margin:0!important}.tiles-sidebar-wrapper>fd-dynamic-side-content-main{width:80svw;max-width:80svw;background-color:var(--sapBaseColor)}@media (max-width: 799px){.tiles-sidebar-wrapper{flex-direction:column}.tiles-sidebar-wrapper>fd-dynamic-side-content-side{width:100svw;max-width:100svw;overflow:hidden}.tiles-sidebar-wrapper>fd-dynamic-side-content-main{width:100svw;max-width:100svw}}@media (min-width: 800px) and (max-width: 1439px){.tiles-sidebar-wrapper>fd-dynamic-side-content-side{width:35svw;max-width:35svw;overflow:hidden}.tiles-sidebar-wrapper>fd-dynamic-side-content-main{width:65svw;max-width:65svw}}\n"], dependencies: [{ kind: "directive", type: i1$5.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: i4$4.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4$4.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "component", type: i3$2.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i3$2.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i4$5.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i4$5.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i4$5.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i5$4.MessagePageComponent, selector: "fd-message-page", inputs: ["class", "type", "hasIcon", "glyphFont", "glyph"] }, { kind: "component", type: i5$4.MessagePageTitleComponent, selector: "fd-message-page-title" }, { kind: "directive", type: i1.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i7.BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTileSidebarPageComponent, selector: "bt-barsa-tile-sidebar-page", providers: [RoutingService], usesInheritance: true, ngImport: i0, template: "<div fd-bar>\r\n    <div fd-bar-left style=\"flex: 1; width: 100%\">\r\n        <fd-breadcrumb style=\"width: 100%\">\r\n            @if (breadcrumbs$ | async; as breadCrumbs) { @for ( breadCrumb of breadCrumbs ;track breadCrumb.url; let i =\r\n            $index; let last = $last) {\r\n            <fd-breadcrumb-item>\r\n                <bsu-breadcrumb\r\n                    [index]=\"i\"\r\n                    [isLast]=\"last\"\r\n                    [breadCrumb]=\"breadCrumb\"\r\n                    [allBreadCrumb]=\"breadCrumbs\"\r\n                ></bsu-breadcrumb>\r\n            </fd-breadcrumb-item>\r\n            } }\r\n        </fd-breadcrumb>\r\n    </div>\r\n</div>\r\n\r\n<fd-dynamic-side-content class=\"tiles-sidebar-wrapper\" fillEmptySpace style=\"overflow: auto\">\r\n    <fd-dynamic-side-content-side>\r\n        <ng-container #containerRef></ng-container>\r\n    </fd-dynamic-side-content-side>\r\n    <fd-dynamic-side-content-main style=\"margin: 2rem\">\r\n        @if(firstReportLoaded()===false){\r\n        <fd-message-page type=\"no-items\" style=\"align-self: center; background: transparent\">\r\n            <fd-message-page-title>{{ 'SearchInReports' | bbbTranslate }}</fd-message-page-title>\r\n        </fd-message-page>\r\n        }\r\n        <router-outlet name=\"mainside\"> </router-outlet>\r\n    </fd-dynamic-side-content-main>\r\n</fd-dynamic-side-content>\r\n<div class=\"sidbar-outlet\">\r\n    <router-outlet></router-outlet>\r\n</div>\r\n", styles: [":host{width:100%;display:block}fd-dynamic-page ::ng-deep article fd-dynamic-page-content{padding:0}fd-dynamic-page ::ng-deep article fd-layout-panel{background-color:var(--sapBackgroundColor)}fd-dynamic-page ::ng-deep article li{border:none}.tiles-sidebar-wrapper>fd-dynamic-side-content-side{max-width:20svw;width:20svw;overflow-y:auto;padding:0;background-color:var(--sapBaseColor);border:.0625rem solid var(--sapTile_SeparatorColor, #ccc);border-top:none}.tiles-sidebar-wrapper>fd-dynamic-side-content-side ::ng-deep li span.haschildren{font-family:B-Font Medium}.tiles-sidebar-wrapper>fd-dynamic-side-content-side ::ng-deep bsu-barsa-ulv-main,.tiles-sidebar-wrapper>fd-dynamic-side-content-main ::ng-deep bsu-barsa-ulv-main{margin:0!important}.tiles-sidebar-wrapper>fd-dynamic-side-content-main{width:80svw;max-width:80svw;background-color:var(--sapBaseColor)}@media (max-width: 799px){.tiles-sidebar-wrapper{flex-direction:column}.tiles-sidebar-wrapper>fd-dynamic-side-content-side{width:100svw;max-width:100svw;overflow:hidden}.tiles-sidebar-wrapper>fd-dynamic-side-content-main{width:100svw;max-width:100svw}}@media (min-width: 800px) and (max-width: 1439px){.tiles-sidebar-wrapper>fd-dynamic-side-content-side{width:35svw;max-width:35svw;overflow:hidden}.tiles-sidebar-wrapper>fd-dynamic-side-content-main{width:65svw;max-width:65svw}}\n"], dependencies: [{ kind: "directive", type: i1$5.RouterOutlet, selector: "router-outlet", inputs: ["name"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: i4$5.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4$5.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "component", type: i3$2.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i3$2.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i4$6.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i4$6.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i4$6.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i5$4.MessagePageComponent, selector: "fd-message-page", inputs: ["class", "type", "hasIcon", "glyphFont", "glyph"] }, { kind: "component", type: i5$4.MessagePageTitleComponent, selector: "fd-message-page-title" }, { kind: "directive", type: i1.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i4.BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "pipe", type: i1$4.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTileSidebarPageComponent, decorators: [{
             type: Component,