barsa-tiles 1.0.290 → 1.0.294

package/fesm2015/barsa-tiles.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, HostListener, HostBinding, Directive, Injectable, ViewChild, Inject, Pipe, NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
+import { Component, ChangeDetectionStrategy, Input, HostListener, Pipe, HostBinding, EventEmitter, Directive, Output, Injectable, ViewChild, Inject, NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
 import * as i1$2 from 'barsa-novin-ray-core';
-import { BaseComponent, BarsaApi, BaseDirective, IntersectionStatus, APP_VERSION, BaseModule, BarsaNovinRayCoreModule } from 'barsa-novin-ray-core';
+import { TilePropsComponent, BaseComponent, PreventDefaulEvent, BarsaApi, BaseDirective, IntersectionStatus, APP_VERSION, BaseModule, BarsaNovinRayCoreModule } from 'barsa-novin-ray-core';
 import * as i1 from '@angular/common';
 import { CommonModule, LowerCasePipe } from '@angular/common';
 import * as i1$1 from '@fundamental-ngx/core/tile';
@@ -50,17 +50,11 @@ import * as i4$2 from '@fundamental-ngx/core/notification';
 import { CdkTableModule } from '@angular/cdk/table';
 import { FundamentalNgxPlatformModule } from '@fundamental-ngx/platform';
 
-class BaseTileComponent extends BaseComponent {
-    constructor(el, _renderer2, _cdr) {
-        super();
-        this.el = el;
-        this._renderer2 = _renderer2;
-        this._cdr = _cdr;
-        this.hideClick = new EventEmitter();
-        this.renameClick = new EventEmitter();
-    }
+class BaseTileComponent extends TilePropsComponent {
     get settings() {
-        return this.data.Component.Settings;
+        var _a, _b;
+        const data = (_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a.Component) === null || _b === void 0 ? void 0 : _b.Settings;
+        return data ? data : this.parameters;
     }
     get title() {
         return this.data.TileTitle;
@@ -81,12 +75,17 @@ class BaseTileComponent extends BaseComponent {
         return this.settings.TileSetting;
     }
     setEditHome(val) {
-        this.editHome = val;
+        this.edit = val;
         this._cdr.detectChanges();
     }
+    onTileClick() {
+        if (this.context) {
+            this.context.FireEvent('click', this.context);
+        }
+    }
 }
-BaseTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BaseTileComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-BaseTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BaseTileComponent, selector: "bt-base-tile", inputs: { data: "data", editHome: "editHome" }, outputs: { hideClick: "hideClick", renameClick: "renameClick" }, usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
+BaseTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BaseTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+BaseTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: BaseTileComponent, selector: "bt-base-tile", usesInheritance: true, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: BaseTileComponent, decorators: [{
             type: Component,
             args: [{
@@ -94,15 +93,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                     template: '',
                     changeDetection: ChangeDetectionStrategy.OnPush
                 }]
-        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { data: [{
-                type: Input
-            }], editHome: [{
-                type: Input
-            }], hideClick: [{
-                type: Output
-            }], renameClick: [{
-                type: Output
-            }] } });
+        }] });
 
 class BaseBtTileComponent extends BaseTileComponent {
     ngOnInit() {
@@ -141,16 +132,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 type: Input
             }] } });
 
-class TileComponent extends BaseTileComponent {
+class TileComponent extends TilePropsComponent {
     constructor() {
         super(...arguments);
         this.runningCommand = false;
     }
-    onClick() {
-        if (this.editHome || this.disableClick || this.runningCommand) {
+    onClick(ev) {
+        if (this.edit || this.disableClick || this.runningCommand || !this.dynamicCommand) {
             return false;
         }
-        const command = this.data.DynamicCommand;
+        PreventDefaulEvent(ev);
+        const command = this.dynamicCommand;
         const e = { command, DynamicSetting: null };
         this.runningCommand = true;
         this._cdr.detectChanges();
@@ -162,21 +154,59 @@ class TileComponent extends BaseTileComponent {
     }
 }
 TileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-TileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TileComponent, selector: "bt-tile", inputs: { type: "type", footerTemplate: "footerTemplate", disableClick: "disableClick" }, host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0, template: "<fd-tile [type]=\"type\" [double]=\"double\" [action]=\"editHome\">\r\n    <ng-container *ngIf=\"editHome && !data.Locked\">\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    </ng-container>\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    <ng-content></ng-content>\r\n    <ng-container [ngTemplateOutlet]=\"footerTemplate\" *ngIf=\"footerTemplate; else defaultFooter\"></ng-container>\r\n</fd-tile>\r\n<ng-template #defaultFooter>\r\n    <bt-footer-tile *ngIf=\"footer\" [settings]=\"footer\"></bt-footer-tile>\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<bsu-mask *ngIf=\"runningCommand\"></bsu-mask>\r\n", styles: [":host,fd-tile{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i3.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "directive", type: i3.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i3.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i3.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i1$1.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "directive", type: i1$1.TileHeaderDirective, selector: "[fdTileHeader], [fd-tile-header]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileTitleDirective, selector: "[fdTileTitle], [fd-tile-title]" }, { kind: "directive", type: i1$1.TileSubtitleDirective, selector: "[fdTileTitle], [fd-tile-subtitle]" }, { kind: "directive", type: i1$1.TileActionCloseDirective, selector: "[fdTileActionClose], [fd-tile-action-close]", inputs: ["class"] }, { kind: "directive", type: i1$1.TileActionIndicatorDirective, selector: "[fdTileActionIndicator], [fd-tile-action-indicator]", inputs: ["class"] }, { kind: "component", type: i6.MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "component", type: FooterTileComponent, selector: "bt-footer-tile", inputs: ["settings"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+TileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TileComponent, selector: "bt-tile", inputs: { type: "type", footerTemplate: "footerTemplate", footer: "footer", disableClick: "disableClick", title: "title", subtitle: "subtitle", isDouble: "isDouble", edit: "edit", dynamicCommand: "dynamicCommand" }, host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0, template: "<fd-tile [type]=\"type\" [double]=\"isDouble\" [action]=\"edit\">\n    <ng-container *ngIf=\"edit && !data.Locked\">\n        <button fd-button fd-tile-action-close fdType=\"transparent\" (click)=\"hideClick.emit()\"></button>\n        <button fd-button fd-tile-action-indicator fdType=\"transparent\" [fdMenuTrigger]=\"menu\"></button>\n    </ng-container>\n    <div fd-tile-header>\n        <h1 fd-tile-title>\n            {{ title | bbbTranslate }}\n        </h1>\n        <h2 fd-tile-subtitle>\n            {{ subtitle | bbbTranslate }}\n        </h2>\n    </div>\n    <ng-content></ng-content>\n    <ng-container [ngTemplateOutlet]=\"footerTemplate ? footerTemplate : defaultFooter\"></ng-container>\n</fd-tile>\n<ng-template #defaultFooter>\n    <bt-footer-tile *ngIf=\"footer\" [settings]=\"footer\"></bt-footer-tile>\n</ng-template>\n<fd-menu #menu>\n    <li fd-menu-item>\n        <a (click)=\"menu.close(); renameClick.emit()\" fd-menu-interactive>\n            <span fd-menu-title>{{ 'Rename' | bbbTranslate }}</span>\n        </a>\n    </li>\n</fd-menu>\n<bsu-mask *ngIf=\"runningCommand\"></bsu-mask>\n", styles: [":host,fd-tile{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i3.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "directive", type: i3.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i3.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i3.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i1$1.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "directive", type: i1$1.TileHeaderDirective, selector: "[fdTileHeader], [fd-tile-header]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileTitleDirective, selector: "[fdTileTitle], [fd-tile-title]" }, { kind: "directive", type: i1$1.TileSubtitleDirective, selector: "[fdTileTitle], [fd-tile-subtitle]" }, { kind: "directive", type: i1$1.TileActionCloseDirective, selector: "[fdTileActionClose], [fd-tile-action-close]", inputs: ["class"] }, { kind: "directive", type: i1$1.TileActionIndicatorDirective, selector: "[fdTileActionIndicator], [fd-tile-action-indicator]", inputs: ["class"] }, { kind: "component", type: i6.MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "component", type: FooterTileComponent, selector: "bt-footer-tile", inputs: ["settings"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-tile [type]=\"type\" [double]=\"double\" [action]=\"editHome\">\r\n    <ng-container *ngIf=\"editHome && !data.Locked\">\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    </ng-container>\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    <ng-content></ng-content>\r\n    <ng-container [ngTemplateOutlet]=\"footerTemplate\" *ngIf=\"footerTemplate; else defaultFooter\"></ng-container>\r\n</fd-tile>\r\n<ng-template #defaultFooter>\r\n    <bt-footer-tile *ngIf=\"footer\" [settings]=\"footer\"></bt-footer-tile>\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<bsu-mask *ngIf=\"runningCommand\"></bsu-mask>\r\n", styles: [":host,fd-tile{display:block}\n"] }]
+            args: [{ selector: 'bt-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-tile [type]=\"type\" [double]=\"isDouble\" [action]=\"edit\">\n    <ng-container *ngIf=\"edit && !data.Locked\">\n        <button fd-button fd-tile-action-close fdType=\"transparent\" (click)=\"hideClick.emit()\"></button>\n        <button fd-button fd-tile-action-indicator fdType=\"transparent\" [fdMenuTrigger]=\"menu\"></button>\n    </ng-container>\n    <div fd-tile-header>\n        <h1 fd-tile-title>\n            {{ title | bbbTranslate }}\n        </h1>\n        <h2 fd-tile-subtitle>\n            {{ subtitle | bbbTranslate }}\n        </h2>\n    </div>\n    <ng-content></ng-content>\n    <ng-container [ngTemplateOutlet]=\"footerTemplate ? footerTemplate : defaultFooter\"></ng-container>\n</fd-tile>\n<ng-template #defaultFooter>\n    <bt-footer-tile *ngIf=\"footer\" [settings]=\"footer\"></bt-footer-tile>\n</ng-template>\n<fd-menu #menu>\n    <li fd-menu-item>\n        <a (click)=\"menu.close(); renameClick.emit()\" fd-menu-interactive>\n            <span fd-menu-title>{{ 'Rename' | bbbTranslate }}</span>\n        </a>\n    </li>\n</fd-menu>\n<bsu-mask *ngIf=\"runningCommand\"></bsu-mask>\n", styles: [":host,fd-tile{display:block}\n"] }]
         }], propDecorators: { type: [{
                 type: Input
             }], footerTemplate: [{
                 type: Input
+            }], footer: [{
+                type: Input
             }], disableClick: [{
                 type: Input
+            }], title: [{
+                type: Input
+            }], subtitle: [{
+                type: Input
+            }], isDouble: [{
+                type: Input
+            }], edit: [{
+                type: Input
+            }], dynamicCommand: [{
+                type: Input
             }], onClick: [{
                 type: HostListener,
                 args: ['click', ['$event']]
             }] } });
 
+class TilePropPipe {
+    transform(data, prop, parameters) {
+        if (data) {
+            if (prop === 'Title') {
+                return data.TileTitle;
+            }
+            if (prop === 'Subtitle') {
+                return data.Subtitle;
+            }
+            if (prop === 'DynamicCommand') {
+                return data['DynamicCommand'];
+            }
+            return data.Component.Settings.TileSetting[prop];
+        }
+        return parameters ? parameters.TileSetting[prop] : '';
+    }
+}
+TilePropPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TilePropPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
+TilePropPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "14.2.7", ngImport: i0, type: TilePropPipe, name: "tileProp" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TilePropPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'tileProp'
+                }]
+        }] });
+
 class FormTileComponent extends BaseBtTileComponent {
     ngOnInit() {
         super.ngOnInit();
@@ -197,19 +227,19 @@ class FormTileComponent extends BaseBtTileComponent {
     }
 }
 FormTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FormTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-FormTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: FormTileComponent, selector: "bt-form-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    [disableClick]=\"true\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <bnrc-form *ngIf=\"params\" [params]=\"params\"></bnrc-form>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host{display:block}bnrc-form{z-index:3}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i1$2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "formPanelCtrlId"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FormTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: FormTileComponent, selector: "bt-form-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    [disableClick]=\"true\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <bnrc-form *ngIf=\"params\" [params]=\"params\"></bnrc-form>\n    </div>\n</bt-tile>\n", styles: [":host{display:block}bnrc-form{z-index:3}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i1$2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "formPanelCtrlId"], outputs: ["titleChanged", "moChanged", "formClose", "formRendered"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FormTileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-form-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    [disableClick]=\"true\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <bnrc-form *ngIf=\"params\" [params]=\"params\"></bnrc-form>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host{display:block}bnrc-form{z-index:3}\n"] }]
+            args: [{ selector: 'bt-form-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    [disableClick]=\"true\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <bnrc-form *ngIf=\"params\" [params]=\"params\"></bnrc-form>\n    </div>\n</bt-tile>\n", styles: [":host{display:block}bnrc-form{z-index:3}\n"] }]
         }] });
 
 class ActionItemComponent extends TileComponent {
 }
 ActionItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ActionItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ActionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ActionItemComponent, selector: "bt-action-item", usesInheritance: true, ngImport: i0, template: "<div [class.action-item-edit-mode]=\"editHome\" class=\"action-item\">\r\n    <h1 fd-tile-title>{{ title }}</h1>\r\n    <h2 fd-tile-subtitle *ngIf=\"subtitle\">{{ subtitle }}</h2>\r\n\r\n    <div *ngIf=\"editHome && !data.Locked\" 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    <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-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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i3.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "directive", type: i3.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i3.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i3.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "directive", type: i1$1.TileTitleDirective, selector: "[fdTileTitle], [fd-tile-title]" }, { kind: "directive", type: i1$1.TileSubtitleDirective, selector: "[fdTileTitle], [fd-tile-subtitle]" }, { kind: "directive", type: i1$1.TileActionCloseDirective, selector: "[fdTileActionClose], [fd-tile-action-close]", inputs: ["class"] }, { kind: "directive", type: i1$1.TileActionIndicatorDirective, selector: "[fdTileActionIndicator], [fd-tile-action-indicator]", inputs: ["class"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ActionItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ActionItemComponent, selector: "bt-action-item", usesInheritance: true, ngImport: i0, template: "<div [class.action-item-edit-mode]=\"edit\" class=\"action-item\">\n    <h1 fd-tile-title>{{ title }}</h1>\n    <h2 fd-tile-subtitle *ngIf=\"subtitle\">{{ subtitle }}</h2>\n\n    <div *ngIf=\"edit && !data.Locked\" class=\"buttons\">\n        <button fd-button fd-tile-action-close fdType=\"transparent\" (click)=\"hideClick.emit()\"></button>\n        <button fd-button fd-tile-action-indicator fdType=\"transparent\" [fdMenuTrigger]=\"menu\"></button>\n    </div>\n    <fd-menu #menu>\n        <li fd-menu-item>\n            <a (click)=\"menu.close(); renameClick.emit()\" fd-menu-interactive>\n                <span fd-menu-title>{{ 'Rename' | bbbTranslate }}</span>\n            </a>\n        </li>\n    </fd-menu>\n</div>\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-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: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i3.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "directive", type: i3.MenuInteractiveDirective, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i3.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i3.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "directive", type: i1$1.TileTitleDirective, selector: "[fdTileTitle], [fd-tile-title]" }, { kind: "directive", type: i1$1.TileSubtitleDirective, selector: "[fdTileTitle], [fd-tile-subtitle]" }, { kind: "directive", type: i1$1.TileActionCloseDirective, selector: "[fdTileActionClose], [fd-tile-action-close]", inputs: ["class"] }, { kind: "directive", type: i1$1.TileActionIndicatorDirective, selector: "[fdTileActionIndicator], [fd-tile-action-indicator]", inputs: ["class"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ActionItemComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-action-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.action-item-edit-mode]=\"editHome\" class=\"action-item\">\r\n    <h1 fd-tile-title>{{ title }}</h1>\r\n    <h2 fd-tile-subtitle *ngIf=\"subtitle\">{{ subtitle }}</h2>\r\n\r\n    <div *ngIf=\"editHome && !data.Locked\" 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    <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-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"] }]
+            args: [{ selector: 'bt-action-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.action-item-edit-mode]=\"edit\" class=\"action-item\">\n    <h1 fd-tile-title>{{ title }}</h1>\n    <h2 fd-tile-subtitle *ngIf=\"subtitle\">{{ subtitle }}</h2>\n\n    <div *ngIf=\"edit && !data.Locked\" class=\"buttons\">\n        <button fd-button fd-tile-action-close fdType=\"transparent\" (click)=\"hideClick.emit()\"></button>\n        <button fd-button fd-tile-action-indicator fdType=\"transparent\" [fdMenuTrigger]=\"menu\"></button>\n    </div>\n    <fd-menu #menu>\n        <li fd-menu-item>\n            <a (click)=\"menu.close(); renameClick.emit()\" fd-menu-interactive>\n                <span fd-menu-title>{{ 'Rename' | bbbTranslate }}</span>\n            </a>\n        </li>\n    </fd-menu>\n</div>\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-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"] }]
         }] });
 
 class ActionsLinkComponent extends BaseComponent {
@@ -220,16 +250,16 @@ class ActionsLinkComponent extends BaseComponent {
     }
 }
 ActionsLinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ActionsLinkComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ActionsLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: { actionsLink: "actionsLink", editHome: "editHome" }, host: { properties: { "class.hide": "this.hide" } }, usesInheritance: true, ngImport: i0, template: "<bt-action-item\r\n    *ngFor=\"let actionItem of actionsLink\"\r\n    cdkDrag\r\n    [data]=\"actionItem\"\r\n    [editHome]=\"editHome\"\r\n    [cdkDragDisabled]=\"!actionItem || actionItem.Locked\"\r\n    [mo]=\"actionItem\"\r\n>\r\n</bt-action-item>\r\n", styles: [":host{display:flex;width:100%;row-gap:3px;flex-wrap:wrap;border-radius:var(--sapElement_BorderCornerRadius, .25rem);column-gap:3px;padding:1rem 0}bt-action-item{margin-top:auto;margin-bottom:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: ActionItemComponent, selector: "bt-action-item" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ActionsLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: { actionsLink: "actionsLink", edit: "edit" }, host: { properties: { "class.hide": "this.hide" } }, usesInheritance: true, ngImport: i0, template: "<bt-action-item\n    *ngFor=\"let actionItem of actionsLink\"\n    cdkDrag\n    [data]=\"actionItem\"\n    [edit]=\"edit\"\n    [title]=\"actionItem | tileProp: 'Title'\"\n    [subtitle]=\"actionItem | tileProp: 'Subtitle'\"\n    [dynamicCommand]=\"actionItem | tileProp: 'DynamicCommand'\"\n    [isDouble]=\"actionItem | tileProp: 'IsDouble'\"\n    [footer]=\"actionItem | tileProp: 'Footer'\"\n    [cdkDragDisabled]=\"!actionItem || actionItem.Locked\"\n    [mo]=\"actionItem\"\n>\n</bt-action-item>\n", styles: [":host{display:flex;width:100%;row-gap:3px;flex-wrap:wrap;border-radius:var(--sapElement_BorderCornerRadius, .25rem);column-gap:3px;padding:1rem 0}bt-action-item{margin-top:auto;margin-bottom:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: ActionItemComponent, selector: "bt-action-item" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ActionsLinkComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-actions-link', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-action-item\r\n    *ngFor=\"let actionItem of actionsLink\"\r\n    cdkDrag\r\n    [data]=\"actionItem\"\r\n    [editHome]=\"editHome\"\r\n    [cdkDragDisabled]=\"!actionItem || actionItem.Locked\"\r\n    [mo]=\"actionItem\"\r\n>\r\n</bt-action-item>\r\n", styles: [":host{display:flex;width:100%;row-gap:3px;flex-wrap:wrap;border-radius:var(--sapElement_BorderCornerRadius, .25rem);column-gap:3px;padding:1rem 0}bt-action-item{margin-top:auto;margin-bottom:auto}\n"] }]
+            args: [{ selector: 'bt-actions-link', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-action-item\n    *ngFor=\"let actionItem of actionsLink\"\n    cdkDrag\n    [data]=\"actionItem\"\n    [edit]=\"edit\"\n    [title]=\"actionItem | tileProp: 'Title'\"\n    [subtitle]=\"actionItem | tileProp: 'Subtitle'\"\n    [dynamicCommand]=\"actionItem | tileProp: 'DynamicCommand'\"\n    [isDouble]=\"actionItem | tileProp: 'IsDouble'\"\n    [footer]=\"actionItem | tileProp: 'Footer'\"\n    [cdkDragDisabled]=\"!actionItem || actionItem.Locked\"\n    [mo]=\"actionItem\"\n>\n</bt-action-item>\n", styles: [":host{display:flex;width:100%;row-gap:3px;flex-wrap:wrap;border-radius:var(--sapElement_BorderCornerRadius, .25rem);column-gap:3px;padding:1rem 0}bt-action-item{margin-top:auto;margin-bottom:auto}\n"] }]
         }], propDecorators: { hide: [{
                 type: HostBinding,
                 args: ['class.hide']
             }], actionsLink: [{
                 type: Input
-            }], editHome: [{
+            }], edit: [{
                 type: Input
             }] } });
 
@@ -256,7 +286,7 @@ class TileRendererDirective extends BaseDirective {
             .subscribe((componentRef) => {
             const instance = componentRef.instance;
             instance.data = this.data;
-            instance.editHome = this.editHome;
+            instance.edit = this.edit;
             instance.hideClick.pipe(takeUntil(this._onDestroy$)).subscribe(() => {
                 this.hideClick.emit();
             });
@@ -267,9 +297,9 @@ class TileRendererDirective extends BaseDirective {
         });
     }
     ngOnChanges(changes) {
-        const { editHome } = changes;
-        if (editHome && !editHome.firstChange) {
-            this._tileRef.instance.setEditHome(editHome.currentValue);
+        const { edit } = changes;
+        if (edit && !edit.firstChange) {
+            this._tileRef.instance.setEditHome(edit.currentValue);
         }
     }
     ngOnDestroy() {
@@ -280,7 +310,7 @@ class TileRendererDirective extends BaseDirective {
     }
 }
 TileRendererDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TileRendererDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.PortalService }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
-TileRendererDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.7", type: TileRendererDirective, selector: "[tileRenderer]", inputs: { component: "component", data: "data", editHome: "editHome" }, outputs: { hideClick: "hideClick", renameClick: "renameClick" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
+TileRendererDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.7", type: TileRendererDirective, selector: "[tileRenderer]", inputs: { component: "component", data: "data", edit: "edit" }, outputs: { hideClick: "hideClick", renameClick: "renameClick" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TileRendererDirective, decorators: [{
             type: Directive,
             args: [{
@@ -290,7 +320,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 type: Input
             }], data: [{
                 type: Input
-            }], editHome: [{
+            }], edit: [{
                 type: Input
             }], hideClick: [{
                 type: Output
@@ -309,7 +339,7 @@ class TilesViewerGroupComponent extends BaseComponent {
         this.deleteGroup = new EventEmitter();
     }
     onDrop(appTileGroup, event) {
-        if (!this.editHome || appTileGroup.Locked) {
+        if (!this.edit || appTileGroup.Locked) {
             return;
         }
         this.tilesDropped.emit({ appTileGroup, event });
@@ -331,15 +361,15 @@ class TilesViewerGroupComponent extends BaseComponent {
     }
 }
 TilesViewerGroupComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TilesViewerGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TilesViewerGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: { appTileGroup: "appTileGroup", stackContent: "stackContent", editHome: "editHome", 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 [fixed]=\"true\" [attr.editHome]=\"editHome\" cdkDrag [cdkDragDisabled]=\"!editHome || !stackContent\">\r\n    <fd-layout-panel-header *ngIf=\"editHome || stackContent || isAppTileSubGroup\">\r\n        <fd-layout-panel-head>\r\n            <h2 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h2>\r\n        </fd-layout-panel-head>\r\n        <fd-layout-panel-actions *ngIf=\"editHome\" 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                <button\r\n                    fd-button\r\n                    *ngIf=\"appTileGroup.Predefined && appTileGroup.$TileSettingChanged\"\r\n                    [label]=\"'Refresh' | bbbTranslate\"\r\n                    (click)=\"onReset(appTileGroup)\"\r\n                ></button>\r\n                <button\r\n                    *ngIf=\"!appTileGroup.Predefined\"\r\n                    fd-button\r\n                    [label]=\"'Delete' | bbbTranslate\"\r\n                    [fdType]=\"'negative'\"\r\n                    (click)=\"onDelete(appTileGroup)\"\r\n                ></button>\r\n            </fd-toolbar>\r\n        </fd-layout-panel-actions>\r\n    </fd-layout-panel-header>\r\n    <fd-layout-panel-body [bleed]=\"!stackContent\" [class.small-size]=\"deviceSize === 's'\">\r\n        <div\r\n            class=\"tile-wrapper\"\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            <ng-container *ngIf=\"!editHome\">\r\n                <fd-busy-indicator fd-title *ngIf=\"!appTileGroup.$TilesLoaded\" [loading]=\"true\"></fd-busy-indicator>\r\n\r\n                <h5 fd-title *ngIf=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"></h5>\r\n            </ng-container>\r\n            <div\r\n                *ngFor=\"let appTile of appTileGroup.navigatorTiles; let k = index\"\r\n                [class.edit-home]=\"editHome\"\r\n                cdkDrag\r\n                [cdkDragDisabled]=\"!editHome || appTileGroup.Locked\"\r\n            >\r\n                <span\r\n                    [dynamicCommand]=\"appTile.DynamicCommand\"\r\n                    [enableCommand]=\"!editHome && appTile.Component\"\r\n                    tileRenderer\r\n                    [data]=\"appTile\"\r\n                    [editHome]=\"editHome\"\r\n                    [component]=\"appTile.Component\"\r\n                    (hideClick)=\"onAppTileHideClick(appTile)\"\r\n                    (renameClick)=\"onAppTileRenameClick(appTile)\"\r\n                ></span>\r\n            </div>\r\n            <fd-tile class=\"add-tile\" *ngIf=\"editHome\" [routerLink]=\"['/home/appfinder']\">\r\n                <div>\r\n                    <fd-icon glyph=\"add\"></fd-icon>\r\n                </div>\r\n            </fd-tile>\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]=\"editHome\"\r\n    [actionsLink]=\"appTileGroup.navigatorActionLinks\"\r\n    [editHome]=\"editHome\"\r\n    [style.min-height]=\"editHome ? '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<ng-container *ngFor=\"let appTileSubGroup of appTileGroup.$Children\">\r\n    <bt-tiles-viewer-group\r\n        [appTileGroup]=\"appTileSubGroup\"\r\n        [editHome]=\"editHome\"\r\n        [stackContent]=\"stackContent\"\r\n        [isAppTileSubGroup]=\"true\"\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</ng-container>\r\n", styles: [":host{display:block}fd-layout-panel{box-shadow:none}fd-layout-panel fd-layout-panel-body:not(.small-size){margin-top:.5rem}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:3px;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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i3$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i6$1.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage"] }, { kind: "component", type: i6$1.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i6$1.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i6$1.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i6$1.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i6$1.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i9.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i8.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "component", type: i1$1.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "component", type: i4.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i4.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: ["actionsLink", "editHome"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "editHome", "isAppTileSubGroup", "deviceSize"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "directive", type: TileRendererDirective, selector: "[tileRenderer]", inputs: ["component", "data", "editHome"], outputs: ["hideClick", "renameClick"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+TilesViewerGroupComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: { appTileGroup: "appTileGroup", stackContent: "stackContent", edit: "edit", 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 [fixed]=\"true\" [attr.editHome]=\"edit\" cdkDrag [cdkDragDisabled]=\"!edit || !stackContent\">\n    <fd-layout-panel-header *ngIf=\"edit || stackContent || isAppTileSubGroup\">\n        <fd-layout-panel-head>\n            <h2 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h2>\n        </fd-layout-panel-head>\n        <fd-layout-panel-actions *ngIf=\"edit\" class=\"group-btns\">\n            <fd-toolbar [shouldOverflow]=\"false\" [fdType]=\"'transparent'\" [clearBorder]=\"true\">\n                <button\n                    fd-button\n                    fd-toolbar-item\n                    [label]=\"!appTileGroup.navigatorVisible ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\n                    (click)=\"onToggleShowHide(appTileGroup)\"\n                ></button>\n                <button\n                    fd-button\n                    *ngIf=\"appTileGroup.Predefined && appTileGroup.$TileSettingChanged\"\n                    [label]=\"'Refresh' | bbbTranslate\"\n                    (click)=\"onReset(appTileGroup)\"\n                ></button>\n                <button\n                    *ngIf=\"!appTileGroup.Predefined\"\n                    fd-button\n                    [label]=\"'Delete' | bbbTranslate\"\n                    [fdType]=\"'negative'\"\n                    (click)=\"onDelete(appTileGroup)\"\n                ></button>\n            </fd-toolbar>\n        </fd-layout-panel-actions>\n    </fd-layout-panel-header>\n    <fd-layout-panel-body [bleed]=\"!stackContent\" [class.small-size]=\"deviceSize === 's'\">\n        <div\n            class=\"tile-wrapper\"\n            fd-panel-content\n            #tiles=\"cdkDropList\"\n            cdkDropList\n            cdkDropListOrientation=\"horizontal\"\n            (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\n            [cdkDropListConnectedTo]=\"actionLinks\"\n            [cdkDropListData]=\"{\n                isTile: true,\n                items: appTileGroup.navigatorTiles || []\n            }\"\n        >\n            <ng-container *ngIf=\"!edit\">\n                <fd-busy-indicator fd-title *ngIf=\"!appTileGroup.$TilesLoaded\" [loading]=\"true\"></fd-busy-indicator>\n\n                <h5 fd-title *ngIf=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"></h5>\n            </ng-container>\n            <div\n                *ngFor=\"let appTile of appTileGroup.navigatorTiles; let k = index\"\n                [class.edit-home]=\"edit\"\n                cdkDrag\n                [cdkDragDisabled]=\"!edit || appTileGroup.Locked\"\n            >\n                <span\n                    [dynamicCommand]=\"appTile.DynamicCommand\"\n                    [enableCommand]=\"!edit && appTile.Component\"\n                    tileRenderer\n                    [data]=\"appTile\"\n                    [edit]=\"edit\"\n                    [component]=\"appTile.Component\"\n                    (hideClick)=\"onAppTileHideClick(appTile)\"\n                    (renameClick)=\"onAppTileRenameClick(appTile)\"\n                ></span>\n            </div>\n            <fd-tile class=\"add-tile\" *ngIf=\"edit\" [routerLink]=\"['/home/appfinder']\">\n                <div>\n                    <fd-icon glyph=\"add\"></fd-icon>\n                </div>\n            </fd-tile>\n        </div>\n    </fd-layout-panel-body>\n</fd-layout-panel>\n\n<bt-actions-link\n    [class.actions-link-edit-home]=\"edit\"\n    [actionsLink]=\"appTileGroup.navigatorActionLinks\"\n    [edit]=\"edit\"\n    [style.min-height]=\"edit ? '4rem' : 'auto'\"\n    cdkDropList\n    #actionLinks=\"cdkDropList\"\n    cdkDropListOrientation=\"horizontal\"\n    [cdkDropListConnectedTo]=\"tiles\"\n    (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\n    [cdkDropListData]=\"{\n        isTile: false,\n        items: appTileGroup.navigatorActionLinks || []\n    }\"\n>\n</bt-actions-link>\n<ng-container *ngFor=\"let appTileSubGroup of appTileGroup.$Children\">\n    <bt-tiles-viewer-group\n        [appTileGroup]=\"appTileSubGroup\"\n        [edit]=\"edit\"\n        [stackContent]=\"stackContent\"\n        [isAppTileSubGroup]=\"true\"\n        (tilesDropped)=\"tilesDropped.emit($event)\"\n        (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\n        (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\n        (resetGroup)=\"resetGroup.emit($event)\"\n        (deleteGroup)=\"deleteGroup.emit($event)\"\n        (toggleGroup)=\"toggleGroup.emit($event)\"\n    ></bt-tiles-viewer-group>\n</ng-container>\n", styles: [":host{display:block}fd-layout-panel{box-shadow:none}fd-layout-panel fd-layout-panel-body:not(.small-size){margin-top:.5rem}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:3px;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}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i3$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "component", type: i6$1.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage"] }, { kind: "component", type: i6$1.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i6$1.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i6$1.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i6$1.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i6$1.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i9.TitleComponent, selector: "h1[fd-title], h2[fd-title], h3[fd-title], h4[fd-title], h5[fd-title], h6[fd-title]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i8.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "component", type: i1$1.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "component", type: i4.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i4.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: ["actionsLink", "edit"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "edit", "isAppTileSubGroup", "deviceSize"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "directive", type: TileRendererDirective, selector: "[tileRenderer]", inputs: ["component", "data", "edit"], outputs: ["hideClick", "renameClick"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TilesViewerGroupComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-tiles-viewer-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-layout-panel [fixed]=\"true\" [attr.editHome]=\"editHome\" cdkDrag [cdkDragDisabled]=\"!editHome || !stackContent\">\r\n    <fd-layout-panel-header *ngIf=\"editHome || stackContent || isAppTileSubGroup\">\r\n        <fd-layout-panel-head>\r\n            <h2 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h2>\r\n        </fd-layout-panel-head>\r\n        <fd-layout-panel-actions *ngIf=\"editHome\" 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                <button\r\n                    fd-button\r\n                    *ngIf=\"appTileGroup.Predefined && appTileGroup.$TileSettingChanged\"\r\n                    [label]=\"'Refresh' | bbbTranslate\"\r\n                    (click)=\"onReset(appTileGroup)\"\r\n                ></button>\r\n                <button\r\n                    *ngIf=\"!appTileGroup.Predefined\"\r\n                    fd-button\r\n                    [label]=\"'Delete' | bbbTranslate\"\r\n                    [fdType]=\"'negative'\"\r\n                    (click)=\"onDelete(appTileGroup)\"\r\n                ></button>\r\n            </fd-toolbar>\r\n        </fd-layout-panel-actions>\r\n    </fd-layout-panel-header>\r\n    <fd-layout-panel-body [bleed]=\"!stackContent\" [class.small-size]=\"deviceSize === 's'\">\r\n        <div\r\n            class=\"tile-wrapper\"\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            <ng-container *ngIf=\"!editHome\">\r\n                <fd-busy-indicator fd-title *ngIf=\"!appTileGroup.$TilesLoaded\" [loading]=\"true\"></fd-busy-indicator>\r\n\r\n                <h5 fd-title *ngIf=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"></h5>\r\n            </ng-container>\r\n            <div\r\n                *ngFor=\"let appTile of appTileGroup.navigatorTiles; let k = index\"\r\n                [class.edit-home]=\"editHome\"\r\n                cdkDrag\r\n                [cdkDragDisabled]=\"!editHome || appTileGroup.Locked\"\r\n            >\r\n                <span\r\n                    [dynamicCommand]=\"appTile.DynamicCommand\"\r\n                    [enableCommand]=\"!editHome && appTile.Component\"\r\n                    tileRenderer\r\n                    [data]=\"appTile\"\r\n                    [editHome]=\"editHome\"\r\n                    [component]=\"appTile.Component\"\r\n                    (hideClick)=\"onAppTileHideClick(appTile)\"\r\n                    (renameClick)=\"onAppTileRenameClick(appTile)\"\r\n                ></span>\r\n            </div>\r\n            <fd-tile class=\"add-tile\" *ngIf=\"editHome\" [routerLink]=\"['/home/appfinder']\">\r\n                <div>\r\n                    <fd-icon glyph=\"add\"></fd-icon>\r\n                </div>\r\n            </fd-tile>\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]=\"editHome\"\r\n    [actionsLink]=\"appTileGroup.navigatorActionLinks\"\r\n    [editHome]=\"editHome\"\r\n    [style.min-height]=\"editHome ? '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<ng-container *ngFor=\"let appTileSubGroup of appTileGroup.$Children\">\r\n    <bt-tiles-viewer-group\r\n        [appTileGroup]=\"appTileSubGroup\"\r\n        [editHome]=\"editHome\"\r\n        [stackContent]=\"stackContent\"\r\n        [isAppTileSubGroup]=\"true\"\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</ng-container>\r\n", styles: [":host{display:block}fd-layout-panel{box-shadow:none}fd-layout-panel fd-layout-panel-body:not(.small-size){margin-top:.5rem}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:3px;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}\n"] }]
+            args: [{ selector: 'bt-tiles-viewer-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<fd-layout-panel [fixed]=\"true\" [attr.editHome]=\"edit\" cdkDrag [cdkDragDisabled]=\"!edit || !stackContent\">\n    <fd-layout-panel-header *ngIf=\"edit || stackContent || isAppTileSubGroup\">\n        <fd-layout-panel-head>\n            <h2 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h2>\n        </fd-layout-panel-head>\n        <fd-layout-panel-actions *ngIf=\"edit\" class=\"group-btns\">\n            <fd-toolbar [shouldOverflow]=\"false\" [fdType]=\"'transparent'\" [clearBorder]=\"true\">\n                <button\n                    fd-button\n                    fd-toolbar-item\n                    [label]=\"!appTileGroup.navigatorVisible ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\n                    (click)=\"onToggleShowHide(appTileGroup)\"\n                ></button>\n                <button\n                    fd-button\n                    *ngIf=\"appTileGroup.Predefined && appTileGroup.$TileSettingChanged\"\n                    [label]=\"'Refresh' | bbbTranslate\"\n                    (click)=\"onReset(appTileGroup)\"\n                ></button>\n                <button\n                    *ngIf=\"!appTileGroup.Predefined\"\n                    fd-button\n                    [label]=\"'Delete' | bbbTranslate\"\n                    [fdType]=\"'negative'\"\n                    (click)=\"onDelete(appTileGroup)\"\n                ></button>\n            </fd-toolbar>\n        </fd-layout-panel-actions>\n    </fd-layout-panel-header>\n    <fd-layout-panel-body [bleed]=\"!stackContent\" [class.small-size]=\"deviceSize === 's'\">\n        <div\n            class=\"tile-wrapper\"\n            fd-panel-content\n            #tiles=\"cdkDropList\"\n            cdkDropList\n            cdkDropListOrientation=\"horizontal\"\n            (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\n            [cdkDropListConnectedTo]=\"actionLinks\"\n            [cdkDropListData]=\"{\n                isTile: true,\n                items: appTileGroup.navigatorTiles || []\n            }\"\n        >\n            <ng-container *ngIf=\"!edit\">\n                <fd-busy-indicator fd-title *ngIf=\"!appTileGroup.$TilesLoaded\" [loading]=\"true\"></fd-busy-indicator>\n\n                <h5 fd-title *ngIf=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"></h5>\n            </ng-container>\n            <div\n                *ngFor=\"let appTile of appTileGroup.navigatorTiles; let k = index\"\n                [class.edit-home]=\"edit\"\n                cdkDrag\n                [cdkDragDisabled]=\"!edit || appTileGroup.Locked\"\n            >\n                <span\n                    [dynamicCommand]=\"appTile.DynamicCommand\"\n                    [enableCommand]=\"!edit && appTile.Component\"\n                    tileRenderer\n                    [data]=\"appTile\"\n                    [edit]=\"edit\"\n                    [component]=\"appTile.Component\"\n                    (hideClick)=\"onAppTileHideClick(appTile)\"\n                    (renameClick)=\"onAppTileRenameClick(appTile)\"\n                ></span>\n            </div>\n            <fd-tile class=\"add-tile\" *ngIf=\"edit\" [routerLink]=\"['/home/appfinder']\">\n                <div>\n                    <fd-icon glyph=\"add\"></fd-icon>\n                </div>\n            </fd-tile>\n        </div>\n    </fd-layout-panel-body>\n</fd-layout-panel>\n\n<bt-actions-link\n    [class.actions-link-edit-home]=\"edit\"\n    [actionsLink]=\"appTileGroup.navigatorActionLinks\"\n    [edit]=\"edit\"\n    [style.min-height]=\"edit ? '4rem' : 'auto'\"\n    cdkDropList\n    #actionLinks=\"cdkDropList\"\n    cdkDropListOrientation=\"horizontal\"\n    [cdkDropListConnectedTo]=\"tiles\"\n    (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\n    [cdkDropListData]=\"{\n        isTile: false,\n        items: appTileGroup.navigatorActionLinks || []\n    }\"\n>\n</bt-actions-link>\n<ng-container *ngFor=\"let appTileSubGroup of appTileGroup.$Children\">\n    <bt-tiles-viewer-group\n        [appTileGroup]=\"appTileSubGroup\"\n        [edit]=\"edit\"\n        [stackContent]=\"stackContent\"\n        [isAppTileSubGroup]=\"true\"\n        (tilesDropped)=\"tilesDropped.emit($event)\"\n        (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\n        (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\n        (resetGroup)=\"resetGroup.emit($event)\"\n        (deleteGroup)=\"deleteGroup.emit($event)\"\n        (toggleGroup)=\"toggleGroup.emit($event)\"\n    ></bt-tiles-viewer-group>\n</ng-container>\n", styles: [":host{display:block}fd-layout-panel{box-shadow:none}fd-layout-panel fd-layout-panel-body:not(.small-size){margin-top:.5rem}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:3px;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}\n"] }]
         }], ctorParameters: function () { return []; }, propDecorators: { appTileGroup: [{
                 type: Input
             }], stackContent: [{
                 type: Input
-            }], editHome: [{
+            }], edit: [{
                 type: Input
             }], isAppTileSubGroup: [{
                 type: Input
@@ -547,7 +577,7 @@ class TilesService {
         this.shellbarSource = new Subject();
         this.shellbar$ = this.shellbarSource.asObservable().pipe(shareReplay(1));
         this.appTileGroups$ = this._appTileGroupsSource.pipe(shareReplay(1));
-        this.editHome$ = this._edithomeSource.asObservable().pipe(takeUntil(this._OnDestroy$), distinctUntilChanged());
+        this.edit$ = this._edithomeSource.asObservable().pipe(takeUntil(this._OnDestroy$), distinctUntilChanged());
         this.deviceSize$ = this._portalService.deviceSize$;
         this._rtlService.rtl.next(BarsaApi.LoginFormData.IsRtl);
         this.loadAllAppTileGroups();
@@ -1188,7 +1218,7 @@ class TilesViewerComponent extends BaseComponent {
         });
     }
     onDropGroup(appTileGroups, event) {
-        if (!this.editHome) {
+        if (!this.edit) {
             return;
         }
         this.listDropped.emit({ appTileGroups, event });
@@ -1210,10 +1240,10 @@ class TilesViewerComponent extends BaseComponent {
     }
 }
 TilesViewerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TilesViewerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-TilesViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TilesViewerComponent, selector: "bt-tiles-viewer", inputs: { appTileGroups: "appTileGroups", loading: "loading", editHome: "editHome", stackContent: "stackContent", deviceSize: "deviceSize", selectedAppGroupId: "selectedAppGroupId", 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: TabListComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"appTileGroups; else loadingTpl\">\r\n    <bsu-mask *ngIf=\"loading\"></bsu-mask>\r\n    <fd-dynamic-page\r\n        size=\"large\"\r\n        [ariaLabel]=\"'HomeEdit' | bbbTranslate\"\r\n        [autoResponsive]=\"true\"\r\n        [class.stack-mode]=\"stackContent\"\r\n    >\r\n        <fd-dynamic-page-header *ngIf=\"editHome\" [title]=\"'HomeEdit' | bbbTranslate\">\r\n            <fd-dynamic-page-global-actions>\r\n                <fd-toolbar *ngIf=\"editHome\" 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        <fd-dynamic-page-content>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    stackContent ? renderTabsStacked : renderTabs;\r\n                    context: {\r\n                        $implicit: appTileGroups,\r\n                        stackContent: stackContent,\r\n                        editHome: editHome\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n        </fd-dynamic-page-content>\r\n        <fd-dynamic-page-footer>\r\n            <div fd-bar barDesign=\"footer\" *ngIf=\"editHome\">\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        </fd-dynamic-page-footer>\r\n    </fd-dynamic-page>\r\n</ng-container>\r\n\r\n<ng-template #loadingTpl>\r\n    <bsu-mask></bsu-mask>\r\n</ng-template>\r\n\r\n<ng-template #renderTabs let-appTileGroups let-stackContent=\"stackContent\" let-editHome=\"editHome\">\r\n    <fd-tab-list\r\n        class=\"tile-tabs\"\r\n        [size]=\"deviceSize\"\r\n        [collapseOverflow]=\"true\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        cdkDropList\r\n        cdkDropListOrientation=\"vertical\"\r\n        (cdkDropListDropped)=\"onDropGroup(appTileGroups, $event)\"\r\n        (selectedTabChange)=\"onSelectedTabChange($event, appTileGroups)\"\r\n    >\r\n        <ng-container *ngFor=\"let appTileGroup of appTileGroups; let i = index; trackBy: _trackById\">\r\n            <fd-tab\r\n                *ngIf=\"editHome || appTileGroup.navigatorVisible\"\r\n                [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\r\n                [ngClass]=\"'fd-tabs--' + deviceSize\"\r\n                [class.is-expanded]=\"selectedTabTitle === (appTileGroup.navigatorTitle | bbbTranslate)\"\r\n            >\r\n                <fd-dynamic-page-content [id]=\"appTileGroup.Id\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            renderGroup;\r\n                            context: {\r\n                                $implicit: appTileGroup,\r\n                                stackContent: stackContent,\r\n                                editHome: editHome,\r\n                                isAppTileSubGroup: false\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </fd-dynamic-page-content>\r\n            </fd-tab>\r\n        </ng-container>\r\n    </fd-tab-list>\r\n</ng-template>\r\n<ng-template #renderTabsStacked let-appTileGroups let-stackContent=\"stackContent\" let-editHome=\"editHome\">\r\n    <fd-tab-list\r\n        class=\"tile-tabs\"\r\n        [size]=\"deviceSize\"\r\n        [collapseOverflow]=\"true\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        [stackContent]=\"true\"\r\n        [maxContentHeight]=\"stackContent ? 'calc(99vh - 2.75rem - 44px)' : 'calc(100vh - 44px)'\"\r\n        cdkDropList\r\n        cdkDropListOrientation=\"vertical\"\r\n        (cdkDropListDropped)=\"onDropGroup(appTileGroups, $event)\"\r\n    >\r\n        <ng-container *ngFor=\"let appTileGroup of appTileGroups; let i = index; trackBy: _trackById\">\r\n            <fd-tab\r\n                *ngIf=\"editHome || appTileGroup.navigatorVisible\"\r\n                [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\r\n                [ngClass]=\"'fd-tabs--' + deviceSize\"\r\n                [count]=\"appTileGroup.$Children?.length\"\r\n            >\r\n                <fd-dynamic-page-content [id]=\"appTileGroup.Id\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            renderGroup;\r\n                            context: {\r\n                                $implicit: appTileGroup,\r\n                                stackContent: stackContent,\r\n                                editHome: editHome,\r\n                                isAppTileSubGroup: false\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </fd-dynamic-page-content>\r\n            </fd-tab>\r\n        </ng-container>\r\n    </fd-tab-list>\r\n</ng-template>\r\n<ng-template\r\n    #renderGroup\r\n    let-appTileGroup\r\n    let-stackContent=\"stackContent\"\r\n    let-editHome=\"editHome\"\r\n    let-isAppTileSubGroup=\"isAppTileSubGroup\"\r\n>\r\n    <bt-tiles-viewer-group\r\n        [appTileGroup]=\"appTileGroup\"\r\n        [editHome]=\"editHome\"\r\n        [stackContent]=\"stackContent\"\r\n        [isAppTileSubGroup]=\"isAppTileSubGroup\"\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</ng-template>\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 section{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-content{padding:0!important}@media (max-width: 599px){bnrc-dynamic-component{margin-right:0!important;margin-left:0!important}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: i5$3.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i5$3.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i5$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$4.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["role", "ariaLabel", "background", "autoResponsive", "size", "offset", "expandContent"] }, { kind: "component", type: i5$4.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "subtitle"] }, { kind: "component", type: i5$4.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i5$4.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i5$4.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i5$4.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i6$3.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "checkbox", "radio", "alignLabelEnd", "inlineHelpTitle", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "id"] }, { kind: "component", type: i7$1.SwitchComponent, selector: "fd-switch", inputs: ["activeText", "inactiveText", "disabled", "id", "name", "required", "checked", "semantic", "ariaLabel", "ariaLabelledby", "ariaLabelledBy", "semanticAcceptLabel", "semanticDeclineLabel"], outputs: ["checkedChange"] }, { kind: "component", type: i8$2.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "expandOverflowText", "defaultTab", "selectDefaultOnTabsChange"], outputs: ["selectedTabChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i8$2.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: i4.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i4.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i6.MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "editHome", "isAppTileSubGroup", "deviceSize"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+TilesViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TilesViewerComponent, selector: "bt-tiles-viewer", inputs: { appTileGroups: "appTileGroups", loading: "loading", edit: "edit", stackContent: "stackContent", deviceSize: "deviceSize", selectedAppGroupId: "selectedAppGroupId", 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: TabListComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"appTileGroups; else loadingTpl\">\n    <bsu-mask *ngIf=\"loading\"></bsu-mask>\n    <fd-dynamic-page\n        size=\"large\"\n        [ariaLabel]=\"'HomeEdit' | bbbTranslate\"\n        [autoResponsive]=\"true\"\n        [class.stack-mode]=\"stackContent\"\n    >\n        <fd-dynamic-page-header *ngIf=\"edit\" [title]=\"'HomeEdit' | bbbTranslate\">\n            <fd-dynamic-page-global-actions>\n                <fd-toolbar *ngIf=\"edit\" fdType=\"transparent\" [clearBorder]=\"true\">\n                    <label fd-form-label fd-toolbar-item>Stacked Content </label>\n                    <fd-switch\n                        fd-toolbar-item\n                        [checked]=\"stackContent\"\n                        (checkedChange)=\"onStackContentChanged($event)\"\n                    ></fd-switch>\n                </fd-toolbar>\n            </fd-dynamic-page-global-actions>\n            <fd-dynamic-page-layout-actions>\n                <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                    <button fd-button fdType=\"transparent\" aria-label=\"Close\" title=\"Close\" (click)=\"onCloseEditHome()\">\n                        <i class=\"sap-icon--decline\"></i>\n                    </button>\n                </fd-toolbar>\n            </fd-dynamic-page-layout-actions>\n        </fd-dynamic-page-header>\n        <fd-dynamic-page-content>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    stackContent ? renderTabsStacked : renderTabs;\n                    context: {\n                        $implicit: appTileGroups,\n                        stackContent: stackContent,\n                        edit: edit\n                    }\n                \"\n            ></ng-container>\n        </fd-dynamic-page-content>\n        <fd-dynamic-page-footer>\n            <div fd-bar barDesign=\"footer\" *ngIf=\"edit\">\n                <div fd-bar-right>\n                    <fd-button-bar\n                        [label]=\"'SaveAndClose' | bbbTranslate\"\n                        fdType=\"emphasized\"\n                        (click)=\"onExitEditHome(appTileGroups)\"\n                    ></fd-button-bar>\n                </div>\n            </div>\n        </fd-dynamic-page-footer>\n    </fd-dynamic-page>\n</ng-container>\n\n<ng-template #loadingTpl>\n    <bsu-mask></bsu-mask>\n</ng-template>\n\n<ng-template #renderTabs let-appTileGroups let-stackContent=\"stackContent\" let-edit=\"edit\">\n    <fd-tab-list\n        class=\"tile-tabs\"\n        [size]=\"deviceSize\"\n        [collapseOverflow]=\"true\"\n        [expandOverflowText]=\"'More' | bbbTranslate\"\n        cdkDropList\n        cdkDropListOrientation=\"vertical\"\n        (cdkDropListDropped)=\"onDropGroup(appTileGroups, $event)\"\n        (selectedTabChange)=\"onSelectedTabChange($event, appTileGroups)\"\n    >\n        <ng-container *ngFor=\"let appTileGroup of appTileGroups; let i = index; trackBy: _trackById\">\n            <fd-tab\n                *ngIf=\"edit || appTileGroup.navigatorVisible\"\n                [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\n                [ngClass]=\"'fd-tabs--' + deviceSize\"\n                [class.is-expanded]=\"selectedTabTitle === (appTileGroup.navigatorTitle | bbbTranslate)\"\n            >\n                <fd-dynamic-page-content [id]=\"appTileGroup.Id\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            renderGroup;\n                            context: {\n                                $implicit: appTileGroup,\n                                stackContent: stackContent,\n                                edit: edit,\n                                isAppTileSubGroup: false\n                            }\n                        \"\n                    ></ng-container>\n                </fd-dynamic-page-content>\n            </fd-tab>\n        </ng-container>\n    </fd-tab-list>\n</ng-template>\n<ng-template #renderTabsStacked let-appTileGroups let-stackContent=\"stackContent\" let-edit=\"edit\">\n    <fd-tab-list\n        class=\"tile-tabs\"\n        [size]=\"deviceSize\"\n        [collapseOverflow]=\"true\"\n        [expandOverflowText]=\"'More' | bbbTranslate\"\n        [stackContent]=\"true\"\n        [maxContentHeight]=\"stackContent ? 'calc(99vh - 2.75rem - 44px)' : 'calc(100vh - 44px)'\"\n        cdkDropList\n        cdkDropListOrientation=\"vertical\"\n        (cdkDropListDropped)=\"onDropGroup(appTileGroups, $event)\"\n    >\n        <ng-container *ngFor=\"let appTileGroup of appTileGroups; let i = index; trackBy: _trackById\">\n            <fd-tab\n                *ngIf=\"edit || appTileGroup.navigatorVisible\"\n                [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\n                [ngClass]=\"'fd-tabs--' + deviceSize\"\n                [count]=\"appTileGroup.$Children?.length\"\n            >\n                <fd-dynamic-page-content [id]=\"appTileGroup.Id\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            renderGroup;\n                            context: {\n                                $implicit: appTileGroup,\n                                stackContent: stackContent,\n                                edit: edit,\n                                isAppTileSubGroup: false\n                            }\n                        \"\n                    ></ng-container>\n                </fd-dynamic-page-content>\n            </fd-tab>\n        </ng-container>\n    </fd-tab-list>\n</ng-template>\n<ng-template\n    #renderGroup\n    let-appTileGroup\n    let-stackContent=\"stackContent\"\n    let-edit=\"edit\"\n    let-isAppTileSubGroup=\"isAppTileSubGroup\"\n>\n    <bt-tiles-viewer-group\n        [appTileGroup]=\"appTileGroup\"\n        [edit]=\"edit\"\n        [stackContent]=\"stackContent\"\n        [isAppTileSubGroup]=\"isAppTileSubGroup\"\n        (tilesDropped)=\"onDrop($event)\"\n        (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\n        (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\n        (resetGroup)=\"resetGroup.emit($event)\"\n        (deleteGroup)=\"deleteGroup.emit($event)\"\n        (toggleGroup)=\"toggleGroup.emit($event)\"\n    ></bt-tiles-viewer-group>\n</ng-template>\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 section{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-content{padding:0!important}@media (max-width: 599px){bnrc-dynamic-component{margin-right:0!important;margin-left:0!important}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$2.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "component", type: i5$3.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i5$3.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i5$3.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabel", "ariaLabelledby", "id"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5$4.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["role", "ariaLabel", "background", "autoResponsive", "size", "offset", "expandContent"] }, { kind: "component", type: i5$4.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "subtitle"] }, { kind: "component", type: i5$4.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i5$4.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i5$4.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i5$4.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i6$3.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "checkbox", "radio", "alignLabelEnd", "inlineHelpTitle", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "id"] }, { kind: "component", type: i7$1.SwitchComponent, selector: "fd-switch", inputs: ["activeText", "inactiveText", "disabled", "id", "name", "required", "checked", "semantic", "ariaLabel", "ariaLabelledby", "ariaLabelledBy", "semanticAcceptLabel", "semanticDeclineLabel"], outputs: ["checkedChange"] }, { kind: "component", type: i8$2.TabListComponent, selector: "fd-tab-list", inputs: ["size", "mode", "collapseOverflow", "maxVisibleTabs", "stackContent", "maxContentHeight", "collapsibleTabs", "expandOverflowText", "defaultTab", "selectDefaultOnTabsChange"], outputs: ["selectedTabChange", "visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i8$2.TabPanelComponent, selector: "fd-tab", inputs: ["id", "ariaLabel", "ariaLabelledBy", "title", "count", "glyph", "header", "disabled", "tabState"], outputs: ["opened", "closed"] }, { kind: "component", type: i4.ToolbarComponent, selector: "fd-toolbar", inputs: ["class", "shouldOverflow", "fdType", "hasTitle", "title", "active", "clearBorder", "forceOverflow", "tabindex"] }, { kind: "directive", type: i4.ToolbarItemDirective, selector: "[fd-toolbar-item]" }, { kind: "component", type: i6.MaskComponent, selector: "bsu-mask", inputs: ["size", "marginTop"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "edit", "isAppTileSubGroup", "deviceSize"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TilesViewerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-tiles-viewer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"appTileGroups; else loadingTpl\">\r\n    <bsu-mask *ngIf=\"loading\"></bsu-mask>\r\n    <fd-dynamic-page\r\n        size=\"large\"\r\n        [ariaLabel]=\"'HomeEdit' | bbbTranslate\"\r\n        [autoResponsive]=\"true\"\r\n        [class.stack-mode]=\"stackContent\"\r\n    >\r\n        <fd-dynamic-page-header *ngIf=\"editHome\" [title]=\"'HomeEdit' | bbbTranslate\">\r\n            <fd-dynamic-page-global-actions>\r\n                <fd-toolbar *ngIf=\"editHome\" 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        <fd-dynamic-page-content>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    stackContent ? renderTabsStacked : renderTabs;\r\n                    context: {\r\n                        $implicit: appTileGroups,\r\n                        stackContent: stackContent,\r\n                        editHome: editHome\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n        </fd-dynamic-page-content>\r\n        <fd-dynamic-page-footer>\r\n            <div fd-bar barDesign=\"footer\" *ngIf=\"editHome\">\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        </fd-dynamic-page-footer>\r\n    </fd-dynamic-page>\r\n</ng-container>\r\n\r\n<ng-template #loadingTpl>\r\n    <bsu-mask></bsu-mask>\r\n</ng-template>\r\n\r\n<ng-template #renderTabs let-appTileGroups let-stackContent=\"stackContent\" let-editHome=\"editHome\">\r\n    <fd-tab-list\r\n        class=\"tile-tabs\"\r\n        [size]=\"deviceSize\"\r\n        [collapseOverflow]=\"true\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        cdkDropList\r\n        cdkDropListOrientation=\"vertical\"\r\n        (cdkDropListDropped)=\"onDropGroup(appTileGroups, $event)\"\r\n        (selectedTabChange)=\"onSelectedTabChange($event, appTileGroups)\"\r\n    >\r\n        <ng-container *ngFor=\"let appTileGroup of appTileGroups; let i = index; trackBy: _trackById\">\r\n            <fd-tab\r\n                *ngIf=\"editHome || appTileGroup.navigatorVisible\"\r\n                [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\r\n                [ngClass]=\"'fd-tabs--' + deviceSize\"\r\n                [class.is-expanded]=\"selectedTabTitle === (appTileGroup.navigatorTitle | bbbTranslate)\"\r\n            >\r\n                <fd-dynamic-page-content [id]=\"appTileGroup.Id\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            renderGroup;\r\n                            context: {\r\n                                $implicit: appTileGroup,\r\n                                stackContent: stackContent,\r\n                                editHome: editHome,\r\n                                isAppTileSubGroup: false\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </fd-dynamic-page-content>\r\n            </fd-tab>\r\n        </ng-container>\r\n    </fd-tab-list>\r\n</ng-template>\r\n<ng-template #renderTabsStacked let-appTileGroups let-stackContent=\"stackContent\" let-editHome=\"editHome\">\r\n    <fd-tab-list\r\n        class=\"tile-tabs\"\r\n        [size]=\"deviceSize\"\r\n        [collapseOverflow]=\"true\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        [stackContent]=\"true\"\r\n        [maxContentHeight]=\"stackContent ? 'calc(99vh - 2.75rem - 44px)' : 'calc(100vh - 44px)'\"\r\n        cdkDropList\r\n        cdkDropListOrientation=\"vertical\"\r\n        (cdkDropListDropped)=\"onDropGroup(appTileGroups, $event)\"\r\n    >\r\n        <ng-container *ngFor=\"let appTileGroup of appTileGroups; let i = index; trackBy: _trackById\">\r\n            <fd-tab\r\n                *ngIf=\"editHome || appTileGroup.navigatorVisible\"\r\n                [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\r\n                [ngClass]=\"'fd-tabs--' + deviceSize\"\r\n                [count]=\"appTileGroup.$Children?.length\"\r\n            >\r\n                <fd-dynamic-page-content [id]=\"appTileGroup.Id\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            renderGroup;\r\n                            context: {\r\n                                $implicit: appTileGroup,\r\n                                stackContent: stackContent,\r\n                                editHome: editHome,\r\n                                isAppTileSubGroup: false\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </fd-dynamic-page-content>\r\n            </fd-tab>\r\n        </ng-container>\r\n    </fd-tab-list>\r\n</ng-template>\r\n<ng-template\r\n    #renderGroup\r\n    let-appTileGroup\r\n    let-stackContent=\"stackContent\"\r\n    let-editHome=\"editHome\"\r\n    let-isAppTileSubGroup=\"isAppTileSubGroup\"\r\n>\r\n    <bt-tiles-viewer-group\r\n        [appTileGroup]=\"appTileGroup\"\r\n        [editHome]=\"editHome\"\r\n        [stackContent]=\"stackContent\"\r\n        [isAppTileSubGroup]=\"isAppTileSubGroup\"\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</ng-template>\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 section{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-content{padding:0!important}@media (max-width: 599px){bnrc-dynamic-component{margin-right:0!important;margin-left:0!important}}\n"] }]
+            args: [{ selector: 'bt-tiles-viewer', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"appTileGroups; else loadingTpl\">\n    <bsu-mask *ngIf=\"loading\"></bsu-mask>\n    <fd-dynamic-page\n        size=\"large\"\n        [ariaLabel]=\"'HomeEdit' | bbbTranslate\"\n        [autoResponsive]=\"true\"\n        [class.stack-mode]=\"stackContent\"\n    >\n        <fd-dynamic-page-header *ngIf=\"edit\" [title]=\"'HomeEdit' | bbbTranslate\">\n            <fd-dynamic-page-global-actions>\n                <fd-toolbar *ngIf=\"edit\" fdType=\"transparent\" [clearBorder]=\"true\">\n                    <label fd-form-label fd-toolbar-item>Stacked Content </label>\n                    <fd-switch\n                        fd-toolbar-item\n                        [checked]=\"stackContent\"\n                        (checkedChange)=\"onStackContentChanged($event)\"\n                    ></fd-switch>\n                </fd-toolbar>\n            </fd-dynamic-page-global-actions>\n            <fd-dynamic-page-layout-actions>\n                <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\n                    <button fd-button fdType=\"transparent\" aria-label=\"Close\" title=\"Close\" (click)=\"onCloseEditHome()\">\n                        <i class=\"sap-icon--decline\"></i>\n                    </button>\n                </fd-toolbar>\n            </fd-dynamic-page-layout-actions>\n        </fd-dynamic-page-header>\n        <fd-dynamic-page-content>\n            <ng-container\n                *ngTemplateOutlet=\"\n                    stackContent ? renderTabsStacked : renderTabs;\n                    context: {\n                        $implicit: appTileGroups,\n                        stackContent: stackContent,\n                        edit: edit\n                    }\n                \"\n            ></ng-container>\n        </fd-dynamic-page-content>\n        <fd-dynamic-page-footer>\n            <div fd-bar barDesign=\"footer\" *ngIf=\"edit\">\n                <div fd-bar-right>\n                    <fd-button-bar\n                        [label]=\"'SaveAndClose' | bbbTranslate\"\n                        fdType=\"emphasized\"\n                        (click)=\"onExitEditHome(appTileGroups)\"\n                    ></fd-button-bar>\n                </div>\n            </div>\n        </fd-dynamic-page-footer>\n    </fd-dynamic-page>\n</ng-container>\n\n<ng-template #loadingTpl>\n    <bsu-mask></bsu-mask>\n</ng-template>\n\n<ng-template #renderTabs let-appTileGroups let-stackContent=\"stackContent\" let-edit=\"edit\">\n    <fd-tab-list\n        class=\"tile-tabs\"\n        [size]=\"deviceSize\"\n        [collapseOverflow]=\"true\"\n        [expandOverflowText]=\"'More' | bbbTranslate\"\n        cdkDropList\n        cdkDropListOrientation=\"vertical\"\n        (cdkDropListDropped)=\"onDropGroup(appTileGroups, $event)\"\n        (selectedTabChange)=\"onSelectedTabChange($event, appTileGroups)\"\n    >\n        <ng-container *ngFor=\"let appTileGroup of appTileGroups; let i = index; trackBy: _trackById\">\n            <fd-tab\n                *ngIf=\"edit || appTileGroup.navigatorVisible\"\n                [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\n                [ngClass]=\"'fd-tabs--' + deviceSize\"\n                [class.is-expanded]=\"selectedTabTitle === (appTileGroup.navigatorTitle | bbbTranslate)\"\n            >\n                <fd-dynamic-page-content [id]=\"appTileGroup.Id\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            renderGroup;\n                            context: {\n                                $implicit: appTileGroup,\n                                stackContent: stackContent,\n                                edit: edit,\n                                isAppTileSubGroup: false\n                            }\n                        \"\n                    ></ng-container>\n                </fd-dynamic-page-content>\n            </fd-tab>\n        </ng-container>\n    </fd-tab-list>\n</ng-template>\n<ng-template #renderTabsStacked let-appTileGroups let-stackContent=\"stackContent\" let-edit=\"edit\">\n    <fd-tab-list\n        class=\"tile-tabs\"\n        [size]=\"deviceSize\"\n        [collapseOverflow]=\"true\"\n        [expandOverflowText]=\"'More' | bbbTranslate\"\n        [stackContent]=\"true\"\n        [maxContentHeight]=\"stackContent ? 'calc(99vh - 2.75rem - 44px)' : 'calc(100vh - 44px)'\"\n        cdkDropList\n        cdkDropListOrientation=\"vertical\"\n        (cdkDropListDropped)=\"onDropGroup(appTileGroups, $event)\"\n    >\n        <ng-container *ngFor=\"let appTileGroup of appTileGroups; let i = index; trackBy: _trackById\">\n            <fd-tab\n                *ngIf=\"edit || appTileGroup.navigatorVisible\"\n                [title]=\"appTileGroup.navigatorTitle | bbbTranslate\"\n                [ngClass]=\"'fd-tabs--' + deviceSize\"\n                [count]=\"appTileGroup.$Children?.length\"\n            >\n                <fd-dynamic-page-content [id]=\"appTileGroup.Id\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            renderGroup;\n                            context: {\n                                $implicit: appTileGroup,\n                                stackContent: stackContent,\n                                edit: edit,\n                                isAppTileSubGroup: false\n                            }\n                        \"\n                    ></ng-container>\n                </fd-dynamic-page-content>\n            </fd-tab>\n        </ng-container>\n    </fd-tab-list>\n</ng-template>\n<ng-template\n    #renderGroup\n    let-appTileGroup\n    let-stackContent=\"stackContent\"\n    let-edit=\"edit\"\n    let-isAppTileSubGroup=\"isAppTileSubGroup\"\n>\n    <bt-tiles-viewer-group\n        [appTileGroup]=\"appTileGroup\"\n        [edit]=\"edit\"\n        [stackContent]=\"stackContent\"\n        [isAppTileSubGroup]=\"isAppTileSubGroup\"\n        (tilesDropped)=\"onDrop($event)\"\n        (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\n        (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\n        (resetGroup)=\"resetGroup.emit($event)\"\n        (deleteGroup)=\"deleteGroup.emit($event)\"\n        (toggleGroup)=\"toggleGroup.emit($event)\"\n    ></bt-tiles-viewer-group>\n</ng-template>\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 section{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-content{padding:0!important}@media (max-width: 599px){bnrc-dynamic-component{margin-right:0!important;margin-left:0!important}}\n"] }]
         }], propDecorators: { tabListComponent: [{
                 type: ViewChild,
                 args: [TabListComponent]
@@ -1224,7 +1254,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
                 type: Input
             }], loading: [{
                 type: Input
-            }], editHome: [{
+            }], edit: [{
                 type: Input
             }], stackContent: [{
                 type: Input
@@ -1282,7 +1312,7 @@ class TilesViewerContainerComponent extends BaseComponent {
         super.ngOnInit();
         this.viewLoading$ = this._tilesViewerService.viewLoading$;
         this.deviceSize$ = this._portalService.deviceSize$;
-        this.editHome$ = this._tilesService.editHome$;
+        this.edit$ = this._tilesService.edit$;
         this.appTileGroups$ = this._tilesService.homeAppTileGroups$;
         this.appTileGroups$.pipe(withLatestFrom(this.stackContent$)).subscribe(([tiles, stackContent]) => {
             if (tiles && stackContent) {
@@ -1401,10 +1431,10 @@ class TilesViewerContainerComponent extends BaseComponent {
     }
 }
 TilesViewerContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TilesViewerContainerComponent, deps: [{ token: i1$2.PortalService }, { token: TilesService }, { token: TilesViewerService }], target: i0.ɵɵFactoryTarget.Component });
-TilesViewerContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TilesViewerContainerComponent, selector: "bt-tiles-viewer-container", providers: [TilesViewerService], usesInheritance: true, ngImport: i0, template: "<bt-tiles-viewer\r\n    [appTileGroups]=\"(appTileGroups$ | async)!!\"\r\n    [loading]=\"(viewLoading$ | async)!!\"\r\n    [editHome]=\"(editHome$ | async)!!\"\r\n    [stackContent]=\"(stackContent$ | async)!!\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\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", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TilesViewerComponent, selector: "bt-tiles-viewer", inputs: ["appTileGroups", "loading", "editHome", "stackContent", "deviceSize", "selectedAppGroupId", "DynamicComponents"], outputs: ["stackContentChange", "closeEditHome", "save", "listDropped", "tabChanged", "toggleGroup", "resetGroup", "deleteGroup", "hideAppTileClick", "renameAppTileClick", "tilesDropped"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+TilesViewerContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: TilesViewerContainerComponent, selector: "bt-tiles-viewer-container", providers: [TilesViewerService], usesInheritance: true, ngImport: i0, template: "<bt-tiles-viewer\n    [appTileGroups]=\"(appTileGroups$ | async)!!\"\n    [loading]=\"(viewLoading$ | async)!!\"\n    [edit]=\"(edit$ | async)!!\"\n    [stackContent]=\"(stackContent$ | async)!!\"\n    [deviceSize]=\"(deviceSize$ | async)!!\"\n    (stackContentChange)=\"onStackContentChanged($event)\"\n    (closeEditHome)=\"onCloseEditHome()\"\n    (save)=\"onExitEditHome($event)\"\n    (listDropped)=\"onDropGroup($event)\"\n    (tabChanged)=\"onSelectedTabChange($event)\"\n    (toggleGroup)=\"onToggleShowHide($event)\"\n    (resetGroup)=\"onReset($event)\"\n    (deleteGroup)=\"onDelete($event)\"\n    (tilesDropped)=\"onDrop($event)\"\n    (hideAppTileClick)=\"onHideAppTile($event)\"\n    (renameAppTileClick)=\"onRenameAppTile($event)\"\n></bt-tiles-viewer>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: TilesViewerComponent, selector: "bt-tiles-viewer", inputs: ["appTileGroups", "loading", "edit", "stackContent", "deviceSize", "selectedAppGroupId", "DynamicComponents"], outputs: ["stackContentChange", "closeEditHome", "save", "listDropped", "tabChanged", "toggleGroup", "resetGroup", "deleteGroup", "hideAppTileClick", "renameAppTileClick", "tilesDropped"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TilesViewerContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-tiles-viewer-container', providers: [TilesViewerService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tiles-viewer\r\n    [appTileGroups]=\"(appTileGroups$ | async)!!\"\r\n    [loading]=\"(viewLoading$ | async)!!\"\r\n    [editHome]=\"(editHome$ | async)!!\"\r\n    [stackContent]=\"(stackContent$ | async)!!\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\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", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'bt-tiles-viewer-container', providers: [TilesViewerService], changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tiles-viewer\n    [appTileGroups]=\"(appTileGroups$ | async)!!\"\n    [loading]=\"(viewLoading$ | async)!!\"\n    [edit]=\"(edit$ | async)!!\"\n    [stackContent]=\"(stackContent$ | async)!!\"\n    [deviceSize]=\"(deviceSize$ | async)!!\"\n    (stackContentChange)=\"onStackContentChanged($event)\"\n    (closeEditHome)=\"onCloseEditHome()\"\n    (save)=\"onExitEditHome($event)\"\n    (listDropped)=\"onDropGroup($event)\"\n    (tabChanged)=\"onSelectedTabChange($event)\"\n    (toggleGroup)=\"onToggleShowHide($event)\"\n    (resetGroup)=\"onReset($event)\"\n    (deleteGroup)=\"onDelete($event)\"\n    (tilesDropped)=\"onDrop($event)\"\n    (hideAppTileClick)=\"onHideAppTile($event)\"\n    (renameAppTileClick)=\"onRenameAppTile($event)\"\n></bt-tiles-viewer>\n", styles: [":host{display:block}\n"] }]
         }], ctorParameters: function () { return [{ type: i1$2.PortalService }, { type: TilesService }, { type: TilesViewerService }]; } });
 
 class MicroTileChartBulletComponent extends BaseBtTileComponent {
@@ -1420,10 +1450,10 @@ class MicroTileChartBulletComponent extends BaseBtTileComponent {
     }
 }
 MicroTileChartBulletComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartBulletComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MicroTileChartBulletComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartBulletComponent, selector: "bt-micro-tile-chart-bullet", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-bullet\r\n            *ngIf=\"double\"\r\n            [target]=\"target\"\r\n            [value]=\"value\"\r\n            [range]=\"range\"\r\n            [forecast]=\"forecast\"\r\n            [isDelta]=\"isDelta\"\r\n            [separatorLines]=\"separatorLines\"\r\n            [suffix]=\"suffix\"\r\n        >\r\n        </be-micro-chart-bullet>\r\n\r\n        <be-micro-chart-bullet\r\n            [target]=\"target\"\r\n            [value]=\"value\"\r\n            [range]=\"range\"\r\n            [forecast]=\"forecast\"\r\n            [isDelta]=\"double ? false : isDelta\"\r\n            [separatorLines]=\"separatorLines\"\r\n            [suffix]=\"suffix\"\r\n        >\r\n        </be-micro-chart-bullet>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host ::ng-deep .fd-tile__content{display:flex;column-gap:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartBulletComponent, selector: "be-micro-chart-bullet", inputs: ["range", "value", "forecast", "target", "suffix", "separatorLines", "isDelta"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MicroTileChartBulletComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartBulletComponent, selector: "bt-micro-tile-chart-bullet", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-bullet\n            *ngIf=\"double\"\n            [target]=\"target\"\n            [value]=\"value\"\n            [range]=\"range\"\n            [forecast]=\"forecast\"\n            [isDelta]=\"isDelta\"\n            [separatorLines]=\"separatorLines\"\n            [suffix]=\"suffix\"\n        >\n        </be-micro-chart-bullet>\n\n        <be-micro-chart-bullet\n            [target]=\"target\"\n            [value]=\"value\"\n            [range]=\"range\"\n            [forecast]=\"forecast\"\n            [isDelta]=\"double ? false : isDelta\"\n            [separatorLines]=\"separatorLines\"\n            [suffix]=\"suffix\"\n        >\n        </be-micro-chart-bullet>\n    </div>\n</bt-tile>\n", styles: [":host ::ng-deep .fd-tile__content{display:flex;column-gap:20px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartBulletComponent, selector: "be-micro-chart-bullet", inputs: ["range", "value", "forecast", "target", "suffix", "separatorLines", "isDelta"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartBulletComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-micro-tile-chart-bullet', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-bullet\r\n            *ngIf=\"double\"\r\n            [target]=\"target\"\r\n            [value]=\"value\"\r\n            [range]=\"range\"\r\n            [forecast]=\"forecast\"\r\n            [isDelta]=\"isDelta\"\r\n            [separatorLines]=\"separatorLines\"\r\n            [suffix]=\"suffix\"\r\n        >\r\n        </be-micro-chart-bullet>\r\n\r\n        <be-micro-chart-bullet\r\n            [target]=\"target\"\r\n            [value]=\"value\"\r\n            [range]=\"range\"\r\n            [forecast]=\"forecast\"\r\n            [isDelta]=\"double ? false : isDelta\"\r\n            [separatorLines]=\"separatorLines\"\r\n            [suffix]=\"suffix\"\r\n        >\r\n        </be-micro-chart-bullet>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host ::ng-deep .fd-tile__content{display:flex;column-gap:20px}\n"] }]
+            args: [{ selector: 'bt-micro-tile-chart-bullet', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-bullet\n            *ngIf=\"double\"\n            [target]=\"target\"\n            [value]=\"value\"\n            [range]=\"range\"\n            [forecast]=\"forecast\"\n            [isDelta]=\"isDelta\"\n            [separatorLines]=\"separatorLines\"\n            [suffix]=\"suffix\"\n        >\n        </be-micro-chart-bullet>\n\n        <be-micro-chart-bullet\n            [target]=\"target\"\n            [value]=\"value\"\n            [range]=\"range\"\n            [forecast]=\"forecast\"\n            [isDelta]=\"double ? false : isDelta\"\n            [separatorLines]=\"separatorLines\"\n            [suffix]=\"suffix\"\n        >\n        </be-micro-chart-bullet>\n    </div>\n</bt-tile>\n", styles: [":host ::ng-deep .fd-tile__content{display:flex;column-gap:20px}\n"] }]
         }] });
 
 class NewsTileComponent extends BaseBtTileComponent {
@@ -1461,10 +1491,10 @@ class NewsTileComponent extends BaseBtTileComponent {
     }
 }
 NewsTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: NewsTileComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-NewsTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: NewsTileComponent, selector: "bt-news-tile", viewQueries: [{ propertyName: "carouselComponent", first: true, predicate: CarouselComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<bt-tile [data]=\"data\" [type]=\"'launch'\" [footerTemplate]=\"newsFooter\" [editHome]=\"editHome\">\n    <div fd-tile-content style=\"align-items: center; padding-top: 1rem\">\n        <span>\n            {{ activeNews?.Text }}\n        </span>\n\n        <div class=\"wrapper-carousel\">\n            <div class=\"cover\"></div>\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [glyph]=\"isStop ? 'play' : 'pause'\"\n                (click)=\"isStop = !isStop; $event.preventDefault(); $event.stopPropagation()\"\n            ></button>\n            <fd-carousel\n                carouselIndicatorsOrientation=\"top\"\n                [slideTransitionDuration]=\"1000\"\n                (slideChange)=\"slideChange($event)\"\n                [loop]=\"true\"\n                [navigation]=\"false\"\n                [navigatorInPageIndicator]=\"false\"\n                width=\"100%\"\n            >\n                <fd-carousel-item *ngFor=\"let slide of slides\" [value]=\"slide\">\n                    <img\n                        [src]=\"slide.Img ? (slide.Img.FileId | picFieldSrc: 'ID':null:slide.Img.FileId:335:170) : ''\"\n                    />\n                </fd-carousel-item>\n            </fd-carousel>\n        </div>\n    </div>\n</bt-tile>\n\n<!--  tile footer-->\n<ng-template #newsFooter>\n    <div fd-tile-footer [twoColumn]=\"twoColumn\" *untilInView=\"el\">\n        <ng-container *ngIf=\"twoColumn; else oneColumn\">\n            <div fd-tile-section>\n                <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n            </div>\n            <div fd-tile-section>\n                <span fd-tile-footer-text>{{ activeNews?.Footer2 }}</span>\n            </div>\n        </ng-container>\n        <ng-template #oneColumn>\n            <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n        </ng-template>\n    </div>\n</ng-template>\n", styles: [":host{position:relative;display:block}:host bt-tile{position:relative}:host bt-tile .wrapper-carousel{position:absolute;top:0;width:100%;height:100%;left:0;z-index:0}:host bt-tile .wrapper-carousel img{width:335px;height:165px;object-fit:cover}:host ::ng-deep span{z-index:3;color:#fff}:host ::ng-deep button{position:absolute;right:15px;top:15px;display:none}:host ::ng-deep button fd-icon{z-index:4;min-width:1.5rem!important;font-size:1.5rem!important;color:#fff!important}:host ::ng-deep .fd-carousel__content{z-index:3}:host ::ng-deep .fd-carousel__page-indicator-container{position:absolute;bottom:0;display:none;background-color:transparent}:host ::ng-deep .fd-carousel__page-indicator-container ol{z-index:5}:host ::ng-deep .fd-carousel__page-indicator-container ol li{background-color:#dad7d7}:host ::ng-deep .fd-carousel__page-indicator-container ol li.fd-carousel__page-indicator--active{background-color:#fff}:host .cover{background-color:#064079d9;position:absolute;bottom:0;left:0;right:0;height:50%;z-index:4;opacity:.6}:host:hover ::ng-deep .fd-carousel__page-indicator-container{display:inherit}:host:hover ::ng-deep button{display:inline-flex}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3$2.CarouselComponent, selector: "fd-carousel", inputs: ["id", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "pageIndicatorsOrientation", "height", "width", "loop", "leftNavigationBtnLabel", "rightNavigationBtnLabel", "navigation", "navigatorInPageIndicator", "numericIndicator", "pageIndicatorContainer", "pageIndicator", "resourceStrings", "slideTransitionDuration", "swipeEnabled", "vertical", "visibleSlidesCount"], outputs: ["slideChange"] }, { kind: "component", type: i3$2.CarouselItemComponent, selector: "fd-carousel-item", inputs: ["id", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "loading", "title", "initialHeight", "initialWidth", "value"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileFooterDirective, selector: "[fdTileFooter], [fd-tile-footer]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileSectionDirective, selector: "[fdTileSection], [fd-tile-section]" }, { kind: "directive", type: i1$1.TileFooterTextDirective, selector: "[fdTileFooterText], [fd-tile-footer-text]" }, { kind: "directive", type: i1$2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }, { kind: "pipe", type: i1$2.PictureFieldSourcePipe, name: "picFieldSrc" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+NewsTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: NewsTileComponent, selector: "bt-news-tile", viewQueries: [{ propertyName: "carouselComponent", first: true, predicate: CarouselComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [footerTemplate]=\"newsFooter\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n>\n    <div fd-tile-content style=\"align-items: center; padding-top: 1rem\">\n        <span>\n            {{ activeNews?.Text }}\n        </span>\n\n        <div class=\"wrapper-carousel\">\n            <div class=\"cover\"></div>\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [glyph]=\"isStop ? 'play' : 'pause'\"\n                (click)=\"isStop = !isStop; $event.preventDefault(); $event.stopPropagation()\"\n            ></button>\n            <fd-carousel\n                carouselIndicatorsOrientation=\"top\"\n                [slideTransitionDuration]=\"1000\"\n                (slideChange)=\"slideChange($event)\"\n                [loop]=\"true\"\n                [navigation]=\"false\"\n                [navigatorInPageIndicator]=\"false\"\n                width=\"100%\"\n            >\n                <fd-carousel-item *ngFor=\"let slide of slides\" [value]=\"slide\">\n                    <img\n                        [src]=\"slide.Img ? (slide.Img.FileId | picFieldSrc: 'ID':null:slide.Img.FileId:335:170) : ''\"\n                    />\n                </fd-carousel-item>\n            </fd-carousel>\n        </div>\n    </div>\n</bt-tile>\n\n<!--  tile footer-->\n<ng-template #newsFooter>\n    <div fd-tile-footer [twoColumn]=\"twoColumn\" *untilInView=\"el\">\n        <ng-container *ngIf=\"twoColumn; else oneColumn\">\n            <div fd-tile-section>\n                <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n            </div>\n            <div fd-tile-section>\n                <span fd-tile-footer-text>{{ activeNews?.Footer2 }}</span>\n            </div>\n        </ng-container>\n        <ng-template #oneColumn>\n            <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n        </ng-template>\n    </div>\n</ng-template>\n", styles: [":host{position:relative;display:block}:host bt-tile{position:relative}:host bt-tile .wrapper-carousel{position:absolute;top:0;width:100%;height:100%;left:0;z-index:0}:host bt-tile .wrapper-carousel img{width:335px;height:165px;object-fit:cover}:host ::ng-deep span{z-index:3;color:#fff}:host ::ng-deep button{position:absolute;right:15px;top:15px;display:none}:host ::ng-deep button fd-icon{z-index:4;min-width:1.5rem!important;font-size:1.5rem!important;color:#fff!important}:host ::ng-deep .fd-carousel__content{z-index:3}:host ::ng-deep .fd-carousel__page-indicator-container{position:absolute;bottom:0;display:none;background-color:transparent}:host ::ng-deep .fd-carousel__page-indicator-container ol{z-index:5}:host ::ng-deep .fd-carousel__page-indicator-container ol li{background-color:#dad7d7}:host ::ng-deep .fd-carousel__page-indicator-container ol li.fd-carousel__page-indicator--active{background-color:#fff}:host .cover{background-color:#064079d9;position:absolute;bottom:0;left:0;right:0;height:50%;z-index:4;opacity:.6}:host:hover ::ng-deep .fd-carousel__page-indicator-container{display:inherit}:host:hover ::ng-deep button{display:inline-flex}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3$2.CarouselComponent, selector: "fd-carousel", inputs: ["id", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "pageIndicatorsOrientation", "height", "width", "loop", "leftNavigationBtnLabel", "rightNavigationBtnLabel", "navigation", "navigatorInPageIndicator", "numericIndicator", "pageIndicatorContainer", "pageIndicator", "resourceStrings", "slideTransitionDuration", "swipeEnabled", "vertical", "visibleSlidesCount"], outputs: ["slideChange"] }, { kind: "component", type: i3$2.CarouselItemComponent, selector: "fd-carousel-item", inputs: ["id", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "loading", "title", "initialHeight", "initialWidth", "value"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileFooterDirective, selector: "[fdTileFooter], [fd-tile-footer]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileSectionDirective, selector: "[fdTileSection], [fd-tile-section]" }, { kind: "directive", type: i1$1.TileFooterTextDirective, selector: "[fdTileFooterText], [fd-tile-footer-text]" }, { kind: "directive", type: i1$2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: i1$2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: NewsTileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-news-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile [data]=\"data\" [type]=\"'launch'\" [footerTemplate]=\"newsFooter\" [editHome]=\"editHome\">\n    <div fd-tile-content style=\"align-items: center; padding-top: 1rem\">\n        <span>\n            {{ activeNews?.Text }}\n        </span>\n\n        <div class=\"wrapper-carousel\">\n            <div class=\"cover\"></div>\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [glyph]=\"isStop ? 'play' : 'pause'\"\n                (click)=\"isStop = !isStop; $event.preventDefault(); $event.stopPropagation()\"\n            ></button>\n            <fd-carousel\n                carouselIndicatorsOrientation=\"top\"\n                [slideTransitionDuration]=\"1000\"\n                (slideChange)=\"slideChange($event)\"\n                [loop]=\"true\"\n                [navigation]=\"false\"\n                [navigatorInPageIndicator]=\"false\"\n                width=\"100%\"\n            >\n                <fd-carousel-item *ngFor=\"let slide of slides\" [value]=\"slide\">\n                    <img\n                        [src]=\"slide.Img ? (slide.Img.FileId | picFieldSrc: 'ID':null:slide.Img.FileId:335:170) : ''\"\n                    />\n                </fd-carousel-item>\n            </fd-carousel>\n        </div>\n    </div>\n</bt-tile>\n\n<!--  tile footer-->\n<ng-template #newsFooter>\n    <div fd-tile-footer [twoColumn]=\"twoColumn\" *untilInView=\"el\">\n        <ng-container *ngIf=\"twoColumn; else oneColumn\">\n            <div fd-tile-section>\n                <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n            </div>\n            <div fd-tile-section>\n                <span fd-tile-footer-text>{{ activeNews?.Footer2 }}</span>\n            </div>\n        </ng-container>\n        <ng-template #oneColumn>\n            <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n        </ng-template>\n    </div>\n</ng-template>\n", styles: [":host{position:relative;display:block}:host bt-tile{position:relative}:host bt-tile .wrapper-carousel{position:absolute;top:0;width:100%;height:100%;left:0;z-index:0}:host bt-tile .wrapper-carousel img{width:335px;height:165px;object-fit:cover}:host ::ng-deep span{z-index:3;color:#fff}:host ::ng-deep button{position:absolute;right:15px;top:15px;display:none}:host ::ng-deep button fd-icon{z-index:4;min-width:1.5rem!important;font-size:1.5rem!important;color:#fff!important}:host ::ng-deep .fd-carousel__content{z-index:3}:host ::ng-deep .fd-carousel__page-indicator-container{position:absolute;bottom:0;display:none;background-color:transparent}:host ::ng-deep .fd-carousel__page-indicator-container ol{z-index:5}:host ::ng-deep .fd-carousel__page-indicator-container ol li{background-color:#dad7d7}:host ::ng-deep .fd-carousel__page-indicator-container ol li.fd-carousel__page-indicator--active{background-color:#fff}:host .cover{background-color:#064079d9;position:absolute;bottom:0;left:0;right:0;height:50%;z-index:4;opacity:.6}:host:hover ::ng-deep .fd-carousel__page-indicator-container{display:inherit}:host:hover ::ng-deep button{display:inline-flex}\n"] }]
+            args: [{ selector: 'bt-news-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [footerTemplate]=\"newsFooter\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n>\n    <div fd-tile-content style=\"align-items: center; padding-top: 1rem\">\n        <span>\n            {{ activeNews?.Text }}\n        </span>\n\n        <div class=\"wrapper-carousel\">\n            <div class=\"cover\"></div>\n            <button\n                fd-button\n                fdType=\"transparent\"\n                [glyph]=\"isStop ? 'play' : 'pause'\"\n                (click)=\"isStop = !isStop; $event.preventDefault(); $event.stopPropagation()\"\n            ></button>\n            <fd-carousel\n                carouselIndicatorsOrientation=\"top\"\n                [slideTransitionDuration]=\"1000\"\n                (slideChange)=\"slideChange($event)\"\n                [loop]=\"true\"\n                [navigation]=\"false\"\n                [navigatorInPageIndicator]=\"false\"\n                width=\"100%\"\n            >\n                <fd-carousel-item *ngFor=\"let slide of slides\" [value]=\"slide\">\n                    <img\n                        [src]=\"slide.Img ? (slide.Img.FileId | picFieldSrc: 'ID':null:slide.Img.FileId:335:170) : ''\"\n                    />\n                </fd-carousel-item>\n            </fd-carousel>\n        </div>\n    </div>\n</bt-tile>\n\n<!--  tile footer-->\n<ng-template #newsFooter>\n    <div fd-tile-footer [twoColumn]=\"twoColumn\" *untilInView=\"el\">\n        <ng-container *ngIf=\"twoColumn; else oneColumn\">\n            <div fd-tile-section>\n                <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n            </div>\n            <div fd-tile-section>\n                <span fd-tile-footer-text>{{ activeNews?.Footer2 }}</span>\n            </div>\n        </ng-container>\n        <ng-template #oneColumn>\n            <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n        </ng-template>\n    </div>\n</ng-template>\n", styles: [":host{position:relative;display:block}:host bt-tile{position:relative}:host bt-tile .wrapper-carousel{position:absolute;top:0;width:100%;height:100%;left:0;z-index:0}:host bt-tile .wrapper-carousel img{width:335px;height:165px;object-fit:cover}:host ::ng-deep span{z-index:3;color:#fff}:host ::ng-deep button{position:absolute;right:15px;top:15px;display:none}:host ::ng-deep button fd-icon{z-index:4;min-width:1.5rem!important;font-size:1.5rem!important;color:#fff!important}:host ::ng-deep .fd-carousel__content{z-index:3}:host ::ng-deep .fd-carousel__page-indicator-container{position:absolute;bottom:0;display:none;background-color:transparent}:host ::ng-deep .fd-carousel__page-indicator-container ol{z-index:5}:host ::ng-deep .fd-carousel__page-indicator-container ol li{background-color:#dad7d7}:host ::ng-deep .fd-carousel__page-indicator-container ol li.fd-carousel__page-indicator--active{background-color:#fff}:host .cover{background-color:#064079d9;position:absolute;bottom:0;left:0;right:0;height:50%;z-index:4;opacity:.6}:host:hover ::ng-deep .fd-carousel__page-indicator-container{display:inherit}:host:hover ::ng-deep button{display:inline-flex}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { carouselComponent: [{
                 type: ViewChild,
                 args: [CarouselComponent]
@@ -1488,10 +1518,10 @@ class MicroTileChartComparisonComponent extends BaseBtTileComponent {
     }
 }
 MicroTileChartComparisonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartComparisonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MicroTileChartComparisonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartComparisonComponent, selector: "bt-micro-tile-chart-comparison", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-comparison [data]=\"chartData\" [size]=\"double ? 'l' : 's'\"></be-micro-chart-comparison>\r\n    </div>\r\n</bt-tile>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartComparisonComponent, selector: "be-micro-chart-comparison", inputs: ["data", "size"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MicroTileChartComparisonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartComparisonComponent, selector: "bt-micro-tile-chart-comparison", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-comparison [data]=\"chartData\" [size]=\"double ? 'l' : 's'\"></be-micro-chart-comparison>\n    </div>\n</bt-tile>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartComparisonComponent, selector: "be-micro-chart-comparison", inputs: ["data", "size"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartComparisonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-micro-tile-chart-comparison', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-comparison [data]=\"chartData\" [size]=\"double ? 'l' : 's'\"></be-micro-chart-comparison>\r\n    </div>\r\n</bt-tile>\r\n" }]
+            args: [{ selector: 'bt-micro-tile-chart-comparison', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-comparison [data]=\"chartData\" [size]=\"double ? 'l' : 's'\"></be-micro-chart-comparison>\n    </div>\n</bt-tile>\n" }]
         }] });
 
 class MicroTileChartStackbarComponent extends BaseBtTileComponent {
@@ -1508,10 +1538,10 @@ class MicroTileChartStackbarComponent extends BaseBtTileComponent {
     }
 }
 MicroTileChartStackbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartStackbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MicroTileChartStackbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartStackbarComponent, selector: "bt-micro-tile-chart-stackbar", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-stackbar [data]=\"charData\"></be-micro-chart-stackbar>\r\n    </div>\r\n</bt-tile>\r\n", styles: [".chart{width:100%}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartStackbarComponent, selector: "be-micro-chart-stackbar", inputs: ["data"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MicroTileChartStackbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartStackbarComponent, selector: "bt-micro-tile-chart-stackbar", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-stackbar [data]=\"charData\"></be-micro-chart-stackbar>\n    </div>\n</bt-tile>\n", styles: [".chart{width:100%}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartStackbarComponent, selector: "be-micro-chart-stackbar", inputs: ["data"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartStackbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-micro-tile-chart-stackbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-stackbar [data]=\"charData\"></be-micro-chart-stackbar>\r\n    </div>\r\n</bt-tile>\r\n", styles: [".chart{width:100%}\n"] }]
+            args: [{ selector: 'bt-micro-tile-chart-stackbar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-stackbar [data]=\"charData\"></be-micro-chart-stackbar>\n    </div>\n</bt-tile>\n", styles: [".chart{width:100%}\n"] }]
         }] });
 
 class MicroTileChartLineComponent extends BaseBtTileComponent {
@@ -1533,10 +1563,10 @@ class MicroTileChartLineComponent extends BaseBtTileComponent {
     }
 }
 MicroTileChartLineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartLineComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MicroTileChartLineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartLineComponent, selector: "bt-micro-tile-chart-line", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-line [line]=\"chartData\"></be-micro-chart-line>\r\n    </div>\r\n</bt-tile>\r\n", styles: ["be-micro-chart-bar{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartLineComponent, selector: "be-micro-chart-line", inputs: ["line"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MicroTileChartLineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartLineComponent, selector: "bt-micro-tile-chart-line", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-line [line]=\"chartData\"></be-micro-chart-line>\n    </div>\n</bt-tile>\n", styles: ["be-micro-chart-bar{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartLineComponent, selector: "be-micro-chart-line", inputs: ["line"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartLineComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-micro-tile-chart-line', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-line [line]=\"chartData\"></be-micro-chart-line>\r\n    </div>\r\n</bt-tile>\r\n", styles: ["be-micro-chart-bar{display:flex;flex-direction:column}\n"] }]
+            args: [{ selector: 'bt-micro-tile-chart-line', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-line [line]=\"chartData\"></be-micro-chart-line>\n    </div>\n</bt-tile>\n", styles: ["be-micro-chart-bar{display:flex;flex-direction:column}\n"] }]
         }] });
 
 class MicroTileChartCircularComponent extends BaseBtTileComponent {
@@ -1546,10 +1576,10 @@ class MicroTileChartCircularComponent extends BaseBtTileComponent {
     }
 }
 MicroTileChartCircularComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartCircularComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MicroTileChartCircularComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartCircularComponent, selector: "bt-micro-tile-chart-circular", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-circular [data]=\"chartData\"></be-micro-chart-circular>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartCircularComponent, selector: "be-micro-chart-circular", inputs: ["data"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MicroTileChartCircularComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartCircularComponent, selector: "bt-micro-tile-chart-circular", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-circular [data]=\"chartData\"></be-micro-chart-circular>\n    </div>\n</bt-tile>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartCircularComponent, selector: "be-micro-chart-circular", inputs: ["data"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartCircularComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-micro-tile-chart-circular', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-circular [data]=\"chartData\"></be-micro-chart-circular>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'bt-micro-tile-chart-circular', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-circular [data]=\"chartData\"></be-micro-chart-circular>\n    </div>\n</bt-tile>\n", styles: [":host{display:block}\n"] }]
         }] });
 
 class MicroTileChartAreaComponent extends BaseBtTileComponent {
@@ -1579,10 +1609,10 @@ class MicroTileChartAreaComponent extends BaseBtTileComponent {
     }
 }
 MicroTileChartAreaComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartAreaComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MicroTileChartAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartAreaComponent, selector: "bt-micro-tile-chart-area", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-area\r\n            [style.flex-direction]=\"double ? 'row' : 'column'\"\r\n            [chartData]=\"chartData\"\r\n            [size]=\"double ? 'l' : 's'\"\r\n        ></be-micro-chart-area>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host{display:block}be-micro-chart-area{display:flex}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartAreaComponent, selector: "be-micro-chart-area", inputs: ["size", "chartData"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MicroTileChartAreaComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartAreaComponent, selector: "bt-micro-tile-chart-area", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-area\n            [style.flex-direction]=\"double ? 'row' : 'column'\"\n            [chartData]=\"chartData\"\n            [size]=\"double ? 'l' : 's'\"\n        ></be-micro-chart-area>\n    </div>\n</bt-tile>\n", styles: [":host{display:block}be-micro-chart-area{display:flex}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartAreaComponent, selector: "be-micro-chart-area", inputs: ["size", "chartData"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartAreaComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-micro-tile-chart-area', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-area\r\n            [style.flex-direction]=\"double ? 'row' : 'column'\"\r\n            [chartData]=\"chartData\"\r\n            [size]=\"double ? 'l' : 's'\"\r\n        ></be-micro-chart-area>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host{display:block}be-micro-chart-area{display:flex}\n"] }]
+            args: [{ selector: 'bt-micro-tile-chart-area', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-area\n            [style.flex-direction]=\"double ? 'row' : 'column'\"\n            [chartData]=\"chartData\"\n            [size]=\"double ? 'l' : 's'\"\n        ></be-micro-chart-area>\n    </div>\n</bt-tile>\n", styles: [":host{display:block}be-micro-chart-area{display:flex}\n"] }]
         }] });
 
 class MicroTileChartBarComponent extends BaseBtTileComponent {
@@ -1601,10 +1631,10 @@ class MicroTileChartBarComponent extends BaseBtTileComponent {
     }
 }
 MicroTileChartBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartBarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MicroTileChartBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartBarComponent, selector: "bt-micro-tile-chart-bar", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-bar [data]=\"chartData\" [size]=\"double ? 'l' : 's'\" [extraData]=\"extraData\"></be-micro-chart-bar>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartBarComponent, selector: "be-micro-chart-bar", inputs: ["data", "size", "extraData"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+MicroTileChartBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: MicroTileChartBarComponent, selector: "bt-micro-tile-chart-bar", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-bar [data]=\"chartData\" [size]=\"double ? 'l' : 's'\" [extraData]=\"extraData\"></be-micro-chart-bar>\n    </div>\n</bt-tile>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: i2$4.MicroChartBarComponent, selector: "be-micro-chart-bar", inputs: ["data", "size", "extraData"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: MicroTileChartBarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-micro-tile-chart-bar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <be-micro-chart-bar [data]=\"chartData\" [size]=\"double ? 'l' : 's'\" [extraData]=\"extraData\"></be-micro-chart-bar>\r\n    </div>\r\n</bt-tile>\r\n", styles: [":host{display:block}\n"] }]
+            args: [{ selector: 'bt-micro-tile-chart-bar', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <be-micro-chart-bar [data]=\"chartData\" [size]=\"double ? 'l' : 's'\" [extraData]=\"extraData\"></be-micro-chart-bar>\n    </div>\n</bt-tile>\n", styles: [":host{display:block}\n"] }]
         }] });
 
 class CreateAppGroupComponent extends BaseComponent {
@@ -1970,10 +2000,10 @@ class NumericTileComponent extends BaseBtTileComponent {
     }
 }
 NumericTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: NumericTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-NumericTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: NumericTileComponent, selector: "bt-numeric-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\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\">{{ kpi }}</div>\r\n            </div>\r\n            <div fd-numeric-content-scale-container style=\"padding-top: 0.2rem\">\r\n                <div fd-numeric-content-scale [state]=\"scaleState\">\r\n                    <span\r\n                        fd-numeric-content-scale-arrow\r\n                        [glyph]=\"scaleArrowIcon\"\r\n                        [class]=\"scaleArrowIcon | sapFontClass\"\r\n                    ></span>\r\n                    <span fd-numeric-content-scale-text>{{ scaleText }}</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$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.NumericContentDirective, selector: "[fd-numeric-content]", inputs: ["class", "size"] }, { kind: "directive", type: i1$1.NumericContentKpiContainerDirective, selector: "[fd-numeric-content-kpi-container]" }, { kind: "directive", type: i1$1.NumericContentKpiDirective, selector: "[fd-numeric-content-kpi]", inputs: ["state", "class", "glyph"] }, { kind: "directive", type: i1$1.NumericContentLaunchIconContainerDirective, selector: "[fd-numeric-content-launch-icon-container]" }, { kind: "directive", type: i1$1.NumericContentLaunchIconDirective, selector: "[fd-numeric-content-launch-icon]", inputs: ["class", "glyph"] }, { kind: "directive", type: i1$1.NumericContentScaleArrowDirective, selector: "[fd-numeric-content-scale-arrow]", inputs: ["class", "glyph"] }, { kind: "directive", type: i1$1.NumericContentScaleContainerDirective, selector: "[fd-numeric-content-scale-container]" }, { kind: "directive", type: i1$1.NumericContentScaleDirective, selector: "[fd-numeric-content-scale]", inputs: ["state", "class"] }, { kind: "directive", type: i1$1.NumericContentScaleTextDirective, selector: "[fd-numeric-content-scale-text]" }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }, { kind: "pipe", type: i6.SapFontClassPipe, name: "sapFontClass" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+NumericTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: NumericTileComponent, selector: "bt-numeric-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <div fd-numeric-content>\n            <div fd-numeric-content-launch-icon-container>\n                <i fd-numeric-content-launch-icon [glyph]=\"launchIcon\" [class]=\"launchIcon | sapFontClass\"></i>\n            </div>\n            <div fd-numeric-content-kpi-container>\n                <div fd-numeric-content-kpi [state]=\"kpiState\">{{ kpi }}</div>\n            </div>\n            <div fd-numeric-content-scale-container style=\"padding-top: 0.2rem\">\n                <div fd-numeric-content-scale [state]=\"scaleState\">\n                    <span\n                        fd-numeric-content-scale-arrow\n                        [glyph]=\"scaleArrowIcon\"\n                        [class]=\"scaleArrowIcon | sapFontClass\"\n                    ></span>\n                    <span fd-numeric-content-scale-text>{{ scaleText }}</span>\n                </div>\n            </div>\n        </div>\n    </div>\n</bt-tile>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.NumericContentDirective, selector: "[fd-numeric-content]", inputs: ["class", "size"] }, { kind: "directive", type: i1$1.NumericContentKpiContainerDirective, selector: "[fd-numeric-content-kpi-container]" }, { kind: "directive", type: i1$1.NumericContentKpiDirective, selector: "[fd-numeric-content-kpi]", inputs: ["state", "class", "glyph"] }, { kind: "directive", type: i1$1.NumericContentLaunchIconContainerDirective, selector: "[fd-numeric-content-launch-icon-container]" }, { kind: "directive", type: i1$1.NumericContentLaunchIconDirective, selector: "[fd-numeric-content-launch-icon]", inputs: ["class", "glyph"] }, { kind: "directive", type: i1$1.NumericContentScaleArrowDirective, selector: "[fd-numeric-content-scale-arrow]", inputs: ["class", "glyph"] }, { kind: "directive", type: i1$1.NumericContentScaleContainerDirective, selector: "[fd-numeric-content-scale-container]" }, { kind: "directive", type: i1$1.NumericContentScaleDirective, selector: "[fd-numeric-content-scale]", inputs: ["state", "class"] }, { kind: "directive", type: i1$1.NumericContentScaleTextDirective, selector: "[fd-numeric-content-scale-text]" }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: i6.SapFontClassPipe, name: "sapFontClass" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: NumericTileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-numeric-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\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\">{{ kpi }}</div>\r\n            </div>\r\n            <div fd-numeric-content-scale-container style=\"padding-top: 0.2rem\">\r\n                <div fd-numeric-content-scale [state]=\"scaleState\">\r\n                    <span\r\n                        fd-numeric-content-scale-arrow\r\n                        [glyph]=\"scaleArrowIcon\"\r\n                        [class]=\"scaleArrowIcon | sapFontClass\"\r\n                    ></span>\r\n                    <span fd-numeric-content-scale-text>{{ scaleText }}</span>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</bt-tile>\r\n" }]
+            args: [{ selector: 'bt-numeric-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <div fd-numeric-content>\n            <div fd-numeric-content-launch-icon-container>\n                <i fd-numeric-content-launch-icon [glyph]=\"launchIcon\" [class]=\"launchIcon | sapFontClass\"></i>\n            </div>\n            <div fd-numeric-content-kpi-container>\n                <div fd-numeric-content-kpi [state]=\"kpiState\">{{ kpi }}</div>\n            </div>\n            <div fd-numeric-content-scale-container style=\"padding-top: 0.2rem\">\n                <div fd-numeric-content-scale [state]=\"scaleState\">\n                    <span\n                        fd-numeric-content-scale-arrow\n                        [glyph]=\"scaleArrowIcon\"\n                        [class]=\"scaleArrowIcon | sapFontClass\"\n                    ></span>\n                    <span fd-numeric-content-scale-text>{{ scaleText }}</span>\n                </div>\n            </div>\n        </div>\n    </div>\n</bt-tile>\n" }]
         }] });
 
 class LogoTileComponent extends BaseBtTileComponent {
@@ -1987,10 +2017,10 @@ class LogoTileComponent extends BaseBtTileComponent {
     }
 }
 LogoTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LogoTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-LogoTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LogoTileComponent, selector: "bt-logo-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <img fd-tile-logo [src]=\"fileId | picFieldSrc: 'GetPictureFromFileInfo':null\" />\r\n    </div>\r\n</bt-tile>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileLogoDirective, selector: "[fdTileLogo], [fd-tile-logo]" }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }, { kind: "pipe", type: i1$2.PictureFieldSourcePipe, name: "picFieldSrc" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+LogoTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: LogoTileComponent, selector: "bt-logo-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <img fd-tile-logo [src]=\"fileId | picFieldSrc: 'GetPictureFromFileInfo':null\" />\n    </div>\n</bt-tile>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileLogoDirective, selector: "[fdTileLogo], [fd-tile-logo]" }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: i1$2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: LogoTileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-logo-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <img fd-tile-logo [src]=\"fileId | picFieldSrc: 'GetPictureFromFileInfo':null\" />\r\n    </div>\r\n</bt-tile>\r\n" }]
+            args: [{ selector: 'bt-logo-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <img fd-tile-logo [src]=\"fileId | picFieldSrc: 'GetPictureFromFileInfo':null\" />\n    </div>\n</bt-tile>\n" }]
         }] });
 
 class FeedTileComponent extends BaseBtTileComponent {
@@ -2011,19 +2041,24 @@ class FeedTileComponent extends BaseBtTileComponent {
     }
 }
 FeedTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FeedTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-FeedTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: FeedTileComponent, selector: "bt-feed-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'feed'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content [twoColumn]=\"twoColumn\">\r\n        <ng-container *ngIf=\"twoColumn; else oneColumn\">\r\n            <div fd-tile-section>\r\n                <div fd-tile-content-text>{{ text | bbbTranslate }}</div>\r\n                <div fd-tile-content-byline>{{ byline }}</div>\r\n            </div>\r\n            <div fd-tile-section>\r\n                <div fd-numeric-content>\r\n                    <div fd-numeric-content-kpi-container>\r\n                        <div fd-numeric-content-kpi [state]=\"state\">{{ kpi }}</div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </ng-container>\r\n        <ng-template #oneColumn>\r\n            <div fd-numeric-content>\r\n                <div fd-numeric-content-kpi-container>\r\n                    <div fd-numeric-content-kpi [state]=\"state\">{{ kpi }}</div>\r\n                </div>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n</bt-tile>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileSectionDirective, selector: "[fdTileSection], [fd-tile-section]" }, { kind: "directive", type: i1$1.TileContentBylineDirective, selector: "[fdTileContentByline], [fd-tile-content-byline]" }, { kind: "directive", type: i1$1.TileContentTextDirective, selector: "[fdTileContentText], [fd-tile-content-text]" }, { kind: "directive", type: i1$1.NumericContentDirective, selector: "[fd-numeric-content]", inputs: ["class", "size"] }, { kind: "directive", type: i1$1.NumericContentKpiContainerDirective, selector: "[fd-numeric-content-kpi-container]" }, { kind: "directive", type: i1$1.NumericContentKpiDirective, selector: "[fd-numeric-content-kpi]", inputs: ["state", "class", "glyph"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+FeedTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: FeedTileComponent, selector: "bt-feed-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'feed'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content [twoColumn]=\"twoColumn\">\n        <ng-container *ngIf=\"twoColumn; else oneColumn\">\n            <div fd-tile-section>\n                <div fd-tile-content-text>{{ text | bbbTranslate }}</div>\n                <div fd-tile-content-byline>{{ byline }}</div>\n            </div>\n            <div fd-tile-section>\n                <div fd-numeric-content>\n                    <div fd-numeric-content-kpi-container>\n                        <div fd-numeric-content-kpi [state]=\"state\">{{ kpi }}</div>\n                    </div>\n                </div>\n            </div>\n        </ng-container>\n        <ng-template #oneColumn>\n            <div fd-numeric-content>\n                <div fd-numeric-content-kpi-container>\n                    <div fd-numeric-content-kpi [state]=\"state\">{{ kpi }}</div>\n                </div>\n            </div>\n        </ng-template>\n    </div>\n</bt-tile>\n", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileSectionDirective, selector: "[fdTileSection], [fd-tile-section]" }, { kind: "directive", type: i1$1.TileContentBylineDirective, selector: "[fdTileContentByline], [fd-tile-content-byline]" }, { kind: "directive", type: i1$1.TileContentTextDirective, selector: "[fdTileContentText], [fd-tile-content-text]" }, { kind: "directive", type: i1$1.NumericContentDirective, selector: "[fd-numeric-content]", inputs: ["class", "size"] }, { kind: "directive", type: i1$1.NumericContentKpiContainerDirective, selector: "[fd-numeric-content-kpi-container]" }, { kind: "directive", type: i1$1.NumericContentKpiDirective, selector: "[fd-numeric-content-kpi]", inputs: ["state", "class", "glyph"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: i1$2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: FeedTileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-feed-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'feed'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content [twoColumn]=\"twoColumn\">\r\n        <ng-container *ngIf=\"twoColumn; else oneColumn\">\r\n            <div fd-tile-section>\r\n                <div fd-tile-content-text>{{ text | bbbTranslate }}</div>\r\n                <div fd-tile-content-byline>{{ byline }}</div>\r\n            </div>\r\n            <div fd-tile-section>\r\n                <div fd-numeric-content>\r\n                    <div fd-numeric-content-kpi-container>\r\n                        <div fd-numeric-content-kpi [state]=\"state\">{{ kpi }}</div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        </ng-container>\r\n        <ng-template #oneColumn>\r\n            <div fd-numeric-content>\r\n                <div fd-numeric-content-kpi-container>\r\n                    <div fd-numeric-content-kpi [state]=\"state\">{{ kpi }}</div>\r\n                </div>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n</bt-tile>\r\n" }]
+            args: [{ selector: 'bt-feed-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'feed'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content [twoColumn]=\"twoColumn\">\n        <ng-container *ngIf=\"twoColumn; else oneColumn\">\n            <div fd-tile-section>\n                <div fd-tile-content-text>{{ text | bbbTranslate }}</div>\n                <div fd-tile-content-byline>{{ byline }}</div>\n            </div>\n            <div fd-tile-section>\n                <div fd-numeric-content>\n                    <div fd-numeric-content-kpi-container>\n                        <div fd-numeric-content-kpi [state]=\"state\">{{ kpi }}</div>\n                    </div>\n                </div>\n            </div>\n        </ng-container>\n        <ng-template #oneColumn>\n            <div fd-numeric-content>\n                <div fd-numeric-content-kpi-container>\n                    <div fd-numeric-content-kpi [state]=\"state\">{{ kpi }}</div>\n                </div>\n            </div>\n        </ng-template>\n    </div>\n</bt-tile>\n" }]
         }] });
 
 class SimpleTileComponent extends BaseBtTileComponent {
+    ngOnInit() {
+        super.ngOnInit();
+        this.icon = this.settings.Icon;
+        this.iconColor = this.settings.IconColor;
+    }
 }
 SimpleTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: SimpleTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-SimpleTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: SimpleTileComponent, selector: "bt-simple-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <fd-icon\r\n            *ngIf=\"settings.Icon\"\r\n            [glyph]=\"settings.Icon\"\r\n            [font]=\"settings.Icon | sapFont\"\r\n            [style.color]=\"settings.IconColor\"\r\n        ></fd-icon>\r\n    </div>\r\n</bt-tile>\r\n", styles: ["::ng-deep .fd-tile--launch .fd-tile__content{align-items:normal!important}fd-icon{font-size:3rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }, { kind: "pipe", type: i6.SapFontPipe, name: "sapFont" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+SimpleTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: SimpleTileComponent, selector: "bt-simple-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n    (click)=\"onTileClick()\"\n>\n    <div fd-tile-content>\n        <fd-icon *ngIf=\"icon\" [glyph]=\"icon\" [font]=\"icon | sapFont\" [style.color]=\"iconColor\"></fd-icon>\n    </div>\n</bt-tile>\n", styles: ["::ng-deep .fd-tile--launch .fd-tile__content{align-items:normal!important}fd-icon{font-size:3rem}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: i6.SapFontPipe, name: "sapFont" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: SimpleTileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-simple-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <fd-icon\r\n            *ngIf=\"settings.Icon\"\r\n            [glyph]=\"settings.Icon\"\r\n            [font]=\"settings.Icon | sapFont\"\r\n            [style.color]=\"settings.IconColor\"\r\n        ></fd-icon>\r\n    </div>\r\n</bt-tile>\r\n", styles: ["::ng-deep .fd-tile--launch .fd-tile__content{align-items:normal!important}fd-icon{font-size:3rem}\n"] }]
+            args: [{ selector: 'bt-simple-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n    (click)=\"onTileClick()\"\n>\n    <div fd-tile-content>\n        <fd-icon *ngIf=\"icon\" [glyph]=\"icon\" [font]=\"icon | sapFont\" [style.color]=\"iconColor\"></fd-icon>\n    </div>\n</bt-tile>\n", styles: ["::ng-deep .fd-tile--launch .fd-tile__content{align-items:normal!important}fd-icon{font-size:3rem}\n"] }]
         }] });
 
 class ProfileTileComponent extends BaseBtTileComponent {
@@ -2037,10 +2072,10 @@ class ProfileTileComponent extends BaseBtTileComponent {
     }
 }
 ProfileTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ProfileTileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ProfileTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ProfileTileComponent, selector: "bt-profile-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <span\r\n            *ngIf=\"fileId; else showIcon\"\r\n            class=\"profile\"\r\n            fd-tile-profile-img\r\n            [backgroundImage]=\"fileId | picFieldSrc: 'GetPictureFromFileInfo':null\"\r\n        ></span>\r\n        <ng-template #showIcon>\r\n            <fd-icon\r\n                *ngIf=\"settings.Icon; else avatar\"\r\n                [font]=\"settings.Icon | sapFont\"\r\n                fd-tile-profile-img\r\n                style=\"font-size: 2rem\"\r\n                [glyph]=\"settings.Icon\"\r\n            ></fd-icon>\r\n        </ng-template>\r\n        <ng-template #avatar>\r\n            <fd-icon font=\"SAP-icons-TNT\" fd-tile-profile-img style=\"font-size: 2rem\" glyph=\"user\"></fd-icon>\r\n        </ng-template>\r\n    </div>\r\n</bt-tile>\r\n", styles: [".profile{background-size:contain;background-repeat:no-repeat}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileProfileImgDirective, selector: "[fdTileProfileImg], [fd-tile-profile-img]", inputs: ["id", "ariaLabel", "ariaLabelledby", "backgroundImage"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }, { kind: "pipe", type: i1$2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i6.SapFontPipe, name: "sapFont" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+ProfileTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ProfileTileComponent, selector: "bt-profile-tile", usesInheritance: true, ngImport: i0, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <span\n            *ngIf=\"fileId; else showIcon\"\n            class=\"profile\"\n            fd-tile-profile-img\n            [backgroundImage]=\"fileId | picFieldSrc: 'GetPictureFromFileInfo':null\"\n        ></span>\n        <ng-template #showIcon>\n            <fd-icon\n                *ngIf=\"settings.Icon; else avatar\"\n                [font]=\"settings.Icon | sapFont\"\n                fd-tile-profile-img\n                style=\"font-size: 2rem\"\n                [glyph]=\"settings.Icon\"\n            ></fd-icon>\n        </ng-template>\n        <ng-template #avatar>\n            <fd-icon font=\"SAP-icons-TNT\" fd-tile-profile-img style=\"font-size: 2rem\" glyph=\"user\"></fd-icon>\n        </ng-template>\n    </div>\n</bt-tile>\n", styles: [".profile{background-size:contain;background-repeat:no-repeat}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "class", "ariaLabel"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileProfileImgDirective, selector: "[fdTileProfileImg], [fd-tile-profile-img]", inputs: ["id", "ariaLabel", "ariaLabelledby", "backgroundImage"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "footer", "disableClick", "title", "subtitle", "isDouble", "edit", "dynamicCommand"] }, { kind: "pipe", type: i1$2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i6.SapFontPipe, name: "sapFont" }, { kind: "pipe", type: TilePropPipe, name: "tileProp" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ProfileTileComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bt-profile-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\r\n    [data]=\"data\"\r\n    [type]=\"'launch'\"\r\n    [editHome]=\"editHome\"\r\n    (hideClick)=\"hideClick.emit()\"\r\n    (renameClick)=\"renameClick.emit()\"\r\n>\r\n    <div fd-tile-content>\r\n        <span\r\n            *ngIf=\"fileId; else showIcon\"\r\n            class=\"profile\"\r\n            fd-tile-profile-img\r\n            [backgroundImage]=\"fileId | picFieldSrc: 'GetPictureFromFileInfo':null\"\r\n        ></span>\r\n        <ng-template #showIcon>\r\n            <fd-icon\r\n                *ngIf=\"settings.Icon; else avatar\"\r\n                [font]=\"settings.Icon | sapFont\"\r\n                fd-tile-profile-img\r\n                style=\"font-size: 2rem\"\r\n                [glyph]=\"settings.Icon\"\r\n            ></fd-icon>\r\n        </ng-template>\r\n        <ng-template #avatar>\r\n            <fd-icon font=\"SAP-icons-TNT\" fd-tile-profile-img style=\"font-size: 2rem\" glyph=\"user\"></fd-icon>\r\n        </ng-template>\r\n    </div>\r\n</bt-tile>\r\n", styles: [".profile{background-size:contain;background-repeat:no-repeat}\n"] }]
+            args: [{ selector: 'bt-profile-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile\n    [data]=\"data\"\n    [type]=\"'launch'\"\n    [edit]=\"edit\"\n    [title]=\"data | tileProp: 'Title':parameters\"\n    [subtitle]=\"data | tileProp: 'Subtitle':parameters\"\n    [dynamicCommand]=\"data | tileProp: 'DynamicCommand':parameters\"\n    [isDouble]=\"data | tileProp: 'IsDouble':parameters\"\n    [footer]=\"data | tileProp: 'Footer':parameters\"\n    (hideClick)=\"hideClick.emit()\"\n    (renameClick)=\"renameClick.emit()\"\n>\n    <div fd-tile-content>\n        <span\n            *ngIf=\"fileId; else showIcon\"\n            class=\"profile\"\n            fd-tile-profile-img\n            [backgroundImage]=\"fileId | picFieldSrc: 'GetPictureFromFileInfo':null\"\n        ></span>\n        <ng-template #showIcon>\n            <fd-icon\n                *ngIf=\"settings.Icon; else avatar\"\n                [font]=\"settings.Icon | sapFont\"\n                fd-tile-profile-img\n                style=\"font-size: 2rem\"\n                [glyph]=\"settings.Icon\"\n            ></fd-icon>\n        </ng-template>\n        <ng-template #avatar>\n            <fd-icon font=\"SAP-icons-TNT\" fd-tile-profile-img style=\"font-size: 2rem\" glyph=\"user\"></fd-icon>\n        </ng-template>\n    </div>\n</bt-tile>\n", styles: [".profile{background-size:contain;background-repeat:no-repeat}\n"] }]
         }] });
 
 class NotificationGroupHeaderComponent extends BaseComponent {
@@ -2489,7 +2524,7 @@ const components = [
     TilesViewerGroupComponent,
     FormTileComponent
 ];
-const pipes = [GroupTilesPipe, TileHomeFilterPipe, HomeGroupPipe, ActionLinksPipe];
+const pipes = [GroupTilesPipe, TileHomeFilterPipe, HomeGroupPipe, ActionLinksPipe, TilePropPipe];
 const directives = [EmptyListDirective, TileRendererDirective];
 class BarsaTilesModule extends BaseModule {
     constructor(dcm, componentFactoryResolver) {
@@ -2529,7 +2564,7 @@ BarsaTilesModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", versio
         AppFinderGroupComponent,
         AppFinderAppListComponent,
         TilesViewerGroupComponent,
-        FormTileComponent, GroupTilesPipe, TileHomeFilterPipe, HomeGroupPipe, ActionLinksPipe, EmptyListDirective, TileRendererDirective, NotificationGroupComponent,
+        FormTileComponent, GroupTilesPipe, TileHomeFilterPipe, HomeGroupPipe, ActionLinksPipe, TilePropPipe, EmptyListDirective, TileRendererDirective, NotificationGroupComponent,
         NotificationGroupHeaderComponent], imports: [CommonModule,
         FormsModule,
         DragDropModule,
@@ -2614,5 +2649,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
  * Generated bundle index. Do not edit.
  */
 
-export { ActionItemComponent, ActionsLinkComponent, AppFinderAppListComponent, AppFinderComponent, AppFinderGroupComponent, BarsaTilesModule, ChangeAppTileComponent, CreateAppGroupComponent, FeedTileComponent, FooterEditTileComponent, FooterTileComponent, FormAppFinderComponent, FormTileComponent, GroupTilesPipe, LogoTileComponent, MicroTileChartAreaComponent, MicroTileChartBarComponent, MicroTileChartBulletComponent, MicroTileChartCircularComponent, MicroTileChartComparisonComponent, MicroTileChartLineComponent, MicroTileChartStackbarComponent, NewsTileComponent, NumericTileComponent, PinTileComponent, ProfileTileComponent, ShellbarComponent, SimpleTileComponent, TileComponent, TileHomeFilterPipe, TilesService, TilesViewerComponent, TilesViewerContainerComponent, TilesViewerGroupComponent, TilesViewerService };
+export { ActionItemComponent, ActionsLinkComponent, AppFinderAppListComponent, AppFinderComponent, AppFinderGroupComponent, BarsaTilesModule, ChangeAppTileComponent, CreateAppGroupComponent, FeedTileComponent, FooterEditTileComponent, FooterTileComponent, FormAppFinderComponent, FormTileComponent, GroupTilesPipe, LogoTileComponent, MicroTileChartAreaComponent, MicroTileChartBarComponent, MicroTileChartBulletComponent, MicroTileChartCircularComponent, MicroTileChartComparisonComponent, MicroTileChartLineComponent, MicroTileChartStackbarComponent, NewsTileComponent, NumericTileComponent, PinTileComponent, ProfileTileComponent, ShellbarComponent, SimpleTileComponent, TileComponent, TileHomeFilterPipe, TilePropPipe, TilesService, TilesViewerComponent, TilesViewerContainerComponent, TilesViewerGroupComponent, TilesViewerService };
 //# sourceMappingURL=barsa-tiles.mjs.map