barsa-tiles 2.2.80 → 2.2.82
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/fesm2022/barsa-tiles.mjs
CHANGED
|
@@ -1186,11 +1186,11 @@ class TilesViewerGroupComponent extends BaseComponent {
|
|
|
1186
1186
|
this.resetGroup.emit(appTileGroup);
|
|
1187
1187
|
}
|
|
1188
1188
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: TilesViewerGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1189
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: TilesViewerGroupComponent, isStandalone: false, selector: "bt-tiles-viewer-group", inputs: { appTileGroup: "appTileGroup", stackContent: "stackContent", edit: "edit", rtl: "rtl", isAppTileSubGroup: "isAppTileSubGroup", deviceSize: "deviceSize", isLast: "isLast" }, outputs: { tilesDropped: "tilesDropped", hideAppTileClick: "hideAppTileClick", renameAppTileClick: "renameAppTileClick", toggleGroup: "toggleGroup", resetGroup: "resetGroup", deleteGroup: "deleteGroup" }, usesInheritance: true, ngImport: i0, template: "<fd-layout-panel\r\n [attr.editHome]=\"edit\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"!edit || !stackContent\"\r\n [ngClass]=\"appTileGroup.TileGroupType$Caption\" \r\n [class.hide-header]=\"appTileGroup.HideHeader\"\r\n [style.background-color]=\"appTileGroup.BackgroundColor ? appTileGroup.BackgroundColor : null\"\r\n [class.custom-color]=\"appTileGroup.BackgroundColor\"\r\n [class.tw-pb-2]=\"isLast\"\r\n>\r\n @if (edit || stackContent || isAppTileSubGroup || appTileGroup.HideHeader) {\r\n <fd-layout-panel-header>\r\n <fd-layout-panel-head>\r\n <h5 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h5>\r\n </fd-layout-panel-head>\r\n @if (edit) {\r\n <fd-layout-panel-actions class=\"group-btns\">\r\n <fd-toolbar [shouldOverflow]=\"false\" [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [label]=\"!appTileGroup.navigatorVisible ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n (click)=\"onToggleShowHide(appTileGroup)\"\r\n ></button>\r\n @if (appTileGroup.Predefined && appTileGroup.$TileSettingChanged) {\r\n <button fd-button [label]=\"'Refresh' | bbbTranslate\" (click)=\"onReset(appTileGroup)\"></button>\r\n } @if (!appTileGroup.Predefined) {\r\n <button\r\n fd-button\r\n [label]=\"'Delete' | bbbTranslate\"\r\n [fdType]=\"'negative'\"\r\n (click)=\"onDelete(appTileGroup)\"\r\n ></button>\r\n }\r\n </fd-toolbar>\r\n </fd-layout-panel-actions>\r\n }\r\n </fd-layout-panel-header>\r\n }\r\n <fd-layout-panel-body [class.small-size]=\"deviceSize === 's' || deviceSize === 'm'\">\r\n <div\r\n class=\"tile-wrapper\"\r\n tilesCls\r\n [class.!tw-hidden]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n [class.!tw-justify-start]=\"appTileGroup.navigatorTiles?.length % 3 !== 0\"\r\n [rtl]=\"rtl\"\r\n [appTileGroup]=\"appTileGroup\"\r\n [deviceSize]=\"deviceSize\"\r\n [ngClass]=\"deviceSize\"\r\n #tiles=\"cdkDropList\"\r\n cdkDropList\r\n cdkDropListOrientation=\"horizontal\"\r\n (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n [cdkDropListConnectedTo]=\"actionLinks\"\r\n [cdkDropListData]=\"{\r\n isTile: true,\r\n items: appTileGroup.navigatorTiles || []\r\n }\"\r\n >\r\n @if (!edit) { @if (!appTileGroup.$TilesLoaded) {\r\n <fd-busy-indicator [loading]=\"true\"></fd-busy-indicator>\r\n } @else if (!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded) {\r\n <h5 fd-title></h5>\r\n } } @for (appTile of appTileGroup?.navigatorTiles; track appTile.Id; let k = $index) {\r\n <div\r\n [class.edit-home]=\"edit\"\r\n [class.isdouble]=\"appTile.Component?.Settings?.TileSetting?.IsDouble\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"!edit || appTileGroup.Locked\"\r\n >\r\n <span\r\n [dynamicCommand]=\"appTile.DynamicCommand\"\r\n [setToStorage]=\"true\"\r\n [enableCommand]=\"!edit && appTile.Component\"\r\n tileRenderer\r\n [deviceSize]=\"deviceSize\"\r\n [data]=\"appTile\"\r\n [groupType]=\"appTileGroup.TileGroupType$Caption\"\r\n [edit]=\"edit\"\r\n [component]=\"appTile.Component\"\r\n (hideClick)=\"onAppTileHideClick(appTile)\"\r\n (renameClick)=\"onAppTileRenameClick(appTile)\"\r\n ></span>\r\n </div>\r\n } @if (edit) {\r\n <fd-tile class=\"add-tile\" [routerLink]=\"['/home/appfinder']\">\r\n <div style=\"margin: 0\">\r\n <fd-icon glyph=\"add\"></fd-icon>\r\n </div>\r\n </fd-tile>\r\n }\r\n </div>\r\n <bt-actions-link\r\n [class.actions-link-edit-home]=\"edit\"\r\n [actionsLink]=\"appTileGroup.navigatorActionLinks\"\r\n [class.!tw-p-0]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n [edit]=\"edit\"\r\n [deviceSize]=\"deviceSize\"\r\n [style.min-height]=\"edit ? '4rem' : 'auto'\"\r\n cdkDropList\r\n #actionLinks=\"cdkDropList\"\r\n cdkDropListOrientation=\"horizontal\"\r\n [cdkDropListConnectedTo]=\"tiles\"\r\n (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n [cdkDropListData]=\"{\r\n isTile: false,\r\n items: appTileGroup.navigatorActionLinks || []\r\n }\"\r\n >\r\n </bt-actions-link>\r\n </fd-layout-panel-body>\r\n</fd-layout-panel>\r\n\r\n@for (appTileSubGroup of appTileGroup.$Children; track appTileSubGroup.Id;let last=$last) {\r\n<bt-tiles-viewer-group\r\n [class]=\"deviceSize\"\r\n [appTileGroup]=\"appTileSubGroup\"\r\n [isLast]=\"last\" \r\n [edit]=\"edit\"\r\n [rtl]=\"rtl\"\r\n [stackContent]=\"stackContent\"\r\n [cssStyle]=\"appTileSubGroup.CssStyles\"\r\n [isAppTileSubGroup]=\"true\"\r\n [deviceSize]=\"deviceSize\"\r\n (tilesDropped)=\"tilesDropped.emit($event)\"\r\n (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\r\n (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\r\n (resetGroup)=\"resetGroup.emit($event)\"\r\n (deleteGroup)=\"deleteGroup.emit($event)\"\r\n (toggleGroup)=\"toggleGroup.emit($event)\"\r\n></bt-tiles-viewer-group>\r\n}\r\n", styles: [":host{display:block}:host[islast=true]{margin-bottom:1rem}fd-layout-panel.custom-color{margin-top:1rem}fd-layout-panel.empty-tiles-group:not([edithome=true]){display:none}fd-layout-panel fd-layout-panel-header fd-layout-panel-head h5{font-weight:500}fd-layout-panel fd-layout-panel-body.small-size{padding:1rem .5rem}fd-layout-panel.hide-header fd-layout-panel-header{display:none}fd-layout-panel[editHome=false]{background-color: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.TilesGroup{column-gap:.5rem;row-gap:1rem;display:inline-flex;flex-wrap:wrap;align-items:center}.actions-link-edit-home{background-color:var(--sapGroup_ContentBackground, #fff);border-color:var(--sapGroup_ContentBorderColor, #d9d9d9);border-width:var(--sapElement_BorderWidth, .0625rem);border-style:solid}.add-tile{background-color:transparent!important}.add-tile ::ng-deep div{background-color:transparent!important;margin:10px 0}.add-tile div:first-child{display:flex;align-items:center;justify-content:center;height:100%;width:100%}.add-tile fd-icon{font-size:1.5rem;color:#3c4043}fd-layout-panel-body.small-size{display:flex}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup{display:flex;row-gap:.5rem;column-gap:.5rem;justify-content:start}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup.m{justify-content:start}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s{max-height:6.25rem;min-height:6.25rem;min-width:8.25rem;max-width:8.25rem;display:flex;flex-direction:column;justify-content:space-between}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__header{height:1.25rem;max-height:1.25rem;min-height:1.25rem;text-align:center}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__subtitle{display:none}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__footer{display:none}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--launch .fd-tile__content{align-items:center;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i7.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i7.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i7.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i7.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i1$3.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i5.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i1.DynamicStyleDirective, selector: "[cssStyle]", inputs: ["cssStyle"] }, { kind: "component", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: ["actionsLink", "edit", "deviceSize"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "edit", "rtl", "isAppTileSubGroup", "deviceSize", "isLast"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "directive", type: TileRendererDirective, selector: "[tileRenderer]", inputs: ["component", "data", "groupType", "edit", "deviceSize", "setToStorage", "listMode", "navigateBackOnClick"], outputs: ["hideClick", "renameClick"] }, { kind: "directive", type: TileClassDirective, selector: "[tilesCls]", inputs: ["rtl", "deviceSize", "appTileGroup"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1189
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: TilesViewerGroupComponent, isStandalone: false, selector: "bt-tiles-viewer-group", inputs: { appTileGroup: "appTileGroup", stackContent: "stackContent", edit: "edit", rtl: "rtl", isAppTileSubGroup: "isAppTileSubGroup", deviceSize: "deviceSize", isLast: "isLast" }, outputs: { tilesDropped: "tilesDropped", hideAppTileClick: "hideAppTileClick", renameAppTileClick: "renameAppTileClick", toggleGroup: "toggleGroup", resetGroup: "resetGroup", deleteGroup: "deleteGroup" }, usesInheritance: true, ngImport: i0, template: "<fd-layout-panel\r\n [attr.editHome]=\"edit\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"!edit || !stackContent\"\r\n [ngClass]=\"appTileGroup.TileGroupType$Caption\" \r\n [class.hide-header]=\"appTileGroup.HideHeader\"\r\n [style.background-color]=\"appTileGroup.BackgroundColor ? appTileGroup.BackgroundColor : null\"\r\n [class.custom-color]=\"appTileGroup.BackgroundColor\"\r\n [class.tw-pb-2]=\"isLast\"\r\n>\r\n @if (edit || stackContent || isAppTileSubGroup || appTileGroup.HideHeader) {\r\n <fd-layout-panel-header>\r\n <fd-layout-panel-head>\r\n <h5 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h5>\r\n </fd-layout-panel-head>\r\n @if (edit) {\r\n <fd-layout-panel-actions class=\"group-btns\">\r\n <fd-toolbar [shouldOverflow]=\"false\" [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [label]=\"!appTileGroup.navigatorVisible ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n (click)=\"onToggleShowHide(appTileGroup)\"\r\n ></button>\r\n @if (appTileGroup.Predefined && appTileGroup.$TileSettingChanged) {\r\n <button fd-button [label]=\"'Refresh' | bbbTranslate\" (click)=\"onReset(appTileGroup)\"></button>\r\n } @if (!appTileGroup.Predefined) {\r\n <button\r\n fd-button\r\n [label]=\"'Delete' | bbbTranslate\"\r\n [fdType]=\"'negative'\"\r\n (click)=\"onDelete(appTileGroup)\"\r\n ></button>\r\n }\r\n </fd-toolbar>\r\n </fd-layout-panel-actions>\r\n }\r\n </fd-layout-panel-header>\r\n }\r\n <fd-layout-panel-body [class.small-size]=\"deviceSize === 's' || deviceSize === 'm'\">\r\n <div\r\n class=\"tile-wrapper\"\r\n tilesCls\r\n [class.!tw-hidden]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n [class.!tw-justify-start]=\"appTileGroup.navigatorTiles?.length % 3 !== 0\"\r\n [rtl]=\"rtl\"\r\n [appTileGroup]=\"appTileGroup\"\r\n [deviceSize]=\"deviceSize\"\r\n [ngClass]=\"deviceSize\"\r\n #tiles=\"cdkDropList\"\r\n cdkDropList\r\n cdkDropListOrientation=\"horizontal\"\r\n (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n [cdkDropListConnectedTo]=\"actionLinks\"\r\n [cdkDropListData]=\"{\r\n isTile: true,\r\n items: appTileGroup.navigatorTiles || []\r\n }\"\r\n >\r\n @if (!edit) { @if (!appTileGroup.$TilesLoaded) {\r\n <fd-busy-indicator [loading]=\"true\"></fd-busy-indicator>\r\n } @else if (!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded) {\r\n <h5 fd-title></h5>\r\n } } @for (appTile of appTileGroup?.navigatorTiles; track appTile.Id; let k = $index) {\r\n <div\r\n [class.edit-home]=\"edit\"\r\n [class.isdouble]=\"appTile.Component?.Settings?.TileSetting?.IsDouble\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"!edit || appTileGroup.Locked\"\r\n >\r\n <span\r\n [dynamicCommand]=\"appTile.DynamicCommand\"\r\n [setToStorage]=\"true\"\r\n [enableCommand]=\"!edit && appTile.Component\"\r\n tileRenderer\r\n [deviceSize]=\"deviceSize\"\r\n [data]=\"appTile\"\r\n [groupType]=\"appTileGroup.TileGroupType$Caption\"\r\n [edit]=\"edit\"\r\n [component]=\"appTile.Component\"\r\n (hideClick)=\"onAppTileHideClick(appTile)\"\r\n (renameClick)=\"onAppTileRenameClick(appTile)\"\r\n ></span>\r\n </div>\r\n } @if (edit) {\r\n <fd-tile class=\"add-tile\" [routerLink]=\"['/home/appfinder']\">\r\n <div style=\"margin: 0\">\r\n <fd-icon glyph=\"add\"></fd-icon>\r\n </div>\r\n </fd-tile>\r\n }\r\n </div>\r\n <bt-actions-link\r\n [class.actions-link-edit-home]=\"edit\"\r\n [actionsLink]=\"appTileGroup.navigatorActionLinks\"\r\n [class.!tw-p-0]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n [edit]=\"edit\"\r\n [deviceSize]=\"deviceSize\"\r\n [style.min-height]=\"edit ? '4rem' : 'auto'\"\r\n cdkDropList\r\n #actionLinks=\"cdkDropList\"\r\n cdkDropListOrientation=\"horizontal\"\r\n [cdkDropListConnectedTo]=\"tiles\"\r\n (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n [cdkDropListData]=\"{\r\n isTile: false,\r\n items: appTileGroup.navigatorActionLinks || []\r\n }\"\r\n >\r\n </bt-actions-link>\r\n </fd-layout-panel-body>\r\n</fd-layout-panel>\r\n\r\n@for (appTileSubGroup of appTileGroup.$Children; track appTileSubGroup.Id;let last=$last) {\r\n<bt-tiles-viewer-group\r\n [class]=\"deviceSize\"\r\n [appTileGroup]=\"appTileSubGroup\"\r\n [isLast]=\"last\" \r\n [edit]=\"edit\"\r\n [rtl]=\"rtl\"\r\n [stackContent]=\"stackContent\"\r\n [cssStyle]=\"appTileSubGroup.CssStyles\"\r\n [isAppTileSubGroup]=\"true\"\r\n [deviceSize]=\"deviceSize\"\r\n (tilesDropped)=\"tilesDropped.emit($event)\"\r\n (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\r\n (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\r\n (resetGroup)=\"resetGroup.emit($event)\"\r\n (deleteGroup)=\"deleteGroup.emit($event)\"\r\n (toggleGroup)=\"toggleGroup.emit($event)\"\r\n></bt-tiles-viewer-group>\r\n}\r\n", styles: [":host{display:block}:host[islast=true]{margin-bottom:1rem}fd-layout-panel.custom-color{margin-top:1rem}fd-layout-panel.empty-tiles-group:not([edithome=true]){display:none}fd-layout-panel fd-layout-panel-header fd-layout-panel-head h5{font-weight:500}fd-layout-panel.hide-header fd-layout-panel-header{display:none}fd-layout-panel[editHome=false]{background-color: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.TilesGroup{column-gap:.5rem;row-gap:1rem;display:inline-flex;flex-wrap:wrap;align-items:center}.actions-link-edit-home{background-color:var(--sapGroup_ContentBackground, #fff);border-color:var(--sapGroup_ContentBorderColor, #d9d9d9);border-width:var(--sapElement_BorderWidth, .0625rem);border-style:solid}.add-tile{background-color:transparent!important}.add-tile ::ng-deep div{background-color:transparent!important;margin:10px 0}.add-tile div:first-child{display:flex;align-items:center;justify-content:center;height:100%;width:100%}.add-tile fd-icon{font-size:1.5rem;color:#3c4043}fd-layout-panel-body.small-size{display:flex}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup{display:flex;row-gap:.5rem;column-gap:.5rem;justify-content:start}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s{max-height:6.25rem;min-height:6.25rem;min-width:8.25rem;max-width:8.25rem;display:flex;flex-direction:column-reverse;justify-content:space-between}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__header{height:1.25rem;max-height:1.25rem;min-height:1.25rem;text-align:center}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__subtitle{display:none}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__footer{display:none}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--launch .fd-tile__content{align-items:center;justify-content:center}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-numeric-content{justify-content:center}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup.s ::ng-deep .fd-tile--s{max-height:6.25rem;min-height:6.25rem;min-width:calc(33.3333333333svw - 1rem);max-width:calc(33.3333333333svw - 1rem)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: i4$2.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i1$2.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i7.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i7.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i7.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i7.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i7.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i1$3.TileComponent, selector: "fd-tile", inputs: ["class", "size", "double", "type", "action", "clickable"], outputs: ["tileClick"] }, { kind: "component", type: i5.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i5.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i1.DynamicStyleDirective, selector: "[cssStyle]", inputs: ["cssStyle"] }, { kind: "component", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: ["actionsLink", "edit", "deviceSize"] }, { kind: "component", type: TilesViewerGroupComponent, selector: "bt-tiles-viewer-group", inputs: ["appTileGroup", "stackContent", "edit", "rtl", "isAppTileSubGroup", "deviceSize", "isLast"], outputs: ["tilesDropped", "hideAppTileClick", "renameAppTileClick", "toggleGroup", "resetGroup", "deleteGroup"] }, { kind: "directive", type: TileRendererDirective, selector: "[tileRenderer]", inputs: ["component", "data", "groupType", "edit", "deviceSize", "setToStorage", "listMode", "navigateBackOnClick"], outputs: ["hideClick", "renameClick"] }, { kind: "directive", type: TileClassDirective, selector: "[tilesCls]", inputs: ["rtl", "deviceSize", "appTileGroup"] }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1190
1190
|
}
|
|
1191
1191
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: TilesViewerGroupComponent, decorators: [{
|
|
1192
1192
|
type: Component,
|
|
1193
|
-
args: [{ selector: 'bt-tiles-viewer-group', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<fd-layout-panel\r\n [attr.editHome]=\"edit\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"!edit || !stackContent\"\r\n [ngClass]=\"appTileGroup.TileGroupType$Caption\" \r\n [class.hide-header]=\"appTileGroup.HideHeader\"\r\n [style.background-color]=\"appTileGroup.BackgroundColor ? appTileGroup.BackgroundColor : null\"\r\n [class.custom-color]=\"appTileGroup.BackgroundColor\"\r\n [class.tw-pb-2]=\"isLast\"\r\n>\r\n @if (edit || stackContent || isAppTileSubGroup || appTileGroup.HideHeader) {\r\n <fd-layout-panel-header>\r\n <fd-layout-panel-head>\r\n <h5 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h5>\r\n </fd-layout-panel-head>\r\n @if (edit) {\r\n <fd-layout-panel-actions class=\"group-btns\">\r\n <fd-toolbar [shouldOverflow]=\"false\" [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [label]=\"!appTileGroup.navigatorVisible ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n (click)=\"onToggleShowHide(appTileGroup)\"\r\n ></button>\r\n @if (appTileGroup.Predefined && appTileGroup.$TileSettingChanged) {\r\n <button fd-button [label]=\"'Refresh' | bbbTranslate\" (click)=\"onReset(appTileGroup)\"></button>\r\n } @if (!appTileGroup.Predefined) {\r\n <button\r\n fd-button\r\n [label]=\"'Delete' | bbbTranslate\"\r\n [fdType]=\"'negative'\"\r\n (click)=\"onDelete(appTileGroup)\"\r\n ></button>\r\n }\r\n </fd-toolbar>\r\n </fd-layout-panel-actions>\r\n }\r\n </fd-layout-panel-header>\r\n }\r\n <fd-layout-panel-body [class.small-size]=\"deviceSize === 's' || deviceSize === 'm'\">\r\n <div\r\n class=\"tile-wrapper\"\r\n tilesCls\r\n [class.!tw-hidden]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n [class.!tw-justify-start]=\"appTileGroup.navigatorTiles?.length % 3 !== 0\"\r\n [rtl]=\"rtl\"\r\n [appTileGroup]=\"appTileGroup\"\r\n [deviceSize]=\"deviceSize\"\r\n [ngClass]=\"deviceSize\"\r\n #tiles=\"cdkDropList\"\r\n cdkDropList\r\n cdkDropListOrientation=\"horizontal\"\r\n (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n [cdkDropListConnectedTo]=\"actionLinks\"\r\n [cdkDropListData]=\"{\r\n isTile: true,\r\n items: appTileGroup.navigatorTiles || []\r\n }\"\r\n >\r\n @if (!edit) { @if (!appTileGroup.$TilesLoaded) {\r\n <fd-busy-indicator [loading]=\"true\"></fd-busy-indicator>\r\n } @else if (!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded) {\r\n <h5 fd-title></h5>\r\n } } @for (appTile of appTileGroup?.navigatorTiles; track appTile.Id; let k = $index) {\r\n <div\r\n [class.edit-home]=\"edit\"\r\n [class.isdouble]=\"appTile.Component?.Settings?.TileSetting?.IsDouble\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"!edit || appTileGroup.Locked\"\r\n >\r\n <span\r\n [dynamicCommand]=\"appTile.DynamicCommand\"\r\n [setToStorage]=\"true\"\r\n [enableCommand]=\"!edit && appTile.Component\"\r\n tileRenderer\r\n [deviceSize]=\"deviceSize\"\r\n [data]=\"appTile\"\r\n [groupType]=\"appTileGroup.TileGroupType$Caption\"\r\n [edit]=\"edit\"\r\n [component]=\"appTile.Component\"\r\n (hideClick)=\"onAppTileHideClick(appTile)\"\r\n (renameClick)=\"onAppTileRenameClick(appTile)\"\r\n ></span>\r\n </div>\r\n } @if (edit) {\r\n <fd-tile class=\"add-tile\" [routerLink]=\"['/home/appfinder']\">\r\n <div style=\"margin: 0\">\r\n <fd-icon glyph=\"add\"></fd-icon>\r\n </div>\r\n </fd-tile>\r\n }\r\n </div>\r\n <bt-actions-link\r\n [class.actions-link-edit-home]=\"edit\"\r\n [actionsLink]=\"appTileGroup.navigatorActionLinks\"\r\n [class.!tw-p-0]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n [edit]=\"edit\"\r\n [deviceSize]=\"deviceSize\"\r\n [style.min-height]=\"edit ? '4rem' : 'auto'\"\r\n cdkDropList\r\n #actionLinks=\"cdkDropList\"\r\n cdkDropListOrientation=\"horizontal\"\r\n [cdkDropListConnectedTo]=\"tiles\"\r\n (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n [cdkDropListData]=\"{\r\n isTile: false,\r\n items: appTileGroup.navigatorActionLinks || []\r\n }\"\r\n >\r\n </bt-actions-link>\r\n </fd-layout-panel-body>\r\n</fd-layout-panel>\r\n\r\n@for (appTileSubGroup of appTileGroup.$Children; track appTileSubGroup.Id;let last=$last) {\r\n<bt-tiles-viewer-group\r\n [class]=\"deviceSize\"\r\n [appTileGroup]=\"appTileSubGroup\"\r\n [isLast]=\"last\" \r\n [edit]=\"edit\"\r\n [rtl]=\"rtl\"\r\n [stackContent]=\"stackContent\"\r\n [cssStyle]=\"appTileSubGroup.CssStyles\"\r\n [isAppTileSubGroup]=\"true\"\r\n [deviceSize]=\"deviceSize\"\r\n (tilesDropped)=\"tilesDropped.emit($event)\"\r\n (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\r\n (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\r\n (resetGroup)=\"resetGroup.emit($event)\"\r\n (deleteGroup)=\"deleteGroup.emit($event)\"\r\n (toggleGroup)=\"toggleGroup.emit($event)\"\r\n></bt-tiles-viewer-group>\r\n}\r\n", styles: [":host{display:block}:host[islast=true]{margin-bottom:1rem}fd-layout-panel.custom-color{margin-top:1rem}fd-layout-panel.empty-tiles-group:not([edithome=true]){display:none}fd-layout-panel fd-layout-panel-header fd-layout-panel-head h5{font-weight:500}fd-layout-panel
|
|
1193
|
+
args: [{ selector: 'bt-tiles-viewer-group', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<fd-layout-panel\r\n [attr.editHome]=\"edit\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"!edit || !stackContent\"\r\n [ngClass]=\"appTileGroup.TileGroupType$Caption\" \r\n [class.hide-header]=\"appTileGroup.HideHeader\"\r\n [style.background-color]=\"appTileGroup.BackgroundColor ? appTileGroup.BackgroundColor : null\"\r\n [class.custom-color]=\"appTileGroup.BackgroundColor\"\r\n [class.tw-pb-2]=\"isLast\"\r\n>\r\n @if (edit || stackContent || isAppTileSubGroup || appTileGroup.HideHeader) {\r\n <fd-layout-panel-header>\r\n <fd-layout-panel-head>\r\n <h5 fd-layout-panel-title>{{ appTileGroup.navigatorTitle }}</h5>\r\n </fd-layout-panel-head>\r\n @if (edit) {\r\n <fd-layout-panel-actions class=\"group-btns\">\r\n <fd-toolbar [shouldOverflow]=\"false\" [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n <button\r\n fd-button\r\n fd-toolbar-item\r\n [label]=\"!appTileGroup.navigatorVisible ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n (click)=\"onToggleShowHide(appTileGroup)\"\r\n ></button>\r\n @if (appTileGroup.Predefined && appTileGroup.$TileSettingChanged) {\r\n <button fd-button [label]=\"'Refresh' | bbbTranslate\" (click)=\"onReset(appTileGroup)\"></button>\r\n } @if (!appTileGroup.Predefined) {\r\n <button\r\n fd-button\r\n [label]=\"'Delete' | bbbTranslate\"\r\n [fdType]=\"'negative'\"\r\n (click)=\"onDelete(appTileGroup)\"\r\n ></button>\r\n }\r\n </fd-toolbar>\r\n </fd-layout-panel-actions>\r\n }\r\n </fd-layout-panel-header>\r\n }\r\n <fd-layout-panel-body [class.small-size]=\"deviceSize === 's' || deviceSize === 'm'\">\r\n <div\r\n class=\"tile-wrapper\"\r\n tilesCls\r\n [class.!tw-hidden]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n [class.!tw-justify-start]=\"appTileGroup.navigatorTiles?.length % 3 !== 0\"\r\n [rtl]=\"rtl\"\r\n [appTileGroup]=\"appTileGroup\"\r\n [deviceSize]=\"deviceSize\"\r\n [ngClass]=\"deviceSize\"\r\n #tiles=\"cdkDropList\"\r\n cdkDropList\r\n cdkDropListOrientation=\"horizontal\"\r\n (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n [cdkDropListConnectedTo]=\"actionLinks\"\r\n [cdkDropListData]=\"{\r\n isTile: true,\r\n items: appTileGroup.navigatorTiles || []\r\n }\"\r\n >\r\n @if (!edit) { @if (!appTileGroup.$TilesLoaded) {\r\n <fd-busy-indicator [loading]=\"true\"></fd-busy-indicator>\r\n } @else if (!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded) {\r\n <h5 fd-title></h5>\r\n } } @for (appTile of appTileGroup?.navigatorTiles; track appTile.Id; let k = $index) {\r\n <div\r\n [class.edit-home]=\"edit\"\r\n [class.isdouble]=\"appTile.Component?.Settings?.TileSetting?.IsDouble\"\r\n cdkDrag\r\n [cdkDragDisabled]=\"!edit || appTileGroup.Locked\"\r\n >\r\n <span\r\n [dynamicCommand]=\"appTile.DynamicCommand\"\r\n [setToStorage]=\"true\"\r\n [enableCommand]=\"!edit && appTile.Component\"\r\n tileRenderer\r\n [deviceSize]=\"deviceSize\"\r\n [data]=\"appTile\"\r\n [groupType]=\"appTileGroup.TileGroupType$Caption\"\r\n [edit]=\"edit\"\r\n [component]=\"appTile.Component\"\r\n (hideClick)=\"onAppTileHideClick(appTile)\"\r\n (renameClick)=\"onAppTileRenameClick(appTile)\"\r\n ></span>\r\n </div>\r\n } @if (edit) {\r\n <fd-tile class=\"add-tile\" [routerLink]=\"['/home/appfinder']\">\r\n <div style=\"margin: 0\">\r\n <fd-icon glyph=\"add\"></fd-icon>\r\n </div>\r\n </fd-tile>\r\n }\r\n </div>\r\n <bt-actions-link\r\n [class.actions-link-edit-home]=\"edit\"\r\n [actionsLink]=\"appTileGroup.navigatorActionLinks\"\r\n [class.!tw-p-0]=\"!appTileGroup.navigatorTiles.length && appTileGroup.$TilesLoaded\"\r\n [edit]=\"edit\"\r\n [deviceSize]=\"deviceSize\"\r\n [style.min-height]=\"edit ? '4rem' : 'auto'\"\r\n cdkDropList\r\n #actionLinks=\"cdkDropList\"\r\n cdkDropListOrientation=\"horizontal\"\r\n [cdkDropListConnectedTo]=\"tiles\"\r\n (cdkDropListDropped)=\"onDrop(appTileGroup, $event)\"\r\n [cdkDropListData]=\"{\r\n isTile: false,\r\n items: appTileGroup.navigatorActionLinks || []\r\n }\"\r\n >\r\n </bt-actions-link>\r\n </fd-layout-panel-body>\r\n</fd-layout-panel>\r\n\r\n@for (appTileSubGroup of appTileGroup.$Children; track appTileSubGroup.Id;let last=$last) {\r\n<bt-tiles-viewer-group\r\n [class]=\"deviceSize\"\r\n [appTileGroup]=\"appTileSubGroup\"\r\n [isLast]=\"last\" \r\n [edit]=\"edit\"\r\n [rtl]=\"rtl\"\r\n [stackContent]=\"stackContent\"\r\n [cssStyle]=\"appTileSubGroup.CssStyles\"\r\n [isAppTileSubGroup]=\"true\"\r\n [deviceSize]=\"deviceSize\"\r\n (tilesDropped)=\"tilesDropped.emit($event)\"\r\n (renameAppTileClick)=\"renameAppTileClick.emit($event)\"\r\n (hideAppTileClick)=\"hideAppTileClick.emit($event)\"\r\n (resetGroup)=\"resetGroup.emit($event)\"\r\n (deleteGroup)=\"deleteGroup.emit($event)\"\r\n (toggleGroup)=\"toggleGroup.emit($event)\"\r\n></bt-tiles-viewer-group>\r\n}\r\n", styles: [":host{display:block}:host[islast=true]{margin-bottom:1rem}fd-layout-panel.custom-color{margin-top:1rem}fd-layout-panel.empty-tiles-group:not([edithome=true]){display:none}fd-layout-panel fd-layout-panel-header fd-layout-panel-head h5{font-weight:500}fd-layout-panel.hide-header fd-layout-panel-header{display:none}fd-layout-panel[editHome=false]{background-color: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.TilesGroup{column-gap:.5rem;row-gap:1rem;display:inline-flex;flex-wrap:wrap;align-items:center}.actions-link-edit-home{background-color:var(--sapGroup_ContentBackground, #fff);border-color:var(--sapGroup_ContentBorderColor, #d9d9d9);border-width:var(--sapElement_BorderWidth, .0625rem);border-style:solid}.add-tile{background-color:transparent!important}.add-tile ::ng-deep div{background-color:transparent!important;margin:10px 0}.add-tile div:first-child{display:flex;align-items:center;justify-content:center;height:100%;width:100%}.add-tile fd-icon{font-size:1.5rem;color:#3c4043}fd-layout-panel-body.small-size{display:flex}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup{display:flex;row-gap:.5rem;column-gap:.5rem;justify-content:start}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s{max-height:6.25rem;min-height:6.25rem;min-width:8.25rem;max-width:8.25rem;display:flex;flex-direction:column-reverse;justify-content:space-between}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__header{height:1.25rem;max-height:1.25rem;min-height:1.25rem;text-align:center}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__subtitle{display:none}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--s .fd-tile__footer{display:none}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-tile--launch .fd-tile__content{align-items:center;justify-content:center}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup ::ng-deep .fd-numeric-content{justify-content:center}fd-layout-panel-body.small-size .tile-wrapper.TilesGroup.s ::ng-deep .fd-tile--s{max-height:6.25rem;min-height:6.25rem;min-width:calc(33.3333333333svw - 1rem);max-width:calc(33.3333333333svw - 1rem)}\n"] }]
|
|
1194
1194
|
}], propDecorators: { appTileGroup: [{
|
|
1195
1195
|
type: Input
|
|
1196
1196
|
}], stackContent: [{
|
|
@@ -2715,11 +2715,11 @@ class BarsaShellbarComponent extends BaseComponent {
|
|
|
2715
2715
|
this.cultureChanged.emit(culture);
|
|
2716
2716
|
}
|
|
2717
2717
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BarsaShellbarComponent, deps: [{ token: i1$1.DialogService }, { token: DOCUMENT }, { token: APP_VERSION }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2718
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: BarsaShellbarComponent, isStandalone: false, selector: "bt-barsa-shellbar", inputs: { cssCustomUrl: "cssCustomUrl", cssUrl: "cssUrl", cssVariableUrl: "cssVariableUrl", multiLanguages: "multiLanguages", userLoggedIn: "userLoggedIn", settings: "settings", productMenuControl: "productMenuControl", deviceSize: "deviceSize", cultures: "cultures", shellbarData: "shellbarData", notificationsUnreadCount: "notificationsUnreadCount", productMenuItems1: "productMenuItems1", bodyClick: "bodyClick", logo: "logo", actions: "actions", userMenu: "userMenu", productSwitcher: "productSwitcher", subtitle: "subtitle", isMobile: "isMobile", hideShellbarActions: "hideShellbarActions", flatButtons: "flatButtons", isTablet: "isTablet", userProfileImageUrl: "userProfileImageUrl", isDesktop: "isDesktop", isServiceDesk: "isServiceDesk", isOpenQuickAccess: "isOpenQuickAccess", sideMenuTemplate: "sideMenuTemplate", notificationReport: "notificationReport" }, outputs: { isOpenQuickAccessChanged: "isOpenQuickAccessChanged", openNotificationPanel: "openNotificationPanel", openQuickAccessPanel: "openQuickAccessPanel", cultureChanged: "cultureChanged", notifiationActionClick: "notifiationActionClick" }, viewQueries: [{ propertyName: "comboboxComponent", first: true, predicate: ComboboxComponent, descendants: true }, { propertyName: "popoverComponent", first: true, predicate: ["popoverComponent"], descendants: true }, { propertyName: "_notificationsDialog", first: true, predicate: ["notificationsDialog"], descendants: true, read: TemplateRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (cssVariableUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssVariableUrl\" />\r\n} @if (cssUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssUrl\" />\r\n} @if (cssCustomUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssCustomUrl\" />\r\n}\r\n<fd-shellbar\r\n [size]=\"deviceSize\"\r\n [ngClass]=\"deviceSize\"\r\n routeFormChange\r\n (stateChanged)=\"onRouteFormStateChange()\"\r\n [handleBodyClick]=\"true\"\r\n>\r\n @if (sideMenuTemplate) {\r\n <fd-shellbar-action\r\n [glyph]=\"'apps'\"\r\n [label]=\"'Quick Access' | bbbTranslate\"\r\n [notificationCount]=\"notificationsUnreadCount\"\r\n [notificationLabel]=\"'Quick Access' | bbbTranslate\"\r\n [callback]=\"onOpenQuickAccess\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (sideMenuTemplate) {\r\n <button\r\n fd-shellbar-side-nav\r\n fd-button\r\n fdType=\"transparent\"\r\n glyph=\"menu2\"\r\n style=\"width: 2.75rem\"\r\n (click)=\"$event.stopPropagation(); isOpenQuickAccessChanged.emit(!isOpenQuickAccess)\"\r\n ></button>\r\n } @if (logo) {\r\n <fd-shellbar-logo>\r\n <a\r\n [style.backgroundImage]=\"'url(' + (logo?.FileId | picFieldSrc: 'GetPictureFromFileInfo':null) + ')'\"\r\n href=\"/\"\r\n class=\"fd-shellbar__logo fd-shellbar__logo--image-replaced\"\r\n aria-label=\"Barsa Novin Ray\"\r\n ></a>\r\n </fd-shellbar-logo>\r\n } @if (!settings?.HideProductMenu && productMenuItems1 && productMenuItems1.length > 0) {\r\n <fd-product-menu [control]=\"productMenuControl\" [closePopoverOnSelect]=\"true\" [items]=\"productMenuItems1\">\r\n </fd-product-menu>\r\n }\r\n <fd-shellbar-subtitle> {{ subtitle | bbbTranslate }}{{ showVersion ? appVersion : '' }}</fd-shellbar-subtitle>\r\n\r\n <fd-shellbar-actions\r\n [class.flat-buttons]=\"flatButtons?.length\"\r\n [user]=\"user()\"\r\n [userMenu]=\"userMenu\"\r\n #shellbarActions\r\n >\r\n @for (action of actions; track action) {\r\n <fd-shellbar-action\r\n [glyph]=\"action.Icon\"\r\n [callback]=\"action.Callback\"\r\n [label]=\"action.Label\"\r\n notificationLabel=\"login\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (deviceSize === 's' && userLoggedIn && !settings?.HideNotifications) {\r\n <fd-shellbar-action\r\n [glyph]=\"'bell'\"\r\n [label]=\"'Notifications' | bbbTranslate\"\r\n [notificationCount]=\"notificationsUnreadCount\"\r\n [notificationLabel]=\"'Notifications' | bbbTranslate\"\r\n [callback]=\"onBellNotification\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (!settings?.HideNotifications && userLoggedIn) {\r\n <fd-popover\r\n [(isOpen)]=\"isOpenNotificatoin\"\r\n [triggers]=\"[]\"\r\n [focusTrapped]=\"true\"\r\n [noArrow]=\"true\"\r\n placement=\"bottom\"\r\n title=\"Notification Popover\"\r\n [focusAutoCapture]=\"true\"\r\n [mobile]=\"deviceSize === 's'\"\r\n #popoverComponent\r\n >\r\n <fd-popover-control>\r\n <fd-shellbar-action\r\n [glyph]=\"'bell'\"\r\n [label]=\"'Notification'\"\r\n [notificationCount]=\"notificationsUnreadCount\"\r\n [notificationLabel]=\"'Notification Label'\"\r\n [callback]=\"onOpenNotification\"\r\n >\r\n </fd-shellbar-action>\r\n </fd-popover-control>\r\n <fd-popover-body style=\"min-width: 320px; overflow-x: auto; box-shadow: var(--sapContent_Shadow0)\">\r\n <ng-container\r\n *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n ></ng-container>\r\n </fd-popover-body>\r\n </fd-popover>\r\n } @if (!settings?.HideLanguage && multiLanguages) {\r\n <fd-shellbar-action [glyph]=\"'world'\" [label]=\"'language'\" [fdMenuTrigger]=\"menu\" (callback)=\"(onLanguage)\">\r\n </fd-shellbar-action>\r\n } @if (productSwitcher?.length) {\r\n <fd-product-switch>\r\n <fd-product-switch-body [products]=\"productSwitcher\" [forceListMode]=\"deviceSize === 's'\">\r\n </fd-product-switch-body>\r\n </fd-product-switch>\r\n } @if(flatButtons?.length){\r\n <div class=\"tw-flex tw-gap-1\">\r\n @for(btn of flatButtons;track btn){\r\n <button\r\n fd-button\r\n [label]=\"btn.text\"\r\n [glyph]=\"btn.text === ('Login' | bbbTranslate) ? 'person-placeholder' : null\"\r\n fdType=\"emphasized\"\r\n (click)=\"btn.callback()\"\r\n ></button>\r\n }\r\n </div>\r\n }\r\n </fd-shellbar-actions>\r\n</fd-shellbar>\r\n\r\n<ng-template #loading>\r\n <bsu-mask></bsu-mask>\r\n</ng-template>\r\n\r\n<div\r\n *ngIf=\"sideMenuTemplate\"\r\n class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\r\n [class.tw-w-screen]=\"isMobile\"\r\n [class.-tw-right-full]=\"isMobile\"\r\n [class.tw-w-96]=\"!isMobile\"\r\n [class.-tw-right-96]=\"!isMobile\"\r\n [class.!tw-right-0]=\"isOpenQuickAccess\"\r\n (click)=\"$event.stopPropagation()\"\r\n>\r\n <ng-container *ngTemplateOutlet=\"sideMenuTemplate\"></ng-container>\r\n</div>\r\n\r\n@if(isOpenQuickAccess) {\r\n<div\r\n class=\"sidemenu-h tw-fixed tw-right-0 tw-bg-slate-800/[.5] tw-z-[90] tw-w-screen tw-backdrop-blur-sm\"\r\n (click)=\"isOpenQuickAccessChanged.emit(false)\"\r\n></div>\r\n}\r\n<fd-menu #menu>\r\n <ul fd-list>\r\n @for (culture of cultures | keyvalue; track culture) {\r\n <li fd-list-item>\r\n <a fd-list-link (click)=\"onCultureChange(culture.value)\">\r\n <span fd-list-title>\r\n <img width=\"14px\" height=\"12px\" [src]=\"'/assets/flags/' + culture.key + '.png'\" />\r\n <span class=\"culture-abbrivation\" [ngClass]=\"culture.key\"> {{ culture.key }}</span>\r\n </span>\r\n </a>\r\n </li>\r\n }\r\n </ul>\r\n</fd-menu>\r\n<ng-template #notificationGroupTpl let-notificationCount=\"notificationCount\">\r\n <bt-notification-group\r\n [notificationReport]=\"notificationReport\"\r\n [notificationCount]=\"notificationCount\"\r\n (actionClick)=\"popoverComponent.close(); onNotificationAction($event)\"\r\n [deviceSize]=\"deviceSize\"\r\n ></bt-notification-group>\r\n</ng-template>\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #notificationsDialog>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-header>\r\n <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Notification' | bbbTranslate }}</h1>\r\n <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\r\n </fd-dialog-header>\r\n <fd-dialog-body class=\"mobile\">\r\n <ng-container\r\n *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n ></ng-container>\r\n </fd-dialog-body>\r\n </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;position:relative}:host.flat-buttons fd-shellbar-actions{flex-direction:row-reverse}:host.hide-user-menu fd-shellbar-actions ::ng-deep .fd-user-menu{display:none}:host ::ng-deep fd-shellbar-actions fd-avatar{background-color:transparent!important;color:var(--sapShell_InteractiveTextColor, #d1e8ff)}:host ::ng-deep fd-combobox .fd-input-group input{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}:host ::ng-deep fd-combobox .fd-input-group span{min-width:2rem;min-height:1.625rem}:host ::ng-deep .fd-shellbar__subtitle{font-size:1rem}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__subtitle{display:block;overflow:hidden;text-wrap:wrap;width:100%;word-break:break-all}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--product{flex:1}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--actions{max-width:120px}.fd-shellbar__logo{min-height:3rem;height:3rem;width:3rem}.extra-button-wrapper{display:flex;height:100%;align-items:center;position:absolute;left:10px;top:0;gap:.285rem}.sidemenu-h{top:var(--fdShellbar_Height);height:calc(100vh - var(--fdShellbar_Height))}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"] }, { kind: "directive", type: i4.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i4.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i4$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i4$1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$1.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i7$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8$1.ProductSwitchComponent, selector: "fd-product-switch", inputs: ["placement", "disabled"] }, { kind: "component", type: i8$1.ProductSwitchBodyComponent, selector: "fd-product-switch-body", inputs: ["dragAndDropEnabled", "products", "forceListMode"], outputs: ["productsChange", "itemClicked"] }, { kind: "component", type: i9$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i9$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i9$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i10.ShellbarComponent, selector: "fd-shellbar", inputs: ["size", "breakpoints", "sideNav", "groupFlex", "showNavigationButton", "showBackButton", "navigationButtonLabel", "backButtonLabel"], outputs: ["navigationButtonClicked", "backButtonClicked"] }, { kind: "component", type: i10.ProductMenuComponent, selector: "fd-product-menu", inputs: ["closeOnEscapeKey", "closeOnOutsideClick", "triggers", "placement", "disabled", "fillControlMode", "control", "items", "closePopoverOnSelect"] }, { kind: "component", type: i10.ShellbarSubtitleComponent, selector: "fd-shellbar-subtitle" }, { kind: "component", type: i10.ShellbarActionsComponent, selector: "fd-shellbar-actions", inputs: ["user", "userMenu", "closePopoverOnSelect", "assistiveTools", "assistiveToolsCallback"], outputs: ["searchOpen"] }, { kind: "component", type: i10.ShellbarActionComponent, selector: "fd-shellbar-action", inputs: ["glyph", "glyphFont", "callback", "label", "notificationLabel", "notificationCount"] }, { kind: "component", type: i10.ShellbarLogoComponent, selector: "fd-shellbar-logo" }, { kind: "directive", type: i10.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "directive", type: i1.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i1.RouteFormChangeDirective, selector: "[routeFormChange]", inputs: ["handleBodyClick"], outputs: ["stateChanged"] }, { kind: "component", type: i2.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: NotificationGroupComponent, selector: "bt-notification-group", inputs: ["notifications", "loading", "deviceSize", "notificationCount", "notificationReport"], outputs: ["viewed", "remove", "actionClick", "showEvent", "loadMore"] }, { kind: "pipe", type: i1$4.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i1.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2718
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: BarsaShellbarComponent, isStandalone: false, selector: "bt-barsa-shellbar", inputs: { cssCustomUrl: "cssCustomUrl", cssUrl: "cssUrl", cssVariableUrl: "cssVariableUrl", multiLanguages: "multiLanguages", userLoggedIn: "userLoggedIn", settings: "settings", productMenuControl: "productMenuControl", deviceSize: "deviceSize", cultures: "cultures", shellbarData: "shellbarData", notificationsUnreadCount: "notificationsUnreadCount", productMenuItems1: "productMenuItems1", bodyClick: "bodyClick", logo: "logo", actions: "actions", userMenu: "userMenu", productSwitcher: "productSwitcher", subtitle: "subtitle", isMobile: "isMobile", hideShellbarActions: "hideShellbarActions", flatButtons: "flatButtons", isTablet: "isTablet", userProfileImageUrl: "userProfileImageUrl", isDesktop: "isDesktop", isServiceDesk: "isServiceDesk", isOpenQuickAccess: "isOpenQuickAccess", sideMenuTemplate: "sideMenuTemplate", notificationReport: "notificationReport" }, outputs: { isOpenQuickAccessChanged: "isOpenQuickAccessChanged", openNotificationPanel: "openNotificationPanel", openQuickAccessPanel: "openQuickAccessPanel", cultureChanged: "cultureChanged", notifiationActionClick: "notifiationActionClick" }, viewQueries: [{ propertyName: "comboboxComponent", first: true, predicate: ComboboxComponent, descendants: true }, { propertyName: "popoverComponent", first: true, predicate: ["popoverComponent"], descendants: true }, { propertyName: "_notificationsDialog", first: true, predicate: ["notificationsDialog"], descendants: true, read: TemplateRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (cssVariableUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssVariableUrl\" />\r\n} @if (cssUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssUrl\" />\r\n} @if (cssCustomUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssCustomUrl\" />\r\n}\r\n<fd-shellbar\r\n [size]=\"deviceSize\"\r\n [ngClass]=\"deviceSize\"\r\n routeFormChange\r\n (stateChanged)=\"onRouteFormStateChange()\"\r\n [handleBodyClick]=\"true\"\r\n>\r\n @if (sideMenuTemplate) {\r\n <fd-shellbar-action\r\n [glyph]=\"'apps'\"\r\n [label]=\"'Quick Access' | bbbTranslate\"\r\n [notificationCount]=\"notificationsUnreadCount\"\r\n [notificationLabel]=\"'Quick Access' | bbbTranslate\"\r\n [callback]=\"onOpenQuickAccess\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (sideMenuTemplate) {\r\n <button\r\n fd-shellbar-side-nav\r\n fd-button\r\n fdType=\"transparent\"\r\n glyph=\"menu2\"\r\n style=\"width: 2.75rem\"\r\n (click)=\"$event.stopPropagation(); isOpenQuickAccessChanged.emit(!isOpenQuickAccess)\"\r\n ></button>\r\n } @if (logo) {\r\n <fd-shellbar-logo>\r\n <a\r\n [style.backgroundImage]=\"'url(' + (logo?.FileId | picFieldSrc: 'GetPictureFromFileInfo':null) + ')'\"\r\n href=\"/\"\r\n class=\"fd-shellbar__logo fd-shellbar__logo--image-replaced\"\r\n aria-label=\"Barsa Novin Ray\"\r\n ></a>\r\n </fd-shellbar-logo>\r\n } @if (!settings?.HideProductMenu && productMenuItems1 && productMenuItems1.length > 0) {\r\n <fd-product-menu [control]=\"productMenuControl\" [closePopoverOnSelect]=\"true\" [items]=\"productMenuItems1\">\r\n </fd-product-menu>\r\n }\r\n <fd-shellbar-subtitle> {{ subtitle | bbbTranslate }}{{ showVersion ? appVersion : '' }}</fd-shellbar-subtitle>\r\n\r\n <fd-shellbar-actions\r\n [class.flat-buttons]=\"flatButtons?.length\"\r\n [user]=\"user()\"\r\n [userMenu]=\"userMenu\"\r\n #shellbarActions\r\n >\r\n @for (action of actions; track action) {\r\n <fd-shellbar-action\r\n [glyph]=\"action.Icon\"\r\n [callback]=\"action.Callback\"\r\n [label]=\"action.Label\"\r\n notificationLabel=\"login\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (!settings?.HideNotifications && userLoggedIn) {\r\n <fd-popover\r\n [(isOpen)]=\"isOpenNotificatoin\"\r\n [triggers]=\"[]\"\r\n [focusTrapped]=\"true\"\r\n [noArrow]=\"true\"\r\n placement=\"bottom\"\r\n title=\"Notification Popover\"\r\n [focusAutoCapture]=\"true\"\r\n [mobile]=\"deviceSize === 's'\"\r\n #popoverComponent\r\n >\r\n <fd-popover-control>\r\n <fd-shellbar-action\r\n [glyph]=\"'bell'\"\r\n [label]=\"'Notification'\"\r\n [notificationCount]=\"notificationsUnreadCount\"\r\n [notificationLabel]=\"'Notification Label'\"\r\n [callback]=\"onOpenNotification\"\r\n >\r\n </fd-shellbar-action>\r\n </fd-popover-control>\r\n <fd-popover-body style=\"min-width: 320px; overflow-x: auto; box-shadow: var(--sapContent_Shadow0)\">\r\n <ng-container\r\n *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n ></ng-container>\r\n </fd-popover-body>\r\n </fd-popover>\r\n } @if (!settings?.HideLanguage && multiLanguages) {\r\n <fd-shellbar-action [glyph]=\"'world'\" [label]=\"'language'\" [fdMenuTrigger]=\"menu\" (callback)=\"(onLanguage)\">\r\n </fd-shellbar-action>\r\n } @if (productSwitcher?.length) {\r\n <fd-product-switch>\r\n <fd-product-switch-body [products]=\"productSwitcher\" [forceListMode]=\"deviceSize === 's'\">\r\n </fd-product-switch-body>\r\n </fd-product-switch>\r\n } @if(flatButtons?.length){\r\n <div class=\"tw-flex tw-gap-1\">\r\n @for(btn of flatButtons;track btn){\r\n <button\r\n fd-button\r\n [label]=\"btn.text\"\r\n [glyph]=\"btn.text === ('Login' | bbbTranslate) ? 'person-placeholder' : null\"\r\n fdType=\"emphasized\"\r\n (click)=\"btn.callback()\"\r\n ></button>\r\n }\r\n </div>\r\n }\r\n </fd-shellbar-actions>\r\n</fd-shellbar>\r\n\r\n<ng-template #loading>\r\n <bsu-mask></bsu-mask>\r\n</ng-template>\r\n\r\n<div\r\n *ngIf=\"sideMenuTemplate\"\r\n class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\r\n [class.tw-w-screen]=\"isMobile\"\r\n [class.-tw-right-full]=\"isMobile\"\r\n [class.tw-w-96]=\"!isMobile\"\r\n [class.-tw-right-96]=\"!isMobile\"\r\n [class.!tw-right-0]=\"isOpenQuickAccess\"\r\n (click)=\"$event.stopPropagation()\"\r\n>\r\n <ng-container *ngTemplateOutlet=\"sideMenuTemplate\"></ng-container>\r\n</div>\r\n\r\n@if(isOpenQuickAccess) {\r\n<div\r\n class=\"sidemenu-h tw-fixed tw-right-0 tw-bg-slate-800/[.5] tw-z-[90] tw-w-screen tw-backdrop-blur-sm\"\r\n (click)=\"isOpenQuickAccessChanged.emit(false)\"\r\n></div>\r\n}\r\n<fd-menu #menu>\r\n <ul fd-list>\r\n @for (culture of cultures | keyvalue; track culture) {\r\n <li fd-list-item>\r\n <a fd-list-link (click)=\"onCultureChange(culture.value)\">\r\n <span fd-list-title>\r\n <img width=\"14px\" height=\"12px\" [src]=\"'/assets/flags/' + culture.key + '.png'\" />\r\n <span class=\"culture-abbrivation\" [ngClass]=\"culture.key\"> {{ culture.key }}</span>\r\n </span>\r\n </a>\r\n </li>\r\n }\r\n </ul>\r\n</fd-menu>\r\n<ng-template #notificationGroupTpl let-notificationCount=\"notificationCount\">\r\n <bt-notification-group\r\n [notificationReport]=\"notificationReport\"\r\n [notificationCount]=\"notificationCount\"\r\n (actionClick)=\"popoverComponent.close(); onNotificationAction($event)\"\r\n [deviceSize]=\"deviceSize\"\r\n ></bt-notification-group>\r\n</ng-template>\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #notificationsDialog>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-header>\r\n <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Notification' | bbbTranslate }}</h1>\r\n <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\r\n </fd-dialog-header>\r\n <fd-dialog-body class=\"mobile\">\r\n <ng-container\r\n *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n ></ng-container>\r\n </fd-dialog-body>\r\n </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;position:relative}:host.flat-buttons fd-shellbar-actions{flex-direction:row-reverse}:host.hide-user-menu fd-shellbar-actions ::ng-deep .fd-user-menu{display:none}:host ::ng-deep fd-shellbar-actions fd-avatar{background-color:transparent!important;color:var(--sapShell_InteractiveTextColor, #d1e8ff)}:host ::ng-deep fd-combobox .fd-input-group input{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}:host ::ng-deep fd-combobox .fd-input-group span{min-width:2rem;min-height:1.625rem}:host ::ng-deep .fd-shellbar__subtitle{font-size:1rem}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__subtitle{display:block;overflow:hidden;text-wrap:wrap;width:100%;word-break:break-all}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--product{flex:1}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--actions{max-width:120px}.fd-shellbar__logo{min-height:3rem;height:3rem;width:3rem}.extra-button-wrapper{display:flex;height:100%;align-items:center;position:absolute;left:10px;top:0;gap:.285rem}.sidemenu-h{top:var(--fdShellbar_Height);height:calc(100vh - var(--fdShellbar_Height))}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i4.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"] }, { kind: "directive", type: i4.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { kind: "directive", type: i4.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i4$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i4$1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$1.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i7$1.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i7$1.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i7$1.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i8.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8$1.ProductSwitchComponent, selector: "fd-product-switch", inputs: ["placement", "disabled"] }, { kind: "component", type: i8$1.ProductSwitchBodyComponent, selector: "fd-product-switch-body", inputs: ["dragAndDropEnabled", "products", "forceListMode"], outputs: ["productsChange", "itemClicked"] }, { kind: "component", type: i9$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i9$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i9$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i10.ShellbarComponent, selector: "fd-shellbar", inputs: ["size", "breakpoints", "sideNav", "groupFlex", "showNavigationButton", "showBackButton", "navigationButtonLabel", "backButtonLabel"], outputs: ["navigationButtonClicked", "backButtonClicked"] }, { kind: "component", type: i10.ProductMenuComponent, selector: "fd-product-menu", inputs: ["closeOnEscapeKey", "closeOnOutsideClick", "triggers", "placement", "disabled", "fillControlMode", "control", "items", "closePopoverOnSelect"] }, { kind: "component", type: i10.ShellbarSubtitleComponent, selector: "fd-shellbar-subtitle" }, { kind: "component", type: i10.ShellbarActionsComponent, selector: "fd-shellbar-actions", inputs: ["user", "userMenu", "closePopoverOnSelect", "assistiveTools", "assistiveToolsCallback"], outputs: ["searchOpen"] }, { kind: "component", type: i10.ShellbarActionComponent, selector: "fd-shellbar-action", inputs: ["glyph", "glyphFont", "callback", "label", "notificationLabel", "notificationCount"] }, { kind: "component", type: i10.ShellbarLogoComponent, selector: "fd-shellbar-logo" }, { kind: "directive", type: i10.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "directive", type: i1.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i1.RouteFormChangeDirective, selector: "[routeFormChange]", inputs: ["handleBodyClick"], outputs: ["stateChanged"] }, { kind: "component", type: i2.MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: NotificationGroupComponent, selector: "bt-notification-group", inputs: ["notifications", "loading", "deviceSize", "notificationCount", "notificationReport"], outputs: ["viewed", "remove", "actionClick", "showEvent", "loadMore"] }, { kind: "pipe", type: i1$4.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i1.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i1.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
2719
2719
|
}
|
|
2720
2720
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: BarsaShellbarComponent, decorators: [{
|
|
2721
2721
|
type: Component,
|
|
2722
|
-
args: [{ selector: 'bt-barsa-shellbar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (cssVariableUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssVariableUrl\" />\r\n} @if (cssUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssUrl\" />\r\n} @if (cssCustomUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssCustomUrl\" />\r\n}\r\n<fd-shellbar\r\n [size]=\"deviceSize\"\r\n [ngClass]=\"deviceSize\"\r\n routeFormChange\r\n (stateChanged)=\"onRouteFormStateChange()\"\r\n [handleBodyClick]=\"true\"\r\n>\r\n @if (sideMenuTemplate) {\r\n <fd-shellbar-action\r\n [glyph]=\"'apps'\"\r\n [label]=\"'Quick Access' | bbbTranslate\"\r\n [notificationCount]=\"notificationsUnreadCount\"\r\n [notificationLabel]=\"'Quick Access' | bbbTranslate\"\r\n [callback]=\"onOpenQuickAccess\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (sideMenuTemplate) {\r\n <button\r\n fd-shellbar-side-nav\r\n fd-button\r\n fdType=\"transparent\"\r\n glyph=\"menu2\"\r\n style=\"width: 2.75rem\"\r\n (click)=\"$event.stopPropagation(); isOpenQuickAccessChanged.emit(!isOpenQuickAccess)\"\r\n ></button>\r\n } @if (logo) {\r\n <fd-shellbar-logo>\r\n <a\r\n [style.backgroundImage]=\"'url(' + (logo?.FileId | picFieldSrc: 'GetPictureFromFileInfo':null) + ')'\"\r\n href=\"/\"\r\n class=\"fd-shellbar__logo fd-shellbar__logo--image-replaced\"\r\n aria-label=\"Barsa Novin Ray\"\r\n ></a>\r\n </fd-shellbar-logo>\r\n } @if (!settings?.HideProductMenu && productMenuItems1 && productMenuItems1.length > 0) {\r\n <fd-product-menu [control]=\"productMenuControl\" [closePopoverOnSelect]=\"true\" [items]=\"productMenuItems1\">\r\n </fd-product-menu>\r\n }\r\n <fd-shellbar-subtitle> {{ subtitle | bbbTranslate }}{{ showVersion ? appVersion : '' }}</fd-shellbar-subtitle>\r\n\r\n <fd-shellbar-actions\r\n [class.flat-buttons]=\"flatButtons?.length\"\r\n [user]=\"user()\"\r\n [userMenu]=\"userMenu\"\r\n #shellbarActions\r\n >\r\n @for (action of actions; track action) {\r\n <fd-shellbar-action\r\n [glyph]=\"action.Icon\"\r\n [callback]=\"action.Callback\"\r\n [label]=\"action.Label\"\r\n notificationLabel=\"login\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (
|
|
2722
|
+
args: [{ selector: 'bt-barsa-shellbar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (cssVariableUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssVariableUrl\" />\r\n} @if (cssUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssUrl\" />\r\n} @if (cssCustomUrl) {\r\n<link type=\"text/css\" rel=\"stylesheet\" [href]=\"cssCustomUrl\" />\r\n}\r\n<fd-shellbar\r\n [size]=\"deviceSize\"\r\n [ngClass]=\"deviceSize\"\r\n routeFormChange\r\n (stateChanged)=\"onRouteFormStateChange()\"\r\n [handleBodyClick]=\"true\"\r\n>\r\n @if (sideMenuTemplate) {\r\n <fd-shellbar-action\r\n [glyph]=\"'apps'\"\r\n [label]=\"'Quick Access' | bbbTranslate\"\r\n [notificationCount]=\"notificationsUnreadCount\"\r\n [notificationLabel]=\"'Quick Access' | bbbTranslate\"\r\n [callback]=\"onOpenQuickAccess\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (sideMenuTemplate) {\r\n <button\r\n fd-shellbar-side-nav\r\n fd-button\r\n fdType=\"transparent\"\r\n glyph=\"menu2\"\r\n style=\"width: 2.75rem\"\r\n (click)=\"$event.stopPropagation(); isOpenQuickAccessChanged.emit(!isOpenQuickAccess)\"\r\n ></button>\r\n } @if (logo) {\r\n <fd-shellbar-logo>\r\n <a\r\n [style.backgroundImage]=\"'url(' + (logo?.FileId | picFieldSrc: 'GetPictureFromFileInfo':null) + ')'\"\r\n href=\"/\"\r\n class=\"fd-shellbar__logo fd-shellbar__logo--image-replaced\"\r\n aria-label=\"Barsa Novin Ray\"\r\n ></a>\r\n </fd-shellbar-logo>\r\n } @if (!settings?.HideProductMenu && productMenuItems1 && productMenuItems1.length > 0) {\r\n <fd-product-menu [control]=\"productMenuControl\" [closePopoverOnSelect]=\"true\" [items]=\"productMenuItems1\">\r\n </fd-product-menu>\r\n }\r\n <fd-shellbar-subtitle> {{ subtitle | bbbTranslate }}{{ showVersion ? appVersion : '' }}</fd-shellbar-subtitle>\r\n\r\n <fd-shellbar-actions\r\n [class.flat-buttons]=\"flatButtons?.length\"\r\n [user]=\"user()\"\r\n [userMenu]=\"userMenu\"\r\n #shellbarActions\r\n >\r\n @for (action of actions; track action) {\r\n <fd-shellbar-action\r\n [glyph]=\"action.Icon\"\r\n [callback]=\"action.Callback\"\r\n [label]=\"action.Label\"\r\n notificationLabel=\"login\"\r\n >\r\n </fd-shellbar-action>\r\n } @if (!settings?.HideNotifications && userLoggedIn) {\r\n <fd-popover\r\n [(isOpen)]=\"isOpenNotificatoin\"\r\n [triggers]=\"[]\"\r\n [focusTrapped]=\"true\"\r\n [noArrow]=\"true\"\r\n placement=\"bottom\"\r\n title=\"Notification Popover\"\r\n [focusAutoCapture]=\"true\"\r\n [mobile]=\"deviceSize === 's'\"\r\n #popoverComponent\r\n >\r\n <fd-popover-control>\r\n <fd-shellbar-action\r\n [glyph]=\"'bell'\"\r\n [label]=\"'Notification'\"\r\n [notificationCount]=\"notificationsUnreadCount\"\r\n [notificationLabel]=\"'Notification Label'\"\r\n [callback]=\"onOpenNotification\"\r\n >\r\n </fd-shellbar-action>\r\n </fd-popover-control>\r\n <fd-popover-body style=\"min-width: 320px; overflow-x: auto; box-shadow: var(--sapContent_Shadow0)\">\r\n <ng-container\r\n *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n ></ng-container>\r\n </fd-popover-body>\r\n </fd-popover>\r\n } @if (!settings?.HideLanguage && multiLanguages) {\r\n <fd-shellbar-action [glyph]=\"'world'\" [label]=\"'language'\" [fdMenuTrigger]=\"menu\" (callback)=\"(onLanguage)\">\r\n </fd-shellbar-action>\r\n } @if (productSwitcher?.length) {\r\n <fd-product-switch>\r\n <fd-product-switch-body [products]=\"productSwitcher\" [forceListMode]=\"deviceSize === 's'\">\r\n </fd-product-switch-body>\r\n </fd-product-switch>\r\n } @if(flatButtons?.length){\r\n <div class=\"tw-flex tw-gap-1\">\r\n @for(btn of flatButtons;track btn){\r\n <button\r\n fd-button\r\n [label]=\"btn.text\"\r\n [glyph]=\"btn.text === ('Login' | bbbTranslate) ? 'person-placeholder' : null\"\r\n fdType=\"emphasized\"\r\n (click)=\"btn.callback()\"\r\n ></button>\r\n }\r\n </div>\r\n }\r\n </fd-shellbar-actions>\r\n</fd-shellbar>\r\n\r\n<ng-template #loading>\r\n <bsu-mask></bsu-mask>\r\n</ng-template>\r\n\r\n<div\r\n *ngIf=\"sideMenuTemplate\"\r\n class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[100] tw-shadow-2xl tw-overflow-auto\"\r\n [class.tw-w-screen]=\"isMobile\"\r\n [class.-tw-right-full]=\"isMobile\"\r\n [class.tw-w-96]=\"!isMobile\"\r\n [class.-tw-right-96]=\"!isMobile\"\r\n [class.!tw-right-0]=\"isOpenQuickAccess\"\r\n (click)=\"$event.stopPropagation()\"\r\n>\r\n <ng-container *ngTemplateOutlet=\"sideMenuTemplate\"></ng-container>\r\n</div>\r\n\r\n@if(isOpenQuickAccess) {\r\n<div\r\n class=\"sidemenu-h tw-fixed tw-right-0 tw-bg-slate-800/[.5] tw-z-[90] tw-w-screen tw-backdrop-blur-sm\"\r\n (click)=\"isOpenQuickAccessChanged.emit(false)\"\r\n></div>\r\n}\r\n<fd-menu #menu>\r\n <ul fd-list>\r\n @for (culture of cultures | keyvalue; track culture) {\r\n <li fd-list-item>\r\n <a fd-list-link (click)=\"onCultureChange(culture.value)\">\r\n <span fd-list-title>\r\n <img width=\"14px\" height=\"12px\" [src]=\"'/assets/flags/' + culture.key + '.png'\" />\r\n <span class=\"culture-abbrivation\" [ngClass]=\"culture.key\"> {{ culture.key }}</span>\r\n </span>\r\n </a>\r\n </li>\r\n }\r\n </ul>\r\n</fd-menu>\r\n<ng-template #notificationGroupTpl let-notificationCount=\"notificationCount\">\r\n <bt-notification-group\r\n [notificationReport]=\"notificationReport\"\r\n [notificationCount]=\"notificationCount\"\r\n (actionClick)=\"popoverComponent.close(); onNotificationAction($event)\"\r\n [deviceSize]=\"deviceSize\"\r\n ></bt-notification-group>\r\n</ng-template>\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #notificationsDialog>\r\n <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n <fd-dialog-header>\r\n <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Notification' | bbbTranslate }}</h1>\r\n <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\r\n </fd-dialog-header>\r\n <fd-dialog-body class=\"mobile\">\r\n <ng-container\r\n *ngTemplateOutlet=\"notificationGroupTpl; context: { notificationCount: notificationsUnreadCount }\"\r\n ></ng-container>\r\n </fd-dialog-body>\r\n </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;position:relative}:host.flat-buttons fd-shellbar-actions{flex-direction:row-reverse}:host.hide-user-menu fd-shellbar-actions ::ng-deep .fd-user-menu{display:none}:host ::ng-deep fd-shellbar-actions fd-avatar{background-color:transparent!important;color:var(--sapShell_InteractiveTextColor, #d1e8ff)}:host ::ng-deep fd-combobox .fd-input-group input{min-width:2rem;height:1.625rem;margin-top:.1875rem;margin-bottom:.1875rem;padding:0 .5rem;box-sizing:border-box}:host ::ng-deep fd-combobox .fd-input-group span{min-width:2rem;min-height:1.625rem}:host ::ng-deep .fd-shellbar__subtitle{font-size:1rem}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__subtitle{display:block;overflow:hidden;text-wrap:wrap;width:100%;word-break:break-all}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--product{flex:1}:host ::ng-deep .fd-shellbar--s ::ng-deep .fd-shellbar__group.fd-shellbar__group--actions{max-width:120px}.fd-shellbar__logo{min-height:3rem;height:3rem;width:3rem}.extra-button-wrapper{display:flex;height:100%;align-items:center;position:absolute;left:10px;top:0;gap:.285rem}.sidemenu-h{top:var(--fdShellbar_Height);height:calc(100vh - var(--fdShellbar_Height))}\n"] }]
|
|
2723
2723
|
}], ctorParameters: () => [{ type: i1$1.DialogService }, { type: Document, decorators: [{
|
|
2724
2724
|
type: Inject,
|
|
2725
2725
|
args: [DOCUMENT]
|