barsa-sap-ui 2.3.108 → 2.3.110

package/fesm2022/barsa-sap-ui.mjs

@@ -5,7 +5,7 @@ import { BaseComponent, ReportViewBaseComponent, getUniqueId, BarsaApi, LayoutIt
 import moment from 'moment';
 import jmoment from 'moment-jalaali';
 import { combineLatest, of, BehaviorSubject, Subject, takeUntil as takeUntil$1, debounceTime as debounceTime$1, concatMap, tap as tap$1, Observable, fromEvent, first as first$1, skip, map as map$1, from } from 'rxjs';
-import { tap, filter, map, distinctUntilChanged, debounceTime, withLatestFrom, takeUntil, exhaustMap, finalize, first, switchMap, delay, concatMap as concatMap$1, catchError } from 'rxjs/operators';
+import { tap, filter, map, distinctUntilChanged, debounceTime, takeUntil, throttleTime, withLatestFrom, exhaustMap, finalize, first, switchMap, delay, concatMap as concatMap$1, catchError } from 'rxjs/operators';
 import { Overlay } from '@angular/cdk/overlay';
 import * as i238 from '@fundamental-ngx/core';
 import { DialogRef, ContentDensityService, DialogService, TableComponent, ToolbarComponent, GlobalContentDensityService, PopoverComponent, RadioButtonComponent, DynamicPageComponent, FileUploaderComponent, MultiInputComponent, MessageStripAlertService, TabPanelComponent, WizardComponent, WizardStepComponent, ComboboxComponent, InlineHelpDirective, SliderComponent, ContentDensityMode, ThemingService as ThemingService$1, RtlService, NotificationService as NotificationService$1, NotificationRef as NotificationRef$1, MessageToastService, FundamentalNgxCoreModule, SideNavigationModule, FacetModule, WizardModule, RatingStarLabelPipe, ListGroupPipe, DateTimeFormatPipe, DateFromNowPipe, DateFormatPipe, AvatarIconPipe, ContentDensityModule } from '@fundamental-ngx/core';
@@ -32,18 +32,18 @@ import * as i2$3 from '@fundamental-ngx/core/select';
 import * as i5$1 from '@fundamental-ngx/core/busy-indicator';
 import * as i5$2 from '@fundamental-ngx/core/menu';
 import * as i7$1 from '@fundamental-ngx/core/split-button';
-import * as i8 from '@fundamental-ngx/core/toolbar';
+import * as i7$2 from '@fundamental-ngx/core/toolbar';
 import * as i2$4 from 'barsa-calendar';
 import { CalendarService, BarsaCalendarModule } from 'barsa-calendar';
 import * as i2$5 from '@fundamental-ngx/core/layout-panel';
 import * as i3$4 from '@fundamental-ngx/core/table';
-import * as i7$2 from '@fundamental-ngx/core/popover';
+import * as i7$3 from '@fundamental-ngx/core/popover';
 import * as i4$3 from '@fundamental-ngx/core/content-density';
 import * as i1$3 from '@fundamental-ngx/core/illustrated-message';
 import * as i3$6 from '@fundamental-ngx/core/avatar';
 import * as i5$3 from '@fundamental-ngx/core/text';
 import * as i10 from '@fundamental-ngx/core/layout-grid';
-import * as i7$3 from '@fundamental-ngx/core/card';
+import * as i7$4 from '@fundamental-ngx/core/card';
 import * as i3$5 from 'ng2-pdfjs-viewer';
 import { PdfJsViewerModule } from 'ng2-pdfjs-viewer';
 import * as i2$6 from '@fundamental-ngx/core/link';
@@ -60,7 +60,7 @@ import * as i3$7 from '@fundamental-ngx/core/radio';
 import * as i3$8 from '@angular/router';
 import { Router, NavigationEnd, ActivatedRoute, RouterModule } from '@angular/router';
 import * as i4$5 from '@fundamental-ngx/core/breadcrumb';
-import * as i8$1 from '@fundamental-ngx/core/dynamic-page';
+import * as i8 from '@fundamental-ngx/core/dynamic-page';
 import * as i9 from '@fundamental-ngx/core/dynamic-side-content';
 import { ThemingService } from '@fundamental-ngx/core/theming';
 import * as i4$6 from 'ngx-color/swatches';
@@ -73,11 +73,11 @@ import * as i5$5 from '@fundamental-ngx/core/file-uploader';
 import * as i5$6 from '@fundamental-ngx/core/object-number';
 import * as i11 from '@fundamental-ngx/core/slider';
 import * as i12$1 from '@fundamental-ngx/core/progress-indicator';
-import * as i8$2 from '@fundamental-ngx/core/facets';
+import * as i8$1 from '@fundamental-ngx/core/facets';
 import * as i14 from '@fundamental-ngx/core/rating-indicator';
 import * as i18 from '@fundamental-ngx/platform';
 import { IconTabBarComponent, PlatformIconTabBarModule } from '@fundamental-ngx/platform';
-import * as i8$3 from '@fundamental-ngx/core/multi-input';
+import * as i8$2 from '@fundamental-ngx/core/multi-input';
 import * as i4$7 from '@fundamental-ngx/core/combobox';
 import * as i3$9 from '@fundamental-ngx/core/wizard';
 import * as i4$8 from '@fundamental-ngx/core/segmented-button';
@@ -87,13 +87,13 @@ import * as i1$5 from '@fundamental-ngx/core/switch';
 import * as i6$1 from '@fundamental-ngx/core/info-label';
 import * as i10$2 from '@fundamental-ngx/core/object-identifier';
 import * as i6$2 from '@fundamental-ngx/core/shellbar';
-import * as i8$4 from '@fundamental-ngx/core/object-attribute';
+import * as i8$3 from '@fundamental-ngx/core/object-attribute';
 import { trigger, transition, style, animate, state } from '@angular/animations';
 import * as i1$6 from '@fundamental-ngx/core/tabs';
 import * as i2$a from '@fundamental-ngx/core/message-page';
 import Splide from '@splidejs/splide';
 import * as i1$7 from '@fundamental-ngx/core/skeleton';
-import * as i7$4 from '@fundamental-ngx/core/nested-list';
+import * as i7$5 from '@fundamental-ngx/core/nested-list';
 import * as i9$1 from '@fundamental-ngx/core/side-navigation';
 import { CdkTableModule } from '@angular/cdk/table';
 
@@ -1873,6 +1873,7 @@ class SapUiReportBaseComponent extends ReportBaseComponent {
         this.showOkCancelButtons = this.context.ShowOkCancelButtons;
         this._ulvMainService.layoutInfo$.subscribe((layoutInfo) => {
             if (layoutInfo && layoutInfo.UseLayoutItemTextForControl) {
+                this._ulvMainService.setUseLayoutItemTextForControl(true);
                 this.useLayoutItemTextForControl = true;
             }
         });
@@ -1892,7 +1893,7 @@ class SapUiReportBaseComponent extends ReportBaseComponent {
         this.inlineEditMode$ = this._ulvMainService.inlineEditMode$;
         this.onlyInlineEdit$ = this._ulvMainService.onlyInlineEdit$;
         this._ulvMainService.setCanSaveGridSettings(this.viewSetting?.CanSaveGridSetting);
-        this.hasSelected$ = this.moDataList$.pipe(map((moList) => moList.some((c) => c.$IsChecked)));
+        this.hasSelected$ = this._ulvMainService.hasSelected$;
         this.moDataList$ = this.moDataList$.pipe(map((items) => this._mapCartableMo(items)));
         const gridDataSource = new GridMoDataList(this.moDataList$, this.gridSetting$, this.visibleColumns$, this.searchTerm$, this.inlineEditMode$, this.allowInlineEdit$);
         this.gridDataSource = gridDataSource;
@@ -1921,6 +1922,12 @@ class SapUiReportBaseComponent extends ReportBaseComponent {
                 // }
             });
         }));
+        this._ulvMainService.sortSettingChanged$
+            .pipe(takeUntil(this._onDestroy$), throttleTime(1000))
+            .subscribe((c) => this.updateSortSettings(c));
+        this._ulvMainService.createNewInlineMo$
+            .pipe(takeUntil(this._onDestroy$), throttleTime(1000))
+            .subscribe((c) => this._createNewInlineMo(c));
         this._ulvMainService.inlineEditMode$.pipe(withLatestFrom(this.hasSelected$), filter(() => this._access.Add !== false));
         this._setContainerWidth();
     }
@@ -1934,9 +1941,6 @@ class SapUiReportBaseComponent extends ReportBaseComponent {
         const { itemId, options } = e;
         this._ulvMainService.executeToolbarButton(itemId, options);
     }
-    onEditMode() {
-        this._setInlineEdit(!this._inlineEditMode);
-    }
     onSelectNextInlineRecord(mo) {
         this._selectNextInlineRecord(mo);
     }
@@ -2027,18 +2031,14 @@ class SapUiReportBaseComponent extends ReportBaseComponent {
     onFilter(selectedColumn) {
         this._showFilterSetting(selectedColumn);
     }
-    onColumnSettings(device) {
-        this._openSettings('columns', device);
-    }
-    onSortSettings(device) {
-        this._openSettings('sort', device);
-    }
-    onGroupbySettings(device) {
-        this._openSettings('groupby', device);
+    /* toolbar events */
+    onCreateNewMo() {
+        this._ulvMainService.newInlineMo(true);
     }
     onSortSettingsChange(sortSettings) {
-        this.updateSortSettings(sortSettings);
+        this._ulvMainService.sortSettingChange(sortSettings);
     }
+    /*  toolbar events end */
     onListCheckboxClick($event) {
         const { mo, index, e } = $event;
         this.onRowCheck({ mo, index, cause: 'singleSelect' });
@@ -2096,12 +2096,6 @@ class SapUiReportBaseComponent extends ReportBaseComponent {
     //     this._setNewInlineMo(formMo);
     //     this._select(formMo, -1);
     // }
-    onToolbarCreateNewInlineMo() {
-        this._createNewInlineMo();
-    }
-    onCreateNewMo() {
-        this._createNewInlineMo(true);
-    }
     onMandatory(isMandator) {
         this.context.fireEvent('Mandatory', isMandator);
     }
@@ -2206,7 +2200,7 @@ class SapUiReportBaseComponent extends ReportBaseComponent {
             return;
         }
         else {
-            this._createNewInlineMo();
+            this._ulvMainService.newInlineMo(false);
         }
     }
     _inlineEditSaveFormPanel(mo) {
@@ -2372,7 +2366,7 @@ class SapUiReportBaseComponent extends ReportBaseComponent {
             this.secondaryColumnsSource.next([]);
         }
         let columnsCount = visibleColumns.length;
-        const gridSettings = this.gridSettingSource.getValue();
+        const gridSettings = this._ulvMainService.gridSetting;
         const groupedColumns = gridSettings.SortSettingList.filter((d) => d.IsGrouped);
         const nameGroupedColumns = groupedColumns.map((c) => c.Name);
         const colWidthSettings = gridSettings?.ColSettingList?.filter((c) => nameGroupedColumns.indexOf(c.Name) === -1).map((c) => c.Width);
@@ -2563,8 +2557,6 @@ class UlvToolbarComponent extends BaseComponent {
     constructor() {
         super(...arguments);
         this.hideTitle = false;
-        // eslint-disable-next-line
-        this.search = new EventEmitter();
         this.groupbyClick = new EventEmitter();
         this.sortClick = new EventEmitter();
         this.columnClick = new EventEmitter();
@@ -2575,6 +2567,7 @@ class UlvToolbarComponent extends BaseComponent {
         this._refreshToolbar$ = new Subject();
         this._renderer2 = inject(Renderer2);
         this._portalService = inject(PortalService);
+        this._cdr = inject(ChangeDetectorRef);
         this.visibled = signal(false);
         this.ulvWidth = signal('100%');
         this.parentWidth = 0;
@@ -2600,6 +2593,9 @@ class UlvToolbarComponent extends BaseComponent {
             this._setWidth$.next();
         }
     }
+    changeDetect() {
+        this._cdr.detectChanges();
+    }
     onGroupbySettings() {
         this.groupbyClick.emit(this.deviceName);
     }
@@ -2641,7 +2637,7 @@ class UlvToolbarComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UlvToolbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UlvToolbarComponent, isStandalone: false, selector: "bsu-ulv-toolbar", inputs: { allowGridColumnSort: "allowGridColumnSort", useLayoutItemTextForControl: "useLayoutItemTextForControl", enableSearch: "enableSearch", hideTitle: "hideTitle", title: "title", icon: "icon", deviceName: "deviceName", deviceSize: "deviceSize", access: "access", hideToolbar: "hideToolbar", toolbarButtons: "toolbarButtons", contentDensity: "contentDensity", inlineEditMode: "inlineEditMode", allowInlineEdit: "allowInlineEdit", gridSetting: "gridSetting", viewCollection: "viewCollection", reportView: "reportView", inDialog: "inDialog", isMultiSelect: "isMultiSelect", cls: "cls", hasSelected: "hasSelected", config: "config", hidden: "hidden", buttons: "buttons", moDataListCount: "moDataListCount" }, outputs: { search: "search", groupbyClick: "groupbyClick", sortClick: "sortClick", columnClick: "columnClick", editModeClick: "editModeClick", viewClick: "viewClick", createNewInlineMo: "createNewInlineMo" }, viewQueries: [{ propertyName: "_tlbCmp", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "_divTempWidth", first: true, predicate: ["divTempWidth"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n    style=\"width: 100%; height: 0; visibility: hidden; opacity: 0\"\r\n    resizeHandler\r\n    [fnResize]=\"onResize\"\r\n    #divTempWidth\r\n></div>\r\n@if (!useLayoutItemTextForControl && !hideToolbar && visibled()) {\r\n<fd-toolbar\r\n    #toolbar\r\n    [shouldOverflow]=\"deviceSize === 's'\"\r\n    [ngClass]=\"deviceSize\"\r\n    [hasTitle]=\"!hideTitle\"\r\n    [forceOverflow]=\"true\"\r\n    [ngClass]=\"cls\"\r\n    [style.width]=\"ulvWidth()\"\r\n>\r\n    @if(!hideTitle && deviceSize !== 's' ? (title | bbbTranslate) : ''){ @if(icon){\r\n    <fd-icon [glyph]=\"icon\"></fd-icon>\r\n    }\r\n    <h4 fd-title>{{ title | bbbTranslate }}</h4>\r\n    } @if (deviceSize !== 's') {\r\n    <fd-toolbar-spacer fd-toolbar-item></fd-toolbar-spacer>\r\n    } @if (!hideToolbar) { @for (btn of toolbarButtons; track _trackBy(i, btn); let i = $index) { @if (btn !== '-' &&\r\n    btn.Command && !btn.Command.CustomUi && !btn.menu) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"btn.itemId === 'Edit' ? 'always' : btn.Command?.IsBuiltin ? 'low' : 'high'\"\r\n        [ulvCommandHandler]=\"btn\"\r\n        [disable]=\"inlineEditMode && btn.itemId === 'New'\"\r\n        [disabled]=\"btn.Command._isEnable === false ? true : false\"\r\n        [fdType]=\"!btn.Command._isEnable ? 'transparent' : btn.Command.JsonExtraProp?.Design || 'transparent'\"\r\n        [glyph]=\"deviceSize === 's' ? null : btn.newIcon || btn.Command.JsonExtraProp?.Icon\"\r\n        [title]=\"(btn.Command?.IsBuiltin ? btn.text : '') | bbbTranslate\"\r\n        (click)=\"inlineEditMode && btn.itemId === 'New' && createNewInlineMo.emit()\"\r\n        bodyClick\r\n    >\r\n        @if (!btn.Command.JsonExtraProp?.Icon && !btn.Command?.IsBuiltin && btn.icon) {\r\n        <img width=\"16\" [src]=\"btn.icon\" />\r\n        } @if (!btn.hideText || deviceSize === 's') {\r\n        <span>{{ (!btn.text && btn.isCustom ? btn.itemId : btn.text) | bbbTranslate }}</span>\r\n        }\r\n    </button>\r\n    } @if ((btn === '-' || btn.type === 'seperator') && deviceName !== 'mobile') {\r\n    <fd-toolbar-separator fd-toolbar-item></fd-toolbar-separator>\r\n    } @if (btn.menu) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdMenu]=\"true\"\r\n        [fdType]=\"btn.Command?.IsBuiltin ? 'standard' : 'transparent'\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [ariaLabel]=\"btn.text | bbbTranslate\"\r\n        [fdMenuTrigger]=\"menu\"\r\n        bodyClick\r\n    >\r\n        <fd-menu #menu>\r\n            @for (btnCommand of btn.menu.items; track btnCommand) {\r\n            <li fd-menu-item [ulvCommandHandler]=\"btnCommand\" (click)=\"menu.close()\">\r\n                <div fd-menu-interactive>\r\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </button>\r\n    } @if (btn !== '-' && btn.Command && btn.Command.CustomUi) {\r\n    <bnrc-dynamic-form-toolbaritem\r\n        fd-toolbar-item\r\n        [ulvCommandHandler]=\"btn\"\r\n        [component]=\"btn.Command?.CustomUi\"\r\n        [context]=\"btn\"\r\n        [isEnable]=\"btn.Command?._isEnable\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        bodyClick\r\n    ></bnrc-dynamic-form-toolbaritem>\r\n    } }\r\n    <ng-content select=\"[fd-toolbar-item]\"></ng-content>\r\n    @if (allowInlineEdit && access?.Edit) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdType]=\"inlineEditMode ? 'emphasized' : 'transparent'\"\r\n        [glyph]=\"'edit'\"\r\n        [label]=\"deviceSize === 's' ? ('Inline Edit In List' | bbbTranslate) : ''\"\r\n        (click)=\"onEditMode()\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        [title]=\"'Inline Edit In List' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    } @if (gridSetting && gridSetting.Hidden !== true && allowGridColumnSort) { @if (deviceSize === 's') {\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onGroupbySettings()\"\r\n        [label]=\"'Groups' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onSortSettings()\"\r\n        [label]=\"'Sort' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onColumnSettings()\"\r\n        [label]=\"'Columns' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    } @if (deviceSize !== 's') {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"'never'\"\r\n        [fdMenu]=\"true\"\r\n        fdType=\"transparent\"\r\n        glyph=\"action-settings\"\r\n        [title]=\"'Settings' | bbbTranslate\"\r\n        [fdMenuTrigger]=\"tableMenuSettings\"\r\n        bodyClick\r\n    ></button>\r\n    }\r\n    <fd-menu #tableMenuSettings>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onColumnSettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"action-settings\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Columns' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onSortSettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"sort\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Sort' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onGroupbySettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"group-2\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Groups' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n    </fd-menu>\r\n    } @if (viewCollection && viewCollection.length > 1) {\r\n    <fd-split-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"deviceSize === 's' ? 'always' : 'low'\"\r\n        [fdType]=\"'transparent'\"\r\n        [mainAction]=\"{\r\n            keepMainAction: true,\r\n            mainActionTitle: splitBtnTitle\r\n        }\"\r\n    >\r\n        <fd-menu>\r\n            @for (viewObject of viewCollection; track viewObject) {\r\n            <li fd-menu-item>\r\n                <div fd-menu-interactive (click)=\"onChangeView(viewObject)\" bodyClick>\r\n                    <span fd-menu-title>\r\n                        <fd-icon [glyph]=\"viewObject.UiComponent.Settings?.Icon\"> </fd-icon>\r\n                    </span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </fd-split-button>\r\n    }\r\n    <ng-template #splitBtnTitle>\r\n        <fd-icon [glyph]=\"reportView.UiComponent.Settings?.Icon\"></fd-icon>\r\n    </ng-template>\r\n    <ng-template #splitBtnSettings>\r\n        <fd-icon [glyph]=\"'action-settings'\"></fd-icon>\r\n    </ng-template>\r\n    }\r\n</fd-toolbar>\r\n}\r\n", styles: [":host{display:block;width:100%;position:relative}:host fd-toolbar.border-b-0{border-bottom-width:0px!important}:host ::ng-deep .fd-toolbar{flex-wrap:nowrap!important}:host ::ng-deep .fd-toolbar{border-top:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-left:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host fd-toolbar.s ::ng-deep .fd-toolbar{justify-content:end}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.UlvCommandDirective, selector: "[ulvCommandHandler]", inputs: ["ulvCommandHandler", "disable"], outputs: ["commandClick"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i2.ResizeHandlerDirective, selector: "[resizeHandler]", inputs: ["fnResize"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i5$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UlvToolbarComponent, isStandalone: false, selector: "bsu-ulv-toolbar", inputs: { allowGridColumnSort: "allowGridColumnSort", useLayoutItemTextForControl: "useLayoutItemTextForControl", hideTitle: "hideTitle", title: "title", icon: "icon", deviceName: "deviceName", deviceSize: "deviceSize", access: "access", hideToolbar: "hideToolbar", toolbarButtons: "toolbarButtons", contentDensity: "contentDensity", inlineEditMode: "inlineEditMode", allowInlineEdit: "allowInlineEdit", gridSetting: "gridSetting", viewCollection: "viewCollection", reportView: "reportView", inDialog: "inDialog", isMultiSelect: "isMultiSelect", cls: "cls", hasSelected: "hasSelected" }, outputs: { groupbyClick: "groupbyClick", sortClick: "sortClick", columnClick: "columnClick", editModeClick: "editModeClick", viewClick: "viewClick", createNewInlineMo: "createNewInlineMo" }, viewQueries: [{ propertyName: "_tlbCmp", first: true, predicate: ["toolbar"], descendants: true }, { propertyName: "_divTempWidth", first: true, predicate: ["divTempWidth"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n    style=\"width: 100%; height: 0; visibility: hidden; opacity: 0\"\r\n    resizeHandler\r\n    [fnResize]=\"onResize\"\r\n    #divTempWidth\r\n></div>\r\n@if (!useLayoutItemTextForControl && !hideToolbar && visibled()) {\r\n<fd-toolbar\r\n    #toolbar\r\n    [shouldOverflow]=\"deviceSize === 's'\"\r\n    [ngClass]=\"deviceSize\"\r\n    [hasTitle]=\"!hideTitle\"\r\n    [forceOverflow]=\"true\"\r\n    [ngClass]=\"cls\"\r\n    [style.width]=\"ulvWidth()\"\r\n>\r\n    @if(!hideTitle && deviceSize !== 's' ? (title | bbbTranslate) : ''){ @if(icon){\r\n    <fd-icon [glyph]=\"icon\"></fd-icon>\r\n    }\r\n    <h4 fd-title>{{ title | bbbTranslate }}</h4>\r\n    } @if (deviceSize !== 's') {\r\n    <fd-toolbar-spacer fd-toolbar-item></fd-toolbar-spacer>\r\n    } @if (!hideToolbar) { @for (btn of toolbarButtons; track _trackBy(i, btn); let i = $index) { @if (btn !== '-' &&\r\n    btn.Command && !btn.Command.CustomUi && !btn.menu) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"btn.itemId === 'Edit' ? 'always' : btn.Command?.IsBuiltin ? 'low' : 'high'\"\r\n        [ulvCommandHandler]=\"btn\"\r\n        [disable]=\"inlineEditMode && btn.itemId === 'New'\"\r\n        [disabled]=\"btn.Command._isEnable === false ? true : false\"\r\n        [fdType]=\"!btn.Command._isEnable ? 'transparent' : btn.Command.JsonExtraProp?.Design || 'transparent'\"\r\n        [glyph]=\"deviceSize === 's' ? null : btn.newIcon || btn.Command.JsonExtraProp?.Icon\"\r\n        [title]=\"(btn.Command?.IsBuiltin ? btn.text : '') | bbbTranslate\"\r\n        (click)=\"inlineEditMode && btn.itemId === 'New' && createNewInlineMo.emit()\"\r\n        bodyClick\r\n    >\r\n        @if (!btn.Command.JsonExtraProp?.Icon && !btn.Command?.IsBuiltin && btn.icon) {\r\n        <img width=\"16\" [src]=\"btn.icon\" />\r\n        } @if (!btn.hideText || deviceSize === 's') {\r\n        <span>{{ (!btn.text && btn.isCustom ? btn.itemId : btn.text) | bbbTranslate }}</span>\r\n        }\r\n    </button>\r\n    } @if ((btn === '-' || btn.type === 'seperator') && deviceName !== 'mobile') {\r\n    <fd-toolbar-separator fd-toolbar-item></fd-toolbar-separator>\r\n    } @if (btn.menu) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdMenu]=\"true\"\r\n        [fdType]=\"btn.Command?.IsBuiltin ? 'standard' : 'transparent'\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [ariaLabel]=\"btn.text | bbbTranslate\"\r\n        [fdMenuTrigger]=\"menu\"\r\n        bodyClick\r\n    >\r\n        <fd-menu #menu>\r\n            @for (btnCommand of btn.menu.items; track btnCommand) {\r\n            <li fd-menu-item [ulvCommandHandler]=\"btnCommand\" (click)=\"menu.close()\">\r\n                <div fd-menu-interactive>\r\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </button>\r\n    } @if (btn !== '-' && btn.Command && btn.Command.CustomUi) {\r\n    <bnrc-dynamic-form-toolbaritem\r\n        fd-toolbar-item\r\n        [ulvCommandHandler]=\"btn\"\r\n        [component]=\"btn.Command?.CustomUi\"\r\n        [context]=\"btn\"\r\n        [isEnable]=\"btn.Command?._isEnable\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        bodyClick\r\n    ></bnrc-dynamic-form-toolbaritem>\r\n    } }\r\n    <ng-content select=\"[fd-toolbar-item]\"></ng-content>\r\n    @if (allowInlineEdit && access?.Edit) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdType]=\"inlineEditMode ? 'emphasized' : 'transparent'\"\r\n        [glyph]=\"'edit'\"\r\n        [label]=\"deviceSize === 's' ? ('Inline Edit In List' | bbbTranslate) : ''\"\r\n        (click)=\"onEditMode()\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        [title]=\"'Inline Edit In List' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    } @if (gridSetting && gridSetting.Hidden !== true && allowGridColumnSort) { @if (deviceSize === 's') {\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onGroupbySettings()\"\r\n        [label]=\"'Groups' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onSortSettings()\"\r\n        [label]=\"'Sort' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        [contentDensity]=\"contentDensity\"\r\n        fdType=\"transparent\"\r\n        [attr.fdOverflowPriority]=\"'always'\"\r\n        (click)=\"onColumnSettings()\"\r\n        [label]=\"'Columns' | bbbTranslate\"\r\n        bodyClick\r\n    ></button>\r\n    } @if (deviceSize !== 's') {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"'never'\"\r\n        [fdMenu]=\"true\"\r\n        fdType=\"transparent\"\r\n        glyph=\"action-settings\"\r\n        [title]=\"'Settings' | bbbTranslate\"\r\n        [fdMenuTrigger]=\"tableMenuSettings\"\r\n        bodyClick\r\n    ></button>\r\n    }\r\n    <fd-menu #tableMenuSettings>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onColumnSettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"action-settings\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Columns' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onSortSettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"sort\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Sort' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n        <li fd-menu-item>\r\n            <div fd-menu-interactive (click)=\"tableMenuSettings.close(); onGroupbySettings()\" bodyClick>\r\n                <fd-menu-addon position=\"before\" glyph=\"group-2\"></fd-menu-addon>\r\n                <span fd-menu-title>\r\n                    {{ 'Groups' | bbbTranslate }}\r\n                </span>\r\n            </div>\r\n        </li>\r\n    </fd-menu>\r\n    } @if (viewCollection && viewCollection.length > 1) {\r\n    <fd-split-button\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"deviceSize === 's' ? 'always' : 'low'\"\r\n        [fdType]=\"'transparent'\"\r\n        [mainAction]=\"{\r\n            keepMainAction: true,\r\n            mainActionTitle: splitBtnTitle\r\n        }\"\r\n    >\r\n        <fd-menu>\r\n            @for (viewObject of viewCollection; track viewObject) {\r\n            <li fd-menu-item>\r\n                <div fd-menu-interactive (click)=\"onChangeView(viewObject)\" bodyClick>\r\n                    <span fd-menu-title>\r\n                        <fd-icon [glyph]=\"viewObject.UiComponent.Settings?.Icon\"> </fd-icon>\r\n                    </span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </fd-split-button>\r\n    }\r\n    <ng-template #splitBtnTitle>\r\n        <fd-icon [glyph]=\"reportView.UiComponent.Settings?.Icon\"></fd-icon>\r\n    </ng-template>\r\n    <ng-template #splitBtnSettings>\r\n        <fd-icon [glyph]=\"'action-settings'\"></fd-icon>\r\n    </ng-template>\r\n    }\r\n</fd-toolbar>\r\n}\r\n", styles: [":host{display:block;width:100%;position:relative}:host fd-toolbar.border-b-0{border-bottom-width:0px!important}:host ::ng-deep .fd-toolbar{flex-wrap:nowrap!important}:host ::ng-deep .fd-toolbar{border-top:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-left:var(--sapList_BorderWidth) solid var(--sapList_BorderColor);border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host fd-toolbar.s ::ng-deep .fd-toolbar{justify-content:end}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.UlvCommandDirective, selector: "[ulvCommandHandler]", inputs: ["ulvCommandHandler", "disable"], outputs: ["commandClick"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i2.ResizeHandlerDirective, selector: "[resizeHandler]", inputs: ["fnResize"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i5$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i7$2.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i7$2.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UlvToolbarComponent, decorators: [{
             type: Component,
@@ -2656,8 +2652,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                 type: Input
             }], useLayoutItemTextForControl: [{
                 type: Input
-            }], enableSearch: [{
-                type: Input
             }], hideTitle: [{
                 type: Input
             }], title: [{
@@ -2694,16 +2688,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                 type: Input
             }], hasSelected: [{
                 type: Input
-            }], config: [{
-                type: Input
-            }], hidden: [{
-                type: Input
-            }], buttons: [{
-                type: Input
-            }], moDataListCount: [{
-                type: Input
-            }], search: [{
-                type: Output
             }], groupbyClick: [{
                 type: Output
             }], sortClick: [{
@@ -2734,7 +2718,7 @@ class UiGanttChartComponent extends SapUiReportBaseComponent {
         this._modeSource.next(mode);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiGanttChartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiGanttChartComponent, isStandalone: false, selector: "bsu-ui-gantt-chart", usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"\n        renderContainer;\n        context: {\n            $implicit: moDataList$ | async,\n            allChecked: allChecked$ | async,\n            groupby: groupby$ | async,\n            isCheckList: context.Setting.View?.IsCheckList,\n            columns: columns$ | async,\n            columnsCount: columnsCount$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            onlyInlineEdit: onlyInlineEdit$ | async,\n            secondaryColumns: secondaryColumns$ | async,\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\n            popin: (mobileOrTablet$ | async) || (secondaryColumnsCount$ | async) ? true : false,\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\n            conditionalFormats: conditionalFormats$ | async,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            mobileOrTablet: mobileOrTablet$ | async,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            title: title$ | async,\n            rtl: rtl$ | async,\n            hideToolbar: hideToolbar$ | async,\n            allColumns: allColumns,\n            gridSetting: gridSetting$ | async,\n            contentDensity: contentDensity$ | async,\n            formLayout: layout$ | async,\n            hasSelected: hasSelected$ | async,\n            showOkCancelButtons: showOkCancelButtons,\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\n            navigationArrow: navigationArrow$ | async,\n            mode: mode$ | async,\n            ganttFields: context.Setting.View.GanttFields,\n            ganttChartHelper: context._ganttChartHelper\n        }\n    \"\n></ng-container>\n<ng-template\n    #renderContainer\n    let-moDataList\n    let-allChecked=\"allChecked\"\n    let-isCheckList=\"isCheckList\"\n    let-columns=\"columns\"\n    let-columnsCount=\"columnsCount\"\n    let-groupby=\"groupby\"\n    let-secondaryColumns=\"secondaryColumns\"\n    let-contextMenuItems=\"contextMenuItems\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-access=\"access\"\n    let-toolbarButtons=\"toolbarButtons\"\n    let-popin=\"popin\"\n    let-mobileOrTablet=\"mobileOrTablet\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-gridSetting=\"gridSetting\"\n    let-contentDensity=\"contentDensity\"\n    let-formLayout=\"formLayout\"\n    let-hasSelected=\"hasSelected\"\n    let-showOkCancelButtons=\"showOkCancelButtons\"\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\n    let-navigationArrow=\"navigationArrow\"\n    let-mode=\"mode\"\n    let-ganttFields=\"ganttFields\"\n    let-ganttChartHelper=\"ganttChartHelper\"\n>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"hideToolbar\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [toolbarButtons]=\"toolbarButtons\"\n        [gridSetting]=\"gridSetting\"\n        [title]=\"title\"\n        [hasSelected]=\"hasSelected\"\n        [access]=\"access\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"false\"\n        [allowInlineEdit]=\"false\"\n        [moDataListCount]=\"moDataList.length\"\n    ></bsu-ulv-toolbar>\n    <bsu-gantt-dhtml-chart-view\n        [isCheckList]=\"isCheckList\"\n        [allChecked]=\"allChecked\"\n        [moDataList]=\"moDataList\"\n        [access]=\"access\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [navigationArrow]=\"navigationArrow\"\n        [title]=\"title\"\n        [mobileOrTablet]=\"mobileOrTablet\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [inlineEditMode]=\"false\"\n        [allowInlineEdit]=\"false\"\n        [mode]=\"mode\"\n        [showOkCancelButtons]=\"showOkCancelButtons\"\n        [ganttFields]=\"ganttFields\"\n        [ganttChartHelper]=\"ganttChartHelper\"\n        (ulvCommandClick)=\"onUlvCommand($event)\"\n        (filter)=\"onFilter($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n    >\n    </bsu-gantt-dhtml-chart-view>\n</ng-template>\n", styles: [":host{display:block}:host.gantt_rtl{direction:ltr}::ng-deep .gantt_rtl>.gantt_layout_root>.gantt_layout{display:flex;flex-direction:row-reverse}::ng-deep .gantt-fix-grid{direction:ltr}::ng-deep .gantt_grid_scale{direction:ltr}::ng-deep .gantt_tree_content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep .gantt_container,::ng-deep .gantt_tooltip{font-family:var(--sapFontFamily)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: GanttDhtmlChartViewComponent, selector: "bsu-gantt-dhtml-chart-view", inputs: ["mode", "ganttFields", "ganttChartHelper"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiGanttChartComponent, isStandalone: false, selector: "bsu-ui-gantt-chart", usesInheritance: true, ngImport: i0, template: "<ng-container\n    *ngTemplateOutlet=\"\n        renderContainer;\n        context: {\n            $implicit: moDataList$ | async,\n            allChecked: allChecked$ | async,\n            groupby: groupby$ | async,\n            isCheckList: context.Setting.View?.IsCheckList,\n            columns: columns$ | async,\n            columnsCount: columnsCount$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            onlyInlineEdit: onlyInlineEdit$ | async,\n            secondaryColumns: secondaryColumns$ | async,\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\n            popin: (mobileOrTablet$ | async) || (secondaryColumnsCount$ | async) ? true : false,\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\n            conditionalFormats: conditionalFormats$ | async,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            mobileOrTablet: mobileOrTablet$ | async,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            title: title$ | async,\n            rtl: rtl$ | async,\n            hideToolbar: hideToolbar$ | async,\n            allColumns: allColumns,\n            gridSetting: gridSetting$ | async,\n            contentDensity: contentDensity$ | async,\n            formLayout: layout$ | async,\n            hasSelected: hasSelected$ | async,\n            showOkCancelButtons: showOkCancelButtons,\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\n            navigationArrow: navigationArrow$ | async,\n            mode: mode$ | async,\n            ganttFields: context.Setting.View.GanttFields,\n            ganttChartHelper: context._ganttChartHelper\n        }\n    \"\n></ng-container>\n<ng-template\n    #renderContainer\n    let-moDataList\n    let-allChecked=\"allChecked\"\n    let-isCheckList=\"isCheckList\"\n    let-columns=\"columns\"\n    let-columnsCount=\"columnsCount\"\n    let-groupby=\"groupby\"\n    let-secondaryColumns=\"secondaryColumns\"\n    let-contextMenuItems=\"contextMenuItems\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-access=\"access\"\n    let-toolbarButtons=\"toolbarButtons\"\n    let-popin=\"popin\"\n    let-mobileOrTablet=\"mobileOrTablet\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-gridSetting=\"gridSetting\"\n    let-contentDensity=\"contentDensity\"\n    let-formLayout=\"formLayout\"\n    let-hasSelected=\"hasSelected\"\n    let-showOkCancelButtons=\"showOkCancelButtons\"\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\n    let-navigationArrow=\"navigationArrow\"\n    let-mode=\"mode\"\n    let-ganttFields=\"ganttFields\"\n    let-ganttChartHelper=\"ganttChartHelper\"\n>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"hideToolbar\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [toolbarButtons]=\"toolbarButtons\"\n        [gridSetting]=\"gridSetting\"\n        [title]=\"title\"\n        [hasSelected]=\"hasSelected\"\n        [access]=\"access\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"false\"\n        [allowInlineEdit]=\"false\"\n        [moDataListCount]=\"moDataList.length\"\n    ></bsu-ulv-toolbar>\n    <bsu-gantt-dhtml-chart-view\n        [isCheckList]=\"isCheckList\"\n        [allChecked]=\"allChecked\"\n        [moDataList]=\"moDataList\"\n        [access]=\"access\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [navigationArrow]=\"navigationArrow\"\n        [title]=\"title\"\n        [mobileOrTablet]=\"mobileOrTablet\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [inlineEditMode]=\"false\"\n        [allowInlineEdit]=\"false\"\n        [mode]=\"mode\"\n        [showOkCancelButtons]=\"showOkCancelButtons\"\n        [ganttFields]=\"ganttFields\"\n        [ganttChartHelper]=\"ganttChartHelper\"\n        (ulvCommandClick)=\"onUlvCommand($event)\"\n        (filter)=\"onFilter($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n    >\n    </bsu-gantt-dhtml-chart-view>\n</ng-template>\n", styles: [":host{display:block}:host.gantt_rtl{direction:ltr}::ng-deep .gantt_rtl>.gantt_layout_root>.gantt_layout{display:flex;flex-direction:row-reverse}::ng-deep .gantt-fix-grid{direction:ltr}::ng-deep .gantt_grid_scale{direction:ltr}::ng-deep .gantt_tree_content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}::ng-deep .gantt_container,::ng-deep .gantt_tooltip{font-family:var(--sapFontFamily)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected"], outputs: ["groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: GanttDhtmlChartViewComponent, selector: "bsu-gantt-dhtml-chart-view", inputs: ["mode", "ganttFields", "ganttChartHelper"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiGanttChartComponent, decorators: [{
             type: Component,
@@ -3088,7 +3072,7 @@ class ColumnMatrixRendererComponent extends BaseComponent {
         this.changeToEdit.emit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ColumnMatrixRendererComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: ColumnMatrixRendererComponent, isStandalone: false, selector: "bsu-column-matrix-renderer", inputs: { value: "value", valueCaption: "valueCaption", formLayout: "formLayout", columnCaption: "columnCaption", uiControl: "uiControl", valueType: "valueType", isActive: "isActive", height: "height" }, outputs: { cellClick: "cellClick", changeToEdit: "changeToEdit" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container>\r\n    @if (!isActive) {\r\n    <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\r\n    } @else { @if (uiControl) {\r\n    <bsu-layout-control [caption]=\"valueCaption\" [config]=\"uiControl\" [focusControl]=\"true\" [showLabel]=\"false\">\r\n    </bsu-layout-control>\r\n    } }\r\n</ng-container>\r\n\r\n<ng-template #renderGeneral>\r\n    @if(!uiControl){\r\n    <div [attr.title]=\"value | matrixValue: valueType:uiControl\">{{ value | matrixValue: valueType:uiControl }}</div>\r\n    } @else{\r\n    <div (click)=\"cellClick.emit()\" class=\"render-general\">\r\n        <fd-popover #popover [fillControlMode]=\"'equal'\">\r\n            <fd-popover-control style=\"display: flex; flex-direction: column; justify-content: center; min-width: 100%\">\r\n                <span\r\n                    style=\"min-width: 100%; height: inherit\"\r\n                    #popoverControlEl\r\n                    (keydown.enter)=\"onEdit()\"\r\n                    (mouseover)=\"onOpenPopover($event, popoverControlEl)\"\r\n                    (mouseleave)=\"popover.close()\"\r\n                    [class.break-anywhere]=\"breakValueAnywhere\"\r\n                    >{{ value | matrixValue: valueType:uiControl }}</span\r\n                >\r\n            </fd-popover-control>\r\n            <fd-popover-body>\r\n                <span [class.break-anywhere]=\"breakValueAnywhere\">{{ value | matrixValue: valueType:uiControl }}</span>\r\n            </fd-popover-body>\r\n        </fd-popover>\r\n    </div>\r\n    }\r\n</ng-template>\r\n", styles: [":host{flex:1;width:inherit}.break-anywhere{line-break:anywhere}.render-general{width:100%;height:100%}::ng-deep fd-popover,::ng-deep fd-popover-control,::ng-deep .fd-popover__control{height:inherit;min-width:100%}fd-popover-body{margin-top:5px}fd-popover-body ::ng-deep .fd-popover__popper--cdk-custom{padding:5px}fd-popover-body span{white-space:break-spaces;padding:5px}bsu-layout-control{min-width:100%!important}bsu-layout-control span{height:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "cellEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"], outputs: ["events"] }, { kind: "pipe", type: MatrixValuePipe, name: "matrixValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: ColumnMatrixRendererComponent, isStandalone: false, selector: "bsu-column-matrix-renderer", inputs: { value: "value", valueCaption: "valueCaption", formLayout: "formLayout", columnCaption: "columnCaption", uiControl: "uiControl", valueType: "valueType", isActive: "isActive", height: "height" }, outputs: { cellClick: "cellClick", changeToEdit: "changeToEdit" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container>\r\n    @if (!isActive) {\r\n    <ng-container *ngTemplateOutlet=\"renderGeneral\"></ng-container>\r\n    } @else { @if (uiControl) {\r\n    <bsu-layout-control [caption]=\"valueCaption\" [config]=\"uiControl\" [focusControl]=\"true\" [showLabel]=\"false\">\r\n    </bsu-layout-control>\r\n    } }\r\n</ng-container>\r\n\r\n<ng-template #renderGeneral>\r\n    @if(!uiControl){\r\n    <div [attr.title]=\"value | matrixValue: valueType:uiControl\">{{ value | matrixValue: valueType:uiControl }}</div>\r\n    } @else{\r\n    <div (click)=\"cellClick.emit()\" class=\"render-general\">\r\n        <fd-popover #popover [fillControlMode]=\"'equal'\">\r\n            <fd-popover-control style=\"display: flex; flex-direction: column; justify-content: center; min-width: 100%\">\r\n                <span\r\n                    style=\"min-width: 100%; height: inherit\"\r\n                    #popoverControlEl\r\n                    (keydown.enter)=\"onEdit()\"\r\n                    (mouseover)=\"onOpenPopover($event, popoverControlEl)\"\r\n                    (mouseleave)=\"popover.close()\"\r\n                    [class.break-anywhere]=\"breakValueAnywhere\"\r\n                    >{{ value | matrixValue: valueType:uiControl }}</span\r\n                >\r\n            </fd-popover-control>\r\n            <fd-popover-body>\r\n                <span [class.break-anywhere]=\"breakValueAnywhere\">{{ value | matrixValue: valueType:uiControl }}</span>\r\n            </fd-popover-body>\r\n        </fd-popover>\r\n    </div>\r\n    }\r\n</ng-template>\r\n", styles: [":host{flex:1;width:inherit}.break-anywhere{line-break:anywhere}.render-general{width:100%;height:100%}::ng-deep fd-popover,::ng-deep fd-popover-control,::ng-deep .fd-popover__control{height:inherit;min-width:100%}fd-popover-body{margin-top:5px}fd-popover-body ::ng-deep .fd-popover__popper--cdk-custom{padding:5px}fd-popover-body span{white-space:break-spaces;padding:5px}bsu-layout-control{min-width:100%!important}bsu-layout-control span{height:inherit}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: ["inlineEdit", "cellEdit", "caption", "focusControl", "showLabel", "maxLabelWidth", "hasHorizontalText", "contentDensity", "flex", "RefreshLabel", "SetVisible"], outputs: ["events"] }, { kind: "pipe", type: MatrixValuePipe, name: "matrixValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ColumnMatrixRendererComponent, decorators: [{
             type: Component,
@@ -3458,11 +3442,11 @@ class UiEditableGridComponent extends SapUiReportBaseComponent {
             .subscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiEditableGridComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiEditableGridComponent, isStandalone: false, selector: "bsu-ui-editable-grid", providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        matrixTemplate;\r\n        context: {\r\n            moDataList: matrixMoList$ | async,\r\n            columns: horizontalRows,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            title: title$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            activeCell: activeCell,\r\n            valueControlFieldCaption: valueControlFieldCaption,\r\n            valueType: valueType,\r\n            formSetting: context.Setting.FormTemplate,\r\n            matrixWidthType: matrixWidthType,\r\n            cellWidth: cellWidth,\r\n            verticalLabelWidth: verticalLabelWidth,\r\n            fitWidth: fitWidth,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            hasSelected: hasSelected$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            formLayout: formLayout\r\n        }\r\n    \"\r\n></ng-container>\r\n\r\n<ng-template\r\n    #matrixTemplate\r\n    let-moDataList=\"moDataList\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-columns=\"columns\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-activeCell=\"activeCell\"\r\n    let-valueControlFieldCaption=\"valueControlFieldCaption\"\r\n    let-valueType=\"valueType\"\r\n    let-formSetting=\"formSetting\"\r\n    let-matrixWidthType=\"matrixWidthType\"\r\n    let-cellWidth=\"cellWidth\"\r\n    let-verticalLabelWidth=\"verticalLabelWidth\"\r\n    let-fitWidth=\"fitWidth\"\r\n    let-access=\"access\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-containerWidth=\"containterWidth\"\r\n    let-formLayout=\"formLayout\"\r\n>\r\n    <bsu-ulv-toolbar\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [title]=\"title\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [access]=\"access\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n        (sortClick)=\"onSortSettings(deviceName)\"\r\n        (editModeClick)=\"onEditMode()\"\r\n    >\r\n        @if(formPanelCtrlr){\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [fdType]=\"'emphasized'\"\r\n            [label]=\"'Save' | bbbTranslate\"\r\n            [glyph]=\"'save'\"\r\n            (click)=\"onSave()\"\r\n        ></button\r\n        >}\r\n        <!-- <fd-split-button\r\n            fd-toolbar-item\r\n            [mainAction]=\"{\r\n                keepMainAction: true,\r\n                mainActionTitle: splitBtnTitle\r\n            }\"\r\n        >\r\n            <fd-menu>\r\n                <li fd-menu-item>\r\n                    <div fd-menu-interactive (click)=\"onChangeView(true)\">\r\n                        <span fd-menu-title>\r\n                            {{ widthTypeEnum.FitWidth }}\r\n                        </span>\r\n                    </div>\r\n                </li>\r\n                <li fd-menu-item>\r\n                    <div fd-menu-interactive (click)=\"onChangeView(false)\">\r\n                        <span fd-menu-title>\r\n                            {{ widthTypeEnum.StaticWidth }}\r\n                        </span>\r\n                    </div>\r\n                </li>\r\n            </fd-menu>\r\n        </fd-split-button> -->\r\n\r\n        <ng-template #splitBtnTitle>\r\n            <span>{{ fitWidth ? widthTypeEnum.FitWidth : widthTypeEnum.StaticWidth }}</span>\r\n        </ng-template>\r\n    </bsu-ulv-toolbar>\r\n    <bsu-ui-matrix-view\r\n        [moDataList]=\"moDataList\"\r\n        [columns]=\"columns\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [activeCell]=\"activeCell\"\r\n        [valueControlFieldCaption]=\"valueControlFieldCaption\"\r\n        [valueType]=\"valueType\"\r\n        [access]=\"access\"\r\n        [formLayout]=\"formLayout\"\r\n        [matrixWidthType]=\"matrixWidthType\"\r\n        [cellWidth]=\"cellWidth\"\r\n        [cellHeight]=\"cellHeight\"\r\n        [verticalLabelWidth]=\"verticalLabelWidth\"\r\n        [fitWidth]=\"fitWidth\"\r\n        [minWidth]=\"minWidth\"\r\n        [minHeight]=\"minHeight\"\r\n        [rowResizer]=\"rowResizer\"\r\n        [enableResizing]=\"enableResizing\"\r\n        [containerWidth]=\"containerWidth\"\r\n        (selectionChange)=\"onSelectionChange($event)\"\r\n    ></bsu-ui-matrix-view>\r\n</ng-template>\r\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}.fd-table__row th.fd-table__cell{background-color:var(--sapList_HeaderBackground, #f2f2f2);color:var(--sapList_HeaderTextColor, #32363a)}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiMatrixViewComponent, selector: "bsu-ui-matrix-view", inputs: ["deviceSize", "deviceName", "moDataList", "columns", "formLayout", "conditionalFormat", "activeCell", "valueControlFieldCaption", "formTemplate", "valueType", "cellWidth", "cellHeight", "verticalLabelWidth", "fitWidth", "minWidth", "minHeight", "rowResizer", "enableResizing"], outputs: ["selectionChange"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiEditableGridComponent, isStandalone: false, selector: "bsu-ui-editable-grid", providers: [FormPanelService], usesInheritance: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        matrixTemplate;\r\n        context: {\r\n            moDataList: matrixMoList$ | async,\r\n            columns: horizontalRows,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            title: title$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            activeCell: activeCell,\r\n            valueControlFieldCaption: valueControlFieldCaption,\r\n            valueType: valueType,\r\n            formSetting: context.Setting.FormTemplate,\r\n            matrixWidthType: matrixWidthType,\r\n            cellWidth: cellWidth,\r\n            verticalLabelWidth: verticalLabelWidth,\r\n            fitWidth: fitWidth,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            hasSelected: hasSelected$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            formLayout: formLayout\r\n        }\r\n    \"\r\n></ng-container>\r\n\r\n<ng-template\r\n    #matrixTemplate\r\n    let-moDataList=\"moDataList\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-columns=\"columns\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-activeCell=\"activeCell\"\r\n    let-valueControlFieldCaption=\"valueControlFieldCaption\"\r\n    let-valueType=\"valueType\"\r\n    let-formSetting=\"formSetting\"\r\n    let-matrixWidthType=\"matrixWidthType\"\r\n    let-cellWidth=\"cellWidth\"\r\n    let-verticalLabelWidth=\"verticalLabelWidth\"\r\n    let-fitWidth=\"fitWidth\"\r\n    let-access=\"access\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-containerWidth=\"containterWidth\"\r\n    let-formLayout=\"formLayout\"\r\n>\r\n \r\n    <bsu-ui-matrix-view\r\n        [moDataList]=\"moDataList\"\r\n        [columns]=\"columns\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [activeCell]=\"activeCell\"\r\n        [valueControlFieldCaption]=\"valueControlFieldCaption\"\r\n        [valueType]=\"valueType\"\r\n        [access]=\"access\"\r\n        [formLayout]=\"formLayout\"\r\n        [matrixWidthType]=\"matrixWidthType\"\r\n        [cellWidth]=\"cellWidth\"\r\n        [cellHeight]=\"cellHeight\"\r\n        [verticalLabelWidth]=\"verticalLabelWidth\"\r\n        [fitWidth]=\"fitWidth\"\r\n        [minWidth]=\"minWidth\"\r\n        [minHeight]=\"minHeight\"\r\n        [rowResizer]=\"rowResizer\"\r\n        [enableResizing]=\"enableResizing\"\r\n        [containerWidth]=\"containerWidth\"\r\n        (selectionChange)=\"onSelectionChange($event)\"\r\n    ></bsu-ui-matrix-view>\r\n</ng-template>\r\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}.fd-table__row th.fd-table__cell{background-color:var(--sapList_HeaderBackground, #f2f2f2);color:var(--sapList_HeaderTextColor, #32363a)}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiMatrixViewComponent, selector: "bsu-ui-matrix-view", inputs: ["deviceSize", "deviceName", "moDataList", "columns", "formLayout", "conditionalFormat", "activeCell", "valueControlFieldCaption", "formTemplate", "valueType", "cellWidth", "cellHeight", "verticalLabelWidth", "fitWidth", "minWidth", "minHeight", "rowResizer", "enableResizing"], outputs: ["selectionChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiEditableGridComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-editable-grid', changeDetection: ChangeDetectionStrategy.OnPush, providers: [FormPanelService], standalone: false, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        matrixTemplate;\r\n        context: {\r\n            moDataList: matrixMoList$ | async,\r\n            columns: horizontalRows,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            title: title$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            activeCell: activeCell,\r\n            valueControlFieldCaption: valueControlFieldCaption,\r\n            valueType: valueType,\r\n            formSetting: context.Setting.FormTemplate,\r\n            matrixWidthType: matrixWidthType,\r\n            cellWidth: cellWidth,\r\n            verticalLabelWidth: verticalLabelWidth,\r\n            fitWidth: fitWidth,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            hasSelected: hasSelected$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            formLayout: formLayout\r\n        }\r\n    \"\r\n></ng-container>\r\n\r\n<ng-template\r\n    #matrixTemplate\r\n    let-moDataList=\"moDataList\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-columns=\"columns\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-activeCell=\"activeCell\"\r\n    let-valueControlFieldCaption=\"valueControlFieldCaption\"\r\n    let-valueType=\"valueType\"\r\n    let-formSetting=\"formSetting\"\r\n    let-matrixWidthType=\"matrixWidthType\"\r\n    let-cellWidth=\"cellWidth\"\r\n    let-verticalLabelWidth=\"verticalLabelWidth\"\r\n    let-fitWidth=\"fitWidth\"\r\n    let-access=\"access\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-containerWidth=\"containterWidth\"\r\n    let-formLayout=\"formLayout\"\r\n>\r\n    <bsu-ulv-toolbar\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [title]=\"title\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [access]=\"access\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n        (sortClick)=\"onSortSettings(deviceName)\"\r\n        (editModeClick)=\"onEditMode()\"\r\n    >\r\n        @if(formPanelCtrlr){\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [fdType]=\"'emphasized'\"\r\n            [label]=\"'Save' | bbbTranslate\"\r\n            [glyph]=\"'save'\"\r\n            (click)=\"onSave()\"\r\n        ></button\r\n        >}\r\n        <!-- <fd-split-button\r\n            fd-toolbar-item\r\n            [mainAction]=\"{\r\n                keepMainAction: true,\r\n                mainActionTitle: splitBtnTitle\r\n            }\"\r\n        >\r\n            <fd-menu>\r\n                <li fd-menu-item>\r\n                    <div fd-menu-interactive (click)=\"onChangeView(true)\">\r\n                        <span fd-menu-title>\r\n                            {{ widthTypeEnum.FitWidth }}\r\n                        </span>\r\n                    </div>\r\n                </li>\r\n                <li fd-menu-item>\r\n                    <div fd-menu-interactive (click)=\"onChangeView(false)\">\r\n                        <span fd-menu-title>\r\n                            {{ widthTypeEnum.StaticWidth }}\r\n                        </span>\r\n                    </div>\r\n                </li>\r\n            </fd-menu>\r\n        </fd-split-button> -->\r\n\r\n        <ng-template #splitBtnTitle>\r\n            <span>{{ fitWidth ? widthTypeEnum.FitWidth : widthTypeEnum.StaticWidth }}</span>\r\n        </ng-template>\r\n    </bsu-ulv-toolbar>\r\n    <bsu-ui-matrix-view\r\n        [moDataList]=\"moDataList\"\r\n        [columns]=\"columns\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [activeCell]=\"activeCell\"\r\n        [valueControlFieldCaption]=\"valueControlFieldCaption\"\r\n        [valueType]=\"valueType\"\r\n        [access]=\"access\"\r\n        [formLayout]=\"formLayout\"\r\n        [matrixWidthType]=\"matrixWidthType\"\r\n        [cellWidth]=\"cellWidth\"\r\n        [cellHeight]=\"cellHeight\"\r\n        [verticalLabelWidth]=\"verticalLabelWidth\"\r\n        [fitWidth]=\"fitWidth\"\r\n        [minWidth]=\"minWidth\"\r\n        [minHeight]=\"minHeight\"\r\n        [rowResizer]=\"rowResizer\"\r\n        [enableResizing]=\"enableResizing\"\r\n        [containerWidth]=\"containerWidth\"\r\n        (selectionChange)=\"onSelectionChange($event)\"\r\n    ></bsu-ui-matrix-view>\r\n</ng-template>\r\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}.fd-table__row th.fd-table__cell{background-color:var(--sapList_HeaderBackground, #f2f2f2);color:var(--sapList_HeaderTextColor, #32363a)}\n"] }]
+            args: [{ selector: 'bsu-ui-editable-grid', changeDetection: ChangeDetectionStrategy.OnPush, providers: [FormPanelService], standalone: false, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        matrixTemplate;\r\n        context: {\r\n            moDataList: matrixMoList$ | async,\r\n            columns: horizontalRows,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            title: title$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            activeCell: activeCell,\r\n            valueControlFieldCaption: valueControlFieldCaption,\r\n            valueType: valueType,\r\n            formSetting: context.Setting.FormTemplate,\r\n            matrixWidthType: matrixWidthType,\r\n            cellWidth: cellWidth,\r\n            verticalLabelWidth: verticalLabelWidth,\r\n            fitWidth: fitWidth,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            hasSelected: hasSelected$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            formLayout: formLayout\r\n        }\r\n    \"\r\n></ng-container>\r\n\r\n<ng-template\r\n    #matrixTemplate\r\n    let-moDataList=\"moDataList\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-columns=\"columns\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-activeCell=\"activeCell\"\r\n    let-valueControlFieldCaption=\"valueControlFieldCaption\"\r\n    let-valueType=\"valueType\"\r\n    let-formSetting=\"formSetting\"\r\n    let-matrixWidthType=\"matrixWidthType\"\r\n    let-cellWidth=\"cellWidth\"\r\n    let-verticalLabelWidth=\"verticalLabelWidth\"\r\n    let-fitWidth=\"fitWidth\"\r\n    let-access=\"access\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-containerWidth=\"containterWidth\"\r\n    let-formLayout=\"formLayout\"\r\n>\r\n \r\n    <bsu-ui-matrix-view\r\n        [moDataList]=\"moDataList\"\r\n        [columns]=\"columns\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [activeCell]=\"activeCell\"\r\n        [valueControlFieldCaption]=\"valueControlFieldCaption\"\r\n        [valueType]=\"valueType\"\r\n        [access]=\"access\"\r\n        [formLayout]=\"formLayout\"\r\n        [matrixWidthType]=\"matrixWidthType\"\r\n        [cellWidth]=\"cellWidth\"\r\n        [cellHeight]=\"cellHeight\"\r\n        [verticalLabelWidth]=\"verticalLabelWidth\"\r\n        [fitWidth]=\"fitWidth\"\r\n        [minWidth]=\"minWidth\"\r\n        [minHeight]=\"minHeight\"\r\n        [rowResizer]=\"rowResizer\"\r\n        [enableResizing]=\"enableResizing\"\r\n        [containerWidth]=\"containerWidth\"\r\n        (selectionChange)=\"onSelectionChange($event)\"\r\n    ></bsu-ui-matrix-view>\r\n</ng-template>\r\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}.fd-table__row th.fd-table__cell{background-color:var(--sapList_HeaderBackground, #f2f2f2);color:var(--sapList_HeaderTextColor, #32363a)}\n"] }]
         }] });
 var WidthTypeEnum;
 (function (WidthTypeEnum) {
@@ -3543,7 +3527,7 @@ class UlvContextMenuComponent extends BaseComponent {
         this._popoverCmp.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UlvContextMenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UlvContextMenuComponent, isStandalone: false, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: { onlyOverflow: "onlyOverflow", rightClickEnable: "rightClickEnable", closeOnOutsideClick: "closeOnOutsideClick", deviceName: "deviceName", menuItems: "menuItems", allColumns: "allColumns", index: "index", mo: "mo", styleIndex: "styleIndex", conditionalFormats: "conditionalFormats", disableOverflowContextMenu: "disableOverflowContextMenu", footerMode: "footerMode", contextMenuOverflowText: "contextMenuOverflowText", appendTo: "appendTo" }, outputs: { commandClick: "commandClick" }, host: { properties: { "class.disableOverflow": "this._disableOverflow" } }, viewQueries: [{ propertyName: "_popoverCmp", first: true, predicate: PopoverComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (footerMode) {\r\n<div fd-bar barDesign=\"footer\" [cozy]=\"false\" style=\"width: 100%\">\r\n    <div fd-bar-right>\r\n        <ng-container *ngTemplateOutlet=\"footerToolbarTpl\"></ng-container>\r\n    </div>\r\n    <ng-template #footerToolbarTpl>\r\n        <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\" [shouldOverflow]=\"true\">\r\n            @for (cmd of menuItems; track cmd) {\r\n            <span fd-toolbar-item>\r\n                <ng-container *ngTemplateOutlet=\"buttonTemplate; context: { $implicit: cmd }\"></ng-container>\r\n            </span>\r\n            }\r\n        </fd-toolbar>\r\n    </ng-template>\r\n</div>\r\n} @else if(rightClickEnable){\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        overflowCommands;\r\n        context: { $implicit: menuItems, index: index, hideBtn: true, appendTo: appendTo, showText: true }\r\n    \"\r\n></ng-container>\r\n}@else{\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        overflowMode && !disableOverflowContextMenu ? overflowCommands : simpleCommands;\r\n        context: { $implicit: menuItems, index: index }\r\n    \"\r\n></ng-container>\r\n}\r\n\r\n<ng-template #simpleCommands let-commands let-index=\"index\">\r\n    @for (cmd of commands; track cmd) {\r\n    <ng-container *ngTemplateOutlet=\"menuButtonTemplate; context: { $implicit: cmd }\"></ng-container>\r\n    }\r\n</ng-template>\r\n\r\n<ng-template\r\n    #overflowCommands\r\n    let-commands\r\n    let-index=\"index\"\r\n    let-hideBtn=\"hideBtn\"\r\n    let-appendTo=\"appendTo\"\r\n    let-showText=\"showText\"\r\n>\r\n    <fd-popover\r\n        placement=\"bottom\"\r\n        [(isOpen)]=\"isOpenOverflow\"\r\n        [closeOnOutsideClick]=\"closeOnOutsideClick === false ? false : true\"\r\n        [noArrow]=\"true\"\r\n        [appendTo]=\"appendTo\"\r\n        [focusAutoCapture]=\"true\"\r\n        [focusTrapped]=\"true\"\r\n    >\r\n        <fd-popover-control #popover>\r\n            @if(!hideBtn){\r\n            <button\r\n                fd-button\r\n                (click)=\"onOpenOverflow($event)\"\r\n                [fdType]=\"'transparent'\"\r\n                [glyph]=\"!contextMenuOverflowText ? 'overflow' : null\"\r\n                [title]=\"contextMenuOverflowText\"\r\n                [label]=\"contextMenuOverflowText\"\r\n            ></button>\r\n            }\r\n        </fd-popover-control>\r\n        <fd-popover-body>\r\n            <ul fd-list class=\"ulv-overflow-buttons\">\r\n                @for (cmd of commands; track cmd) {\r\n                <li fd-list-item>\r\n                    <ng-container *ngTemplateOutlet=\"menuButtonTemplate; context: { $implicit: cmd }\"></ng-container>\r\n                </li>\r\n                }\r\n            </ul>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</ng-template>\r\n\r\n<ng-template #menuButtonTemplate let-cmd>\r\n    <ng-container\r\n        *ngTemplateOutlet=\"cmd.menu ? menuTemplate : buttonTemplate; context: { $implicit: cmd, showLabel: true }\"\r\n    ></ng-container>\r\n</ng-template>\r\n<ng-template #menuTemplate let-cmd>\r\n    <fd-split-button fd-toolbar-item [mainAction]=\"{ mainActionTitle: cmd.text, keepMainAction: true }\">\r\n        <fd-menu>\r\n            @for (btnCommand of cmd.menu.items; track btnCommand) {\r\n            <li\r\n                fd-menu-item\r\n                #liEl\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"cmd.text\"\r\n                [hostEl]=\"liEl\"\r\n                (click)=\"onCommandSplitButtonClick($event, btnCommand)\"\r\n            >\r\n                <div fd-menu-interactive>\r\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </fd-split-button>\r\n</ng-template>\r\n<ng-template #buttonTemplate let-cmd let-showLabel=\"showLabel\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            cmd?.Command?.CustomUi ? customButtonTemplate : defaultButtonTemplate;\r\n            context: { $implicit: cmd, showLabel: showLabel }\r\n        \"\r\n    ></ng-container>\r\n</ng-template>\r\n<ng-template #defaultButtonTemplate let-cmd let-showLabel=\"showLabel\">\r\n    <button\r\n        fd-button\r\n        #btnEl\r\n        class=\"!tw-border-none\"\r\n        [fdType]=\"cmd.Command?.JsonExtraProp?.Design ? cmd.Command?.JsonExtraProp.Design : 'transparent'\"\r\n        [glyph]=\"cmd.Command?.NewIcon || cmd.Command?.JsonExtraProp?.Icon || ''\"\r\n        [ulvCommandHandler]=\"cmd\"\r\n        [label]=\"cmd.Command?.NewIcon && cmd.Command?.JsonExtraProp?.Icon ? (cmd.text | bbbTranslate) : ''\"\r\n        [applyConditionalFormats]=\"conditionalFormats\"\r\n        [styleIndex]=\"styleIndex\"\r\n        [dbName]=\"cmd.text\"\r\n        [hostEl]=\"btnEl\"\r\n        [disabled]=\"cmd.Command?._isEnable === false\"\r\n        (commandClick)=\"onCommandClick($event)\"\r\n    >\r\n        <!-- \u0686\u0648\u0646 \u0639\u06A9\u0633 \u062F\u0631 \u0633\u0645\u062A \u0631\u0627\u0633\u062A \u0642\u0631\u0627\u0631 \u0628\u06AF\u06CC\u0631\u062F \u0627\u0632 \u0644\u06CC\u0628\u0644 \u062F\u06A9\u0645\u0647 \u0627\u0633\u062A\u0641\u0627\u062F\u0647 \u0646\u06A9\u0631\u062F\u0645 -->\r\n        @if (!cmd.Command?.NewIcon && !cmd.Command?.JsonExtraProp?.Icon) {\r\n        <img [src]=\"cmd.icon\" />\r\n        }\r\n        <span *ngIf=\"true || !(cmd.Command?.NewIcon || cmd.Command?.JsonExtraProp?.Icon)\">{{\r\n            cmd.text | bbbTranslate\r\n        }}</span>\r\n    </button>\r\n</ng-template>\r\n<ng-template #customButtonTemplate let-cmd let-showLabel=\"showLabel\">\r\n    <div\r\n        #hostEl\r\n        [dbName]=\"cmd.text\"\r\n        [applyConditionalFormats]=\"conditionalFormats\"\r\n        [hostEl]=\"hostEl\"\r\n        [styleIndex]=\"styleIndex\"\r\n    >\r\n        <bnrc-dynamic-form-toolbaritem\r\n            fd-toolbar-item\r\n            [ulvCommandHandler]=\"cmd\"\r\n            [component]=\"cmd.Command?.CustomUi\"\r\n            [mo]=\"mo\"\r\n            [context]=\"cmd\"\r\n            [showText]=\"showLabel || disableOverflowContextMenu === false\"\r\n            [deviceName]=\"deviceName\"\r\n            [index]=\"index\"\r\n            [isEnable]=\"cmd.Command?._isEnable || cmd.Command?.UseForSingle\"\r\n            [allColumns]=\"allColumns\"\r\n            (btnClick)=\"onCommandClick($event)\"\r\n        ></bnrc-dynamic-form-toolbaritem>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:flex;justify-content:center;align-items:center}:host ::ng-deep button{margin-top:0!important}:host ::ng-deep .fd-popover-custom{max-width:none}:host.disableOverflow{column-gap:5px}button{align-items:center}button div{display:flex}button ::ng-deep span{height:auto!important}\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.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.UlvCommandDirective, selector: "[ulvCommandHandler]", inputs: ["ulvCommandHandler", "disable"], outputs: ["commandClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UlvContextMenuComponent, isStandalone: false, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: { onlyOverflow: "onlyOverflow", rightClickEnable: "rightClickEnable", closeOnOutsideClick: "closeOnOutsideClick", deviceName: "deviceName", menuItems: "menuItems", allColumns: "allColumns", index: "index", mo: "mo", styleIndex: "styleIndex", conditionalFormats: "conditionalFormats", disableOverflowContextMenu: "disableOverflowContextMenu", footerMode: "footerMode", contextMenuOverflowText: "contextMenuOverflowText", appendTo: "appendTo" }, outputs: { commandClick: "commandClick" }, host: { properties: { "class.disableOverflow": "this._disableOverflow" } }, viewQueries: [{ propertyName: "_popoverCmp", first: true, predicate: PopoverComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (footerMode) {\r\n<div fd-bar barDesign=\"footer\" [cozy]=\"false\" style=\"width: 100%\">\r\n    <div fd-bar-right>\r\n        <ng-container *ngTemplateOutlet=\"footerToolbarTpl\"></ng-container>\r\n    </div>\r\n    <ng-template #footerToolbarTpl>\r\n        <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\" [shouldOverflow]=\"true\">\r\n            @for (cmd of menuItems; track cmd) {\r\n            <span fd-toolbar-item>\r\n                <ng-container *ngTemplateOutlet=\"buttonTemplate; context: { $implicit: cmd }\"></ng-container>\r\n            </span>\r\n            }\r\n        </fd-toolbar>\r\n    </ng-template>\r\n</div>\r\n} @else if(rightClickEnable){\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        overflowCommands;\r\n        context: { $implicit: menuItems, index: index, hideBtn: true, appendTo: appendTo, showText: true }\r\n    \"\r\n></ng-container>\r\n}@else{\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        overflowMode && !disableOverflowContextMenu ? overflowCommands : simpleCommands;\r\n        context: { $implicit: menuItems, index: index }\r\n    \"\r\n></ng-container>\r\n}\r\n\r\n<ng-template #simpleCommands let-commands let-index=\"index\">\r\n    @for (cmd of commands; track cmd) {\r\n    <ng-container *ngTemplateOutlet=\"menuButtonTemplate; context: { $implicit: cmd }\"></ng-container>\r\n    }\r\n</ng-template>\r\n\r\n<ng-template\r\n    #overflowCommands\r\n    let-commands\r\n    let-index=\"index\"\r\n    let-hideBtn=\"hideBtn\"\r\n    let-appendTo=\"appendTo\"\r\n    let-showText=\"showText\"\r\n>\r\n    <fd-popover\r\n        placement=\"bottom\"\r\n        [(isOpen)]=\"isOpenOverflow\"\r\n        [closeOnOutsideClick]=\"closeOnOutsideClick === false ? false : true\"\r\n        [noArrow]=\"true\"\r\n        [appendTo]=\"appendTo\"\r\n        [focusAutoCapture]=\"true\"\r\n        [focusTrapped]=\"true\"\r\n    >\r\n        <fd-popover-control #popover>\r\n            @if(!hideBtn){\r\n            <button\r\n                fd-button\r\n                (click)=\"onOpenOverflow($event)\"\r\n                [fdType]=\"'transparent'\"\r\n                [glyph]=\"!contextMenuOverflowText ? 'overflow' : null\"\r\n                [title]=\"contextMenuOverflowText\"\r\n                [label]=\"contextMenuOverflowText\"\r\n            ></button>\r\n            }\r\n        </fd-popover-control>\r\n        <fd-popover-body>\r\n            <ul fd-list class=\"ulv-overflow-buttons\">\r\n                @for (cmd of commands; track cmd) {\r\n                <li fd-list-item>\r\n                    <ng-container *ngTemplateOutlet=\"menuButtonTemplate; context: { $implicit: cmd }\"></ng-container>\r\n                </li>\r\n                }\r\n            </ul>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</ng-template>\r\n\r\n<ng-template #menuButtonTemplate let-cmd>\r\n    <ng-container\r\n        *ngTemplateOutlet=\"cmd.menu ? menuTemplate : buttonTemplate; context: { $implicit: cmd, showLabel: true }\"\r\n    ></ng-container>\r\n</ng-template>\r\n<ng-template #menuTemplate let-cmd>\r\n    <fd-split-button fd-toolbar-item [mainAction]=\"{ mainActionTitle: cmd.text, keepMainAction: true }\">\r\n        <fd-menu>\r\n            @for (btnCommand of cmd.menu.items; track btnCommand) {\r\n            <li\r\n                fd-menu-item\r\n                #liEl\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"cmd.text\"\r\n                [hostEl]=\"liEl\"\r\n                (click)=\"onCommandSplitButtonClick($event, btnCommand)\"\r\n            >\r\n                <div fd-menu-interactive>\r\n                    <span fd-menu-title>{{ btnCommand.text | bbbTranslate }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </fd-split-button>\r\n</ng-template>\r\n<ng-template #buttonTemplate let-cmd let-showLabel=\"showLabel\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            cmd?.Command?.CustomUi ? customButtonTemplate : defaultButtonTemplate;\r\n            context: { $implicit: cmd, showLabel: showLabel }\r\n        \"\r\n    ></ng-container>\r\n</ng-template>\r\n<ng-template #defaultButtonTemplate let-cmd let-showLabel=\"showLabel\">\r\n    <button\r\n        fd-button\r\n        #btnEl\r\n        class=\"!tw-border-none\"\r\n        [fdType]=\"cmd.Command?.JsonExtraProp?.Design ? cmd.Command?.JsonExtraProp.Design : 'transparent'\"\r\n        [glyph]=\"cmd.Command?.NewIcon || cmd.Command?.JsonExtraProp?.Icon || ''\"\r\n        [ulvCommandHandler]=\"cmd\"\r\n        [label]=\"cmd.Command?.NewIcon && cmd.Command?.JsonExtraProp?.Icon ? (cmd.text | bbbTranslate) : ''\"\r\n        [applyConditionalFormats]=\"conditionalFormats\"\r\n        [styleIndex]=\"styleIndex\"\r\n        [dbName]=\"cmd.text\"\r\n        [hostEl]=\"btnEl\"\r\n        [disabled]=\"cmd.Command?._isEnable === false\"\r\n        (commandClick)=\"onCommandClick($event)\"\r\n    >\r\n        <!-- \u0686\u0648\u0646 \u0639\u06A9\u0633 \u062F\u0631 \u0633\u0645\u062A \u0631\u0627\u0633\u062A \u0642\u0631\u0627\u0631 \u0628\u06AF\u06CC\u0631\u062F \u0627\u0632 \u0644\u06CC\u0628\u0644 \u062F\u06A9\u0645\u0647 \u0627\u0633\u062A\u0641\u0627\u062F\u0647 \u0646\u06A9\u0631\u062F\u0645 -->\r\n        @if (!cmd.Command?.NewIcon && !cmd.Command?.JsonExtraProp?.Icon) {\r\n        <img [src]=\"cmd.icon\" />\r\n        }\r\n        <span *ngIf=\"true || !(cmd.Command?.NewIcon || cmd.Command?.JsonExtraProp?.Icon)\">{{\r\n            cmd.text | bbbTranslate\r\n        }}</span>\r\n    </button>\r\n</ng-template>\r\n<ng-template #customButtonTemplate let-cmd let-showLabel=\"showLabel\">\r\n    <div\r\n        #hostEl\r\n        [dbName]=\"cmd.text\"\r\n        [applyConditionalFormats]=\"conditionalFormats\"\r\n        [hostEl]=\"hostEl\"\r\n        [styleIndex]=\"styleIndex\"\r\n    >\r\n        <bnrc-dynamic-form-toolbaritem\r\n            fd-toolbar-item\r\n            [ulvCommandHandler]=\"cmd\"\r\n            [component]=\"cmd.Command?.CustomUi\"\r\n            [mo]=\"mo\"\r\n            [context]=\"cmd\"\r\n            [showText]=\"showLabel || disableOverflowContextMenu === false\"\r\n            [deviceName]=\"deviceName\"\r\n            [index]=\"index\"\r\n            [isEnable]=\"cmd.Command?._isEnable || cmd.Command?.UseForSingle\"\r\n            [allColumns]=\"allColumns\"\r\n            (btnClick)=\"onCommandClick($event)\"\r\n        ></bnrc-dynamic-form-toolbaritem>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:flex;justify-content:center;align-items:center}:host ::ng-deep button{margin-top:0!important}:host ::ng-deep .fd-popover-custom{max-width:none}:host.disableOverflow{column-gap:5px}button{align-items:center}button div{display:flex}button ::ng-deep span{height:auto!important}\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.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.UlvCommandDirective, selector: "[ulvCommandHandler]", inputs: ["ulvCommandHandler", "disable"], outputs: ["commandClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UlvContextMenuComponent, decorators: [{
             type: Component,
@@ -3720,11 +3704,11 @@ class UiCalendarComponent extends SapUiReportBaseComponent {
         this.context.fireEvent('datechange');
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiCalendarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiCalendarComponent, isStandalone: false, selector: "bsu-ui-calendar", usesInheritance: true, ngImport: i0, template: "<!--render container-->\n<ng-container\n    *ngTemplateOutlet=\"\n        renderCalendar;\n        context: {\n            $implicit: gridDataSource.data$ | async,\n            allChecked: allChecked$ | async,\n            groupby: groupby$ | async,\n            isCheckList: context.Setting.View?.IsCheckList,\n            columns: columns$ | async,\n            columnsCount: columnsCount$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            onlyInlineEdit: onlyInlineEdit$ | async,\n            secondaryColumns: secondaryColumns$ | async,\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\n            popin: (mobileOrTablet$ | async) || (secondaryColumnsCount$ | async) ? true : false,\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\n            conditionalFormats: conditionalFormats$ | async,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            mobileOrTablet: mobileOrTablet$ | async,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            title: title$ | async,\n            rtl: rtl$ | async,\n            hideToolbar: hideToolbar$ | async,\n            allColumns: allColumns,\n            gridSetting: gridSetting$ | async,\n            contentDensity: contentDensity$ | async,\n            formLayout: layout$ | async,\n            contextSetting: context.Setting,\n            hasSelected: hasSelected$ | async,\n            navigationArrow: navigationArrow$ | async,\n            inDialog: inDialog$ | async,\n            isMultiSelect: isMultiSelect$ | async,\n            viewSetting: viewSetting,\n            selectedMo: selectedMo$ | async\n        }\n    \"\n></ng-container>\n\n<ng-template\n    #renderCalendar\n    let-moDataList\n    let-allChecked=\"allChecked\"\n    let-isCheckList=\"isCheckList\"\n    let-columns=\"columns\"\n    let-columnsCount=\"columnsCount\"\n    let-groupby=\"groupby\"\n    let-secondaryColumns=\"secondaryColumns\"\n    let-contextMenuItems=\"contextMenuItems\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-access=\"access\"\n    let-toolbarButtons=\"toolbarButtons\"\n    let-popin=\"popin\"\n    let-mobileOrTablet=\"mobileOrTablet\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-gridSetting=\"gridSetting\"\n    let-contentDensity=\"contentDensity\"\n    let-formLayout=\"formLayout\"\n    let-rtl=\"rtl\"\n    let-hasSelected=\"hasSelected\"\n    let-navigationArrow=\"navigationArrow\"\n    let-inDialog=\"inDialog\"\n    let-selectedMo=\"selectedMo\"\n    let-contextSetting=\"contextSetting\"\n    let-viewSetting=\"viewSetting\"\n>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"hideToolbar\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [toolbarButtons]=\"toolbarButtons\"\n        [gridSetting]=\"gridSetting\"\n        [title]=\"title\"\n        [context]=\"context\"\n        [access]=\"access\"\n        [hasSelected]=\"hasSelected\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [moDataListCount]=\"moDataList.length\"\n        (sortClick)=\"onSortSettings(deviceName)\"\n        (groupbyClick)=\"onGroupbySettings(deviceName)\"\n        (columnClick)=\"onColumnSettings(deviceName)\"\n        (editModeClick)=\"onEditMode()\"\n    ></bsu-ulv-toolbar>\n    <bc-calendar-container\n        [inDialog]=\"inDialog\"\n        [contextSetting]=\"contextSetting\"\n        [viewSetting]=\"viewSetting\"\n        [isCheckList]=\"isCheckList\"\n        [selectedMo]=\"selectedMo\"\n        [allChecked]=\"allChecked\"\n        [moDataList]=\"moDataList\"\n        [access]=\"access\"\n        [parentHeight]=\"parentHeight\"\n        [groupby]=\"groupby\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [navigationArrow]=\"navigationArrow\"\n        [title]=\"title\"\n        [mobileOrTablet]=\"mobileOrTablet\"\n        [rtl]=\"rtl\"\n        [popin]=\"popin\"\n        [secondaryColumns]=\"secondaryColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [columns]=\"columns\"\n        [columnsCount]=\"columnsCount\"\n        [rowHoverable]=\"rowHoverable\"\n        [rowActivable]=\"rowActivable\"\n        [formLayout]=\"formLayout\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (sortAscending)=\"onSortAscending($event)\"\n        (sortDescending)=\"onSortDescending($event)\"\n        (filter)=\"onFilter($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (allCheckbox)=\"onAllCheckbox($event)\"\n        (expandClick)=\"(onExpandClick)\"\n        (deleteTask)=\"onDeleteTask($event)\"\n        (editTask)=\"onEditTask($event)\"\n        (daySelect)=\"onDaySelect($event)\"\n        (rangeSelect)=\"onRangeSelect($event)\"\n        (loadData)=\"onLoadData($event)\"\n    >\n    </bc-calendar-container>\n</ng-template>\n", styles: [":host{display:block;height:94%}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$4.CalendarContainerComponent, selector: "bc-calendar-container", inputs: ["calendarFields", "userCalendars", "viewSetting"], outputs: ["deleteTask", "editTask", "rangeSelect", "daySelect", "loadData"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiCalendarComponent, isStandalone: false, selector: "bsu-ui-calendar", usesInheritance: true, ngImport: i0, template: "<!--render container-->\n<ng-container\n    *ngTemplateOutlet=\"\n        renderCalendar;\n        context: {\n            $implicit: gridDataSource.data$ | async,\n            allChecked: allChecked$ | async,\n            groupby: groupby$ | async,\n            isCheckList: context.Setting.View?.IsCheckList,\n            columns: columns$ | async,\n            columnsCount: columnsCount$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            onlyInlineEdit: onlyInlineEdit$ | async,\n            secondaryColumns: secondaryColumns$ | async,\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\n            popin: (mobileOrTablet$ | async) || (secondaryColumnsCount$ | async) ? true : false,\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\n            conditionalFormats: conditionalFormats$ | async,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            mobileOrTablet: mobileOrTablet$ | async,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            title: title$ | async,\n            rtl: rtl$ | async,\n            hideToolbar: hideToolbar$ | async,\n            allColumns: allColumns,\n            gridSetting: gridSetting$ | async,\n            contentDensity: contentDensity$ | async,\n            formLayout: layout$ | async,\n            contextSetting: context.Setting,\n            hasSelected: hasSelected$ | async,\n            navigationArrow: navigationArrow$ | async,\n            inDialog: inDialog$ | async,\n            isMultiSelect: isMultiSelect$ | async,\n            viewSetting: viewSetting,\n            selectedMo: selectedMo$ | async\n        }\n    \"\n></ng-container>\n\n<ng-template\n    #renderCalendar\n    let-moDataList\n    let-allChecked=\"allChecked\"\n    let-isCheckList=\"isCheckList\"\n    let-columns=\"columns\"\n    let-columnsCount=\"columnsCount\"\n    let-groupby=\"groupby\"\n    let-secondaryColumns=\"secondaryColumns\"\n    let-contextMenuItems=\"contextMenuItems\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-access=\"access\"\n    let-toolbarButtons=\"toolbarButtons\"\n    let-popin=\"popin\"\n    let-mobileOrTablet=\"mobileOrTablet\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-gridSetting=\"gridSetting\"\n    let-contentDensity=\"contentDensity\"\n    let-formLayout=\"formLayout\"\n    let-rtl=\"rtl\"\n    let-hasSelected=\"hasSelected\"\n    let-navigationArrow=\"navigationArrow\"\n    let-inDialog=\"inDialog\"\n    let-selectedMo=\"selectedMo\"\n    let-contextSetting=\"contextSetting\"\n    let-viewSetting=\"viewSetting\"\n>\n   \n    <bc-calendar-container\n        [inDialog]=\"inDialog\"\n        [contextSetting]=\"contextSetting\"\n        [viewSetting]=\"viewSetting\"\n        [isCheckList]=\"isCheckList\"\n        [selectedMo]=\"selectedMo\"\n        [allChecked]=\"allChecked\"\n        [moDataList]=\"moDataList\"\n        [access]=\"access\"\n        [parentHeight]=\"parentHeight\"\n        [groupby]=\"groupby\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [navigationArrow]=\"navigationArrow\"\n        [title]=\"title\"\n        [mobileOrTablet]=\"mobileOrTablet\"\n        [rtl]=\"rtl\"\n        [popin]=\"popin\"\n        [secondaryColumns]=\"secondaryColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [columns]=\"columns\"\n        [columnsCount]=\"columnsCount\"\n        [rowHoverable]=\"rowHoverable\"\n        [rowActivable]=\"rowActivable\"\n        [formLayout]=\"formLayout\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (sortAscending)=\"onSortAscending($event)\"\n        (sortDescending)=\"onSortDescending($event)\"\n        (filter)=\"onFilter($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (allCheckbox)=\"onAllCheckbox($event)\"\n        (expandClick)=\"(onExpandClick)\"\n        (deleteTask)=\"onDeleteTask($event)\"\n        (editTask)=\"onEditTask($event)\"\n        (daySelect)=\"onDaySelect($event)\"\n        (rangeSelect)=\"onRangeSelect($event)\"\n        (loadData)=\"onLoadData($event)\"\n    >\n    </bc-calendar-container>\n</ng-template>\n", styles: [":host{display:block;height:94%}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2$4.CalendarContainerComponent, selector: "bc-calendar-container", inputs: ["calendarFields", "userCalendars", "viewSetting"], outputs: ["deleteTask", "editTask", "rangeSelect", "daySelect", "loadData"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiCalendarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-calendar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!--render container-->\n<ng-container\n    *ngTemplateOutlet=\"\n        renderCalendar;\n        context: {\n            $implicit: gridDataSource.data$ | async,\n            allChecked: allChecked$ | async,\n            groupby: groupby$ | async,\n            isCheckList: context.Setting.View?.IsCheckList,\n            columns: columns$ | async,\n            columnsCount: columnsCount$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            onlyInlineEdit: onlyInlineEdit$ | async,\n            secondaryColumns: secondaryColumns$ | async,\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\n            popin: (mobileOrTablet$ | async) || (secondaryColumnsCount$ | async) ? true : false,\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\n            conditionalFormats: conditionalFormats$ | async,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            mobileOrTablet: mobileOrTablet$ | async,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            title: title$ | async,\n            rtl: rtl$ | async,\n            hideToolbar: hideToolbar$ | async,\n            allColumns: allColumns,\n            gridSetting: gridSetting$ | async,\n            contentDensity: contentDensity$ | async,\n            formLayout: layout$ | async,\n            contextSetting: context.Setting,\n            hasSelected: hasSelected$ | async,\n            navigationArrow: navigationArrow$ | async,\n            inDialog: inDialog$ | async,\n            isMultiSelect: isMultiSelect$ | async,\n            viewSetting: viewSetting,\n            selectedMo: selectedMo$ | async\n        }\n    \"\n></ng-container>\n\n<ng-template\n    #renderCalendar\n    let-moDataList\n    let-allChecked=\"allChecked\"\n    let-isCheckList=\"isCheckList\"\n    let-columns=\"columns\"\n    let-columnsCount=\"columnsCount\"\n    let-groupby=\"groupby\"\n    let-secondaryColumns=\"secondaryColumns\"\n    let-contextMenuItems=\"contextMenuItems\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-access=\"access\"\n    let-toolbarButtons=\"toolbarButtons\"\n    let-popin=\"popin\"\n    let-mobileOrTablet=\"mobileOrTablet\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-gridSetting=\"gridSetting\"\n    let-contentDensity=\"contentDensity\"\n    let-formLayout=\"formLayout\"\n    let-rtl=\"rtl\"\n    let-hasSelected=\"hasSelected\"\n    let-navigationArrow=\"navigationArrow\"\n    let-inDialog=\"inDialog\"\n    let-selectedMo=\"selectedMo\"\n    let-contextSetting=\"contextSetting\"\n    let-viewSetting=\"viewSetting\"\n>\n    <bsu-ulv-toolbar\n        [hideToolbar]=\"hideToolbar\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [toolbarButtons]=\"toolbarButtons\"\n        [gridSetting]=\"gridSetting\"\n        [title]=\"title\"\n        [context]=\"context\"\n        [access]=\"access\"\n        [hasSelected]=\"hasSelected\"\n        [contentDensity]=\"contentDensity\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [moDataListCount]=\"moDataList.length\"\n        (sortClick)=\"onSortSettings(deviceName)\"\n        (groupbyClick)=\"onGroupbySettings(deviceName)\"\n        (columnClick)=\"onColumnSettings(deviceName)\"\n        (editModeClick)=\"onEditMode()\"\n    ></bsu-ulv-toolbar>\n    <bc-calendar-container\n        [inDialog]=\"inDialog\"\n        [contextSetting]=\"contextSetting\"\n        [viewSetting]=\"viewSetting\"\n        [isCheckList]=\"isCheckList\"\n        [selectedMo]=\"selectedMo\"\n        [allChecked]=\"allChecked\"\n        [moDataList]=\"moDataList\"\n        [access]=\"access\"\n        [parentHeight]=\"parentHeight\"\n        [groupby]=\"groupby\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [navigationArrow]=\"navigationArrow\"\n        [title]=\"title\"\n        [mobileOrTablet]=\"mobileOrTablet\"\n        [rtl]=\"rtl\"\n        [popin]=\"popin\"\n        [secondaryColumns]=\"secondaryColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [columns]=\"columns\"\n        [columnsCount]=\"columnsCount\"\n        [rowHoverable]=\"rowHoverable\"\n        [rowActivable]=\"rowActivable\"\n        [formLayout]=\"formLayout\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (sortAscending)=\"onSortAscending($event)\"\n        (sortDescending)=\"onSortDescending($event)\"\n        (filter)=\"onFilter($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (allCheckbox)=\"onAllCheckbox($event)\"\n        (expandClick)=\"(onExpandClick)\"\n        (deleteTask)=\"onDeleteTask($event)\"\n        (editTask)=\"onEditTask($event)\"\n        (daySelect)=\"onDaySelect($event)\"\n        (rangeSelect)=\"onRangeSelect($event)\"\n        (loadData)=\"onLoadData($event)\"\n    >\n    </bc-calendar-container>\n</ng-template>\n", styles: [":host{display:block;height:94%}\n"] }]
+            args: [{ selector: 'bsu-ui-calendar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!--render container-->\n<ng-container\n    *ngTemplateOutlet=\"\n        renderCalendar;\n        context: {\n            $implicit: gridDataSource.data$ | async,\n            allChecked: allChecked$ | async,\n            groupby: groupby$ | async,\n            isCheckList: context.Setting.View?.IsCheckList,\n            columns: columns$ | async,\n            columnsCount: columnsCount$ | async,\n            allowInlineEdit: allowInlineEdit$ | async,\n            inlineEditMode: inlineEditMode$ | async,\n            onlyInlineEdit: onlyInlineEdit$ | async,\n            secondaryColumns: secondaryColumns$ | async,\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\n            popin: (mobileOrTablet$ | async) || (secondaryColumnsCount$ | async) ? true : false,\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\n            conditionalFormats: conditionalFormats$ | async,\n            deviceName: deviceName$ | async,\n            deviceSize: deviceSize$ | async,\n            mobileOrTablet: mobileOrTablet$ | async,\n            access: context.Setting.Extra?.DefaultCommandsAccess,\n            title: title$ | async,\n            rtl: rtl$ | async,\n            hideToolbar: hideToolbar$ | async,\n            allColumns: allColumns,\n            gridSetting: gridSetting$ | async,\n            contentDensity: contentDensity$ | async,\n            formLayout: layout$ | async,\n            contextSetting: context.Setting,\n            hasSelected: hasSelected$ | async,\n            navigationArrow: navigationArrow$ | async,\n            inDialog: inDialog$ | async,\n            isMultiSelect: isMultiSelect$ | async,\n            viewSetting: viewSetting,\n            selectedMo: selectedMo$ | async\n        }\n    \"\n></ng-container>\n\n<ng-template\n    #renderCalendar\n    let-moDataList\n    let-allChecked=\"allChecked\"\n    let-isCheckList=\"isCheckList\"\n    let-columns=\"columns\"\n    let-columnsCount=\"columnsCount\"\n    let-groupby=\"groupby\"\n    let-secondaryColumns=\"secondaryColumns\"\n    let-contextMenuItems=\"contextMenuItems\"\n    let-conditionalFormats=\"conditionalFormats\"\n    let-deviceName=\"deviceName\"\n    let-deviceSize=\"deviceSize\"\n    let-access=\"access\"\n    let-toolbarButtons=\"toolbarButtons\"\n    let-popin=\"popin\"\n    let-mobileOrTablet=\"mobileOrTablet\"\n    let-title=\"title\"\n    let-inlineEditMode=\"inlineEditMode\"\n    let-allowInlineEdit=\"allowInlineEdit\"\n    let-hideToolbar=\"hideToolbar\"\n    let-gridSetting=\"gridSetting\"\n    let-contentDensity=\"contentDensity\"\n    let-formLayout=\"formLayout\"\n    let-rtl=\"rtl\"\n    let-hasSelected=\"hasSelected\"\n    let-navigationArrow=\"navigationArrow\"\n    let-inDialog=\"inDialog\"\n    let-selectedMo=\"selectedMo\"\n    let-contextSetting=\"contextSetting\"\n    let-viewSetting=\"viewSetting\"\n>\n   \n    <bc-calendar-container\n        [inDialog]=\"inDialog\"\n        [contextSetting]=\"contextSetting\"\n        [viewSetting]=\"viewSetting\"\n        [isCheckList]=\"isCheckList\"\n        [selectedMo]=\"selectedMo\"\n        [allChecked]=\"allChecked\"\n        [moDataList]=\"moDataList\"\n        [access]=\"access\"\n        [parentHeight]=\"parentHeight\"\n        [groupby]=\"groupby\"\n        [conditionalFormats]=\"conditionalFormats\"\n        [deviceName]=\"deviceName\"\n        [deviceSize]=\"deviceSize\"\n        [navigationArrow]=\"navigationArrow\"\n        [title]=\"title\"\n        [mobileOrTablet]=\"mobileOrTablet\"\n        [rtl]=\"rtl\"\n        [popin]=\"popin\"\n        [secondaryColumns]=\"secondaryColumns\"\n        [contextMenuItems]=\"contextMenuItems\"\n        [inlineEditMode]=\"inlineEditMode\"\n        [allowInlineEdit]=\"allowInlineEdit\"\n        [columns]=\"columns\"\n        [columnsCount]=\"columnsCount\"\n        [rowHoverable]=\"rowHoverable\"\n        [rowActivable]=\"rowActivable\"\n        [formLayout]=\"formLayout\"\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\n        (sortAscending)=\"onSortAscending($event)\"\n        (sortDescending)=\"onSortDescending($event)\"\n        (filter)=\"onFilter($event)\"\n        (rowCheck)=\"onRowCheck($event)\"\n        (rowClick)=\"onRowClick($event)\"\n        (allCheckbox)=\"onAllCheckbox($event)\"\n        (expandClick)=\"(onExpandClick)\"\n        (deleteTask)=\"onDeleteTask($event)\"\n        (editTask)=\"onEditTask($event)\"\n        (daySelect)=\"onDaySelect($event)\"\n        (rangeSelect)=\"onRangeSelect($event)\"\n        (loadData)=\"onLoadData($event)\"\n    >\n    </bc-calendar-container>\n</ng-template>\n", styles: [":host{display:block;height:94%}\n"] }]
         }] });
 
 class ReportTreeBaseComponent extends SapUiReportBaseComponent {
@@ -4512,11 +4496,11 @@ class UiTreeComponent extends ReportTreeBaseComponent {
         this.loadChildren(node);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiTreeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiTreeComponent, isStandalone: false, selector: "bsu-ui-tree", inputs: { showOkCancelButtons: "showOkCancelButtons" }, usesInheritance: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderTree;\r\n        context: {\r\n            $implicit: root$ | async,\r\n            moDataList: flatMoDataList,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            columns: visibleColumns$ | async,\r\n            groupby: groupby$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: context.Setting.View?.ConditionalFormats,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            title: title$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            gridSetting: gridSetting$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            hasSelected: hasSelected$ | async,\r\n            showOkCancelButtons: showOkCancelButtons,\r\n            hideOpenIcon: viewSetting?.HideOpenIcon,\r\n            openOnClick: viewSetting?.OpenOnClick,\r\n            onlyExecuteLeafNode: viewSetting?.OnlyExecuteLeafNode,\r\n            enableNodeReordering: viewSetting?.EnableNodeReordering,\r\n            viewSettingsContentDensity: viewSetting?.ContentDensity$Caption,\r\n            iconField: viewSetting?.IconField,\r\n            hideIcon: viewSetting?.HideIcon,\r\n            colorField: viewSetting?.ColorField,\r\n            hasInlineEditButton: viewSetting?.HasInlineEditButton,\r\n            hasInlineDeleteButton: viewSetting?.HasInlineDeleteButton,\r\n            selectedNode: selectedNode$ | async,\r\n            navigationArrow: navigationArrow$ | async,\r\n            collapseIcon: collapseIcon$ | async,\r\n            relationList: context.Setting.View.RelationList,\r\n            allColumns: allColumns,\r\n            rtl: rtl$ | async,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\r\n            isHetro: context.Setting.ClassNames.DataClass === 'Ul.HetroTreeUlvDataCtrlr',\r\n            selectedMo: selectedMo$ | async\r\n        }\r\n    \"\r\n></ng-container>\r\n\r\n<ng-template\r\n    #renderTree\r\n    let-root\r\n    let-moDataList=\"moDataList\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-access=\"access\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-groupby=\"groupby\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-showOkCancelButtons=\"showOkCancelButtons\"\r\n    let-selectedNode=\"selectedNode\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-collapseIcon=\"collapseIcon\"\r\n    let-rtl=\"rtl\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-relationList=\"relationList\"\r\n    let-isHetro=\"isHetro\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-hideOpenIcon=\"hideOpenIcon\"\r\n    let-openOnClick=\"openOnClick\"\r\n    let-enableNodeReordering=\"enableNodeReordering\"\r\n    let-onlyExecuteLeafNode=\"onlyExecuteLeafNode\"\r\n    let-iconField=\"iconField\"\r\n    let-colorField=\"colorField\"\r\n    let-allColumns=\"allColumns\"\r\n    let-hideIcon=\"hideIcon\"\r\n    let-viewSettingsContentDensity=\"viewSettingsContentDensity\"\r\n    let-hasInlineDeleteButton=\"hasInlineDeleteButton\"\r\n    let-hasInlineEditButton=\"hasInlineEditButton\"\r\n>\r\n    <bsu-ulv-toolbar\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [gridSetting]=\"gridSetting\"\r\n        [title]=\"title\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n        (sortClick)=\"onSortSettings(deviceName)\"\r\n        (groupbyClick)=\"onGroupbySettings(deviceName)\"\r\n        (columnClick)=\"onColumnSettings(deviceName)\"\r\n        (editModeClick)=\"onEditMode()\"\r\n    >\r\n        <button\r\n            fd-button\r\n            fd-toolbar-item\r\n            [fdType]=\"'transparent'\"\r\n            [glyph]=\"'collapse-all'\"\r\n            (click)=\"onCollapseAll()\"\r\n        ></button>\r\n        @if (!showOkCancelButtons && enableNodeReordering) {\r\n        <button\r\n            fd-button\r\n            fd-toolbar-item\r\n            [fdType]=\"'transparent'\"\r\n            [glyph]=\"'move'\"\r\n            (click)=\"onOpenMoveToDialog(selectedNode, deviceName, moveDialog)\"\r\n        ></button>\r\n        }\r\n    </bsu-ulv-toolbar>\r\n    <bsu-ui-tree-view\r\n        *untilInView=\"el\"\r\n        [leafCursorPointer]=\"onlyExecuteLeafNode && openOnClick\"\r\n        [rtl]=\"rtl\"\r\n        [hasInlineDeleteButton]=\"hasInlineDeleteButton\"\r\n        [hasInlineEditButton]=\"hasInlineEditButton\"\r\n        [relationList]=\"relationList\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [root]=\"root\"\r\n        [allColumns]=\"allColumns\"\r\n        [hideIcon]=\"hideIcon\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [iconField]=\"iconField\"\r\n        [colorField]=\"colorField\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [collapseIcon]=\"collapseIcon\"\r\n        [selectedNode]=\"selectedNode\"\r\n        [access]=\"access\"\r\n        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [enableNodeReordering]=\"enableNodeReordering\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [openOnClick]=\"openOnClick\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [moDataList]=\"moDataList\"\r\n        [groupby]=\"groupby\"\r\n        [isHetro]=\"isHetro\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        (checkChange)=\"onCheckChange($event)\"\r\n        (itemDrop)=\"onDrop($event)\"\r\n        (itemDragMoved)=\"onDragMoved($event)\"\r\n        (nodeUlvCommand)=\"onNodeUlvCommand($event)\"\r\n        (nodeViewClick)=\"onNodeViewClick($event)\"\r\n        (loadChildren)=\"onLoadChildren($event)\"\r\n        (nodeSelect)=\"onNodeSelect($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (createNew)=\"onCreateNew($event)\"\r\n    >\r\n    </bsu-ui-tree-view>\r\n    <ng-template let-dialog let-dialogConfig=\"dialogConfig\" #moveDialog>\r\n        <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n            <fd-dialog-header>\r\n                <h1 fd-title>{{ 'Move' | bbbTranslate }}</h1>\r\n                <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\r\n            </fd-dialog-header>\r\n\r\n            <fd-dialog-body>\r\n                <div class=\"move-to\" (keydown.enter)=\"onConfirmDialog(dialogSelectedNode)\">\r\n                    <bsu-ui-tree-view\r\n                        [rtl]=\"rtl\"\r\n                        [root]=\"root\"\r\n                        [access]=\"access\"\r\n                        [navigationArrow]=\"navigationArrow\"\r\n                        [collapseIcon]=\"collapseIcon\"\r\n                        [deviceName]=\"deviceName\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\r\n                        [enableNodeReordering]=\"enableNodeReordering\"\r\n                        [openOnClick]=\"openOnClick\"\r\n                        [selectedNode]=\"dialogSelectedNode\"\r\n                        [moDataList]=\"flatMoDataList\"\r\n                        [groupby]=\"groupby\"\r\n                        [isCheckList]=\"isCheckList\"\r\n                        [conditionalFormats]=\"conditionalFormats\"\r\n                        (loadChildren)=\"onLoadChildren($event)\"\r\n                        (nodeSelect)=\"onSelectNodeInMoveDialog($event)\"\r\n                    ></bsu-ui-tree-view>\r\n                </div>\r\n            </fd-dialog-body>\r\n\r\n            <fd-dialog-footer>\r\n                <ng-template fdkTemplate=\"footer\">\r\n                    <div fd-bar-right>\r\n                        <fd-button-bar\r\n                            fdType=\"emphasized\"\r\n                            [label]=\"'OK' | bbbTranslate\"\r\n                            (click)=\"onConfirmDialog(dialogSelectedNode)\"\r\n                        >\r\n                        </fd-button-bar>\r\n                        <fd-button-bar fd-initial-focus [label]=\"'Cancel' | bbbTranslate\" (click)=\"onDismissDialog()\">\r\n                        </fd-button-bar>\r\n                    </div>\r\n                </ng-template>\r\n            </fd-dialog-footer>\r\n        </fd-dialog>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{width:100%;box-sizing:border-box;display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$3.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiTreeViewComponent, selector: "bsu-ui-tree-view", inputs: ["root", "selectedNode", "isHetro", "leafCursorPointer", "relationList", "showOkCancelButtons", "enableNodeReordering", "collapseIcon", "iconField", "colorField", "viewSettingsContentDensity"], outputs: ["checkChange", "nodeSelect", "createNew", "loadChildren", "nodeViewClick", "nodeUlvCommand", "itemDrop", "itemDragMoved"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiTreeComponent, isStandalone: false, selector: "bsu-ui-tree", inputs: { showOkCancelButtons: "showOkCancelButtons" }, usesInheritance: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderTree;\r\n        context: {\r\n            $implicit: root$ | async,\r\n            moDataList: flatMoDataList,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            columns: visibleColumns$ | async,\r\n            groupby: groupby$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: context.Setting.View?.ConditionalFormats,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            title: title$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            gridSetting: gridSetting$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            hasSelected: hasSelected$ | async,\r\n            showOkCancelButtons: showOkCancelButtons,\r\n            hideOpenIcon: viewSetting?.HideOpenIcon,\r\n            openOnClick: viewSetting?.OpenOnClick,\r\n            onlyExecuteLeafNode: viewSetting?.OnlyExecuteLeafNode,\r\n            enableNodeReordering: viewSetting?.EnableNodeReordering,\r\n            viewSettingsContentDensity: viewSetting?.ContentDensity$Caption,\r\n            iconField: viewSetting?.IconField,\r\n            hideIcon: viewSetting?.HideIcon,\r\n            colorField: viewSetting?.ColorField,\r\n            hasInlineEditButton: viewSetting?.HasInlineEditButton,\r\n            hasInlineDeleteButton: viewSetting?.HasInlineDeleteButton,\r\n            selectedNode: selectedNode$ | async,\r\n            navigationArrow: navigationArrow$ | async,\r\n            collapseIcon: collapseIcon$ | async,\r\n            relationList: context.Setting.View.RelationList,\r\n            allColumns: allColumns,\r\n            rtl: rtl$ | async,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\r\n            isHetro: context.Setting.ClassNames.DataClass === 'Ul.HetroTreeUlvDataCtrlr',\r\n            selectedMo: selectedMo$ | async\r\n        }\r\n    \"\r\n></ng-container>\r\n\r\n<ng-template\r\n    #renderTree\r\n    let-root\r\n    let-moDataList=\"moDataList\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-access=\"access\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-groupby=\"groupby\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-showOkCancelButtons=\"showOkCancelButtons\"\r\n    let-selectedNode=\"selectedNode\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-collapseIcon=\"collapseIcon\"\r\n    let-rtl=\"rtl\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-relationList=\"relationList\"\r\n    let-isHetro=\"isHetro\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-hideOpenIcon=\"hideOpenIcon\"\r\n    let-openOnClick=\"openOnClick\"\r\n    let-enableNodeReordering=\"enableNodeReordering\"\r\n    let-onlyExecuteLeafNode=\"onlyExecuteLeafNode\"\r\n    let-iconField=\"iconField\"\r\n    let-colorField=\"colorField\"\r\n    let-allColumns=\"allColumns\"\r\n    let-hideIcon=\"hideIcon\"\r\n    let-viewSettingsContentDensity=\"viewSettingsContentDensity\"\r\n    let-hasInlineDeleteButton=\"hasInlineDeleteButton\"\r\n    let-hasInlineEditButton=\"hasInlineEditButton\"\r\n>\r\n   \r\n    <bsu-ui-tree-view\r\n        *untilInView=\"el\"\r\n        [leafCursorPointer]=\"onlyExecuteLeafNode && openOnClick\"\r\n        [rtl]=\"rtl\"\r\n        [hasInlineDeleteButton]=\"hasInlineDeleteButton\"\r\n        [hasInlineEditButton]=\"hasInlineEditButton\"\r\n        [relationList]=\"relationList\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [root]=\"root\"\r\n        [allColumns]=\"allColumns\"\r\n        [hideIcon]=\"hideIcon\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [iconField]=\"iconField\"\r\n        [colorField]=\"colorField\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [collapseIcon]=\"collapseIcon\"\r\n        [selectedNode]=\"selectedNode\"\r\n        [access]=\"access\"\r\n        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [enableNodeReordering]=\"enableNodeReordering\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [openOnClick]=\"openOnClick\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [moDataList]=\"moDataList\"\r\n        [groupby]=\"groupby\"\r\n        [isHetro]=\"isHetro\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        (checkChange)=\"onCheckChange($event)\"\r\n        (itemDrop)=\"onDrop($event)\"\r\n        (itemDragMoved)=\"onDragMoved($event)\"\r\n        (nodeUlvCommand)=\"onNodeUlvCommand($event)\"\r\n        (nodeViewClick)=\"onNodeViewClick($event)\"\r\n        (loadChildren)=\"onLoadChildren($event)\"\r\n        (nodeSelect)=\"onNodeSelect($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (createNew)=\"onCreateNew($event)\"\r\n    >\r\n    </bsu-ui-tree-view>\r\n    <ng-template let-dialog let-dialogConfig=\"dialogConfig\" #moveDialog>\r\n        <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n            <fd-dialog-header>\r\n                <h1 fd-title>{{ 'Move' | bbbTranslate }}</h1>\r\n                <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\r\n            </fd-dialog-header>\r\n\r\n            <fd-dialog-body>\r\n                <div class=\"move-to\" (keydown.enter)=\"onConfirmDialog(dialogSelectedNode)\">\r\n                    <bsu-ui-tree-view\r\n                        [rtl]=\"rtl\"\r\n                        [root]=\"root\"\r\n                        [access]=\"access\"\r\n                        [navigationArrow]=\"navigationArrow\"\r\n                        [collapseIcon]=\"collapseIcon\"\r\n                        [deviceName]=\"deviceName\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\r\n                        [enableNodeReordering]=\"enableNodeReordering\"\r\n                        [openOnClick]=\"openOnClick\"\r\n                        [selectedNode]=\"dialogSelectedNode\"\r\n                        [moDataList]=\"flatMoDataList\"\r\n                        [groupby]=\"groupby\"\r\n                        [isCheckList]=\"isCheckList\"\r\n                        [conditionalFormats]=\"conditionalFormats\"\r\n                        (loadChildren)=\"onLoadChildren($event)\"\r\n                        (nodeSelect)=\"onSelectNodeInMoveDialog($event)\"\r\n                    ></bsu-ui-tree-view>\r\n                </div>\r\n            </fd-dialog-body>\r\n\r\n            <fd-dialog-footer>\r\n                <ng-template fdkTemplate=\"footer\">\r\n                    <div fd-bar-right>\r\n                        <fd-button-bar\r\n                            fdType=\"emphasized\"\r\n                            [label]=\"'OK' | bbbTranslate\"\r\n                            (click)=\"onConfirmDialog(dialogSelectedNode)\"\r\n                        >\r\n                        </fd-button-bar>\r\n                        <fd-button-bar fd-initial-focus [label]=\"'Cancel' | bbbTranslate\" (click)=\"onDismissDialog()\">\r\n                        </fd-button-bar>\r\n                    </div>\r\n                </ng-template>\r\n            </fd-dialog-footer>\r\n        </fd-dialog>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{width:100%;box-sizing:border-box;display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$3.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: UiTreeViewComponent, selector: "bsu-ui-tree-view", inputs: ["root", "selectedNode", "isHetro", "leafCursorPointer", "relationList", "showOkCancelButtons", "enableNodeReordering", "collapseIcon", "iconField", "colorField", "viewSettingsContentDensity"], outputs: ["checkChange", "nodeSelect", "createNew", "loadChildren", "nodeViewClick", "nodeUlvCommand", "itemDrop", "itemDragMoved"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiTreeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-tree', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderTree;\r\n        context: {\r\n            $implicit: root$ | async,\r\n            moDataList: flatMoDataList,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            columns: visibleColumns$ | async,\r\n            groupby: groupby$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: context.Setting.View?.ConditionalFormats,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            title: title$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            gridSetting: gridSetting$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            hasSelected: hasSelected$ | async,\r\n            showOkCancelButtons: showOkCancelButtons,\r\n            hideOpenIcon: viewSetting?.HideOpenIcon,\r\n            openOnClick: viewSetting?.OpenOnClick,\r\n            onlyExecuteLeafNode: viewSetting?.OnlyExecuteLeafNode,\r\n            enableNodeReordering: viewSetting?.EnableNodeReordering,\r\n            viewSettingsContentDensity: viewSetting?.ContentDensity$Caption,\r\n            iconField: viewSetting?.IconField,\r\n            hideIcon: viewSetting?.HideIcon,\r\n            colorField: viewSetting?.ColorField,\r\n            hasInlineEditButton: viewSetting?.HasInlineEditButton,\r\n            hasInlineDeleteButton: viewSetting?.HasInlineDeleteButton,\r\n            selectedNode: selectedNode$ | async,\r\n            navigationArrow: navigationArrow$ | async,\r\n            collapseIcon: collapseIcon$ | async,\r\n            relationList: context.Setting.View.RelationList,\r\n            allColumns: allColumns,\r\n            rtl: rtl$ | async,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\r\n            isHetro: context.Setting.ClassNames.DataClass === 'Ul.HetroTreeUlvDataCtrlr',\r\n            selectedMo: selectedMo$ | async\r\n        }\r\n    \"\r\n></ng-container>\r\n\r\n<ng-template\r\n    #renderTree\r\n    let-root\r\n    let-moDataList=\"moDataList\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-access=\"access\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-groupby=\"groupby\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-showOkCancelButtons=\"showOkCancelButtons\"\r\n    let-selectedNode=\"selectedNode\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-collapseIcon=\"collapseIcon\"\r\n    let-rtl=\"rtl\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-relationList=\"relationList\"\r\n    let-isHetro=\"isHetro\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-hideOpenIcon=\"hideOpenIcon\"\r\n    let-openOnClick=\"openOnClick\"\r\n    let-enableNodeReordering=\"enableNodeReordering\"\r\n    let-onlyExecuteLeafNode=\"onlyExecuteLeafNode\"\r\n    let-iconField=\"iconField\"\r\n    let-colorField=\"colorField\"\r\n    let-allColumns=\"allColumns\"\r\n    let-hideIcon=\"hideIcon\"\r\n    let-viewSettingsContentDensity=\"viewSettingsContentDensity\"\r\n    let-hasInlineDeleteButton=\"hasInlineDeleteButton\"\r\n    let-hasInlineEditButton=\"hasInlineEditButton\"\r\n>\r\n    <bsu-ulv-toolbar\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [gridSetting]=\"gridSetting\"\r\n        [title]=\"title\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n        (sortClick)=\"onSortSettings(deviceName)\"\r\n        (groupbyClick)=\"onGroupbySettings(deviceName)\"\r\n        (columnClick)=\"onColumnSettings(deviceName)\"\r\n        (editModeClick)=\"onEditMode()\"\r\n    >\r\n        <button\r\n            fd-button\r\n            fd-toolbar-item\r\n            [fdType]=\"'transparent'\"\r\n            [glyph]=\"'collapse-all'\"\r\n            (click)=\"onCollapseAll()\"\r\n        ></button>\r\n        @if (!showOkCancelButtons && enableNodeReordering) {\r\n        <button\r\n            fd-button\r\n            fd-toolbar-item\r\n            [fdType]=\"'transparent'\"\r\n            [glyph]=\"'move'\"\r\n            (click)=\"onOpenMoveToDialog(selectedNode, deviceName, moveDialog)\"\r\n        ></button>\r\n        }\r\n    </bsu-ulv-toolbar>\r\n    <bsu-ui-tree-view\r\n        *untilInView=\"el\"\r\n        [leafCursorPointer]=\"onlyExecuteLeafNode && openOnClick\"\r\n        [rtl]=\"rtl\"\r\n        [hasInlineDeleteButton]=\"hasInlineDeleteButton\"\r\n        [hasInlineEditButton]=\"hasInlineEditButton\"\r\n        [relationList]=\"relationList\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [root]=\"root\"\r\n        [allColumns]=\"allColumns\"\r\n        [hideIcon]=\"hideIcon\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [iconField]=\"iconField\"\r\n        [colorField]=\"colorField\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [collapseIcon]=\"collapseIcon\"\r\n        [selectedNode]=\"selectedNode\"\r\n        [access]=\"access\"\r\n        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [enableNodeReordering]=\"enableNodeReordering\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [openOnClick]=\"openOnClick\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [moDataList]=\"moDataList\"\r\n        [groupby]=\"groupby\"\r\n        [isHetro]=\"isHetro\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        (checkChange)=\"onCheckChange($event)\"\r\n        (itemDrop)=\"onDrop($event)\"\r\n        (itemDragMoved)=\"onDragMoved($event)\"\r\n        (nodeUlvCommand)=\"onNodeUlvCommand($event)\"\r\n        (nodeViewClick)=\"onNodeViewClick($event)\"\r\n        (loadChildren)=\"onLoadChildren($event)\"\r\n        (nodeSelect)=\"onNodeSelect($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (createNew)=\"onCreateNew($event)\"\r\n    >\r\n    </bsu-ui-tree-view>\r\n    <ng-template let-dialog let-dialogConfig=\"dialogConfig\" #moveDialog>\r\n        <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n            <fd-dialog-header>\r\n                <h1 fd-title>{{ 'Move' | bbbTranslate }}</h1>\r\n                <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\r\n            </fd-dialog-header>\r\n\r\n            <fd-dialog-body>\r\n                <div class=\"move-to\" (keydown.enter)=\"onConfirmDialog(dialogSelectedNode)\">\r\n                    <bsu-ui-tree-view\r\n                        [rtl]=\"rtl\"\r\n                        [root]=\"root\"\r\n                        [access]=\"access\"\r\n                        [navigationArrow]=\"navigationArrow\"\r\n                        [collapseIcon]=\"collapseIcon\"\r\n                        [deviceName]=\"deviceName\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\r\n                        [enableNodeReordering]=\"enableNodeReordering\"\r\n                        [openOnClick]=\"openOnClick\"\r\n                        [selectedNode]=\"dialogSelectedNode\"\r\n                        [moDataList]=\"flatMoDataList\"\r\n                        [groupby]=\"groupby\"\r\n                        [isCheckList]=\"isCheckList\"\r\n                        [conditionalFormats]=\"conditionalFormats\"\r\n                        (loadChildren)=\"onLoadChildren($event)\"\r\n                        (nodeSelect)=\"onSelectNodeInMoveDialog($event)\"\r\n                    ></bsu-ui-tree-view>\r\n                </div>\r\n            </fd-dialog-body>\r\n\r\n            <fd-dialog-footer>\r\n                <ng-template fdkTemplate=\"footer\">\r\n                    <div fd-bar-right>\r\n                        <fd-button-bar\r\n                            fdType=\"emphasized\"\r\n                            [label]=\"'OK' | bbbTranslate\"\r\n                            (click)=\"onConfirmDialog(dialogSelectedNode)\"\r\n                        >\r\n                        </fd-button-bar>\r\n                        <fd-button-bar fd-initial-focus [label]=\"'Cancel' | bbbTranslate\" (click)=\"onDismissDialog()\">\r\n                        </fd-button-bar>\r\n                    </div>\r\n                </ng-template>\r\n            </fd-dialog-footer>\r\n        </fd-dialog>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{width:100%;box-sizing:border-box;display:inline-block}\n"] }]
+            args: [{ selector: 'bsu-ui-tree', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderTree;\r\n        context: {\r\n            $implicit: root$ | async,\r\n            moDataList: flatMoDataList,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            columns: visibleColumns$ | async,\r\n            groupby: groupby$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: context.Setting.View?.ConditionalFormats,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            title: title$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            gridSetting: gridSetting$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            hasSelected: hasSelected$ | async,\r\n            showOkCancelButtons: showOkCancelButtons,\r\n            hideOpenIcon: viewSetting?.HideOpenIcon,\r\n            openOnClick: viewSetting?.OpenOnClick,\r\n            onlyExecuteLeafNode: viewSetting?.OnlyExecuteLeafNode,\r\n            enableNodeReordering: viewSetting?.EnableNodeReordering,\r\n            viewSettingsContentDensity: viewSetting?.ContentDensity$Caption,\r\n            iconField: viewSetting?.IconField,\r\n            hideIcon: viewSetting?.HideIcon,\r\n            colorField: viewSetting?.ColorField,\r\n            hasInlineEditButton: viewSetting?.HasInlineEditButton,\r\n            hasInlineDeleteButton: viewSetting?.HasInlineDeleteButton,\r\n            selectedNode: selectedNode$ | async,\r\n            navigationArrow: navigationArrow$ | async,\r\n            collapseIcon: collapseIcon$ | async,\r\n            relationList: context.Setting.View.RelationList,\r\n            allColumns: allColumns,\r\n            rtl: rtl$ | async,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\r\n            isHetro: context.Setting.ClassNames.DataClass === 'Ul.HetroTreeUlvDataCtrlr',\r\n            selectedMo: selectedMo$ | async\r\n        }\r\n    \"\r\n></ng-container>\r\n\r\n<ng-template\r\n    #renderTree\r\n    let-root\r\n    let-moDataList=\"moDataList\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-access=\"access\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-groupby=\"groupby\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-showOkCancelButtons=\"showOkCancelButtons\"\r\n    let-selectedNode=\"selectedNode\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-collapseIcon=\"collapseIcon\"\r\n    let-rtl=\"rtl\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-relationList=\"relationList\"\r\n    let-isHetro=\"isHetro\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-hideOpenIcon=\"hideOpenIcon\"\r\n    let-openOnClick=\"openOnClick\"\r\n    let-enableNodeReordering=\"enableNodeReordering\"\r\n    let-onlyExecuteLeafNode=\"onlyExecuteLeafNode\"\r\n    let-iconField=\"iconField\"\r\n    let-colorField=\"colorField\"\r\n    let-allColumns=\"allColumns\"\r\n    let-hideIcon=\"hideIcon\"\r\n    let-viewSettingsContentDensity=\"viewSettingsContentDensity\"\r\n    let-hasInlineDeleteButton=\"hasInlineDeleteButton\"\r\n    let-hasInlineEditButton=\"hasInlineEditButton\"\r\n>\r\n   \r\n    <bsu-ui-tree-view\r\n        *untilInView=\"el\"\r\n        [leafCursorPointer]=\"onlyExecuteLeafNode && openOnClick\"\r\n        [rtl]=\"rtl\"\r\n        [hasInlineDeleteButton]=\"hasInlineDeleteButton\"\r\n        [hasInlineEditButton]=\"hasInlineEditButton\"\r\n        [relationList]=\"relationList\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [root]=\"root\"\r\n        [allColumns]=\"allColumns\"\r\n        [hideIcon]=\"hideIcon\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [iconField]=\"iconField\"\r\n        [colorField]=\"colorField\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [collapseIcon]=\"collapseIcon\"\r\n        [selectedNode]=\"selectedNode\"\r\n        [access]=\"access\"\r\n        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [enableNodeReordering]=\"enableNodeReordering\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [openOnClick]=\"openOnClick\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [moDataList]=\"moDataList\"\r\n        [groupby]=\"groupby\"\r\n        [isHetro]=\"isHetro\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        (checkChange)=\"onCheckChange($event)\"\r\n        (itemDrop)=\"onDrop($event)\"\r\n        (itemDragMoved)=\"onDragMoved($event)\"\r\n        (nodeUlvCommand)=\"onNodeUlvCommand($event)\"\r\n        (nodeViewClick)=\"onNodeViewClick($event)\"\r\n        (loadChildren)=\"onLoadChildren($event)\"\r\n        (nodeSelect)=\"onNodeSelect($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (createNew)=\"onCreateNew($event)\"\r\n    >\r\n    </bsu-ui-tree-view>\r\n    <ng-template let-dialog let-dialogConfig=\"dialogConfig\" #moveDialog>\r\n        <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n            <fd-dialog-header>\r\n                <h1 fd-title>{{ 'Move' | bbbTranslate }}</h1>\r\n                <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\r\n            </fd-dialog-header>\r\n\r\n            <fd-dialog-body>\r\n                <div class=\"move-to\" (keydown.enter)=\"onConfirmDialog(dialogSelectedNode)\">\r\n                    <bsu-ui-tree-view\r\n                        [rtl]=\"rtl\"\r\n                        [root]=\"root\"\r\n                        [access]=\"access\"\r\n                        [navigationArrow]=\"navigationArrow\"\r\n                        [collapseIcon]=\"collapseIcon\"\r\n                        [deviceName]=\"deviceName\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [viewSettingsContentDensity]=\"viewSettingsContentDensity\"\r\n                        [enableNodeReordering]=\"enableNodeReordering\"\r\n                        [openOnClick]=\"openOnClick\"\r\n                        [selectedNode]=\"dialogSelectedNode\"\r\n                        [moDataList]=\"flatMoDataList\"\r\n                        [groupby]=\"groupby\"\r\n                        [isCheckList]=\"isCheckList\"\r\n                        [conditionalFormats]=\"conditionalFormats\"\r\n                        (loadChildren)=\"onLoadChildren($event)\"\r\n                        (nodeSelect)=\"onSelectNodeInMoveDialog($event)\"\r\n                    ></bsu-ui-tree-view>\r\n                </div>\r\n            </fd-dialog-body>\r\n\r\n            <fd-dialog-footer>\r\n                <ng-template fdkTemplate=\"footer\">\r\n                    <div fd-bar-right>\r\n                        <fd-button-bar\r\n                            fdType=\"emphasized\"\r\n                            [label]=\"'OK' | bbbTranslate\"\r\n                            (click)=\"onConfirmDialog(dialogSelectedNode)\"\r\n                        >\r\n                        </fd-button-bar>\r\n                        <fd-button-bar fd-initial-focus [label]=\"'Cancel' | bbbTranslate\" (click)=\"onDismissDialog()\">\r\n                        </fd-button-bar>\r\n                    </div>\r\n                </ng-template>\r\n            </fd-dialog-footer>\r\n        </fd-dialog>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{width:100%;box-sizing:border-box;display:inline-block}\n"] }]
         }], propDecorators: { showOkCancelButtons: [{
                 type: Input
             }] } });
@@ -4671,7 +4655,7 @@ class FileViewerContentComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FileViewerContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FileViewerContentComponent, isStandalone: false, selector: "bsu-file-viewer-content", inputs: { fillWidth: "fillWidth", imageOnly: "imageOnly", isImageGallery: "isImageGallery", cardMode: "cardMode", showFooter: "showFooter", showContent: "showContent", selected: "selected", width: "width", deviceSize: "deviceSize", cardContentHeight: "cardContentHeight", file: "file", isThumbnail: "isThumbnail" }, outputs: { cantView: "cantView", imageLoaded: "imageLoaded" }, host: { properties: { "style.height": "this._height" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"cardMode ? cardTpl : file.isImage || imageOnly ? showImage : blobViewer\"\r\n></ng-container>\r\n\r\n<ng-template #showImage>\r\n    <div class=\"tw-flex tw-flex-col big-imgs-box\" [class.fill-width]=\"fillWidth\">\r\n        <div class=\"pics\" [class.tw-m-auto]=\"!fillWidth\">\r\n            <!-- <bsu-mask></bsu-mask> -->\r\n            <img\r\n                imgLazy\r\n                [imgLazy]=\"file.mediaUrl\"\r\n                [src]=\"file.mediaUrl\"\r\n                [style.width]=\"width\"\r\n                (imageLoaded)=\"imageLoaded.emit()\"\r\n            />\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n<ng-template #blobViewer>\r\n    @if(!hideContent()){\r\n    <bsu-blob-viewer\r\n        [file]=\"file\"\r\n        [style.width]=\"width\"\r\n        fillEmptySpace\r\n        [disable]=\"deviceSize !== 's'\"\r\n        [decrement]=\"'25px'\"\r\n    ></bsu-blob-viewer>\r\n    }@else{ }\r\n</ng-template>\r\n<ng-template #cardTpl>\r\n    <fd-card class=\"media\" [class.hideContent]=\"hideContent()\" [class.selected]=\"selected\">\r\n        <fd-card-content\r\n            style=\"text-align: center; padding: 0; margin: auto\"\r\n            [style.height]=\"cardContentHeight\"\r\n            [style.flex]=\"isThumbnail ? 0 : null\"\r\n        >\r\n            @if(hideContent() && file){\r\n            <figure fd-illustrated-message type=\"dialog\" [svgConfig]=\"sceneConfig\" svgAriaLabel=\"Illustration label\">\r\n                <figcaption fd-illustrated-message-figcaption>\r\n                    <h3 fd-illustrated-message-title>{{ 'Unable To Load File' | bbbTranslate }}</h3>\r\n                </figcaption>\r\n            </figure>\r\n            } @else{\r\n            <ng-container\r\n                *ngTemplateOutlet=\"!showContent ? thumbnailTpl : file.isImage || imageOnly ? showImage : blobViewer\"\r\n            ></ng-container>\r\n            }\r\n        </fd-card-content>\r\n    </fd-card>\r\n</ng-template>\r\n<ng-template #thumbnailTpl>\r\n    <img imgLazy [imgLazy]=\"file.thumbnailUrl\" [src]=\"file.thumbnailUrl\" [style.width]=\"width\" />\r\n</ng-template>\r\n", styles: [":host{width:100%;display:flex;min-height:100%;flex-direction:column}fd-card.hideContent{box-shadow:none}fd-card.selected{border:.25rem solid var(--sapList_SelectionBorderColor)}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i1$3.IllustratedMessageComponent, selector: "[fd-illustrated-message]", inputs: ["type", "svgConfig", "svgAriaLabel", "noSvg", "id", "class"] }, { kind: "component", type: i1$3.IllustratedMessageFigcaptionComponent, selector: "[fd-illustrated-message-figcaption]" }, { kind: "directive", type: i1$3.IllustratedMessageTitleDirective, selector: "[fd-illustrated-message-title]" }, { kind: "component", type: BlobViewerComponent, selector: "bsu-blob-viewer", inputs: ["file"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FileViewerContentComponent, isStandalone: false, selector: "bsu-file-viewer-content", inputs: { fillWidth: "fillWidth", imageOnly: "imageOnly", isImageGallery: "isImageGallery", cardMode: "cardMode", showFooter: "showFooter", showContent: "showContent", selected: "selected", width: "width", deviceSize: "deviceSize", cardContentHeight: "cardContentHeight", file: "file", isThumbnail: "isThumbnail" }, outputs: { cantView: "cantView", imageLoaded: "imageLoaded" }, host: { properties: { "style.height": "this._height" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"cardMode ? cardTpl : file.isImage || imageOnly ? showImage : blobViewer\"\r\n></ng-container>\r\n\r\n<ng-template #showImage>\r\n    <div class=\"tw-flex tw-flex-col big-imgs-box\" [class.fill-width]=\"fillWidth\">\r\n        <div class=\"pics\" [class.tw-m-auto]=\"!fillWidth\">\r\n            <!-- <bsu-mask></bsu-mask> -->\r\n            <img\r\n                imgLazy\r\n                [imgLazy]=\"file.mediaUrl\"\r\n                [src]=\"file.mediaUrl\"\r\n                [style.width]=\"width\"\r\n                (imageLoaded)=\"imageLoaded.emit()\"\r\n            />\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n<ng-template #blobViewer>\r\n    @if(!hideContent()){\r\n    <bsu-blob-viewer\r\n        [file]=\"file\"\r\n        [style.width]=\"width\"\r\n        fillEmptySpace\r\n        [disable]=\"deviceSize !== 's'\"\r\n        [decrement]=\"'25px'\"\r\n    ></bsu-blob-viewer>\r\n    }@else{ }\r\n</ng-template>\r\n<ng-template #cardTpl>\r\n    <fd-card class=\"media\" [class.hideContent]=\"hideContent()\" [class.selected]=\"selected\">\r\n        <fd-card-content\r\n            style=\"text-align: center; padding: 0; margin: auto\"\r\n            [style.height]=\"cardContentHeight\"\r\n            [style.flex]=\"isThumbnail ? 0 : null\"\r\n        >\r\n            @if(hideContent() && file){\r\n            <figure fd-illustrated-message type=\"dialog\" [svgConfig]=\"sceneConfig\" svgAriaLabel=\"Illustration label\">\r\n                <figcaption fd-illustrated-message-figcaption>\r\n                    <h3 fd-illustrated-message-title>{{ 'Unable To Load File' | bbbTranslate }}</h3>\r\n                </figcaption>\r\n            </figure>\r\n            } @else{\r\n            <ng-container\r\n                *ngTemplateOutlet=\"!showContent ? thumbnailTpl : file.isImage || imageOnly ? showImage : blobViewer\"\r\n            ></ng-container>\r\n            }\r\n        </fd-card-content>\r\n    </fd-card>\r\n</ng-template>\r\n<ng-template #thumbnailTpl>\r\n    <img imgLazy [imgLazy]=\"file.thumbnailUrl\" [src]=\"file.thumbnailUrl\" [style.width]=\"width\" />\r\n</ng-template>\r\n", styles: [":host{width:100%;display:flex;min-height:100%;flex-direction:column}fd-card.hideContent{box-shadow:none}fd-card.selected{border:.25rem solid var(--sapList_SelectionBorderColor)}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i1$3.IllustratedMessageComponent, selector: "[fd-illustrated-message]", inputs: ["type", "svgConfig", "svgAriaLabel", "noSvg", "id", "class"] }, { kind: "component", type: i1$3.IllustratedMessageFigcaptionComponent, selector: "[fd-illustrated-message-figcaption]" }, { kind: "directive", type: i1$3.IllustratedMessageTitleDirective, selector: "[fd-illustrated-message-title]" }, { kind: "component", type: BlobViewerComponent, selector: "bsu-blob-viewer", inputs: ["file"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FileViewerContentComponent, decorators: [{
             type: Component,
@@ -4959,7 +4943,7 @@ class FileViewerPopoverComponent extends BaseComponent {
         this.popoverOpened = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FileViewerPopoverComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FileViewerPopoverComponent, isStandalone: false, selector: "bsu-file-viewer-popover", inputs: { files: "files", file: "file", index: "index", deviceSize: "deviceSize", canDownload: "canDownload", disableRemove: "disableRemove", fdType: "fdType", attachmentViewType: "attachmentViewType" }, outputs: { remove: "remove" }, usesInheritance: true, ngImport: i0, template: "<div style=\"display: flex; align-items: center; column-gap: 1px\">\r\n    <button\r\n        fd-button\r\n        [fdPopoverTrigger]=\"deviceSize === 's' ? popoverMobile : popoverLarge\"\r\n        [label]=\"attachmentViewType === 1 ? ('\u0645\u0634\u0627\u0647\u062F\u0647' | bbbTranslate) : file.FileName || ''\"\r\n        [title]=\"attachmentViewType === 1 ? ('\u0645\u0634\u0627\u0647\u062F\u0647' | bbbTranslate) : file.FileName || ''\"\r\n        [glyph]=\"attachmentViewType === 1 ? '' : 'attachment'\"\r\n        [fdMenu]=\"deviceSize === 's' || attachmentViewType === 1 ? false : true\"\r\n        [fdType]=\"fdType\"\r\n        class=\"btn-actionsheet\"\r\n        (click)=\"popoverOpened = true\"\r\n    ></button>\r\n    <fd-popover\r\n        #popoverMobile\r\n        [mobile]=\"true\"\r\n        [mobileConfig]=\"{ title: file?.FileName || 'ShowFiles' | bbbTranslate, hasCloseButton: true }\"\r\n    >\r\n        <ng-template #popoverBodyContent>\r\n            @if(popoverOpened){\r\n            <ng-container\r\n                *ngTemplateOutlet=\"popoverbodyTpl; context: { $implicit: popoverMobile, mobile: true }\"\r\n            ></ng-container>\r\n            }\r\n        </ng-template>\r\n    </fd-popover>\r\n    <fd-popover #popoverLarge>\r\n        <fd-popover-body class=\"file-viewer-popover-body\">\r\n            @if(popoverOpened){\r\n            <ng-container\r\n                *ngTemplateOutlet=\"popoverbodyTpl; context: { $implicit: popoverLarge, mobile: false }\"\r\n            ></ng-container>\r\n            }\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n\r\n    @if (!disableRemove) {\r\n    <button fd-button glyph=\"delete\" (click)=\"remove.emit()\"></button>\r\n    }\r\n</div>\r\n\r\n<ng-template #popoverbodyTpl let-popover let-mobile=\"mobile\">\r\n    <!-- <div fd-popover-body-header>\r\n        <div fd-bar [cozy]=\"true\" id=\"popover-bar-header-3\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>{{ file.FileName }}</fd-bar-element>\r\n            </div>\r\n        </div>\r\n    </div> -->\r\n    <bsu-file-viewer-content\r\n        [file]=\"file\"\r\n        [width]=\"mobile ? '100vw' : '30vw'\"\r\n        [cardMode]=\"true\"\r\n        [showContent]=\"true\"\r\n        [showFooter]=\"true\"\r\n        [deviceSize]=\"deviceSize || 's'\"\r\n        (cantView)=\"hideFullScreen = true\"\r\n        [class.mobile]=\"mobile\"\r\n    ></bsu-file-viewer-content>\r\n    @if (canDownload) {\r\n    <div fd-popover-body-footer>\r\n        <bsu-barsa-bar-download-file\r\n            [isMobile]=\"mobile\"\r\n            [popover]=\"popover\"\r\n            [files]=\"files?.length ? files : [file]\"\r\n            [file]=\"file\"\r\n            [selectedIndex]=\"index\"\r\n            [deviceSize]=\"deviceSize || 's'\"\r\n            [hideFullScreen]=\"hideFullScreen\"\r\n        ></bsu-barsa-bar-download-file>\r\n    </div>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block}.btn-actionsheet{width:100%!important;max-width:100%!important}.box{display:flex;flex-direction:column;width:175px;height:120px;position:relative;border:1px solid #ccc}.box .box-content{height:85px;text-align:center;display:flex;align-items:center;justify-content:center}.box .box-content fd-icon{font-size:1.825rem;color:#e5e5e5}.box .box-file-download{background-color:#f5f5f5;border-top:1px solid #e5e5e5;display:flex;gap:.285rem}.box .box-file-download .icon{align-items:center;float:left;display:-webkit-box;display:-webkit-flex;display:flex;height:32px;-webkit-justify-content:center;justify-content:center;width:32px}.box .box-file-download .filename-wrapper{display:flex;overflow:hidden}.box .box-file-download .filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#777;font-size:12px;font-weight:700;line-height:16px;margin-top:8px;word-wrap:normal}.box .download-wrapper{display:none}.box.onside{background:#f5f5f5}.box.onside .box-content{display:none}.box.onside .box-file-download{border-top:none;height:85px}.box.onside .download-wrapper{display:flex;gap:.285rem;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$2.PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: ["fdPopoverTrigger"] }, { kind: "component", type: BarsaBarDownloadFileComponent, selector: "bsu-barsa-bar-download-file", inputs: ["popover", "file", "files", "hideFullScreen", "isMobile", "canPrint", "selectedIndex", "deviceSize"] }, { kind: "component", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: ["fillWidth", "imageOnly", "isImageGallery", "cardMode", "showFooter", "showContent", "selected", "width", "deviceSize", "cardContentHeight", "file", "isThumbnail"], outputs: ["cantView", "imageLoaded"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FileViewerPopoverComponent, isStandalone: false, selector: "bsu-file-viewer-popover", inputs: { files: "files", file: "file", index: "index", deviceSize: "deviceSize", canDownload: "canDownload", disableRemove: "disableRemove", fdType: "fdType", attachmentViewType: "attachmentViewType" }, outputs: { remove: "remove" }, usesInheritance: true, ngImport: i0, template: "<div style=\"display: flex; align-items: center; column-gap: 1px\">\r\n    <button\r\n        fd-button\r\n        [fdPopoverTrigger]=\"deviceSize === 's' ? popoverMobile : popoverLarge\"\r\n        [label]=\"attachmentViewType === 1 ? ('\u0645\u0634\u0627\u0647\u062F\u0647' | bbbTranslate) : file.FileName || ''\"\r\n        [title]=\"attachmentViewType === 1 ? ('\u0645\u0634\u0627\u0647\u062F\u0647' | bbbTranslate) : file.FileName || ''\"\r\n        [glyph]=\"attachmentViewType === 1 ? '' : 'attachment'\"\r\n        [fdMenu]=\"deviceSize === 's' || attachmentViewType === 1 ? false : true\"\r\n        [fdType]=\"fdType\"\r\n        class=\"btn-actionsheet\"\r\n        (click)=\"popoverOpened = true\"\r\n    ></button>\r\n    <fd-popover\r\n        #popoverMobile\r\n        [mobile]=\"true\"\r\n        [mobileConfig]=\"{ title: file?.FileName || 'ShowFiles' | bbbTranslate, hasCloseButton: true }\"\r\n    >\r\n        <ng-template #popoverBodyContent>\r\n            @if(popoverOpened){\r\n            <ng-container\r\n                *ngTemplateOutlet=\"popoverbodyTpl; context: { $implicit: popoverMobile, mobile: true }\"\r\n            ></ng-container>\r\n            }\r\n        </ng-template>\r\n    </fd-popover>\r\n    <fd-popover #popoverLarge>\r\n        <fd-popover-body class=\"file-viewer-popover-body\">\r\n            @if(popoverOpened){\r\n            <ng-container\r\n                *ngTemplateOutlet=\"popoverbodyTpl; context: { $implicit: popoverLarge, mobile: false }\"\r\n            ></ng-container>\r\n            }\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n\r\n    @if (!disableRemove) {\r\n    <button fd-button glyph=\"delete\" (click)=\"remove.emit()\"></button>\r\n    }\r\n</div>\r\n\r\n<ng-template #popoverbodyTpl let-popover let-mobile=\"mobile\">\r\n    <!-- <div fd-popover-body-header>\r\n        <div fd-bar [cozy]=\"true\" id=\"popover-bar-header-3\">\r\n            <div fd-bar-left>\r\n                <fd-bar-element>{{ file.FileName }}</fd-bar-element>\r\n            </div>\r\n        </div>\r\n    </div> -->\r\n    <bsu-file-viewer-content\r\n        [file]=\"file\"\r\n        [width]=\"mobile ? '100vw' : '30vw'\"\r\n        [cardMode]=\"true\"\r\n        [showContent]=\"true\"\r\n        [showFooter]=\"true\"\r\n        [deviceSize]=\"deviceSize || 's'\"\r\n        (cantView)=\"hideFullScreen = true\"\r\n        [class.mobile]=\"mobile\"\r\n    ></bsu-file-viewer-content>\r\n    @if (canDownload) {\r\n    <div fd-popover-body-footer>\r\n        <bsu-barsa-bar-download-file\r\n            [isMobile]=\"mobile\"\r\n            [popover]=\"popover\"\r\n            [files]=\"files?.length ? files : [file]\"\r\n            [file]=\"file\"\r\n            [selectedIndex]=\"index\"\r\n            [deviceSize]=\"deviceSize || 's'\"\r\n            [hideFullScreen]=\"hideFullScreen\"\r\n        ></bsu-barsa-bar-download-file>\r\n    </div>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block}.btn-actionsheet{width:100%!important;max-width:100%!important}.box{display:flex;flex-direction:column;width:175px;height:120px;position:relative;border:1px solid #ccc}.box .box-content{height:85px;text-align:center;display:flex;align-items:center;justify-content:center}.box .box-content fd-icon{font-size:1.825rem;color:#e5e5e5}.box .box-file-download{background-color:#f5f5f5;border-top:1px solid #e5e5e5;display:flex;gap:.285rem}.box .box-file-download .icon{align-items:center;float:left;display:-webkit-box;display:-webkit-flex;display:flex;height:32px;-webkit-justify-content:center;justify-content:center;width:32px}.box .box-file-download .filename-wrapper{display:flex;overflow:hidden}.box .box-file-download .filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#777;font-size:12px;font-weight:700;line-height:16px;margin-top:8px;word-wrap:normal}.box .download-wrapper{display:none}.box.onside{background:#f5f5f5}.box.onside .box-content{display:none}.box.onside .box-file-download{border-top:none;height:85px}.box.onside .download-wrapper{display:flex;gap:.285rem;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$3.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$3.PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: ["fdPopoverTrigger"] }, { kind: "component", type: BarsaBarDownloadFileComponent, selector: "bsu-barsa-bar-download-file", inputs: ["popover", "file", "files", "hideFullScreen", "isMobile", "canPrint", "selectedIndex", "deviceSize"] }, { kind: "component", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: ["fillWidth", "imageOnly", "isImageGallery", "cardMode", "showFooter", "showContent", "selected", "width", "deviceSize", "cardContentHeight", "file", "isThumbnail"], outputs: ["cantView", "imageLoaded"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FileViewerPopoverComponent, decorators: [{
             type: Component,
@@ -5558,9 +5542,6 @@ class UiReportContainerComponent extends SapUiReportBaseComponent {
         this._hidePaging();
         this._initBackground();
     }
-    onChangeView(viewSetting) {
-        this._changeView(viewSetting);
-    }
     _initBackground() {
         const { BackgroundColor, BackgroundImage, BackgroundRepeat } = this.viewSetting;
         const backgroundUrl = `url(${this._picFieldSource.transform(BackgroundImage?.FileId, 'ID', null)})`;
@@ -5575,10 +5556,13 @@ class UiReportContainerComponent extends SapUiReportBaseComponent {
         const viewCollection = this.context.Setting.ClassNames.CustomUi.Parameters.ViewCollection.MoDataList.filter((view) => !view.UiComponent.Settings?.Hidden);
         const defaultView = viewCollection.find((view) => view.UiComponent.Settings?.IsDefault) ?? viewCollection[0];
         this.viewCollection = viewCollection;
+        this._ulvMainService.setViewCollection(viewCollection);
+        this._ulvMainService.setHideTitle(this.viewSetting.HideTitleMode);
         this._changeView(defaultView);
+        this.selectedView$ = this._ulvMainService.selectedView$;
     }
     _changeView(uiComponent) {
-        this.selectedView = uiComponent;
+        this._ulvMainService.setSelectedView(uiComponent);
     }
     _hidePaging() {
         if (this.viewSetting?.HidePaging) {
@@ -5586,11 +5570,11 @@ class UiReportContainerComponent extends SapUiReportBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiReportContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiReportContainerComponent, isStandalone: false, selector: "bsu-ui-report-container", viewQueries: [{ propertyName: "tableView", first: true, predicate: ["renderTable"], descendants: true, static: true }, { propertyName: "cardListView", first: true, predicate: ["renderCardList"], descendants: true, static: true }, { propertyName: "listView", first: true, predicate: ["renderList"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<!--render container-->\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderContainer;\r\n        context: {\r\n            $implicit: gridDataSource.data$ | async,\r\n            allChecked: allChecked$ | async,\r\n            groupby: groupby$ | async,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            columns: columns$ | async,\r\n            columnsCount: columnsCount$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            onlyInlineEdit: onlyInlineEdit$ | async,\r\n            secondaryColumns: secondaryColumns$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            popin: (secondaryColumnsCount$ | async)!! > 0 ? true : false,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            mobileOrTablet: mobileOrTablet$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            title: title$ | async,\r\n            icon: viewSetting?.Icon,\r\n            rtl: rtl$ | async,\r\n            hideToolbar: (hideToolbar$ | async) === true || viewSetting.HideToolbar,\r\n            selectedView: selectedView,\r\n            viewCollection: viewCollection,\r\n            allColumns: allColumns,\r\n            gridSetting: gridSetting$ | async,\r\n            hasSummary: context.Setting.View?.HasSummaryRow,\r\n            contentDensity: contentDensity$ | async,\r\n            formLayout: layout$ | async,\r\n            hasSelected: hasSelected$ | async,\r\n            disableOverflowContextMenu: viewSetting.DisableOverflowContextMenu,\r\n            inlineEditWithoutSelection: viewSetting.InlineEditWithoutSelection,\r\n            showCreateForm: viewSetting.ShowCreateForm,\r\n            hideOpenIcon: viewSetting.HideOpenIcon,\r\n            hideTitleMode: viewSetting.HideTitleMode,\r\n            openOnClick: viewSetting.OpenOnClick,\r\n            navigationArrow: navigationArrow$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            typeDefId: context.Setting.Extra.Report.TypeDefId,\r\n            reportId: context.Setting.Extra.Report.Id,\r\n            listEditViewId: context.Setting.Extra.Report.ListEditViewId,\r\n            typeViewId: context.Setting.Extra.Report.TypeViewId,\r\n            formSetting: context.Setting.FormTemplate,\r\n            extraRelation: context.Setting.Extra?.Relation,\r\n            contextView: context.Setting.View,\r\n            cartableTemplates: cartableTemplates$ | async,\r\n            cartableChildsMo: cartableChildsMo$ | async,\r\n            disableResponsive: viewSetting.DisableResponsive,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            contextSetting: context.Setting,\r\n            customFieldInfo: context.Setting.CustomFieldInfo,\r\n            selectedMo: selectedMo$ | async,\r\n            hideSearchpanel: hideSearchpanel$ | async,\r\n            selectedCount: selectedCount$ | async,\r\n            gridFreeColumnSizing: gridFreeColumnSizing$ | async,\r\n            UlvMainCtrlr: context.Adapter?.UlvMainCtrlr,\r\n            allowGridColumnSort: context.ViewSetting?.AllowGridColumnSort,\r\n            hasInlineEditButton: viewSetting.HasInlineEditButton,\r\n            hasInlineDeleteButton: viewSetting.HasInlineDeleteButton,\r\n            pagingSetting: pagingSetting$ | async,\r\n            shortcutList: viewSetting.ShortcutList?.MoDataList,\r\n            simpleInlineEdit: simpleInlineEdit,\r\n            toolbarSettings: viewSetting.ToolbarSettings,\r\n            layoutInfo:layoutInfo\r\n        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\r\n    let-layoutInfo=\"layoutInfo\"\r\n    let-shortcutList=\"shortcutList\"\r\n    let-inlineEditWithoutSelection=\"inlineEditWithoutSelection\"\r\n    let-allChecked=\"allChecked\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-columns=\"columns\"\r\n    let-columnsCount=\"columnsCount\"\r\n    let-groupby=\"groupby\"\r\n    let-secondaryColumns=\"secondaryColumns\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-access=\"access\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-popin=\"popin\"\r\n    let-mobileOrTablet=\"mobileOrTablet\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-onlyInlineEdit=\"onlyInlineEdit\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-rtl=\"rtl\"\r\n    let-allColumns=\"allColumns\"\r\n    let-selectedView=\"selectedView\"\r\n    let-viewCollection=\"viewCollection\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-formLayout=\"formLayout\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-containerWidth=\"containerWidth\"\r\n    let-hasSummary=\"hasSummary\"\r\n    let-typeDefId=\"typeDefId\"\r\n    let-formSetting=\"formSetting\"\r\n    let-extraRelation=\"extraRelation\"\r\n    let-contextView=\"contextView\"\r\n    let-showCreateForm=\"showCreateForm\"\r\n    let-hideOpenIcon=\"hideOpenIcon\"\r\n    let-cartableTemplates=\"cartableTemplates\"\r\n    let-cartableChildsMo=\"cartableChildsMo\"\r\n    let-openOnClick=\"openOnClick\"\r\n    let-disableResponsive=\"disableResponsive\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-customFieldInfo=\"customFieldInfo\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-selectedCount=\"selectedCount\"\r\n    let-hideSearchpanel=\"hideSearchpanel\"\r\n    let-gridFreeColumnSizing=\"gridFreeColumnSizing\"\r\n    let-reportId=\"reportId\"\r\n    let-listEditViewId=\"listEditViewId\"\r\n    let-typeViewId=\"typeViewId\"\r\n    let-UlvMainCtrlr=\"UlvMainCtrlr\"\r\n    let-allowGridColumnSort=\"allowGridColumnSort\"\r\n    let-pagingSetting=\"pagingSetting\"\r\n    let-hasInlineDeleteButton=\"hasInlineDeleteButton\"\r\n    let-hasInlineEditButton=\"hasInlineEditButton\"\r\n    let-contextSetting=\"contextSetting\"\r\n    let-icon=\"icon\"\r\n    let-simpleInlineEdit=\"simpleInlineEdit\"\r\n    let-hideTitleMode=\"hideTitleMode\"\r\n    let-toolbarSettings=\"toolbarSettings\"\r\n>\r\n    @if (showCreateForm) {\r\n    <div>\r\n        <bsu-report-new-top-form\r\n            [extraRelation]=\"extraRelation\"\r\n            [moDataListCount]=\"moDataList.length\"\r\n            [selectedMo]=\"selectedMo\"\r\n            [formSetting]=\"formSetting\"\r\n            [typeDefId]=\"typeDefId\"\r\n            [inlineEditMode]=\"true\"\r\n            [isChecked]=\"true\"\r\n            (add)=\"onNewTopFormAdd($event)\"\r\n            (save)=\"onSaveTopForm($event)\"\r\n        ></bsu-report-new-top-form>\r\n    </div>\r\n    }\r\n    <bsu-ulv-toolbar\r\n        [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        [hideToolbar]=\"hideToolbar\"        \r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [toolbarButtons]=\"toolbarButtons | ulvToolbarSettings: toolbarSettings\"\r\n        [gridSetting]=\"gridSetting\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [title]=\"title\"\r\n        [hideTitle]=\"hideTitleMode === '1' || hideTitleMode === '3'\"\r\n        [icon]=\"icon\"\r\n        [access]=\"access\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [inDialog]=\"inDialog\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [viewCollection]=\"viewCollection\"\r\n        [reportView]=\"selectedView\"\r\n        [inlineEditMode]=\"allowInlineEdit && inlineEditMode && formSetting\"\r\n        [allowInlineEdit]=\"allowInlineEdit && formSetting\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        (sortClick)=\"onSortSettings($event)\"\r\n        (groupbyClick)=\"onGroupbySettings($event)\"\r\n        (columnClick)=\"onColumnSettings($event)\"\r\n        (editModeClick)=\"onEditMode()\"\r\n        (viewClick)=\"onChangeView($event)\"\r\n        (createNewInlineMo)=\"onToolbarCreateNewInlineMo()\"\r\n    ></bsu-ulv-toolbar>\r\n\r\n    <div\r\n        class=\"report-view\"\r\n        [shortcutRegister]=\"shortcutList\"\r\n        reportViewRenderer\r\n        [layoutInfo]=\"layoutInfo\"\r\n        [attr.reportCaption]=\"context.Setting.Extra.Report.Caption\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [hideTitle]=\"hideTitleMode === '2' || hideTitleMode === '3'\"\r\n        [groupSummary]=\"groupSummary\"\r\n        [hasInlineDeleteButton]=\"hasInlineDeleteButton\"\r\n        [hasInlineEditButton]=\"hasInlineEditButton\"\r\n        [contextSetting]=\"contextSetting\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [inlineEditWithoutSelection]=\"inlineEditWithoutSelection\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [reportId]=\"reportId\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [hideSearchpanel]=\"hideSearchpanel\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [selectedCount]=\"selectedCount\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [customFieldInfo]=\"customFieldInfo\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [openOnClick]=\"openOnClick\"\r\n        [contextView]=\"contextView\"\r\n        [containerWidth]=\"containerWidth\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [view]=\"selectedView\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [groupby]=\"groupby\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [formSetting]=\"formSetting\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [columns]=\"columns\"\r\n        [rtl]=\"rtl\"\r\n        [allColumns]=\"allColumns\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [formLayout]=\"formLayout\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        (escapeKey)=\"onEscapeKey($event)\"\r\n        (resetWorkflowState)=\"onResetWorkflowState($event)\"\r\n        (hasDetailsInRow)=\"onHasDetailsInRow($event, deviceSize)\"\r\n        (executeToolbarButton)=\"onExecuteToolbarButton($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (deselectAll)=\"onDeselectAll()\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (columnResized)=\"onColumnResized($event)\"\r\n        (cartableFormClosed)=\"onCartableFormClosed($event)\"\r\n        (createNewMo)=\"onCreateNewMo()\"\r\n        (updateMo)=\"onUpdateMo($event)\"\r\n        (mandatory)=\"onMandatory($event)\"\r\n        (sortSettingsChange)=\"onSortSettingsChange($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n        (resetGridSettings)=\"onResetGridSettings()\"\r\n    ></div>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%;background-repeat:repeat}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}.view-row{cursor:pointer}.header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:.5rem;background-color:var(--sapBaseColor)}.header span{font-size:1.7rem;font-weight:300}.btn-margin{margin:0 8px 0 0}.table-header-btn-group{display:flex;justify-content:flex-end;flex-grow:1}.context-command{margin:0 2px}.body-wrapper,.body-wrapper table{width:100%}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.root-grouped{color:green}.cell-expand{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.75rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:2rem;max-width:2rem}.single-select{min-width:2rem;max-width:2rem;width:2rem;text-align:center}.grid-editable-btn-group{display:flex;justify-content:space-evenly;align-items:center}.table-fixed{table-layout:fixed}.table-fixed td{overflow:hidden}::ng-deep span.fd-toolbar__spacer{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ShortcutRegisterDirective, selector: "[shortcutRegister]", inputs: ["shortcutRegister"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: ReportNewTopFormComponent, selector: "bsu-report-new-top-form", inputs: ["selectedMo"], outputs: ["add", "save"] }, { kind: "directive", type: ReportViewRendererDirective, selector: "[reportViewRenderer]", inputs: ["view", "moDataList", "allChecked", "contextSetting", "groupby", "isCheckList", "hasInlineDeleteButton", "hasInlineEditButton", "selectedCount", "hideToolbar", "toolbarButtons", "pagingSetting", "UlvMainCtrlr", "hasSummary", "relationList", "columns", "columnsCount", "secondaryColumns", "contextMenuItems", "conditionalFormats", "deviceName", "deviceSize", "mobileOrTablet", "access", "title", "customFieldInfo", "selectedMo", "allColumns", "viewSetting", "inlineEditMode", "onlyInlineEdit", "allowInlineEdit", "popin", "hasSelected", "layoutInfo", "formSetting", "disableOverflowContextMenu", "navigationArrow", "typeDefId", "reportId", "listEditViewId", "typeViewId", "containerWidth", "extraRelation", "contextView", "contentDensity", "hideOpenIcon", "hideTitle", "groupSummary", "openOnClick", "inDialog", "isMultiSelect", "rtl", "disableResponsive", "simpleInlineEdit", "hideSearchpanel", "gridFreeColumnSizing", "inlineEditWithoutSelection", "cartableTemplates", "cartableChildsMo"], outputs: ["editFormPanelCancel", "editFormPanelValueChange", "resetWorkflowState", "ulvCommandClick", "sortAscending", "sortDescending", "filter", "deselectAll", "rowCheck", "rowClick", "executeToolbarButton", "expandClick", "trackBySelectedFn", "cartableFormClosed", "createNewMo", "updateMo", "hasDetailsInRow", "allCheckbox", "mandatory", "editFormPanelSave", "columnResized", "selectNextInlineRecord", "workflowShareButtons", "escapeKey", "resetGridSettings", "sortSettingsChange"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }, { kind: "pipe", type: i2.ToolbarSettingsPipe, name: "ulvToolbarSettings" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiReportContainerComponent, isStandalone: false, selector: "bsu-ui-report-container", viewQueries: [{ propertyName: "tableView", first: true, predicate: ["renderTable"], descendants: true, static: true }, { propertyName: "cardListView", first: true, predicate: ["renderCardList"], descendants: true, static: true }, { propertyName: "listView", first: true, predicate: ["renderList"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<!--render container-->\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderContainer;\r\n        context: {\r\n            $implicit: gridDataSource.data$ | async,\r\n            allChecked: allChecked$ | async,\r\n            groupby: groupby$ | async,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            columns: columns$ | async,\r\n            columnsCount: columnsCount$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            onlyInlineEdit: onlyInlineEdit$ | async,\r\n            secondaryColumns: secondaryColumns$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            popin: (secondaryColumnsCount$ | async)!! > 0 ? true : false,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            mobileOrTablet: mobileOrTablet$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            title: title$ | async,\r\n            icon: viewSetting?.Icon,\r\n            rtl: rtl$ | async,\r\n            hideToolbar: (hideToolbar$ | async) === true || viewSetting.HideToolbar,\r\n            selectedView: selectedView$ | async,\r\n            viewCollection: viewCollection,\r\n            allColumns: allColumns,\r\n            gridSetting: gridSetting$ | async,\r\n            hasSummary: context.Setting.View?.HasSummaryRow,\r\n            contentDensity: contentDensity$ | async,\r\n            formLayout: layout$ | async,\r\n            hasSelected: hasSelected$ | async,\r\n            disableOverflowContextMenu: viewSetting.DisableOverflowContextMenu,\r\n            inlineEditWithoutSelection: viewSetting.InlineEditWithoutSelection,\r\n            showCreateForm: viewSetting.ShowCreateForm,\r\n            hideOpenIcon: viewSetting.HideOpenIcon,\r\n            hideTitleMode: viewSetting.HideTitleMode,\r\n            openOnClick: viewSetting.OpenOnClick,\r\n            navigationArrow: navigationArrow$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            typeDefId: context.Setting.Extra.Report.TypeDefId,\r\n            reportId: context.Setting.Extra.Report.Id,\r\n            listEditViewId: context.Setting.Extra.Report.ListEditViewId,\r\n            typeViewId: context.Setting.Extra.Report.TypeViewId,\r\n            formSetting: context.Setting.FormTemplate,\r\n            extraRelation: context.Setting.Extra?.Relation,\r\n            contextView: context.Setting.View,\r\n            cartableTemplates: cartableTemplates$ | async,\r\n            cartableChildsMo: cartableChildsMo$ | async,\r\n            disableResponsive: viewSetting.DisableResponsive,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            contextSetting: context.Setting,\r\n            customFieldInfo: context.Setting.CustomFieldInfo,\r\n            selectedMo: selectedMo$ | async,\r\n            hideSearchpanel: hideSearchpanel$ | async,\r\n            selectedCount: selectedCount$ | async,\r\n            gridFreeColumnSizing: gridFreeColumnSizing$ | async,\r\n            UlvMainCtrlr: context.Adapter?.UlvMainCtrlr,\r\n            allowGridColumnSort: context.ViewSetting?.AllowGridColumnSort,\r\n            hasInlineEditButton: viewSetting.HasInlineEditButton,\r\n            hasInlineDeleteButton: viewSetting.HasInlineDeleteButton,\r\n            pagingSetting: pagingSetting$ | async,\r\n            shortcutList: viewSetting.ShortcutList?.MoDataList,\r\n            simpleInlineEdit: simpleInlineEdit,\r\n            toolbarSettings: viewSetting.ToolbarSettings,\r\n            layoutInfo: layoutInfo\r\n        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\r\n    let-layoutInfo=\"layoutInfo\"\r\n    let-shortcutList=\"shortcutList\"\r\n    let-inlineEditWithoutSelection=\"inlineEditWithoutSelection\"\r\n    let-allChecked=\"allChecked\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-columns=\"columns\"\r\n    let-columnsCount=\"columnsCount\"\r\n    let-groupby=\"groupby\"\r\n    let-secondaryColumns=\"secondaryColumns\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-access=\"access\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-popin=\"popin\"\r\n    let-mobileOrTablet=\"mobileOrTablet\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-onlyInlineEdit=\"onlyInlineEdit\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-rtl=\"rtl\"\r\n    let-allColumns=\"allColumns\"\r\n    let-selectedView=\"selectedView\"\r\n    let-viewCollection=\"viewCollection\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-formLayout=\"formLayout\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-containerWidth=\"containerWidth\"\r\n    let-hasSummary=\"hasSummary\"\r\n    let-typeDefId=\"typeDefId\"\r\n    let-formSetting=\"formSetting\"\r\n    let-extraRelation=\"extraRelation\"\r\n    let-contextView=\"contextView\"\r\n    let-showCreateForm=\"showCreateForm\"\r\n    let-hideOpenIcon=\"hideOpenIcon\"\r\n    let-cartableTemplates=\"cartableTemplates\"\r\n    let-cartableChildsMo=\"cartableChildsMo\"\r\n    let-openOnClick=\"openOnClick\"\r\n    let-disableResponsive=\"disableResponsive\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-customFieldInfo=\"customFieldInfo\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-selectedCount=\"selectedCount\"\r\n    let-hideSearchpanel=\"hideSearchpanel\"\r\n    let-gridFreeColumnSizing=\"gridFreeColumnSizing\"\r\n    let-reportId=\"reportId\"\r\n    let-listEditViewId=\"listEditViewId\"\r\n    let-typeViewId=\"typeViewId\"\r\n    let-UlvMainCtrlr=\"UlvMainCtrlr\"\r\n    let-allowGridColumnSort=\"allowGridColumnSort\"\r\n    let-pagingSetting=\"pagingSetting\"\r\n    let-hasInlineDeleteButton=\"hasInlineDeleteButton\"\r\n    let-hasInlineEditButton=\"hasInlineEditButton\"\r\n    let-contextSetting=\"contextSetting\"\r\n    let-icon=\"icon\"\r\n    let-simpleInlineEdit=\"simpleInlineEdit\"\r\n    let-hideTitleMode=\"hideTitleMode\"\r\n    let-toolbarSettings=\"toolbarSettings\"\r\n>\r\n    @if (showCreateForm) {\r\n    <div>\r\n        <bsu-report-new-top-form\r\n            [extraRelation]=\"extraRelation\"\r\n            [moDataListCount]=\"moDataList.length\"\r\n            [selectedMo]=\"selectedMo\"\r\n            [formSetting]=\"formSetting\"\r\n            [typeDefId]=\"typeDefId\"\r\n            [inlineEditMode]=\"true\"\r\n            [isChecked]=\"true\"\r\n            (add)=\"onNewTopFormAdd($event)\"\r\n            (save)=\"onSaveTopForm($event)\"\r\n        ></bsu-report-new-top-form>\r\n    </div>\r\n    } @if(selectedView){\r\n    <div\r\n        class=\"report-view\"\r\n        [shortcutRegister]=\"shortcutList\"\r\n        reportViewRenderer\r\n        [layoutInfo]=\"layoutInfo\"\r\n        [attr.reportCaption]=\"context.Setting.Extra.Report.Caption\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [hideTitle]=\"hideTitleMode === '2' || hideTitleMode === '3'\"\r\n        [groupSummary]=\"groupSummary\"\r\n        [hasInlineDeleteButton]=\"hasInlineDeleteButton\"\r\n        [hasInlineEditButton]=\"hasInlineEditButton\"\r\n        [contextSetting]=\"contextSetting\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [inlineEditWithoutSelection]=\"inlineEditWithoutSelection\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [reportId]=\"reportId\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [hideSearchpanel]=\"hideSearchpanel\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [selectedCount]=\"selectedCount\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [customFieldInfo]=\"customFieldInfo\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [openOnClick]=\"openOnClick\"\r\n        [contextView]=\"contextView\"\r\n        [containerWidth]=\"containerWidth\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [view]=\"selectedView\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [groupby]=\"groupby\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [formSetting]=\"formSetting\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [columns]=\"columns\"\r\n        [rtl]=\"rtl\"\r\n        [allColumns]=\"allColumns\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [formLayout]=\"formLayout\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        (escapeKey)=\"onEscapeKey($event)\"\r\n        (resetWorkflowState)=\"onResetWorkflowState($event)\"\r\n        (hasDetailsInRow)=\"onHasDetailsInRow($event, deviceSize)\"\r\n        (executeToolbarButton)=\"onExecuteToolbarButton($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (deselectAll)=\"onDeselectAll()\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (columnResized)=\"onColumnResized($event)\"\r\n        (cartableFormClosed)=\"onCartableFormClosed($event)\"\r\n        (createNewMo)=\"onCreateNewMo()\"\r\n        (updateMo)=\"onUpdateMo($event)\"\r\n        (mandatory)=\"onMandatory($event)\"\r\n        (sortSettingsChange)=\"onSortSettingsChange($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n        (resetGridSettings)=\"onResetGridSettings()\"\r\n    ></div>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%;background-repeat:repeat}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}.view-row{cursor:pointer}.header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:.5rem;background-color:var(--sapBaseColor)}.header span{font-size:1.7rem;font-weight:300}.btn-margin{margin:0 8px 0 0}.table-header-btn-group{display:flex;justify-content:flex-end;flex-grow:1}.context-command{margin:0 2px}.body-wrapper,.body-wrapper table{width:100%}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.root-grouped{color:green}.cell-expand{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.75rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:2rem;max-width:2rem}.single-select{min-width:2rem;max-width:2rem;width:2rem;text-align:center}.grid-editable-btn-group{display:flex;justify-content:space-evenly;align-items:center}.table-fixed{table-layout:fixed}.table-fixed td{overflow:hidden}::ng-deep span.fd-toolbar__spacer{display:none}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ShortcutRegisterDirective, selector: "[shortcutRegister]", inputs: ["shortcutRegister"] }, { kind: "component", type: ReportNewTopFormComponent, selector: "bsu-report-new-top-form", inputs: ["selectedMo"], outputs: ["add", "save"] }, { kind: "directive", type: ReportViewRendererDirective, selector: "[reportViewRenderer]", inputs: ["view", "moDataList", "allChecked", "contextSetting", "groupby", "isCheckList", "hasInlineDeleteButton", "hasInlineEditButton", "selectedCount", "hideToolbar", "toolbarButtons", "pagingSetting", "UlvMainCtrlr", "hasSummary", "relationList", "columns", "columnsCount", "secondaryColumns", "contextMenuItems", "conditionalFormats", "deviceName", "deviceSize", "mobileOrTablet", "access", "title", "customFieldInfo", "selectedMo", "allColumns", "viewSetting", "inlineEditMode", "onlyInlineEdit", "allowInlineEdit", "popin", "hasSelected", "layoutInfo", "formSetting", "disableOverflowContextMenu", "navigationArrow", "typeDefId", "reportId", "listEditViewId", "typeViewId", "containerWidth", "extraRelation", "contextView", "contentDensity", "hideOpenIcon", "hideTitle", "groupSummary", "openOnClick", "inDialog", "isMultiSelect", "rtl", "disableResponsive", "simpleInlineEdit", "hideSearchpanel", "gridFreeColumnSizing", "inlineEditWithoutSelection", "cartableTemplates", "cartableChildsMo"], outputs: ["editFormPanelCancel", "editFormPanelValueChange", "resetWorkflowState", "ulvCommandClick", "sortAscending", "sortDescending", "filter", "deselectAll", "rowCheck", "rowClick", "executeToolbarButton", "expandClick", "trackBySelectedFn", "cartableFormClosed", "createNewMo", "updateMo", "hasDetailsInRow", "allCheckbox", "mandatory", "editFormPanelSave", "columnResized", "selectNextInlineRecord", "workflowShareButtons", "escapeKey", "resetGridSettings", "sortSettingsChange"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiReportContainerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-report-container', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!--render container-->\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderContainer;\r\n        context: {\r\n            $implicit: gridDataSource.data$ | async,\r\n            allChecked: allChecked$ | async,\r\n            groupby: groupby$ | async,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            columns: columns$ | async,\r\n            columnsCount: columnsCount$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            onlyInlineEdit: onlyInlineEdit$ | async,\r\n            secondaryColumns: secondaryColumns$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            popin: (secondaryColumnsCount$ | async)!! > 0 ? true : false,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            mobileOrTablet: mobileOrTablet$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            title: title$ | async,\r\n            icon: viewSetting?.Icon,\r\n            rtl: rtl$ | async,\r\n            hideToolbar: (hideToolbar$ | async) === true || viewSetting.HideToolbar,\r\n            selectedView: selectedView,\r\n            viewCollection: viewCollection,\r\n            allColumns: allColumns,\r\n            gridSetting: gridSetting$ | async,\r\n            hasSummary: context.Setting.View?.HasSummaryRow,\r\n            contentDensity: contentDensity$ | async,\r\n            formLayout: layout$ | async,\r\n            hasSelected: hasSelected$ | async,\r\n            disableOverflowContextMenu: viewSetting.DisableOverflowContextMenu,\r\n            inlineEditWithoutSelection: viewSetting.InlineEditWithoutSelection,\r\n            showCreateForm: viewSetting.ShowCreateForm,\r\n            hideOpenIcon: viewSetting.HideOpenIcon,\r\n            hideTitleMode: viewSetting.HideTitleMode,\r\n            openOnClick: viewSetting.OpenOnClick,\r\n            navigationArrow: navigationArrow$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            typeDefId: context.Setting.Extra.Report.TypeDefId,\r\n            reportId: context.Setting.Extra.Report.Id,\r\n            listEditViewId: context.Setting.Extra.Report.ListEditViewId,\r\n            typeViewId: context.Setting.Extra.Report.TypeViewId,\r\n            formSetting: context.Setting.FormTemplate,\r\n            extraRelation: context.Setting.Extra?.Relation,\r\n            contextView: context.Setting.View,\r\n            cartableTemplates: cartableTemplates$ | async,\r\n            cartableChildsMo: cartableChildsMo$ | async,\r\n            disableResponsive: viewSetting.DisableResponsive,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            contextSetting: context.Setting,\r\n            customFieldInfo: context.Setting.CustomFieldInfo,\r\n            selectedMo: selectedMo$ | async,\r\n            hideSearchpanel: hideSearchpanel$ | async,\r\n            selectedCount: selectedCount$ | async,\r\n            gridFreeColumnSizing: gridFreeColumnSizing$ | async,\r\n            UlvMainCtrlr: context.Adapter?.UlvMainCtrlr,\r\n            allowGridColumnSort: context.ViewSetting?.AllowGridColumnSort,\r\n            hasInlineEditButton: viewSetting.HasInlineEditButton,\r\n            hasInlineDeleteButton: viewSetting.HasInlineDeleteButton,\r\n            pagingSetting: pagingSetting$ | async,\r\n            shortcutList: viewSetting.ShortcutList?.MoDataList,\r\n            simpleInlineEdit: simpleInlineEdit,\r\n            toolbarSettings: viewSetting.ToolbarSettings,\r\n            layoutInfo:layoutInfo\r\n        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\r\n    let-layoutInfo=\"layoutInfo\"\r\n    let-shortcutList=\"shortcutList\"\r\n    let-inlineEditWithoutSelection=\"inlineEditWithoutSelection\"\r\n    let-allChecked=\"allChecked\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-columns=\"columns\"\r\n    let-columnsCount=\"columnsCount\"\r\n    let-groupby=\"groupby\"\r\n    let-secondaryColumns=\"secondaryColumns\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-access=\"access\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-popin=\"popin\"\r\n    let-mobileOrTablet=\"mobileOrTablet\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-onlyInlineEdit=\"onlyInlineEdit\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-rtl=\"rtl\"\r\n    let-allColumns=\"allColumns\"\r\n    let-selectedView=\"selectedView\"\r\n    let-viewCollection=\"viewCollection\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-formLayout=\"formLayout\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-containerWidth=\"containerWidth\"\r\n    let-hasSummary=\"hasSummary\"\r\n    let-typeDefId=\"typeDefId\"\r\n    let-formSetting=\"formSetting\"\r\n    let-extraRelation=\"extraRelation\"\r\n    let-contextView=\"contextView\"\r\n    let-showCreateForm=\"showCreateForm\"\r\n    let-hideOpenIcon=\"hideOpenIcon\"\r\n    let-cartableTemplates=\"cartableTemplates\"\r\n    let-cartableChildsMo=\"cartableChildsMo\"\r\n    let-openOnClick=\"openOnClick\"\r\n    let-disableResponsive=\"disableResponsive\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-customFieldInfo=\"customFieldInfo\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-selectedCount=\"selectedCount\"\r\n    let-hideSearchpanel=\"hideSearchpanel\"\r\n    let-gridFreeColumnSizing=\"gridFreeColumnSizing\"\r\n    let-reportId=\"reportId\"\r\n    let-listEditViewId=\"listEditViewId\"\r\n    let-typeViewId=\"typeViewId\"\r\n    let-UlvMainCtrlr=\"UlvMainCtrlr\"\r\n    let-allowGridColumnSort=\"allowGridColumnSort\"\r\n    let-pagingSetting=\"pagingSetting\"\r\n    let-hasInlineDeleteButton=\"hasInlineDeleteButton\"\r\n    let-hasInlineEditButton=\"hasInlineEditButton\"\r\n    let-contextSetting=\"contextSetting\"\r\n    let-icon=\"icon\"\r\n    let-simpleInlineEdit=\"simpleInlineEdit\"\r\n    let-hideTitleMode=\"hideTitleMode\"\r\n    let-toolbarSettings=\"toolbarSettings\"\r\n>\r\n    @if (showCreateForm) {\r\n    <div>\r\n        <bsu-report-new-top-form\r\n            [extraRelation]=\"extraRelation\"\r\n            [moDataListCount]=\"moDataList.length\"\r\n            [selectedMo]=\"selectedMo\"\r\n            [formSetting]=\"formSetting\"\r\n            [typeDefId]=\"typeDefId\"\r\n            [inlineEditMode]=\"true\"\r\n            [isChecked]=\"true\"\r\n            (add)=\"onNewTopFormAdd($event)\"\r\n            (save)=\"onSaveTopForm($event)\"\r\n        ></bsu-report-new-top-form>\r\n    </div>\r\n    }\r\n    <bsu-ulv-toolbar\r\n        [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        [hideToolbar]=\"hideToolbar\"        \r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [toolbarButtons]=\"toolbarButtons | ulvToolbarSettings: toolbarSettings\"\r\n        [gridSetting]=\"gridSetting\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [title]=\"title\"\r\n        [hideTitle]=\"hideTitleMode === '1' || hideTitleMode === '3'\"\r\n        [icon]=\"icon\"\r\n        [access]=\"access\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [inDialog]=\"inDialog\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [viewCollection]=\"viewCollection\"\r\n        [reportView]=\"selectedView\"\r\n        [inlineEditMode]=\"allowInlineEdit && inlineEditMode && formSetting\"\r\n        [allowInlineEdit]=\"allowInlineEdit && formSetting\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        (sortClick)=\"onSortSettings($event)\"\r\n        (groupbyClick)=\"onGroupbySettings($event)\"\r\n        (columnClick)=\"onColumnSettings($event)\"\r\n        (editModeClick)=\"onEditMode()\"\r\n        (viewClick)=\"onChangeView($event)\"\r\n        (createNewInlineMo)=\"onToolbarCreateNewInlineMo()\"\r\n    ></bsu-ulv-toolbar>\r\n\r\n    <div\r\n        class=\"report-view\"\r\n        [shortcutRegister]=\"shortcutList\"\r\n        reportViewRenderer\r\n        [layoutInfo]=\"layoutInfo\"\r\n        [attr.reportCaption]=\"context.Setting.Extra.Report.Caption\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [hideTitle]=\"hideTitleMode === '2' || hideTitleMode === '3'\"\r\n        [groupSummary]=\"groupSummary\"\r\n        [hasInlineDeleteButton]=\"hasInlineDeleteButton\"\r\n        [hasInlineEditButton]=\"hasInlineEditButton\"\r\n        [contextSetting]=\"contextSetting\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [inlineEditWithoutSelection]=\"inlineEditWithoutSelection\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [reportId]=\"reportId\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [hideSearchpanel]=\"hideSearchpanel\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [selectedCount]=\"selectedCount\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [customFieldInfo]=\"customFieldInfo\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [openOnClick]=\"openOnClick\"\r\n        [contextView]=\"contextView\"\r\n        [containerWidth]=\"containerWidth\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [view]=\"selectedView\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [groupby]=\"groupby\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [formSetting]=\"formSetting\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [columns]=\"columns\"\r\n        [rtl]=\"rtl\"\r\n        [allColumns]=\"allColumns\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [formLayout]=\"formLayout\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        (escapeKey)=\"onEscapeKey($event)\"\r\n        (resetWorkflowState)=\"onResetWorkflowState($event)\"\r\n        (hasDetailsInRow)=\"onHasDetailsInRow($event, deviceSize)\"\r\n        (executeToolbarButton)=\"onExecuteToolbarButton($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (deselectAll)=\"onDeselectAll()\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (columnResized)=\"onColumnResized($event)\"\r\n        (cartableFormClosed)=\"onCartableFormClosed($event)\"\r\n        (createNewMo)=\"onCreateNewMo()\"\r\n        (updateMo)=\"onUpdateMo($event)\"\r\n        (mandatory)=\"onMandatory($event)\"\r\n        (sortSettingsChange)=\"onSortSettingsChange($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n        (resetGridSettings)=\"onResetGridSettings()\"\r\n    ></div>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%;background-repeat:repeat}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}.view-row{cursor:pointer}.header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:.5rem;background-color:var(--sapBaseColor)}.header span{font-size:1.7rem;font-weight:300}.btn-margin{margin:0 8px 0 0}.table-header-btn-group{display:flex;justify-content:flex-end;flex-grow:1}.context-command{margin:0 2px}.body-wrapper,.body-wrapper table{width:100%}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.root-grouped{color:green}.cell-expand{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.75rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:2rem;max-width:2rem}.single-select{min-width:2rem;max-width:2rem;width:2rem;text-align:center}.grid-editable-btn-group{display:flex;justify-content:space-evenly;align-items:center}.table-fixed{table-layout:fixed}.table-fixed td{overflow:hidden}::ng-deep span.fd-toolbar__spacer{display:none}\n"] }]
+            args: [{ selector: 'bsu-ui-report-container', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!--render container-->\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderContainer;\r\n        context: {\r\n            $implicit: gridDataSource.data$ | async,\r\n            allChecked: allChecked$ | async,\r\n            groupby: groupby$ | async,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            columns: columns$ | async,\r\n            columnsCount: columnsCount$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            onlyInlineEdit: onlyInlineEdit$ | async,\r\n            secondaryColumns: secondaryColumns$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            popin: (secondaryColumnsCount$ | async)!! > 0 ? true : false,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            mobileOrTablet: mobileOrTablet$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            title: title$ | async,\r\n            icon: viewSetting?.Icon,\r\n            rtl: rtl$ | async,\r\n            hideToolbar: (hideToolbar$ | async) === true || viewSetting.HideToolbar,\r\n            selectedView: selectedView$ | async,\r\n            viewCollection: viewCollection,\r\n            allColumns: allColumns,\r\n            gridSetting: gridSetting$ | async,\r\n            hasSummary: context.Setting.View?.HasSummaryRow,\r\n            contentDensity: contentDensity$ | async,\r\n            formLayout: layout$ | async,\r\n            hasSelected: hasSelected$ | async,\r\n            disableOverflowContextMenu: viewSetting.DisableOverflowContextMenu,\r\n            inlineEditWithoutSelection: viewSetting.InlineEditWithoutSelection,\r\n            showCreateForm: viewSetting.ShowCreateForm,\r\n            hideOpenIcon: viewSetting.HideOpenIcon,\r\n            hideTitleMode: viewSetting.HideTitleMode,\r\n            openOnClick: viewSetting.OpenOnClick,\r\n            navigationArrow: navigationArrow$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            typeDefId: context.Setting.Extra.Report.TypeDefId,\r\n            reportId: context.Setting.Extra.Report.Id,\r\n            listEditViewId: context.Setting.Extra.Report.ListEditViewId,\r\n            typeViewId: context.Setting.Extra.Report.TypeViewId,\r\n            formSetting: context.Setting.FormTemplate,\r\n            extraRelation: context.Setting.Extra?.Relation,\r\n            contextView: context.Setting.View,\r\n            cartableTemplates: cartableTemplates$ | async,\r\n            cartableChildsMo: cartableChildsMo$ | async,\r\n            disableResponsive: viewSetting.DisableResponsive,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            contextSetting: context.Setting,\r\n            customFieldInfo: context.Setting.CustomFieldInfo,\r\n            selectedMo: selectedMo$ | async,\r\n            hideSearchpanel: hideSearchpanel$ | async,\r\n            selectedCount: selectedCount$ | async,\r\n            gridFreeColumnSizing: gridFreeColumnSizing$ | async,\r\n            UlvMainCtrlr: context.Adapter?.UlvMainCtrlr,\r\n            allowGridColumnSort: context.ViewSetting?.AllowGridColumnSort,\r\n            hasInlineEditButton: viewSetting.HasInlineEditButton,\r\n            hasInlineDeleteButton: viewSetting.HasInlineDeleteButton,\r\n            pagingSetting: pagingSetting$ | async,\r\n            shortcutList: viewSetting.ShortcutList?.MoDataList,\r\n            simpleInlineEdit: simpleInlineEdit,\r\n            toolbarSettings: viewSetting.ToolbarSettings,\r\n            layoutInfo: layoutInfo\r\n        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\r\n    let-layoutInfo=\"layoutInfo\"\r\n    let-shortcutList=\"shortcutList\"\r\n    let-inlineEditWithoutSelection=\"inlineEditWithoutSelection\"\r\n    let-allChecked=\"allChecked\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-columns=\"columns\"\r\n    let-columnsCount=\"columnsCount\"\r\n    let-groupby=\"groupby\"\r\n    let-secondaryColumns=\"secondaryColumns\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-access=\"access\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-popin=\"popin\"\r\n    let-mobileOrTablet=\"mobileOrTablet\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-onlyInlineEdit=\"onlyInlineEdit\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-rtl=\"rtl\"\r\n    let-allColumns=\"allColumns\"\r\n    let-selectedView=\"selectedView\"\r\n    let-viewCollection=\"viewCollection\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-formLayout=\"formLayout\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-containerWidth=\"containerWidth\"\r\n    let-hasSummary=\"hasSummary\"\r\n    let-typeDefId=\"typeDefId\"\r\n    let-formSetting=\"formSetting\"\r\n    let-extraRelation=\"extraRelation\"\r\n    let-contextView=\"contextView\"\r\n    let-showCreateForm=\"showCreateForm\"\r\n    let-hideOpenIcon=\"hideOpenIcon\"\r\n    let-cartableTemplates=\"cartableTemplates\"\r\n    let-cartableChildsMo=\"cartableChildsMo\"\r\n    let-openOnClick=\"openOnClick\"\r\n    let-disableResponsive=\"disableResponsive\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-customFieldInfo=\"customFieldInfo\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-selectedCount=\"selectedCount\"\r\n    let-hideSearchpanel=\"hideSearchpanel\"\r\n    let-gridFreeColumnSizing=\"gridFreeColumnSizing\"\r\n    let-reportId=\"reportId\"\r\n    let-listEditViewId=\"listEditViewId\"\r\n    let-typeViewId=\"typeViewId\"\r\n    let-UlvMainCtrlr=\"UlvMainCtrlr\"\r\n    let-allowGridColumnSort=\"allowGridColumnSort\"\r\n    let-pagingSetting=\"pagingSetting\"\r\n    let-hasInlineDeleteButton=\"hasInlineDeleteButton\"\r\n    let-hasInlineEditButton=\"hasInlineEditButton\"\r\n    let-contextSetting=\"contextSetting\"\r\n    let-icon=\"icon\"\r\n    let-simpleInlineEdit=\"simpleInlineEdit\"\r\n    let-hideTitleMode=\"hideTitleMode\"\r\n    let-toolbarSettings=\"toolbarSettings\"\r\n>\r\n    @if (showCreateForm) {\r\n    <div>\r\n        <bsu-report-new-top-form\r\n            [extraRelation]=\"extraRelation\"\r\n            [moDataListCount]=\"moDataList.length\"\r\n            [selectedMo]=\"selectedMo\"\r\n            [formSetting]=\"formSetting\"\r\n            [typeDefId]=\"typeDefId\"\r\n            [inlineEditMode]=\"true\"\r\n            [isChecked]=\"true\"\r\n            (add)=\"onNewTopFormAdd($event)\"\r\n            (save)=\"onSaveTopForm($event)\"\r\n        ></bsu-report-new-top-form>\r\n    </div>\r\n    } @if(selectedView){\r\n    <div\r\n        class=\"report-view\"\r\n        [shortcutRegister]=\"shortcutList\"\r\n        reportViewRenderer\r\n        [layoutInfo]=\"layoutInfo\"\r\n        [attr.reportCaption]=\"context.Setting.Extra.Report.Caption\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [hideTitle]=\"hideTitleMode === '2' || hideTitleMode === '3'\"\r\n        [groupSummary]=\"groupSummary\"\r\n        [hasInlineDeleteButton]=\"hasInlineDeleteButton\"\r\n        [hasInlineEditButton]=\"hasInlineEditButton\"\r\n        [contextSetting]=\"contextSetting\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [inlineEditWithoutSelection]=\"inlineEditWithoutSelection\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [reportId]=\"reportId\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [hideSearchpanel]=\"hideSearchpanel\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [selectedCount]=\"selectedCount\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [customFieldInfo]=\"customFieldInfo\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [openOnClick]=\"openOnClick\"\r\n        [contextView]=\"contextView\"\r\n        [containerWidth]=\"containerWidth\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [view]=\"selectedView\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [groupby]=\"groupby\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [formSetting]=\"formSetting\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [columns]=\"columns\"\r\n        [rtl]=\"rtl\"\r\n        [allColumns]=\"allColumns\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [formLayout]=\"formLayout\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        (escapeKey)=\"onEscapeKey($event)\"\r\n        (resetWorkflowState)=\"onResetWorkflowState($event)\"\r\n        (hasDetailsInRow)=\"onHasDetailsInRow($event, deviceSize)\"\r\n        (executeToolbarButton)=\"onExecuteToolbarButton($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (deselectAll)=\"onDeselectAll()\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (columnResized)=\"onColumnResized($event)\"\r\n        (cartableFormClosed)=\"onCartableFormClosed($event)\"\r\n        (createNewMo)=\"onCreateNewMo()\"\r\n        (updateMo)=\"onUpdateMo($event)\"\r\n        (mandatory)=\"onMandatory($event)\"\r\n        (sortSettingsChange)=\"onSortSettingsChange($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n        (resetGridSettings)=\"onResetGridSettings()\"\r\n    ></div>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%;background-repeat:repeat}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}.view-row{cursor:pointer}.header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;padding:.5rem;background-color:var(--sapBaseColor)}.header span{font-size:1.7rem;font-weight:300}.btn-margin{margin:0 8px 0 0}.table-header-btn-group{display:flex;justify-content:flex-end;flex-grow:1}.context-command{margin:0 2px}.body-wrapper,.body-wrapper table{width:100%}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.root-grouped{color:green}.cell-expand{cursor:pointer;display:inline-flex;justify-content:center;align-items:center;font-size:.75rem;color:#0854a0;color:var(--sapContent_IconColor, #0854a0);min-width:2rem;max-width:2rem}.single-select{min-width:2rem;max-width:2rem;width:2rem;text-align:center}.grid-editable-btn-group{display:flex;justify-content:space-evenly;align-items:center}.table-fixed{table-layout:fixed}.table-fixed td{overflow:hidden}::ng-deep span.fd-toolbar__spacer{display:none}\n"] }]
         }], propDecorators: { tableView: [{
                 type: ViewChild,
                 args: ['renderTable', { static: true }]
@@ -5669,7 +5653,7 @@ class CardItemComponent extends BaseViewItemPropsComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CardItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: CardItemComponent, isStandalone: false, selector: "bsu-card-item", inputs: { setting: "setting", extraFooterComponent: "extraFooterComponent" }, providers: [FormPanelService], viewQueries: [{ propertyName: "_quickViewTemplate", first: true, predicate: ["quickViewTemplate"], descendants: true, static: true }, { propertyName: "_contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-card\r\n    [cardType]=\"setting.CardType$Caption\"\r\n    [interactive]=\"setting.IsInteractive === false ? false : true\"\r\n    class=\"docs-flex-item-margin\"\r\n    [class.openOnClick]=\"setting.openOnClick\"\r\n    [class.hide-header-border]=\"setting.HideHeaderBorder\"\r\n    [style.width]=\"cardWidth\"\r\n    [style.min-width]=\"minWidth\"\r\n    [style.max-width]=\"maxWidth\"\r\n    [class.card-media]=\"cardMedia\"\r\n    (click)=\"onRowCheck()\"\r\n    (dblclick)=\"onRowClick()\"\r\n>\r\n    @if(cardMedia){\r\n    <fd-card-media>\r\n        @if(isCardTypeBanner){\r\n        <div\r\n            fd-card-media-content-container\r\n            [legendColor]=\"setting.CustomColor ? null : 13\"\r\n            [style.background]=\"setting.CustomColor ? setting.CustomColor : null\"\r\n        >\r\n            <div fd-card-media-heading [level]=\"2\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.TitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </div>\r\n            <p fd-card-media-text>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.SubtitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n            @if (contextMenuItems.length ) {\r\n\r\n            <bsu-ulv-context-menu\r\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n                [conditionalFormats]=\"conditionalFormats\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [mo]=\"mo\"\r\n                [index]=\"index\"\r\n                (commandClick)=\"onUlvCommand()\"\r\n                [deviceName]=\"deviceName\"\r\n                [menuItems]=\"contextMenuItems\"\r\n                [allColumns]=\"allColumns\"\r\n            ></bsu-ulv-context-menu>\r\n            }\r\n        </div>\r\n        }\r\n        <div fd-card-media-image-container #container>\r\n            <img\r\n                fd-card-media-image\r\n                [src]=\"\r\n                    setting.MediaField\r\n                        ? (mo[setting.MediaField.Name]?.FileId | picFieldSrc: 'ID':setting.MediaField.FieldDefId)\r\n                        : ''\r\n                \"\r\n                alt=\"pic not loaded\"\r\n                [style.max-height.px]=\"isCardTypeBanner ? setting?.SliderHeight || 300 : null\"\r\n            />\r\n        </div>\r\n    </fd-card-media>\r\n    } @if(!isCardTypeBanner){\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            setting.HeaderComponent ? renderHeaderComponent : renderHeader;\r\n            context: {\r\n                $implicit: mo,\r\n                index: this.index\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    } @if (!noContent || contextMenuItems) {\r\n    <fd-card-content ellipsify class=\"tw-flex tw-flex-col tw-justify-stretch tw-items-stretch\">\r\n        <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\" class=\"tw-h-full tw-w-full tw-flex-1\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\r\n                    context: {\r\n                        $implicit: mo,\r\n                        index: this.index,\r\n                        component: setting.ContentComponent,\r\n                        componentSettings: setting.ContentComponent?.Settings\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n            @for(item of setting.ContentComponents?.MoDataList;track item.Id){\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    contentTemplateComponent;\r\n                    context: {\r\n                        $implicit: mo,\r\n                        index: this.index,\r\n                        component: item.Component,\r\n                        componentSettings: item.Component?.Settings\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n            }\r\n        </div>\r\n    </fd-card-content>\r\n    } @if(detailsText || contextMenuEnabled && !isCardTypeBanner){\r\n    <fd-card-footer\r\n        [class.extra-footer]=\"extraFooterComponent?.Selector\"\r\n        [class.hasDetailsAndContextMenu]=\"detailsText && contextMenuEnabled && contextMenuInFooter\"\r\n    >\r\n        @if(extraFooterComponent?.Selector){\r\n        <bnrc-dynamic-item-component\r\n            style=\"display: block; flex: 1\"\r\n            [component]=\"extraFooterComponent\"\r\n            [mo]=\"mo\"\r\n            [styleIndex]=\"mo.$StyleIndex\"\r\n            [isChecked]=\"isChecked\"\r\n            [setting]=\"setting\"\r\n            [parameters]=\"extraFooterComponent.Settings\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n        ></bnrc-dynamic-item-component>\r\n        } @if(detailsText){<button *fdCardFooterActionItem fd-button fdType=\"transparent\" [fdPopoverTrigger]=\"popover\">\r\n            {{ detailsText }}\r\n        </button>\r\n        } @if(contextMenuInFooter){\r\n        <div\r\n            *fdCardFooterActionItem\r\n            ulvContextMenu\r\n            [allColumns]=\"allColumns\"\r\n            [footerMode]=\"false\"\r\n            [menuItems]=\"contextMenuItems\"\r\n            [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n            [styleIndex]=\"styleIndex\"\r\n            [conditionalFormats]=\"conditionalFormats\"\r\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            [mo]=\"mo\"\r\n            (commandClick)=\"onUlvCommand()\"\r\n        ></div>\r\n        }\r\n        <fd-popover #popover>\r\n            @if (detailsColumns?.length) {\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    detailsColumnsTemplate;\r\n                    context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\r\n                \"\r\n            ></ng-container>\r\n            }\r\n        </fd-popover>\r\n    </fd-card-footer>\r\n    }\r\n</fd-card>\r\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            detailsFormItems;\r\n            context: {\r\n                $implicit: detailsColumns,\r\n                mo: this.mo,\r\n                inlineEditMode: this.inlineEditMode,\r\n                layout94: layout94\r\n            }\r\n        \"\r\n    ></ng-container>\r\n</ng-template>\r\n<ng-template\r\n    #detailsFormItems\r\n    let-detailsColumns\r\n    let-mo=\"mo\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-layout94=\"layout94\"\r\n>\r\n    <div class=\"form-items\" class=\"tw-p-2\">\r\n        @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n        <div\r\n            fd-form-item\r\n            class=\"!tw-flex-row\"\r\n            [dynCommand]=\"column.$CustomComponent?.DynamicCommand\"\r\n            [mo]=\"mo\"\r\n            [enableCommand]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n            bodyClick\r\n            [class.tw-cursor-pointer]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n        >\r\n            @if(!column.$CustomComponent?.HideColumnCaption) {<label fd-form-label for=\"input-2\"\r\n                >{{ column.Caption }}<span>:</span></label\r\n            >}\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    columnTemplate;\r\n                    context: {\r\n                        $implicit: column,\r\n                        mo: mo,\r\n                        index: columnIndex,\r\n                        inlineEditMode: inlineEditMode,\r\n                        layout94: layout94\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n        </div>\r\n        }\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n    #columnTemplate\r\n    let-column\r\n    let-mo=\"mo\"\r\n    let-index=\"index\"\r\n    let-layout94=\"layout94\"\r\n    let-disableEllapsis=\"disableEllapsis\"\r\n    let-fdTextMode=\"fdTextMode\"\r\n>\r\n    @if (column) {\r\n    <bsu-barsa-table-column\r\n        [mo]=\"mo\"\r\n        [allColumns]=\"allColumns\"\r\n        [column]=\"column\"\r\n        [isdirty]=\"false\"\r\n        [value]=\"column | columnValue: mo\"\r\n        [icon]=\"column | columnIcon: mo\"\r\n        [customComponent]=\"column.$CustomComponent\"\r\n        [column]=\"column\"\r\n        [disableEllapsis]=\"disableEllapsis === false ? false : true\"\r\n        [fdTextMode]=\"fdTextMode\"\r\n        [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [isChecked]=\"isChecked\"\r\n        [index]=\"index\"\r\n        [formSetting]=\"formSetting\"\r\n        [rtl]=\"rtl\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [layout94]=\"layout94\"\r\n        (save)=\"onEditFormPanelSave(null)\"\r\n        (cancel)=\"onEditFormPanelCancel(null)\"\r\n        (tab)=\"onTabKeyDown($event, index)\"\r\n        (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\r\n    >\r\n    </bsu-barsa-table-column>\r\n\r\n    }\r\n</ng-template>\r\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\r\n    @if (!noContent) {\r\n    <fd-quick-view [id]=\"'id'\">\r\n        <fd-quick-view-group>\r\n            @for (column of setting.FieldListMapped; track column) {\r\n            <fd-quick-view-group-item [class.rowDirection]=\"column?.$CustomComponent?.IsRowDirection\">\r\n                @if (column) { @if(!column.$CustomComponent?.HideColumnCaption) {<fd-quick-view-group-item-label>\r\n                    {{ column.Caption | bbbTranslate }} </fd-quick-view-group-item-label\r\n                >}\r\n                <fd-quick-view-group-item-content>\r\n                    <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                                columnTemplate;\r\n                                context: {\r\n                                    $implicit: column,\r\n                                    layout94: layout$ | async,\r\n                                    mo: mo,\r\n                                    index: index\r\n                                }\r\n                            \"\r\n                        ></ng-container>\r\n                    </div>\r\n                </fd-quick-view-group-item-content>\r\n                }\r\n            </fd-quick-view-group-item>\r\n            } @if (setting.DescriptionField) {\r\n            <fd-quick-view-group-item>\r\n                <fd-quick-view-group-item-content>\r\n                    @if (inlineEditMode && allowInlineEdit) {\r\n                    <fd-quick-view-group-item-label>\r\n                        {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n                    </fd-quick-view-group-item-label>\r\n                    }\r\n                    <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                                columnTemplate;\r\n                                context: {\r\n                                    $implicit: setting.DescriptionField,\r\n                                    layout94: layout$ | async,\r\n                                    mo: mo,\r\n                                    index: index\r\n                                }\r\n                            \"\r\n                        ></ng-container>\r\n                    </div>\r\n                </fd-quick-view-group-item-content>\r\n                @if (setting.ActionFieldNameField) {\r\n                <fd-quick-view-group-item-content\r\n                    class=\"action\"\r\n                    (click)=\"onAction(setting.ActionFieldCommandField || '')\"\r\n                >\r\n                    <a fd-link>\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                                columnTemplate;\r\n                                context: {\r\n                                    $implicit: setting.ActionFieldNameField,\r\n                                    layout94: layout$ | async,\r\n                                    mo: mo,\r\n                                    index: index\r\n                                }\r\n                            \"\r\n                        ></ng-container>\r\n                    </a>\r\n                </fd-quick-view-group-item-content>\r\n                }\r\n            </fd-quick-view-group-item>\r\n            }\r\n        </fd-quick-view-group>\r\n    </fd-quick-view>\r\n    }\r\n</ng-template>\r\n<ng-template #contentTemplate let-mo let-index=\"index\">\r\n    <fd-layout-grid>\r\n        <div fdLayoutGridRow style=\"align-items: center\">\r\n            <div [fdLayoutGridCol]=\"12\">\r\n                @for (column of setting.FieldListMapped; track column) {\r\n                <div style=\"display: flex\">\r\n                    <label fd-form-label [colon]=\"true\">{{ column.Caption | bbbTranslate }}</label>\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            columnTemplate;\r\n                            context: {\r\n                                $implicit: column,\r\n                                layout94: layout$ | async,\r\n                                mo: mo,\r\n                                index: index\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </div>\r\n                }\r\n            </div>\r\n            @if (setting.DescriptionField) {\r\n            <div [fdLayoutGridCol]=\"12\">\r\n                @if (inlineEditMode && allowInlineEdit) {\r\n                <label>\r\n                    {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n                </label>\r\n                }\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.DescriptionField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </div>\r\n            }\r\n        </div>\r\n    </fd-layout-grid>\r\n</ng-template>\r\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\r\n    @if (visible) {\r\n    <fd-avatar\r\n        alterIcon=\"alt|content|backup|default-icon\"\r\n        [circle]=\"circle\"\r\n        [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\r\n        [size]=\"\r\n            deviceSize === 'xl' || deviceSize === 'l' ? setting.AvatarSizeDesktop$Caption : setting.AvatarSize$Caption\r\n        \"\r\n        [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\r\n    >\r\n    </fd-avatar>\r\n    }\r\n</ng-template>\r\n\r\n<ng-template\r\n    #contentTemplateComponent\r\n    let-mo\r\n    let-index=\"index\"\r\n    let-componentSettings=\"componentSettings\"\r\n    let-component=\"component\"\r\n>\r\n    <bnrc-dynamic-item-component\r\n        [component]=\"component\"\r\n        [mo]=\"mo\"\r\n        [styleIndex]=\"mo.$StyleIndex\"\r\n        [isChecked]=\"isChecked\"\r\n        [setting]=\"setting\"\r\n        [parameters]=\"componentSettings\"\r\n        [editMode]=\"inlineEditMode\"\r\n        [rtl]=\"rtl\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [index]=\"index\"\r\n        [allColumns]=\"allColumns\"\r\n    ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n\r\n<ng-template #renderHeader let-mo let-index=\"index\">\r\n    @if(!hideOpenIcon && (openOnClick || (canView && deviceName !== 'desktop'))){\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            renderHeaderMobileCanView;\r\n            context: {\r\n                $implicit: mo,\r\n                index: index\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    }@else{\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            renderHeaderDesktop;\r\n            context: {\r\n                $implicit: mo,\r\n                index: index\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template #renderHeaderDesktop let-mo let-index=\"index\">\r\n    <fd-card-header class=\"HeaderDesktop\">\r\n        <div>\r\n            @if(isCheckList){\r\n            <fd-checkbox\r\n                [name]=\"mo.$Caption\"\r\n                [ngModel]=\"isChecked\"\r\n                (ngModelChange)=\"onRowCheck()\"\r\n                stopPropagation\r\n            ></fd-checkbox>\r\n            }\r\n        </div>\r\n        <fd-card-main-header>\r\n            @if (setting.AvatarField || setting.Avatar) {\r\n            <fd-avatar\r\n                alterIcon=\"alt|content|backup|default-icon\"\r\n                [circle]=\"setting.CircleAvatar\"\r\n                [image]=\"\r\n                    setting.AvatarField\r\n                        ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n                        : ''\r\n                \"\r\n                [size]=\"\r\n                    deviceSize === 'xl' || deviceSize === 'l'\r\n                        ? setting.AvatarSizeDesktop$Caption\r\n                        : setting.AvatarSize$Caption\r\n                \"\r\n                [glyph]=\"\r\n                    setting.Avatar ||\r\n                    (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n                \"\r\n            ></fd-avatar>\r\n            }\r\n            <h2 fd-card-title>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.TitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index,\r\n                            disableEllapsis: false,\r\n                            fdTextMode: true\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </h2>\r\n            <h3 fd-card-subtitle>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.SubtitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index,\r\n                            disableEllapsis: false\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </h3>\r\n            <span fd-card-counter status=\"positive\" [class.!tw-hidden]=\"!setting.CounterField\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.CounterField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index,\r\n                            disableEllapsis: false\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </span>\r\n            @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n            <div\r\n                ulvContextMenu\r\n                fd-card-header-action\r\n                [allColumns]=\"allColumns\"\r\n                [footerMode]=\"false\"\r\n                [menuItems]=\"contextMenuItems\"\r\n                [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [conditionalFormats]=\"conditionalFormats\"\r\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n                [mo]=\"mo\"\r\n                (commandClick)=\"onUlvCommand()\"\r\n            ></div>\r\n            }\r\n        </fd-card-main-header>\r\n        <ng-container *ngTemplateOutlet=\"extendedHeader\"></ng-container>\r\n    </fd-card-header>\r\n</ng-template>\r\n<ng-template #extendedHeader>\r\n  @if(setting.hasExtHeader){\r\n        <fd-card-extended-header>\r\n            <div fd-card-header-column>\r\n                <div fd-card-header-row>\r\n                    @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n                    layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n                    layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    }\r\n                </div>\r\n            </div>\r\n            <div fd-card-header-column [align]=\"'right'\">\r\n                <div fd-card-header-row>\r\n                    @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n                    layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n                    layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </fd-card-extended-header>\r\n        }\r\n</ng-template>\r\n<ng-template #renderHeaderMobileCanView let-mo let-index=\"index\">\r\n    <fd-card-header class=\"HeaderMobileCanView\">\r\n        <div>\r\n            @if(isCheckList){\r\n            <fd-checkbox\r\n                [name]=\"mo.$Caption\"\r\n                [ngModel]=\"isChecked\"\r\n                (ngModelChange)=\"onRowCheck()\"\r\n                stopPropagation\r\n            ></fd-checkbox>\r\n            }\r\n        </div>\r\n        <fd-card-main-header>\r\n            @if ( setting.AvatarField || setting.Avatar) {\r\n            <fd-avatar\r\n                alterIcon=\"alt|content|backup|default-icon\"\r\n                [circle]=\"setting.CircleAvatar\"\r\n                [image]=\"\r\n                    setting.AvatarField\r\n                        ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n                        : ''\r\n                \"\r\n                [size]=\"\r\n                    deviceSize === 'xl' || deviceSize === 'l'\r\n                        ? setting.AvatarSizeDesktop$Caption\r\n                        : setting.AvatarSize$Caption\r\n                \"\r\n                [glyph]=\"\r\n                    setting.Avatar ||\r\n                    (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n                \"\r\n            ></fd-avatar>\r\n            }\r\n            <h2 fd-card-title>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.TitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index,\r\n                            fdTextMode: true\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </h2>\r\n            <h3 fd-card-subtitle>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.SubtitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </h3>\r\n\r\n            @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n            <div\r\n                ulvContextMenu\r\n                fd-card-header-action\r\n                [allColumns]=\"allColumns\"\r\n                [footerMode]=\"false\"\r\n                [menuItems]=\"contextMenuItems\"\r\n                [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [conditionalFormats]=\"conditionalFormats\"\r\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n                [mo]=\"mo\"\r\n                (commandClick)=\"onUlvCommand()\"\r\n            ></div>\r\n            }@else {\r\n            <button\r\n                fd-button\r\n                fd-card-header-action\r\n                class=\"view-btn\"\r\n                stopPropagation\r\n                (click)=\"onRowClick()\"\r\n                [glyph]=\"navigationArrow\"\r\n                fdType=\"transparent\"\r\n            ></button>\r\n            }\r\n        </fd-card-main-header>\r\n        @if(setting.hasExtHeader){\r\n        <fd-card-extended-header>\r\n            <div fd-card-header-column>\r\n                <div fd-card-header-row>\r\n                    @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n                    layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n                    layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    }\r\n                </div>\r\n            </div>\r\n            <div fd-card-header-column [align]=\"'right'\">\r\n                <div fd-card-header-row>\r\n                    @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n                    layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n                    layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </fd-card-extended-header>\r\n        }\r\n    </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\r\n    <bnrc-card-dynamic-item-component\r\n        [component]=\"setting.HeaderComponent\"\r\n        [maxHeightHeader]=\"maxHeightHeader\"\r\n        [mo]=\"mo\"\r\n        [columnTemplate]=\"columnTemplate\"\r\n        [extendedHeaderTemplate]=\"extendedHeader\"\r\n        [layout94$]=\"layout$\"\r\n        [styleIndex]=\"mo.$StyleIndex\"\r\n        [isChecked]=\"isChecked\"\r\n        [setting]=\"setting\"\r\n        [parameters]=\"setting.HeaderComponent.Settings\"\r\n        [editMode]=\"inlineEditMode\"\r\n        [rtl]=\"rtl\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [index]=\"index\"\r\n        [allColumns]=\"allColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [canView]=\"canView\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [isCheckList]=\"isCheckList\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-card-dynamic-item-component>\r\n</ng-template>\r\n", styles: ["fd-card.fd-card--banner>fd-card-media{border-radius:inherit}fd-card.fd-card--banner>fd-card-media .fd-card__media-image-container{z-index:4}fd-card div[ulvcontextmenu] ::ng-deep .fd-bar{background-color:transparent}fd-card fd-card-content ::ng-deep bsu-column-renderer div.renderGeneral{font-family:IranYekanDigits}fd-card fd-card-footer.extra-footer{flex-wrap:wrap}fd-card fd-card-footer.hasDetailsAndContextMenu ::ng-deep .fd-card__footer-actions{justify-content:space-between!important}fd-card fd-card-content{padding:0!important}fd-card fd-card-content>div>fd-quick-view ::ng-deep .fd-quick-view__content{padding-top:0}fd-card fd-card-content>div>fd-quick-view fd-quick-view-group-item.rowDirection ::ng-deep .fd-form-item{flex-direction:row}fd-card.hide-header-border ::ng-deep fd-card-header fd-card-main-header>.fd-card__header-main{border:none}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-quick-view-subheader ::ng-deep div{background:inherit}.action{cursor:pointer;margin-top:6px;flex:1;display:flex;justify-content:end;flex-direction:column}.openOnClick{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "hideOpenIcon", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "showRowNumber", "rowNumber", "formSetting", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "maxHeightHeader", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "component", type: i2.CardDynamicItemComponent, selector: "bnrc-card-dynamic-item-component", inputs: ["columnTemplate", "extendedHeaderTemplate"] }, { kind: "directive", type: i2.DynamicCommandDirective, selector: "[dynCommand]", inputs: ["dynCommand", "mo", "enableCommand"], outputs: ["commandClick"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i2.StopPropagationDirective, selector: "[stopPropagation]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$6.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$3.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "directive", type: i7$3.CardHeaderActionDirective, selector: "[fd-card-header-action]" }, { kind: "component", type: i7$3.CardExtendedHeaderComponent, selector: "fd-card-extended-header", inputs: ["ariaRoleDescription", "align"] }, { kind: "directive", type: i7$3.CardHeaderRowDirective, selector: "[fd-card-header-row]" }, { kind: "directive", type: i7$3.CardHeaderColumnDirective, selector: "[fd-card-header-column]", inputs: ["align"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i7$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "directive", type: i7$3.CardCounterDirective, selector: "[fd-card-counter]", inputs: ["statusInput"] }, { kind: "component", type: i7$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i7$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i7$3.CardMediaComponent, selector: "fd-card-media", inputs: ["ariaRoleDescription", "hasPadding", "shellColor", "legendColor"] }, { kind: "directive", type: i7$3.CardMediaImageDirective, selector: "[fd-card-media-image]" }, { kind: "directive", type: i7$3.CardMediaImageContainerDirective, selector: "[fd-card-media-image-container]" }, { kind: "directive", type: i7$3.CardMediaContentContainerDirective, selector: "[fd-card-media-content-container]", inputs: ["isOverlay", "shellColor", "legendColor"] }, { kind: "directive", type: i7$3.CardMediaHeadingDirective, selector: "[fd-card-media-heading]", inputs: ["id", "level"] }, { kind: "directive", type: i7$3.CardMediaTextDirective, selector: "[fd-card-media-text]" }, { kind: "component", type: i2$2.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i10.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i10.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i10.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$2.PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: ["fdPopoverTrigger"] }, { kind: "component", type: i12.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i12.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i12.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i12.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i12.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i12.QuickViewGroupItemContentElementDirective, selector: "[fd-quick-view-group-item-content-element]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "closeOnOutsideClick", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column", inputs: ["disableEllapsis", "fdTextMode"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: CardItemComponent, isStandalone: false, selector: "bsu-card-item", inputs: { setting: "setting", extraFooterComponent: "extraFooterComponent" }, providers: [FormPanelService], viewQueries: [{ propertyName: "_quickViewTemplate", first: true, predicate: ["quickViewTemplate"], descendants: true, static: true }, { propertyName: "_contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-card\r\n    [cardType]=\"setting.CardType$Caption\"\r\n    [interactive]=\"setting.IsInteractive === false ? false : true\"\r\n    class=\"docs-flex-item-margin\"\r\n    [class.openOnClick]=\"setting.openOnClick\"\r\n    [class.hide-header-border]=\"setting.HideHeaderBorder\"\r\n    [style.width]=\"cardWidth\"\r\n    [style.min-width]=\"minWidth\"\r\n    [style.max-width]=\"maxWidth\"\r\n    [class.card-media]=\"cardMedia\"\r\n    (click)=\"onRowCheck()\"\r\n    (dblclick)=\"onRowClick()\"\r\n>\r\n    @if(cardMedia){\r\n    <fd-card-media>\r\n        @if(isCardTypeBanner){\r\n        <div\r\n            fd-card-media-content-container\r\n            [legendColor]=\"setting.CustomColor ? null : 13\"\r\n            [style.background]=\"setting.CustomColor ? setting.CustomColor : null\"\r\n        >\r\n            <div fd-card-media-heading [level]=\"2\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.TitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </div>\r\n            <p fd-card-media-text>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.SubtitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n            @if (contextMenuItems.length ) {\r\n\r\n            <bsu-ulv-context-menu\r\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n                [conditionalFormats]=\"conditionalFormats\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [mo]=\"mo\"\r\n                [index]=\"index\"\r\n                (commandClick)=\"onUlvCommand()\"\r\n                [deviceName]=\"deviceName\"\r\n                [menuItems]=\"contextMenuItems\"\r\n                [allColumns]=\"allColumns\"\r\n            ></bsu-ulv-context-menu>\r\n            }\r\n        </div>\r\n        }\r\n        <div fd-card-media-image-container #container>\r\n            <img\r\n                fd-card-media-image\r\n                [src]=\"\r\n                    setting.MediaField\r\n                        ? (mo[setting.MediaField.Name]?.FileId | picFieldSrc: 'ID':setting.MediaField.FieldDefId)\r\n                        : ''\r\n                \"\r\n                alt=\"pic not loaded\"\r\n                [style.max-height.px]=\"isCardTypeBanner ? setting?.SliderHeight || 300 : null\"\r\n            />\r\n        </div>\r\n    </fd-card-media>\r\n    } @if(!isCardTypeBanner){\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            setting.HeaderComponent ? renderHeaderComponent : renderHeader;\r\n            context: {\r\n                $implicit: mo,\r\n                index: this.index\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    } @if (!noContent || contextMenuItems) {\r\n    <fd-card-content ellipsify class=\"tw-flex tw-flex-col tw-justify-stretch tw-items-stretch\">\r\n        <div #divEl [applyConditionalFormats]=\"conditionalFormats\" [styleIndex]=\"styleIndex\" [hostEl]=\"divEl\" class=\"tw-h-full tw-w-full tw-flex-1\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    setting.ContentComponent ? contentTemplateComponent : contentTemplateRef;\r\n                    context: {\r\n                        $implicit: mo,\r\n                        index: this.index,\r\n                        component: setting.ContentComponent,\r\n                        componentSettings: setting.ContentComponent?.Settings\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n            @for(item of setting.ContentComponents?.MoDataList;track item.Id){\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    contentTemplateComponent;\r\n                    context: {\r\n                        $implicit: mo,\r\n                        index: this.index,\r\n                        component: item.Component,\r\n                        componentSettings: item.Component?.Settings\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n            }\r\n        </div>\r\n    </fd-card-content>\r\n    } @if(detailsText || contextMenuEnabled && !isCardTypeBanner){\r\n    <fd-card-footer\r\n        [class.extra-footer]=\"extraFooterComponent?.Selector\"\r\n        [class.hasDetailsAndContextMenu]=\"detailsText && contextMenuEnabled && contextMenuInFooter\"\r\n    >\r\n        @if(extraFooterComponent?.Selector){\r\n        <bnrc-dynamic-item-component\r\n            style=\"display: block; flex: 1\"\r\n            [component]=\"extraFooterComponent\"\r\n            [mo]=\"mo\"\r\n            [styleIndex]=\"mo.$StyleIndex\"\r\n            [isChecked]=\"isChecked\"\r\n            [setting]=\"setting\"\r\n            [parameters]=\"extraFooterComponent.Settings\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n        ></bnrc-dynamic-item-component>\r\n        } @if(detailsText){<button *fdCardFooterActionItem fd-button fdType=\"transparent\" [fdPopoverTrigger]=\"popover\">\r\n            {{ detailsText }}\r\n        </button>\r\n        } @if(contextMenuInFooter){\r\n        <div\r\n            *fdCardFooterActionItem\r\n            ulvContextMenu\r\n            [allColumns]=\"allColumns\"\r\n            [footerMode]=\"false\"\r\n            [menuItems]=\"contextMenuItems\"\r\n            [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n            [styleIndex]=\"styleIndex\"\r\n            [conditionalFormats]=\"conditionalFormats\"\r\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            [mo]=\"mo\"\r\n            (commandClick)=\"onUlvCommand()\"\r\n        ></div>\r\n        }\r\n        <fd-popover #popover>\r\n            @if (detailsColumns?.length) {\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    detailsColumnsTemplate;\r\n                    context: { mo: mo, inlineEditMode: inlineEditMode, layout94: layout$ | async }\r\n                \"\r\n            ></ng-container>\r\n            }\r\n        </fd-popover>\r\n    </fd-card-footer>\r\n    }\r\n</fd-card>\r\n<ng-template #detailsColumnsTemplate let-mo=\"mo\" let-inlineEditMode=\"inlineEditMode\" let-layout94=\"layout94\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            detailsFormItems;\r\n            context: {\r\n                $implicit: detailsColumns,\r\n                mo: this.mo,\r\n                inlineEditMode: this.inlineEditMode,\r\n                layout94: layout94\r\n            }\r\n        \"\r\n    ></ng-container>\r\n</ng-template>\r\n<ng-template\r\n    #detailsFormItems\r\n    let-detailsColumns\r\n    let-mo=\"mo\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-layout94=\"layout94\"\r\n>\r\n    <div class=\"form-items\" class=\"tw-p-2\">\r\n        @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n        <div\r\n            fd-form-item\r\n            class=\"!tw-flex-row\"\r\n            [dynCommand]=\"column.$CustomComponent?.DynamicCommand\"\r\n            [mo]=\"mo\"\r\n            [enableCommand]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n            bodyClick\r\n            [class.tw-cursor-pointer]=\"!!column.$CustomComponent?.DynamicCommand\"\r\n        >\r\n            @if(!column.$CustomComponent?.HideColumnCaption) {<label fd-form-label for=\"input-2\"\r\n                >{{ column.Caption }}<span>:</span></label\r\n            >}\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    columnTemplate;\r\n                    context: {\r\n                        $implicit: column,\r\n                        mo: mo,\r\n                        index: columnIndex,\r\n                        inlineEditMode: inlineEditMode,\r\n                        layout94: layout94\r\n                    }\r\n                \"\r\n            ></ng-container>\r\n        </div>\r\n        }\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n    #columnTemplate\r\n    let-column\r\n    let-mo=\"mo\"\r\n    let-index=\"index\"\r\n    let-layout94=\"layout94\"\r\n    let-disableEllapsis=\"disableEllapsis\"\r\n    let-fdTextMode=\"fdTextMode\"\r\n>\r\n    @if (column) {\r\n    <bsu-barsa-table-column\r\n        [mo]=\"mo\"\r\n        [allColumns]=\"allColumns\"\r\n        [column]=\"column\"\r\n        [isdirty]=\"false\"\r\n        [value]=\"column | columnValue: mo\"\r\n        [icon]=\"column | columnIcon: mo\"\r\n        [customComponent]=\"column.$CustomComponent\"\r\n        [column]=\"column\"\r\n        [disableEllapsis]=\"disableEllapsis === false ? false : true\"\r\n        [fdTextMode]=\"fdTextMode\"\r\n        [editMode]=\"isChecked && inlineEditMode && allowInlineEdit\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [isChecked]=\"isChecked\"\r\n        [index]=\"index\"\r\n        [formSetting]=\"formSetting\"\r\n        [rtl]=\"rtl\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [layout94]=\"layout94\"\r\n        (save)=\"onEditFormPanelSave(null)\"\r\n        (cancel)=\"onEditFormPanelCancel(null)\"\r\n        (tab)=\"onTabKeyDown($event, index)\"\r\n        (changeToEditMode)=\"onColumnChangeToEditMode($event, index)\"\r\n    >\r\n    </bsu-barsa-table-column>\r\n\r\n    }\r\n</ng-template>\r\n<ng-template #quickViewTemplate let-mo let-index=\"index\">\r\n    @if (!noContent) {\r\n    <fd-quick-view [id]=\"'id'\">\r\n        <fd-quick-view-group>\r\n            @for (column of setting.FieldListMapped; track column) {\r\n            <fd-quick-view-group-item [class.rowDirection]=\"column?.$CustomComponent?.IsRowDirection\">\r\n                @if (column) { @if(!column.$CustomComponent?.HideColumnCaption) {<fd-quick-view-group-item-label>\r\n                    {{ column.Caption | bbbTranslate }} </fd-quick-view-group-item-label\r\n                >}\r\n                <fd-quick-view-group-item-content>\r\n                    <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                                columnTemplate;\r\n                                context: {\r\n                                    $implicit: column,\r\n                                    layout94: layout$ | async,\r\n                                    mo: mo,\r\n                                    index: index\r\n                                }\r\n                            \"\r\n                        ></ng-container>\r\n                    </div>\r\n                </fd-quick-view-group-item-content>\r\n                }\r\n            </fd-quick-view-group-item>\r\n            } @if (setting.DescriptionField) {\r\n            <fd-quick-view-group-item>\r\n                <fd-quick-view-group-item-content>\r\n                    @if (inlineEditMode && allowInlineEdit) {\r\n                    <fd-quick-view-group-item-label>\r\n                        {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n                    </fd-quick-view-group-item-label>\r\n                    }\r\n                    <div fd-quick-view-group-item-content-element class=\"group-item-content\">\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                                columnTemplate;\r\n                                context: {\r\n                                    $implicit: setting.DescriptionField,\r\n                                    layout94: layout$ | async,\r\n                                    mo: mo,\r\n                                    index: index\r\n                                }\r\n                            \"\r\n                        ></ng-container>\r\n                    </div>\r\n                </fd-quick-view-group-item-content>\r\n                @if (setting.ActionFieldNameField) {\r\n                <fd-quick-view-group-item-content\r\n                    class=\"action\"\r\n                    (click)=\"onAction(setting.ActionFieldCommandField || '')\"\r\n                >\r\n                    <a fd-link>\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                                columnTemplate;\r\n                                context: {\r\n                                    $implicit: setting.ActionFieldNameField,\r\n                                    layout94: layout$ | async,\r\n                                    mo: mo,\r\n                                    index: index\r\n                                }\r\n                            \"\r\n                        ></ng-container>\r\n                    </a>\r\n                </fd-quick-view-group-item-content>\r\n                }\r\n            </fd-quick-view-group-item>\r\n            }\r\n        </fd-quick-view-group>\r\n    </fd-quick-view>\r\n    }\r\n</ng-template>\r\n<ng-template #contentTemplate let-mo let-index=\"index\">\r\n    <fd-layout-grid>\r\n        <div fdLayoutGridRow style=\"align-items: center\">\r\n            <div [fdLayoutGridCol]=\"12\">\r\n                @for (column of setting.FieldListMapped; track column) {\r\n                <div style=\"display: flex\">\r\n                    <label fd-form-label [colon]=\"true\">{{ column.Caption | bbbTranslate }}</label>\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            columnTemplate;\r\n                            context: {\r\n                                $implicit: column,\r\n                                layout94: layout$ | async,\r\n                                mo: mo,\r\n                                index: index\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </div>\r\n                }\r\n            </div>\r\n            @if (setting.DescriptionField) {\r\n            <div [fdLayoutGridCol]=\"12\">\r\n                @if (inlineEditMode && allowInlineEdit) {\r\n                <label>\r\n                    {{ setting.DescriptionField?.Alias | bbbTranslate }}\r\n                </label>\r\n                }\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.DescriptionField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </div>\r\n            }\r\n        </div>\r\n    </fd-layout-grid>\r\n</ng-template>\r\n<ng-template #avatar let-avatar let-visible=\"visible\" let-circle=\"circle\" let-avatarField=\"avatarField\">\r\n    @if (visible) {\r\n    <fd-avatar\r\n        alterIcon=\"alt|content|backup|default-icon\"\r\n        [circle]=\"circle\"\r\n        [image]=\"avatarField ? (mo[avatarField.Name]?.FileId | picFieldSrc: 'ID':avatarField.FieldDefId) : ''\"\r\n        [size]=\"\r\n            deviceSize === 'xl' || deviceSize === 'l' ? setting.AvatarSizeDesktop$Caption : setting.AvatarSize$Caption\r\n        \"\r\n        [glyph]=\"avatar || (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\"\r\n    >\r\n    </fd-avatar>\r\n    }\r\n</ng-template>\r\n\r\n<ng-template\r\n    #contentTemplateComponent\r\n    let-mo\r\n    let-index=\"index\"\r\n    let-componentSettings=\"componentSettings\"\r\n    let-component=\"component\"\r\n>\r\n    <bnrc-dynamic-item-component\r\n        [component]=\"component\"\r\n        [mo]=\"mo\"\r\n        [styleIndex]=\"mo.$StyleIndex\"\r\n        [isChecked]=\"isChecked\"\r\n        [setting]=\"setting\"\r\n        [parameters]=\"componentSettings\"\r\n        [editMode]=\"inlineEditMode\"\r\n        [rtl]=\"rtl\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [index]=\"index\"\r\n        [allColumns]=\"allColumns\"\r\n    ></bnrc-dynamic-item-component>\r\n</ng-template>\r\n\r\n<ng-template #renderHeader let-mo let-index=\"index\">\r\n    @if(!hideOpenIcon && (openOnClick || (canView && deviceName !== 'desktop'))){\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            renderHeaderMobileCanView;\r\n            context: {\r\n                $implicit: mo,\r\n                index: index\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    }@else{\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            renderHeaderDesktop;\r\n            context: {\r\n                $implicit: mo,\r\n                index: index\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template #renderHeaderDesktop let-mo let-index=\"index\">\r\n    <fd-card-header class=\"HeaderDesktop\">\r\n        <div>\r\n            @if(isCheckList){\r\n            <fd-checkbox\r\n                [name]=\"mo.$Caption\"\r\n                [ngModel]=\"isChecked\"\r\n                (ngModelChange)=\"onRowCheck()\"\r\n                stopPropagation\r\n            ></fd-checkbox>\r\n            }\r\n        </div>\r\n        <fd-card-main-header>\r\n            @if (setting.AvatarField || setting.Avatar) {\r\n            <fd-avatar\r\n                alterIcon=\"alt|content|backup|default-icon\"\r\n                [circle]=\"setting.CircleAvatar\"\r\n                [image]=\"\r\n                    setting.AvatarField\r\n                        ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n                        : ''\r\n                \"\r\n                [size]=\"\r\n                    deviceSize === 'xl' || deviceSize === 'l'\r\n                        ? setting.AvatarSizeDesktop$Caption\r\n                        : setting.AvatarSize$Caption\r\n                \"\r\n                [glyph]=\"\r\n                    setting.Avatar ||\r\n                    (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n                \"\r\n            ></fd-avatar>\r\n            }\r\n            <h2 fd-card-title>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.TitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index,\r\n                            disableEllapsis: false,\r\n                            fdTextMode: true\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </h2>\r\n            <h3 fd-card-subtitle>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.SubtitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index,\r\n                            disableEllapsis: false\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </h3>\r\n            <span fd-card-counter status=\"positive\" [class.!tw-hidden]=\"!setting.CounterField\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.CounterField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index,\r\n                            disableEllapsis: false\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </span>\r\n            @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n            <div\r\n                ulvContextMenu\r\n                fd-card-header-action\r\n                [allColumns]=\"allColumns\"\r\n                [footerMode]=\"false\"\r\n                [menuItems]=\"contextMenuItems\"\r\n                [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [conditionalFormats]=\"conditionalFormats\"\r\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n                [mo]=\"mo\"\r\n                (commandClick)=\"onUlvCommand()\"\r\n            ></div>\r\n            }\r\n        </fd-card-main-header>\r\n        <ng-container *ngTemplateOutlet=\"extendedHeader\"></ng-container>\r\n    </fd-card-header>\r\n</ng-template>\r\n<ng-template #extendedHeader>\r\n  @if(setting.hasExtHeader){\r\n        <fd-card-extended-header>\r\n            <div fd-card-header-column>\r\n                <div fd-card-header-row>\r\n                    @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n                    layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n                    layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    }\r\n                </div>\r\n            </div>\r\n            <div fd-card-header-column [align]=\"'right'\">\r\n                <div fd-card-header-row>\r\n                    @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n                    layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n                    layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </fd-card-extended-header>\r\n        }\r\n</ng-template>\r\n<ng-template #renderHeaderMobileCanView let-mo let-index=\"index\">\r\n    <fd-card-header class=\"HeaderMobileCanView\">\r\n        <div>\r\n            @if(isCheckList){\r\n            <fd-checkbox\r\n                [name]=\"mo.$Caption\"\r\n                [ngModel]=\"isChecked\"\r\n                (ngModelChange)=\"onRowCheck()\"\r\n                stopPropagation\r\n            ></fd-checkbox>\r\n            }\r\n        </div>\r\n        <fd-card-main-header>\r\n            @if ( setting.AvatarField || setting.Avatar) {\r\n            <fd-avatar\r\n                alterIcon=\"alt|content|backup|default-icon\"\r\n                [circle]=\"setting.CircleAvatar\"\r\n                [image]=\"\r\n                    setting.AvatarField\r\n                        ? (mo[setting.AvatarField.Name]?.FileId | picFieldSrc: 'ID':setting.AvatarField.FieldDefId)\r\n                        : ''\r\n                \"\r\n                [size]=\"\r\n                    deviceSize === 'xl' || deviceSize === 'l'\r\n                        ? setting.AvatarSizeDesktop$Caption\r\n                        : setting.AvatarSize$Caption\r\n                \"\r\n                [glyph]=\"\r\n                    setting.Avatar ||\r\n                    (mo.$State === 'New' && !isChecked ? 'favorite' : inlineEditMode && isChecked ? 'edit' : '')\r\n                \"\r\n            ></fd-avatar>\r\n            }\r\n            <h2 fd-card-title>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.TitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index,\r\n                            fdTextMode: true\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </h2>\r\n            <h3 fd-card-subtitle>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: setting.SubtitleField,\r\n                            layout94: layout$ | async,\r\n                            mo: mo,\r\n                            index: index\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </h3>\r\n\r\n            @if (!contextMenuInFooter && (contextMenuItems && contextMenuItems.length > 0)) {\r\n            <div\r\n                ulvContextMenu\r\n                fd-card-header-action\r\n                [allColumns]=\"allColumns\"\r\n                [footerMode]=\"false\"\r\n                [menuItems]=\"contextMenuItems\"\r\n                [contextMenuOverflowText]=\"contextMenuOverflowText\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [conditionalFormats]=\"conditionalFormats\"\r\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n                [mo]=\"mo\"\r\n                (commandClick)=\"onUlvCommand()\"\r\n            ></div>\r\n            }@else {\r\n            <button\r\n                fd-button\r\n                fd-card-header-action\r\n                class=\"view-btn\"\r\n                stopPropagation\r\n                (click)=\"onRowClick()\"\r\n                [glyph]=\"navigationArrow\"\r\n                fdType=\"transparent\"\r\n            ></button>\r\n            }\r\n        </fd-card-main-header>\r\n        @if(setting.hasExtHeader){\r\n        <fd-card-extended-header>\r\n            <div fd-card-header-column>\r\n                <div fd-card-header-row>\r\n                    @if (setting.ExtHeaderFColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderFColRowFirst,\r\n                    layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    } @if (setting.ExtHeaderFColRowSec) { @let ctx = { $implicit: setting.ExtHeaderFColRowSec, layout94:\r\n                    layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    }\r\n                </div>\r\n            </div>\r\n            <div fd-card-header-column [align]=\"'right'\">\r\n                <div fd-card-header-row>\r\n                    @if (setting.ExtHeaderSColRowFirst) { @let ctx = { $implicit: setting.ExtHeaderSColRowFirst,\r\n                    layout94: layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    } @if (setting.ExtHeaderSColRowSec) { @let ctx = { $implicit: setting.ExtHeaderSColRowSec, layout94:\r\n                    layout$ | async, mo: mo, index: index, disableEllapsis: false };\r\n                    <ng-container *ngTemplateOutlet=\"columnTemplate; context: ctx\"></ng-container>\r\n                    }\r\n                </div>\r\n            </div>\r\n        </fd-card-extended-header>\r\n        }\r\n    </fd-card-header>\r\n</ng-template>\r\n<ng-template #renderHeaderComponent let-mo let-index=\"index\">\r\n    <bnrc-card-dynamic-item-component\r\n        [component]=\"setting.HeaderComponent\"\r\n        [maxHeightHeader]=\"maxHeightHeader\"\r\n        [mo]=\"mo\"\r\n        [columnTemplate]=\"columnTemplate\"\r\n        [extendedHeaderTemplate]=\"extendedHeader\"\r\n        [layout94$]=\"layout$\"\r\n        [styleIndex]=\"mo.$StyleIndex\"\r\n        [isChecked]=\"isChecked\"\r\n        [setting]=\"setting\"\r\n        [parameters]=\"setting.HeaderComponent.Settings\"\r\n        [editMode]=\"inlineEditMode\"\r\n        [rtl]=\"rtl\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [index]=\"index\"\r\n        [allColumns]=\"allColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [canView]=\"canView\"\r\n        [hideOpenIcon]=\"hideOpenIcon\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [isCheckList]=\"isCheckList\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-card-dynamic-item-component>\r\n</ng-template>\r\n", styles: ["fd-card.fd-card--banner>fd-card-media{border-radius:inherit}fd-card.fd-card--banner>fd-card-media .fd-card__media-image-container{z-index:4}fd-card div[ulvcontextmenu] ::ng-deep .fd-bar{background-color:transparent}fd-card fd-card-content ::ng-deep bsu-column-renderer div.renderGeneral{font-family:IranYekanDigits}fd-card fd-card-footer.extra-footer{flex-wrap:wrap}fd-card fd-card-footer.hasDetailsAndContextMenu ::ng-deep .fd-card__footer-actions{justify-content:space-between!important}fd-card fd-card-content{padding:0!important}fd-card fd-card-content>div>fd-quick-view ::ng-deep .fd-quick-view__content{padding-top:0}fd-card fd-card-content>div>fd-quick-view fd-quick-view-group-item.rowDirection ::ng-deep .fd-form-item{flex-direction:row}fd-card.hide-header-border ::ng-deep fd-card-header fd-card-main-header>.fd-card__header-main{border:none}fd-card fd-card-header{padding:.5rem}fd-card fd-card-header .fd-card__title{display:flex;justify-content:space-between;align-items:center;width:100%}fd-card fd-card-header button,fd-card fd-card-header div[ulvcontextmenu]{z-index:6}fd-quick-view-subheader ::ng-deep div{background:inherit}.action{cursor:pointer;margin-top:6px;flex:1;display:flex;justify-content:end;flex-direction:column}.openOnClick{cursor:pointer}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "hideOpenIcon", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "showRowNumber", "rowNumber", "formSetting", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "maxHeightHeader", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "component", type: i2.CardDynamicItemComponent, selector: "bnrc-card-dynamic-item-component", inputs: ["columnTemplate", "extendedHeaderTemplate"] }, { kind: "directive", type: i2.DynamicCommandDirective, selector: "[dynCommand]", inputs: ["dynCommand", "mo", "enableCommand"], outputs: ["commandClick"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i2.StopPropagationDirective, selector: "[stopPropagation]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$6.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$4.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "directive", type: i7$4.CardHeaderActionDirective, selector: "[fd-card-header-action]" }, { kind: "component", type: i7$4.CardExtendedHeaderComponent, selector: "fd-card-extended-header", inputs: ["ariaRoleDescription", "align"] }, { kind: "directive", type: i7$4.CardHeaderRowDirective, selector: "[fd-card-header-row]" }, { kind: "directive", type: i7$4.CardHeaderColumnDirective, selector: "[fd-card-header-column]", inputs: ["align"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$4.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i7$4.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "directive", type: i7$4.CardCounterDirective, selector: "[fd-card-counter]", inputs: ["statusInput"] }, { kind: "component", type: i7$4.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i7$4.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i7$4.CardMediaComponent, selector: "fd-card-media", inputs: ["ariaRoleDescription", "hasPadding", "shellColor", "legendColor"] }, { kind: "directive", type: i7$4.CardMediaImageDirective, selector: "[fd-card-media-image]" }, { kind: "directive", type: i7$4.CardMediaImageContainerDirective, selector: "[fd-card-media-image-container]" }, { kind: "directive", type: i7$4.CardMediaContentContainerDirective, selector: "[fd-card-media-content-container]", inputs: ["isOverlay", "shellColor", "legendColor"] }, { kind: "directive", type: i7$4.CardMediaHeadingDirective, selector: "[fd-card-media-heading]", inputs: ["id", "level"] }, { kind: "directive", type: i7$4.CardMediaTextDirective, selector: "[fd-card-media-text]" }, { kind: "component", type: i2$2.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i10.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i10.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i10.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$3.PopoverTriggerDirective, selector: "[fdPopoverTrigger], [fd-popover-trigger]", inputs: ["fdPopoverTrigger"] }, { kind: "component", type: i12.QuickViewComponent, selector: "fd-quick-view", inputs: ["id"] }, { kind: "component", type: i12.QuickViewGroupComponent, selector: "fd-quick-view-group" }, { kind: "component", type: i12.QuickViewGroupItemComponent, selector: "fd-quick-view-group-item", inputs: ["id"] }, { kind: "component", type: i12.QuickViewGroupItemLabelComponent, selector: "fd-quick-view-group-item-label" }, { kind: "component", type: i12.QuickViewGroupItemContentComponent, selector: "fd-quick-view-group-item-content" }, { kind: "directive", type: i12.QuickViewGroupItemContentElementDirective, selector: "[fd-quick-view-group-item-content-element]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "closeOnOutsideClick", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "component", type: BarsaTableColumnComponent, selector: "bsu-barsa-table-column", inputs: ["disableEllapsis", "fdTextMode"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ColumnIconPipe, name: "columnIcon" }, { kind: "pipe", type: i2.ColumnValuePipe, name: "columnValue" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CardItemComponent, decorators: [{
             type: Component,
@@ -5858,7 +5842,7 @@ class UiListViewComponent extends ReportViewBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiListViewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiListViewComponent, isStandalone: false, selector: "bsu-ui-list-view", viewQueries: [{ propertyName: "popupModeTemplateRef", first: true, predicate: ["popupModeTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultModeTemplateRef", first: true, predicate: ["defaultMode"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_menu", first: true, predicate: ["menu"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"selectedPresentaionTemplate\"></ng-container>\r\n\r\n<ng-template #popupModeTemplate>\r\n    <ng-container *ngTemplateOutlet=\"deviceSize === 's' ? mobileTpl : desktopTpl\"></ng-container>\r\n\r\n    <!-- <fd-menu [appendTo]=\"_el\"\r\n  #menu [mobile]=\"deviceSize === 's'\" >\r\n</fd-menu> -->\r\n</ng-template>\r\n<ng-template #mobileTpl>\r\n    <div class=\"popup-mode\">\r\n        <ng-container *ngTemplateOutlet=\"buttonDropDown; context: { menu: menu }\"></ng-container>\r\n    </div>\r\n    <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\r\n    <fd-menu #menu [mobile]=\"true\" [mobileConfig]=\"{ title: title | bbbTranslate, hasCloseButton: true }\">\r\n        <ng-container *ngTemplateOutlet=\"defaultMode; context: { popover: menu, popupMode: true }\"></ng-container>\r\n    </fd-menu>\r\n</ng-template>\r\n<ng-template #desktopTpl>\r\n    <fd-popover #popover fillControlMode=\"equal\">\r\n        <fd-popover-control class=\"popup-mode\">\r\n            <ng-container *ngTemplateOutlet=\"buttonDropDown\"></ng-container>\r\n        </fd-popover-control>\r\n        <fd-popover-body>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"defaultMode; context: { popover: popover, popupMode: true }\"\r\n            ></ng-container>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n    <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\r\n</ng-template>\r\n<ng-template #buttonDropDown let-menu=\"menu\">\r\n    <button\r\n        class=\"drop-down\"\r\n        fd-button\r\n        [label]=\"selectedMo ? (selectedMo.$Caption | bbbTranslate) : (title | bbbTranslate)\"\r\n        [fdMenu]=\"true\"\r\n        [fdMenuTrigger]=\"menu\"\r\n    >\r\n        @if (selectedCount > 0 && isCheckList) {\r\n        <span fd-object-status [inverted]=\"true\" [label]=\"selectedCount\" [title]=\"selectedCount\"></span>\r\n        }\r\n    </button>\r\n</ng-template>\r\n<ng-template #tokensTpl>\r\n    @if (isCheckList && hasSelected) {\r\n    <div style=\"padding: 5px; display: flex; flex-wrap: wrap; row-gap: 5px; column-gap: 5px\">\r\n        @for (mo of moDataList; track mo; let index = $index) { @if (mo.$IsChecked) {\r\n        <fd-token fdCozy [readOnly]=\"false\" (onCloseClick)=\"onRowCheck({mo, index})\">{{\r\n            columns[0].Caption | rval: mo:columns:true\r\n        }}</fd-token>\r\n        } }\r\n    </div>\r\n    }\r\n</ng-template>\r\n<ng-template #defaultMode let-popover=\"popover\" let-popupMode=\"popupMode\">\r\n    <fd-layout-panel [class.popup-mode]=\"popupMode\" [ngClass]=\"'size-' + deviceSize\">\r\n        <fd-layout-panel-header>\r\n            <fd-layout-panel-head>\r\n                <h4 fd-layout-panel-title>{{ title | bbbTranslate }}</h4>\r\n                @if (selectedCount > 0) {\r\n                <span fd-object-status [inverted]=\"true\" [label]=\"selectedCount\" [title]=\"selectedCount\"></span>\r\n                }\r\n            </fd-layout-panel-head>\r\n            <fd-layout-panel-actions>\r\n                @if (deviceSize !== 's') {\r\n                <button\r\n                    style=\"margin-top: 5px\"\r\n                    fd-button\r\n                    glyph=\"decline\"\r\n                    fdType=\"transparent\"\r\n                    (click)=\"popover.close()\"\r\n                ></button>\r\n                }\r\n            </fd-layout-panel-actions>\r\n        </fd-layout-panel-header>\r\n        @if (isCheckList && moDataList.length) {\r\n        <fd-layout-panel-filters>\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <a class=\"clearCheckAll\" (click)=\"onAllCheckbox($event)\" fd-link [aria-label]=\"'All' | bbbTranslate\">{{\r\n                    'All' | bbbTranslate\r\n                }}</a>\r\n                <label fd-toolbar-label style=\"font-size: 1rem; font-weight: bold\">.</label>\r\n                <a\r\n                    (click)=\"onClearCheckbox()\"\r\n                    fd-toolbar-item\r\n                    class=\"clearCheckAll\"\r\n                    fd-link\r\n                    [aria-label]=\"'Clear' | bbbTranslate\"\r\n                    >{{ 'Clear' | bbbTranslate }}</a\r\n                >\r\n            </fd-toolbar>\r\n        </fd-layout-panel-filters>\r\n        }\r\n\r\n        <fd-layout-panel-body [bleed]=\"true\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    isDisplayType ? displayListTemplate : standardListTemplate;\r\n                    context: {\r\n                        $implicit: moDataList,\r\n                        isCheckList: isCheckList,\r\n                        groupby: groupby,\r\n                        conditionalFormats: conditionalFormats,\r\n                        deviceName: deviceName,\r\n                        viewSetting: viewSetting,\r\n                        allColumns: allColumns,\r\n                        access: access,\r\n                        rtl: rtl,\r\n                        popover: popover\r\n                    }\r\n                \"\r\n            >\r\n            </ng-container>\r\n        </fd-layout-panel-body>\r\n    </fd-layout-panel>\r\n</ng-template>\r\n\r\n<!--display list-->\r\n<ng-template\r\n    #displayListTemplate\r\n    let-moDataList\r\n    let-isCheckList=\"isCheckList\"\r\n    let-groupby=\"groupby\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-allColumns=\"allColumns\"\r\n    let-viewSetting=\"viewSetting\"\r\n    let-access=\"access\"\r\n    let-rtl=\"rtl\"\r\n>\r\n    @if (moDataList && moDataList.length > 0) {\r\n    <ul fd-list class=\"display-list fd-list--navigation\" ellipsify>\r\n        @for (mo of moDataList | multipleGroupBy: groupby; track mo; let index = $index; let last = $last) { @if\r\n        (!mo.parent || mo.parent?.expanded) {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                itemTemplate;\r\n                context: {\r\n                    $implicit: mo,\r\n                    index: index,\r\n                    last: last,\r\n                    columns: columns,\r\n                    moDataList: moDataList,\r\n                    moDataListCount: moDataList.length\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        } }\r\n    </ul>\r\n    } @else {\r\n    <bsu-no-data [simple]=\"popupMode\"></bsu-no-data>\r\n    }\r\n</ng-template>\r\n<!--standard list-->\r\n<ng-template\r\n    #standardListTemplate\r\n    let-moDataList\r\n    let-isCheckList=\"isCheckList\"\r\n    let-groupby=\"groupby\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-allColumns=\"allColumns\"\r\n    let-deviceName=\"deviceName\"\r\n    let-access=\"access\"\r\n    let-viewSetting=\"viewSetting\"\r\n    let-rtl=\"rtl\"\r\n    let-last=\"last\"\r\n>\r\n    @if (moDataList && moDataList.length > 0) {\r\n    <ul class=\"fd-list--navigation\" [class.fd-list--byline]=\"!isDisplayType\" fd-list [byline]=\"true\" ellipsify>\r\n        @for (mo of moDataList | multipleGroupBy: groupby; track mo; let index = $index) { @if (!mo.parent ||\r\n        mo.parent?.expanded) {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                itemTemplate;\r\n                context: {\r\n                    $implicit: mo,\r\n                    index: index,\r\n                    last: last,\r\n                    columns: columns,\r\n                    moDataList: moDataList,\r\n                    moDataListCount: moDataList.length\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        } }\r\n    </ul>\r\n    } @else {\r\n    <bsu-no-data [simple]=\"popupMode\"></bsu-no-data>\r\n    }\r\n</ng-template>\r\n\r\n<!--noData-->\r\n<ng-template\r\n    #itemTemplate\r\n    let-mo\r\n    let-index=\"index\"\r\n    let-last=\"last\"\r\n    let-columns=\"columns\"\r\n    let-moDataListCount=\"moDataListCount\"\r\n    let-moDataList=\"moDataList\"\r\n>\r\n    @if (mo.group || mo.group === '') {\r\n    <li\r\n        fd-list-group-header\r\n        [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\r\n        [attr.level]=\"mo.level\"\r\n        [class.root-group]=\"mo.level === 0\"\r\n    >\r\n        <fd-icon\r\n            [glyph]=\"mo.expanded ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\r\n            class=\"cell-expand\"\r\n            (click)=\"onExpandClick(mo)\"\r\n        ></fd-icon>\r\n        <span fd-list-title>{{ mo.group }}</span>\r\n    </li>\r\n    } @else {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            hasRowOlgo ? dynamicItemTemplate : defaultItem;\r\n            context: {\r\n                $implicit: mo,\r\n                index: index,\r\n                columns: columns,\r\n                moDataList: moDataList,\r\n                moDataListCount: moDataList.length\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <ng-template\r\n        #defaultItem\r\n        let-mo\r\n        let-index=\"index\"\r\n        let-columns=\"columns\"\r\n        let-moDataListCount=\"moDataListCount\"\r\n        let-moDataList=\"moDataList\"\r\n    >\r\n        @if (!hasRowOlgo) {\r\n        <bsu-list-item\r\n            [isDisplayType]=\"isDisplayType\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"mo.$IsChecked\"\r\n            [styleIndex]=\"mo.$StyleIndex\"\r\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\r\n            [index]=\"index\"\r\n            [last]=\"last\"\r\n            [setting]=\"listSetting\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [rtl]=\"rtl\"\r\n            [hideOpenIcon]=\"hideOpenIcon\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [formSetting]=\"formSetting\"\r\n            [allColumns]=\"allColumns\"\r\n            [contentDensity]=\"contentDensity\"\r\n            [contextMenuItems]=\"contextMenuItems\"\r\n            [canView]=\"canView\"\r\n            [conditionalFormats]=\"conditionalFormats\"\r\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            [navigationArrow]=\"navigationArrow\"\r\n            [isCheckList]=\"isCheckList\"\r\n            (rowCheck)=\"onRowCheck($event)\"\r\n            (rowClick)=\"onRowClick($event)\"\r\n            (ulvCommand)=\"onUlvCommand($event)\"\r\n            (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n            (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        >\r\n        </bsu-list-item>\r\n        } @else {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"viewSetting.RowOlgo\"\r\n            [mo]=\"mo\"\r\n            [styleIndex]=\"mo.$StyleIndex\"\r\n            [moDataList]=\"moDataList\"\r\n            [showDetailsInRow]=\"showDetailsInRow\"\r\n            [hideOpenIcon]=\"hideOpenIcon\"\r\n            [detailsColumns]=\"detailsColumns\"\r\n            [columnComponents]=\"viewSetting?.ColumnComponents || null\"\r\n            [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\r\n            [cartableMo]=\"mo.RelatedMo\"\r\n            [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\r\n            [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\r\n            [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\r\n            [detailsComponent]=\"detailsComponent\"\r\n            [isChecked]=\"mo.$IsChecked\"\r\n            [visibility]=\"mo.$Visibility\"\r\n            [expanded]=\"mo.$Expanded\"\r\n            [level]=\"mo.$Level\"\r\n            [parentExpanded]=\"mo.$Parent?.$Expanded\"\r\n            [moDataListCount]=\"moDataListCount\"\r\n            [columnsCount]=\"columnsCount - detailsColumns.length\"\r\n            [typeDefId]=\"typeDefId\"\r\n            [extraRelation]=\"extraRelation\"\r\n            [formSetting]=\"formSetting\"\r\n            [index]=\"index\"\r\n            [last]=\"last\"\r\n            [setting]=\"viewSetting\"\r\n            [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns:false\"\r\n            [columns]=\"columns | filterColumnsByDetails: detailsColumns:false\"\r\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\r\n            [access]=\"access\"\r\n            [inlineEditMode]=\"inlineEditMode\"\r\n            [allowInlineEdit]=\"allowInlineEdit\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [allColumns]=\"allColumns\"\r\n            [contextMenuItems]=\"contextMenuItems\"\r\n            [canView]=\"canView\"\r\n            [conditionalFormats]=\"conditionalFormats\"\r\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            [navigationArrow]=\"navigationArrow\"\r\n            [isCheckList]=\"isCheckList\"\r\n            [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\r\n            (events)=\"onOlgoEvents($event)\"\r\n        >\r\n        </bnrc-dynamic-item-component>\r\n        }\r\n    </ng-template>\r\n    <ng-template\r\n        #dynamicItemTemplate\r\n        let-mo\r\n        let-index=\"index\"\r\n        let-columns=\"columns\"\r\n        let-moDataListCount=\"moDataListCount\"\r\n        let-moDataList=\"moDataList\"\r\n    >\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"viewSetting.RowOlgo\"\r\n            [mo]=\"mo\"\r\n            [styleIndex]=\"mo.$StyleIndex\"\r\n            [moDataList]=\"moDataList\"\r\n            [showDetailsInRow]=\"showDetailsInRow\"\r\n            [hideOpenIcon]=\"hideOpenIcon\"\r\n            [detailsColumns]=\"detailsColumns\"\r\n            [columnComponents]=\"viewSetting?.ColumnComponents || null\"\r\n            [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\r\n            [cartableMo]=\"mo.RelatedMo\"\r\n            [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\r\n            [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\r\n            [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\r\n            [detailsComponent]=\"detailsComponent\"\r\n            [isChecked]=\"mo.$IsChecked\"\r\n            [visibility]=\"mo.$Visibility\"\r\n            [expanded]=\"mo.$Expanded\"\r\n            [level]=\"mo.$Level\"\r\n            [parentExpanded]=\"mo.$Parent?.$Expanded\"\r\n            [moDataListCount]=\"moDataListCount\"\r\n            [columnsCount]=\"columnsCount - detailsColumns.length\"\r\n            [typeDefId]=\"typeDefId\"\r\n            [extraRelation]=\"extraRelation\"\r\n            [formSetting]=\"formSetting\"\r\n            [index]=\"index\"\r\n            [last]=\"last\"\r\n            [setting]=\"viewSetting\"\r\n            [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns:false\"\r\n            [columns]=\"columns | filterColumnsByDetails: detailsColumns:false\"\r\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\r\n            [access]=\"access\"\r\n            [inlineEditMode]=\"inlineEditMode\"\r\n            [allowInlineEdit]=\"allowInlineEdit\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [allColumns]=\"allColumns\"\r\n            [contextMenuItems]=\"contextMenuItems\"\r\n            [canView]=\"canView\"\r\n            [conditionalFormats]=\"conditionalFormats\"\r\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            [navigationArrow]=\"navigationArrow\"\r\n            [isCheckList]=\"isCheckList\"\r\n            [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\r\n            (events)=\"onOlgoEvents($event)\"\r\n        >\r\n        </bnrc-dynamic-item-component>\r\n    </ng-template>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block}.fd-list__group-header{column-gap:10px;align-items:center}.header th{border-left:none!important;border-right:none!important}.clearCheckAll{text-decoration:none!important}.fd-list--navigation-indication .fd-list__item:after{min-width:0!important}li.standard-list-row{padding-top:.2rem;padding-bottom:.2rem;min-height:4rem;justify-content:space-evenly;column-gap:10px}li.standard-list-row:hover:not(.selected){background-color:var(--sapBackgroundColor, #f7f7f7)}li.standard-list-row .fd-list__content{row-gap:.4rem}li.standard-list-row .fd-list__content .fd-list__byline{padding:0;font-size:.775rem}li.standard-list-row ::ng-deep .fd-form-item{position:static}li.standard-list-row ::ng-deep .fd-form-item .fd-checkbox__label--compact{padding:0;margin-left:0}li.standard-list-row ::ng-deep fd-icon{font-size:.75rem!important}fd-layout-panel{height:100%}.li-link.checklink[rtl=true]{padding-right:0!important}.li-link.checklist[rtl=false]{padding-left:0!important}.standard-list-group-label{padding-top:10px;padding-bottom:3px}fd-layout-panel-header{display:none}fd-layout-panel.popup-mode.size-s{box-shadow:none!important}fd-layout-panel.popup-mode.size-s fd-layout-panel-header{display:none!important}.popup-mode fd-layout-panel-header{display:flex;min-height:1rem;height:1rem;border:none!important}.popup-mode fd-layout-panel-header h4{font-weight:700;font-size:1rem}.popup-mode fd-layout-panel-head{display:flex;column-gap:5px;align-items:center;justify-content:center}.popup-mode ::ng-deep li{border:none!important}.popup-mode fd-layout-panel-body{margin-top:.3rem}.popup-mode fd-layout-panel-filters{border:none!important;padding:0 1rem}.popup-mode .drop-down{width:100%;max-width:100%;max-height:2rem!important;height:2rem!important;background:var(--sapButton_Background)!important;border:1px solid #ccc!important}.popup-mode .drop-down ::ng-deep span{font-size:1rem!important;line-height:1.2rem!important}.popup-mode .drop-down ::ng-deep fd-icon{position:absolute;left:10px}fd-popover{width:100%;max-width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "hideOpenIcon", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "showRowNumber", "rowNumber", "formSetting", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "maxHeightHeader", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i2$6.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i2$5.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i2$5.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i2$5.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i2$5.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i2$5.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i2$5.LayoutPanelFiltersComponent, selector: "fd-layout-panel-filters" }, { kind: "component", type: i2$5.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarLabelDirective, selector: "[fd-toolbar-label]" }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: ListItemComponent, selector: "bsu-list-item", inputs: ["setting", "isDisplayType"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i2.MultipleGroupByPipe, name: "multipleGroupBy" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterColumnsByDetailsPipe, name: "filterColumnsByDetails" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiListViewComponent, isStandalone: false, selector: "bsu-ui-list-view", viewQueries: [{ propertyName: "popupModeTemplateRef", first: true, predicate: ["popupModeTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultModeTemplateRef", first: true, predicate: ["defaultMode"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_menu", first: true, predicate: ["menu"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"selectedPresentaionTemplate\"></ng-container>\r\n\r\n<ng-template #popupModeTemplate>\r\n    <ng-container *ngTemplateOutlet=\"deviceSize === 's' ? mobileTpl : desktopTpl\"></ng-container>\r\n\r\n    <!-- <fd-menu [appendTo]=\"_el\"\r\n  #menu [mobile]=\"deviceSize === 's'\" >\r\n</fd-menu> -->\r\n</ng-template>\r\n<ng-template #mobileTpl>\r\n    <div class=\"popup-mode\">\r\n        <ng-container *ngTemplateOutlet=\"buttonDropDown; context: { menu: menu }\"></ng-container>\r\n    </div>\r\n    <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\r\n    <fd-menu #menu [mobile]=\"true\" [mobileConfig]=\"{ title: title | bbbTranslate, hasCloseButton: true }\">\r\n        <ng-container *ngTemplateOutlet=\"defaultMode; context: { popover: menu, popupMode: true }\"></ng-container>\r\n    </fd-menu>\r\n</ng-template>\r\n<ng-template #desktopTpl>\r\n    <fd-popover #popover fillControlMode=\"equal\">\r\n        <fd-popover-control class=\"popup-mode\">\r\n            <ng-container *ngTemplateOutlet=\"buttonDropDown\"></ng-container>\r\n        </fd-popover-control>\r\n        <fd-popover-body>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"defaultMode; context: { popover: popover, popupMode: true }\"\r\n            ></ng-container>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n    <ng-container *ngTemplateOutlet=\"tokensTpl\"></ng-container>\r\n</ng-template>\r\n<ng-template #buttonDropDown let-menu=\"menu\">\r\n    <button\r\n        class=\"drop-down\"\r\n        fd-button\r\n        [label]=\"selectedMo ? (selectedMo.$Caption | bbbTranslate) : (title | bbbTranslate)\"\r\n        [fdMenu]=\"true\"\r\n        [fdMenuTrigger]=\"menu\"\r\n    >\r\n        @if (selectedCount > 0 && isCheckList) {\r\n        <span fd-object-status [inverted]=\"true\" [label]=\"selectedCount\" [title]=\"selectedCount\"></span>\r\n        }\r\n    </button>\r\n</ng-template>\r\n<ng-template #tokensTpl>\r\n    @if (isCheckList && hasSelected) {\r\n    <div style=\"padding: 5px; display: flex; flex-wrap: wrap; row-gap: 5px; column-gap: 5px\">\r\n        @for (mo of moDataList; track mo; let index = $index) { @if (mo.$IsChecked) {\r\n        <fd-token fdCozy [readOnly]=\"false\" (onCloseClick)=\"onRowCheck({mo, index})\">{{\r\n            columns[0].Caption | rval: mo:columns:true\r\n        }}</fd-token>\r\n        } }\r\n    </div>\r\n    }\r\n</ng-template>\r\n<ng-template #defaultMode let-popover=\"popover\" let-popupMode=\"popupMode\">\r\n    <fd-layout-panel [class.popup-mode]=\"popupMode\" [ngClass]=\"'size-' + deviceSize\">\r\n        <fd-layout-panel-header>\r\n            <fd-layout-panel-head>\r\n                <h4 fd-layout-panel-title>{{ title | bbbTranslate }}</h4>\r\n                @if (selectedCount > 0) {\r\n                <span fd-object-status [inverted]=\"true\" [label]=\"selectedCount\" [title]=\"selectedCount\"></span>\r\n                }\r\n            </fd-layout-panel-head>\r\n            <fd-layout-panel-actions>\r\n                @if (deviceSize !== 's') {\r\n                <button\r\n                    style=\"margin-top: 5px\"\r\n                    fd-button\r\n                    glyph=\"decline\"\r\n                    fdType=\"transparent\"\r\n                    (click)=\"popover.close()\"\r\n                ></button>\r\n                }\r\n            </fd-layout-panel-actions>\r\n        </fd-layout-panel-header>\r\n        @if (isCheckList && moDataList.length) {\r\n        <fd-layout-panel-filters>\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                <a class=\"clearCheckAll\" (click)=\"onAllCheckbox($event)\" fd-link [aria-label]=\"'All' | bbbTranslate\">{{\r\n                    'All' | bbbTranslate\r\n                }}</a>\r\n                <label fd-toolbar-label style=\"font-size: 1rem; font-weight: bold\">.</label>\r\n                <a\r\n                    (click)=\"onClearCheckbox()\"\r\n                    fd-toolbar-item\r\n                    class=\"clearCheckAll\"\r\n                    fd-link\r\n                    [aria-label]=\"'Clear' | bbbTranslate\"\r\n                    >{{ 'Clear' | bbbTranslate }}</a\r\n                >\r\n            </fd-toolbar>\r\n        </fd-layout-panel-filters>\r\n        }\r\n\r\n        <fd-layout-panel-body [bleed]=\"true\">\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    isDisplayType ? displayListTemplate : standardListTemplate;\r\n                    context: {\r\n                        $implicit: moDataList,\r\n                        isCheckList: isCheckList,\r\n                        groupby: groupby,\r\n                        conditionalFormats: conditionalFormats,\r\n                        deviceName: deviceName,\r\n                        viewSetting: viewSetting,\r\n                        allColumns: allColumns,\r\n                        access: access,\r\n                        rtl: rtl,\r\n                        popover: popover\r\n                    }\r\n                \"\r\n            >\r\n            </ng-container>\r\n        </fd-layout-panel-body>\r\n    </fd-layout-panel>\r\n</ng-template>\r\n\r\n<!--display list-->\r\n<ng-template\r\n    #displayListTemplate\r\n    let-moDataList\r\n    let-isCheckList=\"isCheckList\"\r\n    let-groupby=\"groupby\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-allColumns=\"allColumns\"\r\n    let-viewSetting=\"viewSetting\"\r\n    let-access=\"access\"\r\n    let-rtl=\"rtl\"\r\n>\r\n    @if (moDataList && moDataList.length > 0) {\r\n    <ul fd-list class=\"display-list fd-list--navigation\" ellipsify>\r\n        @for (mo of moDataList | multipleGroupBy: groupby; track mo; let index = $index; let last = $last) { @if\r\n        (!mo.parent || mo.parent?.expanded) {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                itemTemplate;\r\n                context: {\r\n                    $implicit: mo,\r\n                    index: index,\r\n                    last: last,\r\n                    columns: columns,\r\n                    moDataList: moDataList,\r\n                    moDataListCount: moDataList.length\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        } }\r\n    </ul>\r\n    } @else {\r\n    <bsu-no-data [simple]=\"popupMode\"></bsu-no-data>\r\n    }\r\n</ng-template>\r\n<!--standard list-->\r\n<ng-template\r\n    #standardListTemplate\r\n    let-moDataList\r\n    let-isCheckList=\"isCheckList\"\r\n    let-groupby=\"groupby\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-allColumns=\"allColumns\"\r\n    let-deviceName=\"deviceName\"\r\n    let-access=\"access\"\r\n    let-viewSetting=\"viewSetting\"\r\n    let-rtl=\"rtl\"\r\n    let-last=\"last\"\r\n>\r\n    @if (moDataList && moDataList.length > 0) {\r\n    <ul class=\"fd-list--navigation\" [class.fd-list--byline]=\"!isDisplayType\" fd-list [byline]=\"true\" ellipsify>\r\n        @for (mo of moDataList | multipleGroupBy: groupby; track mo; let index = $index) { @if (!mo.parent ||\r\n        mo.parent?.expanded) {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                itemTemplate;\r\n                context: {\r\n                    $implicit: mo,\r\n                    index: index,\r\n                    last: last,\r\n                    columns: columns,\r\n                    moDataList: moDataList,\r\n                    moDataListCount: moDataList.length\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        } }\r\n    </ul>\r\n    } @else {\r\n    <bsu-no-data [simple]=\"popupMode\"></bsu-no-data>\r\n    }\r\n</ng-template>\r\n\r\n<!--noData-->\r\n<ng-template\r\n    #itemTemplate\r\n    let-mo\r\n    let-index=\"index\"\r\n    let-last=\"last\"\r\n    let-columns=\"columns\"\r\n    let-moDataListCount=\"moDataListCount\"\r\n    let-moDataList=\"moDataList\"\r\n>\r\n    @if (mo.group || mo.group === '') {\r\n    <li\r\n        fd-list-group-header\r\n        [style.padding-right]=\"'calc( 1rem + ' + mo.level * 12 + 'px' + ' )'\"\r\n        [attr.level]=\"mo.level\"\r\n        [class.root-group]=\"mo.level === 0\"\r\n    >\r\n        <fd-icon\r\n            [glyph]=\"mo.expanded ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\r\n            class=\"cell-expand\"\r\n            (click)=\"onExpandClick(mo)\"\r\n        ></fd-icon>\r\n        <span fd-list-title>{{ mo.group }}</span>\r\n    </li>\r\n    } @else {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            hasRowOlgo ? dynamicItemTemplate : defaultItem;\r\n            context: {\r\n                $implicit: mo,\r\n                index: index,\r\n                columns: columns,\r\n                moDataList: moDataList,\r\n                moDataListCount: moDataList.length\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <ng-template\r\n        #defaultItem\r\n        let-mo\r\n        let-index=\"index\"\r\n        let-columns=\"columns\"\r\n        let-moDataListCount=\"moDataListCount\"\r\n        let-moDataList=\"moDataList\"\r\n    >\r\n        @if (!hasRowOlgo) {\r\n        <bsu-list-item\r\n            [isDisplayType]=\"isDisplayType\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"mo.$IsChecked\"\r\n            [styleIndex]=\"mo.$StyleIndex\"\r\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\r\n            [index]=\"index\"\r\n            [last]=\"last\"\r\n            [setting]=\"listSetting\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [rtl]=\"rtl\"\r\n            [hideOpenIcon]=\"hideOpenIcon\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [formSetting]=\"formSetting\"\r\n            [allColumns]=\"allColumns\"\r\n            [contentDensity]=\"contentDensity\"\r\n            [contextMenuItems]=\"contextMenuItems\"\r\n            [canView]=\"canView\"\r\n            [conditionalFormats]=\"conditionalFormats\"\r\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            [navigationArrow]=\"navigationArrow\"\r\n            [isCheckList]=\"isCheckList\"\r\n            (rowCheck)=\"onRowCheck($event)\"\r\n            (rowClick)=\"onRowClick($event)\"\r\n            (ulvCommand)=\"onUlvCommand($event)\"\r\n            (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n            (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        >\r\n        </bsu-list-item>\r\n        } @else {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"viewSetting.RowOlgo\"\r\n            [mo]=\"mo\"\r\n            [styleIndex]=\"mo.$StyleIndex\"\r\n            [moDataList]=\"moDataList\"\r\n            [showDetailsInRow]=\"showDetailsInRow\"\r\n            [hideOpenIcon]=\"hideOpenIcon\"\r\n            [detailsColumns]=\"detailsColumns\"\r\n            [columnComponents]=\"viewSetting?.ColumnComponents || null\"\r\n            [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\r\n            [cartableMo]=\"mo.RelatedMo\"\r\n            [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\r\n            [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\r\n            [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\r\n            [detailsComponent]=\"detailsComponent\"\r\n            [isChecked]=\"mo.$IsChecked\"\r\n            [visibility]=\"mo.$Visibility\"\r\n            [expanded]=\"mo.$Expanded\"\r\n            [level]=\"mo.$Level\"\r\n            [parentExpanded]=\"mo.$Parent?.$Expanded\"\r\n            [moDataListCount]=\"moDataListCount\"\r\n            [columnsCount]=\"columnsCount - detailsColumns.length\"\r\n            [typeDefId]=\"typeDefId\"\r\n            [extraRelation]=\"extraRelation\"\r\n            [formSetting]=\"formSetting\"\r\n            [index]=\"index\"\r\n            [last]=\"last\"\r\n            [setting]=\"viewSetting\"\r\n            [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns:false\"\r\n            [columns]=\"columns | filterColumnsByDetails: detailsColumns:false\"\r\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\r\n            [access]=\"access\"\r\n            [inlineEditMode]=\"inlineEditMode\"\r\n            [allowInlineEdit]=\"allowInlineEdit\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [allColumns]=\"allColumns\"\r\n            [contextMenuItems]=\"contextMenuItems\"\r\n            [canView]=\"canView\"\r\n            [conditionalFormats]=\"conditionalFormats\"\r\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            [navigationArrow]=\"navigationArrow\"\r\n            [isCheckList]=\"isCheckList\"\r\n            [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\r\n            (events)=\"onOlgoEvents($event)\"\r\n        >\r\n        </bnrc-dynamic-item-component>\r\n        }\r\n    </ng-template>\r\n    <ng-template\r\n        #dynamicItemTemplate\r\n        let-mo\r\n        let-index=\"index\"\r\n        let-columns=\"columns\"\r\n        let-moDataListCount=\"moDataListCount\"\r\n        let-moDataList=\"moDataList\"\r\n    >\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"viewSetting.RowOlgo\"\r\n            [mo]=\"mo\"\r\n            [styleIndex]=\"mo.$StyleIndex\"\r\n            [moDataList]=\"moDataList\"\r\n            [showDetailsInRow]=\"showDetailsInRow\"\r\n            [hideOpenIcon]=\"hideOpenIcon\"\r\n            [detailsColumns]=\"detailsColumns\"\r\n            [columnComponents]=\"viewSetting?.ColumnComponents || null\"\r\n            [cartableTemplate]=\"cartableTemplates[mo.RelatedMo?.$TypeDefId]\"\r\n            [cartableMo]=\"mo.RelatedMo\"\r\n            [cartableWorkflowData]=\"mo.SerializedWorkflowData\"\r\n            [serializedRelatedMo]=\"mo.SerializedRelatedMo\"\r\n            [detailsText]=\"viewSetting?.DetailsSetting?.ButtonText\"\r\n            [detailsComponent]=\"detailsComponent\"\r\n            [isChecked]=\"mo.$IsChecked\"\r\n            [visibility]=\"mo.$Visibility\"\r\n            [expanded]=\"mo.$Expanded\"\r\n            [level]=\"mo.$Level\"\r\n            [parentExpanded]=\"mo.$Parent?.$Expanded\"\r\n            [moDataListCount]=\"moDataListCount\"\r\n            [columnsCount]=\"columnsCount - detailsColumns.length\"\r\n            [typeDefId]=\"typeDefId\"\r\n            [extraRelation]=\"extraRelation\"\r\n            [formSetting]=\"formSetting\"\r\n            [index]=\"index\"\r\n            [last]=\"last\"\r\n            [setting]=\"viewSetting\"\r\n            [secondaryColumns]=\"secondaryColumns | filterColumnsByDetails: detailsColumns:false\"\r\n            [columns]=\"columns | filterColumnsByDetails: detailsColumns:false\"\r\n            [isNewInlineMo]=\"mo.$NewInlineMo\"\r\n            [access]=\"access\"\r\n            [inlineEditMode]=\"inlineEditMode\"\r\n            [allowInlineEdit]=\"allowInlineEdit\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [allColumns]=\"allColumns\"\r\n            [contextMenuItems]=\"contextMenuItems\"\r\n            [canView]=\"canView\"\r\n            [conditionalFormats]=\"conditionalFormats\"\r\n            [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            [navigationArrow]=\"navigationArrow\"\r\n            [isCheckList]=\"isCheckList\"\r\n            [rowIndicator]=\"columns[0].MetaFieldTypeId === '41'\"\r\n            (events)=\"onOlgoEvents($event)\"\r\n        >\r\n        </bnrc-dynamic-item-component>\r\n    </ng-template>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block}.fd-list__group-header{column-gap:10px;align-items:center}.header th{border-left:none!important;border-right:none!important}.clearCheckAll{text-decoration:none!important}.fd-list--navigation-indication .fd-list__item:after{min-width:0!important}li.standard-list-row{padding-top:.2rem;padding-bottom:.2rem;min-height:4rem;justify-content:space-evenly;column-gap:10px}li.standard-list-row:hover:not(.selected){background-color:var(--sapBackgroundColor, #f7f7f7)}li.standard-list-row .fd-list__content{row-gap:.4rem}li.standard-list-row .fd-list__content .fd-list__byline{padding:0;font-size:.775rem}li.standard-list-row ::ng-deep .fd-form-item{position:static}li.standard-list-row ::ng-deep .fd-form-item .fd-checkbox__label--compact{padding:0;margin-left:0}li.standard-list-row ::ng-deep fd-icon{font-size:.75rem!important}fd-layout-panel{height:100%}.li-link.checklink[rtl=true]{padding-right:0!important}.li-link.checklist[rtl=false]{padding-left:0!important}.standard-list-group-label{padding-top:10px;padding-bottom:3px}fd-layout-panel-header{display:none}fd-layout-panel.popup-mode.size-s{box-shadow:none!important}fd-layout-panel.popup-mode.size-s fd-layout-panel-header{display:none!important}.popup-mode fd-layout-panel-header{display:flex;min-height:1rem;height:1rem;border:none!important}.popup-mode fd-layout-panel-header h4{font-weight:700;font-size:1rem}.popup-mode fd-layout-panel-head{display:flex;column-gap:5px;align-items:center;justify-content:center}.popup-mode ::ng-deep li{border:none!important}.popup-mode fd-layout-panel-body{margin-top:.3rem}.popup-mode fd-layout-panel-filters{border:none!important;padding:0 1rem}.popup-mode .drop-down{width:100%;max-width:100%;max-height:2rem!important;height:2rem!important;background:var(--sapButton_Background)!important;border:1px solid #ccc!important}.popup-mode .drop-down ::ng-deep span{font-size:1rem!important;line-height:1.2rem!important}.popup-mode .drop-down ::ng-deep fd-icon{position:absolute;left:10px}fd-popover{width:100%;max-width:100%}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicItemComponent, selector: "bnrc-dynamic-item-component", inputs: ["mo", "allColumns", "moDataList", "columns", "column", "index", "last", "hideOpenIcon", "deviceName", "deviceSize", "rtl", "editMode", "setting", "parameters", "contextMenuItems", "canView", "showRowNumber", "rowNumber", "formSetting", "conditionalFormats", "disableOverflowContextMenu", "navigationArrow", "isCheckList", "maxHeightHeader", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "directive", type: i2.EllipsifyDirective, selector: "[ellipsify]", inputs: ["limitLine"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i2$6.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i2$5.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i2$5.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i2$5.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "directive", type: i2$5.LayoutPanelTitleDirective, selector: "[fd-layout-panel-title]" }, { kind: "component", type: i2$5.LayoutPanelActionsComponent, selector: "fd-layout-panel-actions" }, { kind: "component", type: i2$5.LayoutPanelFiltersComponent, selector: "fd-layout-panel-filters" }, { kind: "component", type: i2$5.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i7$2.ToolbarLabelDirective, selector: "[fd-toolbar-label]" }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: ListItemComponent, selector: "bsu-list-item", inputs: ["setting", "isDisplayType"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i2.MultipleGroupByPipe, name: "multipleGroupBy" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterColumnsByDetailsPipe, name: "filterColumnsByDetails" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiListViewComponent, decorators: [{
             type: Component,
@@ -6088,7 +6072,7 @@ class BarsaTableHeaderComponent extends BaseComponent {
         return `${column.Name}${index}`;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaTableHeaderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaTableHeaderComponent, isStandalone: false, selector: "bsu-barsa-table-header", inputs: { allChecked: "allChecked", isCheckList: "isCheckList", attachmentViewType: "attachmentViewType", columns: "columns", fitWidth: "fitWidth", contextMenuItems: "contextMenuItems", contextMenuWidth: "contextMenuWidth", showViewButton: "showViewButton", hasSelected: "hasSelected", isMobile: "isMobile", hideOpenIcon: "hideOpenIcon", disableOverflowContextMenu: "disableOverflowContextMenu", inlineEditMode: "inlineEditMode", hideHeader: "hideHeader", showDetailsInRow: "showDetailsInRow", viewSetting: "viewSetting", tableWidth: "tableWidth", resizedByUser: "resizedByUser", disableResponsive: "disableResponsive", actionList: "actionList", rowIndicator: "rowIndicator", rtl: "rtl", sticky: "sticky", showRowNumber: "showRowNumber", hasSecondaryColumns: "hasSecondaryColumns", disableResize: "disableResize", disableHeaderContextMenu: "disableHeaderContextMenu", deviceSize: "deviceSize", tableHeaderMode: "tableHeaderMode" }, outputs: { allCheckbox: "allCheckbox", columnResize: "columnResize", columnResizing: "columnResizing", fitToContent: "fitToContent", fitToContainer: "fitToContainer", freeColumnSize: "freeColumnSize", sortAscending: "sortAscending", sortDescending: "sortDescending", filter: "filter", resetGridSettings: "resetGridSettings", headerRender: "headerRender" }, viewQueries: [{ propertyName: "theadRef", first: true, predicate: ["theadRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "thList", predicate: ["thRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<thead\r\n    fd-table-header\r\n    [class.inline-edit]=\"inlineEditMode\"\r\n    [class.smallColumns]=\"columnsSmallerThanTableWidth\"\r\n    [style.position]=\"sticky ? 'sticky' : null\"\r\n    #theadRef\r\n>\r\n    <tr fd-table-row>\r\n        @if (!hideHeader) { @if (rowIndicator) {\r\n        <th fd-table-cell fd-table-status-indicator #rowIndicator></th>\r\n        } @if (showRowNumber) {\r\n        <th fd-table-cell style=\"width: 40px; max-width: 40px\"></th>\r\n        } @if (isCheckList) {\r\n        <th fd-table-cell>\r\n            <fd-checkbox\r\n                name=\"allCheckbox\"\r\n                [ngModel]=\"allChecked\"\r\n                (ngModelChange)=\"onAllCheckbox($event)\"\r\n            ></fd-checkbox>\r\n        </th>\r\n        } @if (!isCheckList && !showRowNumber) {\r\n        <th fd-table-cell class=\"single-select\"></th>\r\n        } @for (column of columns; track _trackByColumn(i, column); let i = $index; let last = $last) {\r\n        <th\r\n            #thRef\r\n            tableth\r\n            [hasSecondaryColumns]=\"hasSecondaryColumns\"\r\n            fd-table-cell\r\n            resizable\r\n            [index]=\"i\"\r\n            [last]=\"last\"\r\n            [columnsLength]=\"columns.length\"\r\n            [column]=\"column\"\r\n            [tableHeaderMode]=\"tableHeaderMode\"\r\n            [fieldTypeId]=\"+column.FieldTypeId\"\r\n            [rtl]=\"rtl\"\r\n            [caption]=\"column.Caption | bbbTranslate\"\r\n            [name]=\"column.Name\"\r\n            [icon]=\"column.Icon\"\r\n            [colClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\r\n            [displayType]=\"column.Extra?.IconDisplayTypeEnum\"\r\n            [isImageOrIcon]=\"(column | thImageOrIcon) === true\"\r\n            [disableResize]=\"\r\n                hasSecondaryColumns ||\r\n                disableResize ||\r\n                (tableHeaderMode === 2 && last) ||\r\n                (column | thImageOrIcon) === true\r\n            \"\r\n            [disableHeaderContextMenu]=\"disableHeaderContextMenu\"\r\n            [disableResponsive]=\"disableResponsive\"\r\n            (sortAscending)=\"sortAscending.emit(column)\"\r\n            (sortDescending)=\"sortDescending.emit(column)\"\r\n            (filter)=\"filter.emit(column)\"\r\n            (resetGridSettings)=\"resetGridSettings.emit()\"\r\n            (widthChange)=\"!hasSecondaryColumns && onColumnWidthChange(column)\"\r\n            (widthChanging)=\"!hasSecondaryColumns && onColumnWidthChanging(i, column, $event)\"\r\n            [style.width]=\"hasSecondaryColumns ? (columns.length===1  ? '100% !important':'50% !important')   : null\"\r\n        >\r\n            @if(!disableHeaderContextMenu){\r\n            <fd-popover #menu>\r\n                <fd-popover-control>\r\n                    <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\r\n                </fd-popover-control>\r\n                <fd-popover-body>\r\n                    <ul fd-list>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"onSortAscending(column, menu)\">\r\n                                <fd-menu-addon position=\"before\" glyph=\"sort-ascending\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title\r\n                                    >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\r\n                                >\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"onSortDescending(column, menu)\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" glyph=\"sort-descending\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title\r\n                                    >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\r\n                                >\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"onFitToContent(column, i)\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"fitToContainer.emit()\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"freeColumnSize.emit()\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"onResetColumnsSettings()\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" glyph=\"reset\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title>{{ 'GridSettingBase' | bbbTranslate }}</span>\r\n                            </a>\r\n                        </li>\r\n                    </ul>\r\n                </fd-popover-body>\r\n            </fd-popover>\r\n            } @else{\r\n            <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\r\n            }\r\n        </th>\r\n        } @if (contextMenuItems && contextMenuItems.length > 0) {\r\n        <th\r\n            class=\"col-header col-context-menu\"\r\n            fd-table-cell\r\n            [fitContent]=\"disableOverflowContextMenu\"\r\n            [style.width.px]=\"contextMenuWidth\"\r\n        ></th>\r\n        } @if (showDetailsInRow && !inlineEditMode) {\r\n        <th class=\"col-header col-details\" [style.width]=\"deviceSize === 's' ? '44px' : '120px'\" fd-table-cell></th>\r\n        } @if (showViewButton) {\r\n        <th class=\"col-header col-view\" [style.width.px]=\"36 * (actionList?.length ?? 0) + 8\" fd-table-cell></th>\r\n        } }\r\n    </tr>\r\n</thead>\r\n<ng-template #headerValue let-column>\r\n    <div style=\"display: flex\" [attr.title]=\"column.Caption | bbbTranslate\" [style.min-width]=\"isMobile ? 'max-content' : null\">\r\n        @if ( (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) && column.Icon) {\r\n        <img [src]=\"column.Icon\" />\r\n        } @else if(column.FieldTypeId!==38) {\r\n        {{ column.Caption | bbbTranslate }}\r\n        }\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i2$2.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i5$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i3$4.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$4.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$4.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "directive", type: i3$4.TableStatusIndicatorDirective, selector: "[fdTableStatusIndicator], [fd-table-status-indicator]", inputs: ["status"] }, { kind: "component", type: i2.ResizableComponent, selector: "th[resizable]", inputs: ["disableResize", "rtl"], outputs: ["widthChange", "widthChanging"] }, { kind: "directive", type: TableThDirective, selector: "[tableth]", inputs: ["fieldTypeId", "caption", "icon", "inlineEditMode", "isImageOrIcon", "columnsLength", "tableWidth", "last", "rtl", "column", "disableResponsive", "disableResize", "disableHeaderContextMenu", "hasSecondaryColumns", "tableHeaderMode", "colClass", "displayType", "name", "index"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ThImageOrIconePipe, name: "thImageOrIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaTableHeaderComponent, isStandalone: false, selector: "bsu-barsa-table-header", inputs: { allChecked: "allChecked", isCheckList: "isCheckList", attachmentViewType: "attachmentViewType", columns: "columns", fitWidth: "fitWidth", contextMenuItems: "contextMenuItems", contextMenuWidth: "contextMenuWidth", showViewButton: "showViewButton", hasSelected: "hasSelected", isMobile: "isMobile", hideOpenIcon: "hideOpenIcon", disableOverflowContextMenu: "disableOverflowContextMenu", inlineEditMode: "inlineEditMode", hideHeader: "hideHeader", showDetailsInRow: "showDetailsInRow", viewSetting: "viewSetting", tableWidth: "tableWidth", resizedByUser: "resizedByUser", disableResponsive: "disableResponsive", actionList: "actionList", rowIndicator: "rowIndicator", rtl: "rtl", sticky: "sticky", showRowNumber: "showRowNumber", hasSecondaryColumns: "hasSecondaryColumns", disableResize: "disableResize", disableHeaderContextMenu: "disableHeaderContextMenu", deviceSize: "deviceSize", tableHeaderMode: "tableHeaderMode" }, outputs: { allCheckbox: "allCheckbox", columnResize: "columnResize", columnResizing: "columnResizing", fitToContent: "fitToContent", fitToContainer: "fitToContainer", freeColumnSize: "freeColumnSize", sortAscending: "sortAscending", sortDescending: "sortDescending", filter: "filter", resetGridSettings: "resetGridSettings", headerRender: "headerRender" }, viewQueries: [{ propertyName: "theadRef", first: true, predicate: ["theadRef"], descendants: true, read: ElementRef, static: true }, { propertyName: "thList", predicate: ["thRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<thead\r\n    fd-table-header\r\n    [class.inline-edit]=\"inlineEditMode\"\r\n    [class.smallColumns]=\"columnsSmallerThanTableWidth\"\r\n    [style.position]=\"sticky ? 'sticky' : null\"\r\n    #theadRef\r\n>\r\n    <tr fd-table-row>\r\n        @if (!hideHeader) { @if (rowIndicator) {\r\n        <th fd-table-cell fd-table-status-indicator #rowIndicator></th>\r\n        } @if (showRowNumber) {\r\n        <th fd-table-cell style=\"width: 40px; max-width: 40px\"></th>\r\n        } @if (isCheckList) {\r\n        <th fd-table-cell>\r\n            <fd-checkbox\r\n                name=\"allCheckbox\"\r\n                [ngModel]=\"allChecked\"\r\n                (ngModelChange)=\"onAllCheckbox($event)\"\r\n            ></fd-checkbox>\r\n        </th>\r\n        } @if (!isCheckList && !showRowNumber) {\r\n        <th fd-table-cell class=\"single-select\"></th>\r\n        } @for (column of columns; track _trackByColumn(i, column); let i = $index; let last = $last) {\r\n        <th\r\n            #thRef\r\n            tableth\r\n            [hasSecondaryColumns]=\"hasSecondaryColumns\"\r\n            fd-table-cell\r\n            resizable\r\n            [index]=\"i\"\r\n            [last]=\"last\"\r\n            [columnsLength]=\"columns.length\"\r\n            [column]=\"column\"\r\n            [tableHeaderMode]=\"tableHeaderMode\"\r\n            [fieldTypeId]=\"+column.FieldTypeId\"\r\n            [rtl]=\"rtl\"\r\n            [caption]=\"column.Caption | bbbTranslate\"\r\n            [name]=\"column.Name\"\r\n            [icon]=\"column.Icon\"\r\n            [colClass]=\"column.$CSSClassName + ' column__' + column.Caption\"\r\n            [displayType]=\"column.Extra?.IconDisplayTypeEnum\"\r\n            [isImageOrIcon]=\"(column | thImageOrIcon) === true\"\r\n            [disableResize]=\"\r\n                hasSecondaryColumns ||\r\n                disableResize ||\r\n                (tableHeaderMode === 2 && last) ||\r\n                (column | thImageOrIcon) === true\r\n            \"\r\n            [disableHeaderContextMenu]=\"disableHeaderContextMenu\"\r\n            [disableResponsive]=\"disableResponsive\"\r\n            (sortAscending)=\"sortAscending.emit(column)\"\r\n            (sortDescending)=\"sortDescending.emit(column)\"\r\n            (filter)=\"filter.emit(column)\"\r\n            (resetGridSettings)=\"resetGridSettings.emit()\"\r\n            (widthChange)=\"!hasSecondaryColumns && onColumnWidthChange(column)\"\r\n            (widthChanging)=\"!hasSecondaryColumns && onColumnWidthChanging(i, column, $event)\"\r\n            [style.width]=\"hasSecondaryColumns ? (columns.length===1  ? '100% !important':'50% !important')   : null\"\r\n        >\r\n            @if(!disableHeaderContextMenu){\r\n            <fd-popover #menu>\r\n                <fd-popover-control>\r\n                    <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\r\n                </fd-popover-control>\r\n                <fd-popover-body>\r\n                    <ul fd-list>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"onSortAscending(column, menu)\">\r\n                                <fd-menu-addon position=\"before\" glyph=\"sort-ascending\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title\r\n                                    >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Ascending' | bbbTranslate }}</span\r\n                                >\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"onSortDescending(column, menu)\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" glyph=\"sort-descending\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title\r\n                                    >{{ ('Sort' | bbbTranslate) + ' ' }} {{ 'Descending' | bbbTranslate }}</span\r\n                                >\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"onFitToContent(column, i)\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title>{{ ('Fit Column To Content' | bbbTranslate) + ' ' }}</span>\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"fitToContainer.emit()\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title>{{ ('All Columns In Page' | bbbTranslate) + ' ' }}</span>\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"freeColumnSize.emit()\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title>{{ ('Free Columns Size' | bbbTranslate) + ' ' }}</span>\r\n                            </a>\r\n                        </li>\r\n                        <li fd-list-item>\r\n                            <a fd-list-link (click)=\"onResetColumnsSettings()\" bodyClick>\r\n                                <fd-menu-addon position=\"before\" glyph=\"reset\" fd-list-icon></fd-menu-addon>\r\n                                <span fd-list-title>{{ 'GridSettingBase' | bbbTranslate }}</span>\r\n                            </a>\r\n                        </li>\r\n                    </ul>\r\n                </fd-popover-body>\r\n            </fd-popover>\r\n            } @else{\r\n            <ng-container *ngTemplateOutlet=\"headerValue; context: { $implicit: column }\"></ng-container>\r\n            }\r\n        </th>\r\n        } @if (contextMenuItems && contextMenuItems.length > 0) {\r\n        <th\r\n            class=\"col-header col-context-menu\"\r\n            fd-table-cell\r\n            [fitContent]=\"disableOverflowContextMenu\"\r\n            [style.width.px]=\"contextMenuWidth\"\r\n        ></th>\r\n        } @if (showDetailsInRow && !inlineEditMode) {\r\n        <th class=\"col-header col-details\" [style.width]=\"deviceSize === 's' ? '44px' : '120px'\" fd-table-cell></th>\r\n        } @if (showViewButton) {\r\n        <th class=\"col-header col-view\" [style.width.px]=\"36 * (actionList?.length ?? 0) + 8\" fd-table-cell></th>\r\n        } }\r\n    </tr>\r\n</thead>\r\n<ng-template #headerValue let-column>\r\n    <div style=\"display: flex\" [attr.title]=\"column.Caption | bbbTranslate\" [style.min-width]=\"isMobile ? 'max-content' : null\">\r\n        @if ( (column.Extra?.IconDisplayTypeEnum === 'Image' || column.FieldTypeId === 42) && column.Icon) {\r\n        <img [src]=\"column.Icon\" />\r\n        } @else if(column.FieldTypeId!==38) {\r\n        {{ column.Caption | bbbTranslate }}\r\n        }\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:contents;width:100%}:host.has-toolbar thead{border-top:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i2$2.CheckboxComponent, selector: "fd-checkbox", inputs: ["wrapLabel", "valignLabel", "ariaLabel", "role", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "readonly", "tristate", "tristateSelectable", "labelClass", "required", "displayOnly", "values", "standalone"], outputs: ["focusChange"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i5$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i3$4.TableHeaderDirective, selector: "[fdTableHeader], [fd-table-header]", inputs: ["noBorderX", "noBorderY", "nonInteractive"] }, { kind: "directive", type: i3$4.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$4.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "directive", type: i3$4.TableStatusIndicatorDirective, selector: "[fdTableStatusIndicator], [fd-table-status-indicator]", inputs: ["status"] }, { kind: "component", type: i2.ResizableComponent, selector: "th[resizable]", inputs: ["disableResize", "rtl"], outputs: ["widthChange", "widthChanging"] }, { kind: "directive", type: TableThDirective, selector: "[tableth]", inputs: ["fieldTypeId", "caption", "icon", "inlineEditMode", "isImageOrIcon", "columnsLength", "tableWidth", "last", "rtl", "column", "disableResponsive", "disableResize", "disableHeaderContextMenu", "hasSecondaryColumns", "tableHeaderMode", "colClass", "displayType", "name", "index"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ThImageOrIconePipe, name: "thImageOrIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaTableHeaderComponent, decorators: [{
             type: Component,
@@ -6833,7 +6817,7 @@ class UiDateRangeExComponent extends FieldBaseComponent {
                 useFactory: getDateService,
                 deps: [LogService]
             }
-        ], viewQueries: [{ propertyName: "dateRangePicker", first: true, predicate: ["dateRangePicker"], descendants: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (value?.DateRangeType === 'SpecificRange') {\r\n<div class=\"input-container\">\r\n    <ui5-daterange-picker\r\n        id=\"mydaterange-picker1\"\r\n        (mouseover)=\"onOpenPopover()\"\r\n        (mouseleave)=\"popover.close()\"\r\n        #dateRangePicker\r\n        (change)=\"onDateRangeChange()\"\r\n        format-pattern=\"yyyy/MM/dd\"\r\n        [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\r\n        [attr.disabled]=\"(disable$ | async) === true ? true : null\"\r\n        [primaryCalendarType]=\"Setting.CalendarType !== 'Gregorian' ? 'Persian' : Setting.CalendarType\"\r\n    >\r\n    </ui5-daterange-picker>\r\n    <button\r\n        class=\"btn-drop-down\"\r\n        fd-button\r\n        [fdType]=\"'standard'\"\r\n        [glyph]=\"'slim-arrow-down'\"\r\n        (click)=\"popover.open()\"\r\n    ></button>\r\n</div>\r\n} @else {\r\n<!-- <input fd-form-control [(ngModel)]=\"valueStr\" [fd-inline-help]=\"valueStr\" [readOnly]=\"true\" /> -->\r\n<fd-input-group\r\n    placement=\"after\"\r\n    glyph=\"slim-arrow-down\"\r\n    glyphAriaLabel=\"Select Date Range\"\r\n    [button]=\"true\"\r\n    [ngModel]=\"valueStr\"\r\n    (addOnButtonClicked)=\"popover.open()\"\r\n>\r\n</fd-input-group>\r\n}\r\n<ng-template #input>\r\n    <!-- <input fd-form-control [(ngModel)]=\"valueStr\" [fd-inline-help]=\"valueStr\" [readOnly]=\"true\" /> -->\r\n\r\n    <fd-input-group\r\n        placement=\"after\"\r\n        glyph=\"slim-arrow-down\"\r\n        glyphAriaLabel=\"Select Date Range\"\r\n        [button]=\"true\"\r\n        [ngModel]=\"valueStr\"\r\n        (addOnButtonClicked)=\"popover.open()\"\r\n    >\r\n    </fd-input-group>\r\n</ng-template>\r\n\r\n<!-- <button fd-button>\r\n<fd-select (valueChange)=\"onDateRangeTypeChange($event)\">\r\n  <fd-option *ngFor=\"let option of dateRanges\" [value]=\"option\">{{ option | bbbTranslate }}</fd-option>\r\n</fd-select>\r\n</button> -->\r\n\r\n<fd-popover\r\n    #popover\r\n    style=\"display: block\"\r\n    [fillControlMode]=\"'at-least'\"\r\n    placement=\"bottom-start\"\r\n    [(isOpen)]=\"isOpenPopover\"\r\n>\r\n    <fd-popover-body>\r\n        <ul fd-list>\r\n            @for (option of dateRanges; track option) {\r\n            <li fd-list-item (click)=\"popover.close(); onDateRangeTypeChange(option)\">\r\n                <a fd-list-link>\r\n                    <span fd-list-title>{{ option | bbbTranslate }}</span>\r\n                </a>\r\n            </li>\r\n            }\r\n        </ul>\r\n    </fd-popover-body>\r\n</fd-popover>\r\n", styles: [":host{display:block}:host input{border-top-left-radius:0;border-left:none;border-bottom-left-radius:0}:host .input-container{width:100%;display:flex;align-items:center;padding:3px 0}:host .input-container ui5-daterange-picker{min-width:2rem;width:100%;flex-grow:1}.btn-drop-down{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "dateRangePicker", first: true, predicate: ["dateRangePicker"], descendants: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (value?.DateRangeType === 'SpecificRange') {\r\n<div class=\"input-container\">\r\n    <ui5-daterange-picker\r\n        id=\"mydaterange-picker1\"\r\n        (mouseover)=\"onOpenPopover()\"\r\n        (mouseleave)=\"popover.close()\"\r\n        #dateRangePicker\r\n        (change)=\"onDateRangeChange()\"\r\n        format-pattern=\"yyyy/MM/dd\"\r\n        [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\r\n        [attr.disabled]=\"(disable$ | async) === true ? true : null\"\r\n        [primaryCalendarType]=\"Setting.CalendarType !== 'Gregorian' ? 'Persian' : Setting.CalendarType\"\r\n    >\r\n    </ui5-daterange-picker>\r\n    <button\r\n        class=\"btn-drop-down\"\r\n        fd-button\r\n        [fdType]=\"'standard'\"\r\n        [glyph]=\"'slim-arrow-down'\"\r\n        (click)=\"popover.open()\"\r\n    ></button>\r\n</div>\r\n} @else {\r\n<!-- <input fd-form-control [(ngModel)]=\"valueStr\" [fd-inline-help]=\"valueStr\" [readOnly]=\"true\" /> -->\r\n<fd-input-group\r\n    placement=\"after\"\r\n    glyph=\"slim-arrow-down\"\r\n    glyphAriaLabel=\"Select Date Range\"\r\n    [button]=\"true\"\r\n    [ngModel]=\"valueStr\"\r\n    (addOnButtonClicked)=\"popover.open()\"\r\n>\r\n</fd-input-group>\r\n}\r\n<ng-template #input>\r\n    <!-- <input fd-form-control [(ngModel)]=\"valueStr\" [fd-inline-help]=\"valueStr\" [readOnly]=\"true\" /> -->\r\n\r\n    <fd-input-group\r\n        placement=\"after\"\r\n        glyph=\"slim-arrow-down\"\r\n        glyphAriaLabel=\"Select Date Range\"\r\n        [button]=\"true\"\r\n        [ngModel]=\"valueStr\"\r\n        (addOnButtonClicked)=\"popover.open()\"\r\n    >\r\n    </fd-input-group>\r\n</ng-template>\r\n\r\n<!-- <button fd-button>\r\n<fd-select (valueChange)=\"onDateRangeTypeChange($event)\">\r\n  <fd-option *ngFor=\"let option of dateRanges\" [value]=\"option\">{{ option | bbbTranslate }}</fd-option>\r\n</fd-select>\r\n</button> -->\r\n\r\n<fd-popover\r\n    #popover\r\n    style=\"display: block\"\r\n    [fillControlMode]=\"'at-least'\"\r\n    placement=\"bottom-start\"\r\n    [(isOpen)]=\"isOpenPopover\"\r\n>\r\n    <fd-popover-body>\r\n        <ul fd-list>\r\n            @for (option of dateRanges; track option) {\r\n            <li fd-list-item (click)=\"popover.close(); onDateRangeTypeChange(option)\">\r\n                <a fd-list-link>\r\n                    <span fd-list-title>{{ option | bbbTranslate }}</span>\r\n                </a>\r\n            </li>\r\n            }\r\n        </ul>\r\n    </fd-popover-body>\r\n</fd-popover>\r\n", styles: [":host{display:block}:host input{border-top-left-radius:0;border-left:none;border-bottom-left-radius:0}:host .input-container{width:100%;display:flex;align-items:center;padding:3px 0}:host .input-container ui5-daterange-picker{min-width:2rem;width:100%;flex-grow:1}.btn-drop-down{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0;background-color:var(--sapField_ReadOnly_Background);border-color:var(--sapField_ReadOnly_BorderColor)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiDateRangeExComponent, decorators: [{
             type: Component,
@@ -7272,11 +7256,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
 
 class BarsaUlvMainComponent extends BaseComponent {
     constructor() {
-        super();
+        super(...arguments);
         this._backgroundColor = null;
         this._backgroundUrl = null;
         this._backgroundRepeat = null;
         this._customBackground = false;
+        this.hideTitle = false;
+        this.groupbyClick = new EventEmitter();
+        this.sortClick = new EventEmitter();
+        this.columnClick = new EventEmitter();
+        this.editModeClick = new EventEmitter();
+        this.viewClick = new EventEmitter();
+        this.createNewInlineMo = new EventEmitter();
+        /* ulv toolbar  ends*/
         this.closeEvent = new EventEmitter();
         this.searchPanelMoChange = new EventEmitter();
         this.openManageFilters = new EventEmitter();
@@ -7291,13 +7283,28 @@ class BarsaUlvMainComponent extends BaseComponent {
         // eslint-disable-next-line
         this.search = new EventEmitter();
         this.selectSearchPanelSettings = new EventEmitter();
-        this.isServiceDesk = false;
+        this.isServiceDesk = BarsaApi.LoginFormData.IsServiceDesk;
         this.fillPage = false;
         this.sideContentMode = false;
+        this.ulvToolbarComponent = {
+            $Caption: '',
+            Id: '',
+            Module: 'BarsaSapUi',
+            ModuleFileName: 'BarsaSapUiModule.js',
+            Name: 'UlvToolbarComponent',
+            Selector: 'bsu-ulv-toolbar'
+        };
         this._dialogService = inject(DialogService);
         this._renderer2 = inject(Renderer2);
         this._router = inject(Router);
-        this.isServiceDesk = BarsaApi.LoginFormData.IsServiceDesk;
+        this.FnHandleUlvToolbarEvents = (ulvToolbar) => {
+            ulvToolbar.groupbyClick.pipe(takeUntil$1(this._onDestroy$)).subscribe((c) => this.groupbyClick.emit(c));
+            ulvToolbar.columnClick.pipe(takeUntil$1(this._onDestroy$)).subscribe((c) => this.columnClick.emit(c));
+            ulvToolbar.createNewInlineMo.pipe(takeUntil$1(this._onDestroy$)).subscribe(() => this.createNewInlineMo.emit());
+            ulvToolbar.editModeClick.pipe(takeUntil$1(this._onDestroy$)).subscribe(() => this.editModeClick.emit());
+            ulvToolbar.sortClick.pipe(takeUntil$1(this._onDestroy$)).subscribe((c) => this.sortClick.emit(c));
+            ulvToolbar.viewClick.pipe(takeUntil$1(this._onDestroy$)).subscribe((c) => this.viewClick.emit(c));
+        };
     }
     ngOnInit() {
         super.ngOnInit();
@@ -7392,13 +7399,13 @@ class BarsaUlvMainComponent extends BaseComponent {
         this._backgroundRepeat = cssBackground.repeat === false ? 'no-repeat' : 'repeat';
         this._customBackground = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaUlvMainComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaUlvMainComponent, isStandalone: false, selector: "bsu-barsa-ulv-main", inputs: { viewerControl: "viewerControl", hideViewerLoading: "hideViewerLoading", loading: "loading", hidePaging: "hidePaging", viewerLoading: "viewerLoading", isReportPage: "isReportPage", cssBackground: "cssBackground", deviceSize: "deviceSize", shortcuts: "shortcuts", title: "title", searchPanelUi: "searchPanelUi", breadCrumbs: "breadCrumbs", allSearchPanelSettings: "allSearchPanelSettings", isAnonymous: "isAnonymous", canSaveGridSetting: "canSaveGridSetting", rtl: "rtl", hideUlvPageTitle: "hideUlvPageTitle", selectedSearchPanelSettings: "selectedSearchPanelSettings", searchPanelMoChanged: "searchPanelMoChanged", selectedSearchPanelSettingsId: "selectedSearchPanelSettingsId", hideSearchPanel: "hideSearchPanel", pagingSetting: "pagingSetting", contentDensity: "contentDensity", context: "context", isMobile: "isMobile", standalone: "standalone", landscape: "landscape", simpleSearchPanel: "simpleSearchPanel", layoutInfo: "layoutInfo" }, outputs: { closeEvent: "closeEvent", searchPanelMoChange: "searchPanelMoChange", openManageFilters: "openManageFilters", collapsedChange: "collapsedChange", hideSearchPanelClick: "hideSearchPanelClick", filterSave: "filterSave", filterSaveAs: "filterSaveAs", pageChange: "pageChange", showFilterFieldsSetting: "showFilterFieldsSetting", manageFilters: "manageFilters", clearSearch: "clearSearch", search: "search", selectSearchPanelSettings: "selectSearchPanelSettings" }, host: { properties: { "style.background-color": "this._backgroundColor", "style.background-image": "this._backgroundUrl", "style.background-repeat": "this._backgroundRepeat", "class.custom-background": "this._customBackground" } }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true }, { propertyName: "dialogTemplate", first: true, predicate: ["searchpanelDialog"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        isReportPage ? reportPageTemplate : reportTemplate;\r\n        context: {\r\n            $implicit: viewerControl,\r\n            tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n@if (loading) {\r\n<bsu-mask size=\"m\"></bsu-mask>\r\n}\r\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\r\n    <fd-dynamic-page\r\n        darkClass\r\n        formClose\r\n        mobile\r\n        [attr.isMobile]=\"isMobile ? true : null\"\r\n        [isMobile]=\"isMobile\"\r\n        [size]=\"deviceSize | dynamicPageSize\"\r\n        [attr.tabMode]=\"tabMode\"\r\n        [autoResponsive]=\"false\"\r\n        [class.notitle]=\"title.length < 2 || hideUlvPageTitle\"\r\n        [class.nosearchpanel]=\"!searchPanelUi\"\r\n        [class.hideSearchPanel]=\"hideSearchPanel\"\r\n        [class.sideContentMode]=\"sideContentMode\"\r\n    >\r\n        <fd-dynamic-page-header\r\n            [title]=\"\r\n                (title | bbbTranslate) && !hideUlvPageTitle\r\n                    ? (title | bbbTranslate)\r\n                    : isMobile && breadCrumbs.length\r\n                    ? breadCrumbs[breadCrumbs.length - 1].label\r\n                    : ''\r\n            \"\r\n            class=\"p-b0\"\r\n        >\r\n            <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n                <fd-breadcrumb>\r\n                    @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb.url; let i =\r\n                    $index; let last = $last) {\r\n                  @if(i>0) {   <fd-breadcrumb-item>\r\n                        <bsu-breadcrumb\r\n                            [index]=\"i\"\r\n                            [isLast]=\"last\"\r\n                            [breadCrumb]=\"breadCrumb\"\r\n                            [allBreadCrumb]=\"breadCrumbs\"\r\n                        ></bsu-breadcrumb>\r\n                    </fd-breadcrumb-item>\r\n                    }}\r\n                </fd-breadcrumb>\r\n            </fd-dynamic-page-breadcrumb>\r\n            <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\r\n\r\n            <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\r\n                <fd-toolbar [shouldOverflow]=\"true\" style=\"display: none\"> </fd-toolbar>\r\n                <!-- added this because in mobile landscape toolbar disapper -->\r\n                @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\r\n                <fd-toolbar\r\n                    class=\"global-actions\"\r\n                    fdType=\"transparent\"\r\n                    [clearBorder]=\"true\"\r\n                    [shouldOverflow]=\"deviceSize === 's'\"\r\n                >\r\n                    @if (isAnonymous === false && canSaveGridSetting) {\r\n                    <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\r\n                        <fd-popover-control>\r\n                            <div style=\"display: flex; align-items: center\">\r\n                                <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\r\n                                    {{\r\n                                        selectedSearchPanelSettings?.IsStandard\r\n                                            ? ''\r\n                                            : selectedSearchPanelSettings?.Title\r\n                                    }}\r\n                                    @if (searchPanelMoChanged) {\r\n                                    <strong>*</strong>\r\n                                    }\r\n                                </h3>\r\n                                <button\r\n                                    fd-button\r\n                                    glyph=\"slim-arrow-down\"\r\n                                    fdType=\"transparent\"\r\n                                    [fdContentDensity]=\"contentDensity\"\r\n                                ></button>\r\n                            </div>\r\n                        </fd-popover-control>\r\n                        <fd-popover-body mobile>\r\n                            <div fd-popover-body-header>\r\n                                <div fd-bar [fdCozy]>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                            <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\r\n                                @for (option of allSearchPanelSettings; track option) {\r\n                                <li\r\n                                    fd-list-item\r\n                                    [selected]=\"option.Id === selectedSearchPanelSettingsId\"\r\n                                    (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\r\n                                >\r\n                                    <span fd-list-title>{{ option.Title }}</span>\r\n                                </li>\r\n                                }\r\n                            </ul>\r\n                            <div fd-popover-body-footer>\r\n                                <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\r\n                                    @if (selectedSearchPanelSettings) {\r\n                                    <div fd-bar-right>\r\n                                        @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\r\n                                        <fd-button-bar\r\n                                            [label]=\"'Save' | bbbTranslate\"\r\n                                            fdType=\"emphasized\"\r\n                                            (click)=\"onFilterSave(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                        } @if (searchPanelMoChanged) {\r\n                                        <fd-button-bar\r\n                                            [label]=\"'SaveAs' | bbbTranslate\"\r\n                                            [fdType]=\"\r\n                                                selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\r\n                                            \"\r\n                                            (click)=\"onFilterSaveAs(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                        }\r\n                                        <fd-button-bar\r\n                                            [label]=\"'Manage' | bbbTranslate\"\r\n                                            fdkInitialFocus\r\n                                            fdType=\"transparent\"\r\n                                            (click)=\"onManageFilters(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                    </div>\r\n                                    }\r\n                                </div>\r\n                            </div>\r\n                        </fd-popover-body>\r\n                    </fd-popover>\r\n                    } @if (deviceSize !== 's') {\r\n                    <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                    } @if (isMobile && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdOverflowPriority=\"never\"\r\n                        (click)=\"onShowSearchpanelDialog()\"\r\n                        [glyph]=\"'filter'\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && !simpleSearchPanel && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdOverflowPriority=\"never\"\r\n                        fdType=\"emphasized\"\r\n                        [label]=\"'Search' | bbbTranslate\"\r\n                        (click)=\"onSearch()\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <!-- <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [label]=\"'Filters' | bbbTranslate\"\r\n                        (click)=\"onShowFilterFieldsSetting()\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button> -->\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [label]=\"'Clear' | bbbTranslate\"\r\n                        (click)=\"onClearSearch()\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n                        (click)=\"onHideSearchPanelClick()\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    }\r\n                </fd-toolbar>\r\n                }\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\" (click)=\"closeEvent.emit()\" title=\"Close\">\r\n                        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n                    </button>\r\n                </fd-toolbar>\r\n            </fd-dynamic-page-layout-actions>\r\n        </fd-dynamic-page-header>\r\n        @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\r\n        <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\r\n            @if (!isMobile) {\r\n            <bsu-search-panel\r\n                [hideButtons]=\"!simpleSearchPanel\"\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n            }\r\n        </fd-dynamic-page-subheader>\r\n        } @if (!tabMode) {\r\n\r\n        <fd-dynamic-page-content>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    sideContentMode ? sideContentTemplate : viewerTemplate;\r\n                    context: { noRenderPageing: true }\r\n                \"\r\n            ></ng-container>\r\n            \r\n        </fd-dynamic-page-content>\r\n\r\n        } @if (pagingSetting?.TotalPages) {\r\n        <fd-dynamic-page-footer>\r\n            <!-- page footer content goes here -->\r\n            <div fd-bar [barDesign]=\"'footer'\">\r\n                <div fd-bar-middle>\r\n                    <ng-container\r\n                        [renderUlvPaging]=\"context\"\r\n                        [pagingSetting]=\"pagingSetting\"\r\n                        (pageChange)=\"onPageChange($event)\"\r\n                    ></ng-container>\r\n                </div>\r\n            </div>\r\n        </fd-dynamic-page-footer>\r\n        }\r\n    </fd-dynamic-page>\r\n    @if (tabMode) {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template #reportTemplate>\r\n    @if (loading) {\r\n    <bsu-mask size=\"s\"></bsu-mask>\r\n    } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\r\n    <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\r\n    }\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            sideContentMode ? sideContentTemplate : viewerTemplate;\r\n            context: { simpleReport: 'simpleReport' }\r\n        \"\r\n    >\r\n    </ng-container>\r\n</ng-template>\r\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\r\n    <fd-dynamic-side-content\r\n        [class.rtl]=\"rtl\"\r\n        [size]=\"deviceSize | sapSize\"\r\n        fillEmptySpace\r\n        [decrement]=\"'2rem'\"\r\n        [disable]=\"isReportPage\"\r\n        [setMinHeight]=\"true\"\r\n        *untilInView=\"el\"\r\n    >\r\n        <fd-dynamic-side-content-side>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\r\n            ></ng-container>\r\n        </fd-dynamic-side-content-side>\r\n        <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\r\n            <fd-card>\r\n                <fd-card-content class=\"tw-flex tw-flex-col\"> \r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"viewerTemplate; context: { noRenderPageing: isReportPage ? true : false }\"\r\n                    ></ng-container>\r\n                </fd-card-content>\r\n            </fd-card>\r\n        </fd-dynamic-side-content-main>\r\n    </fd-dynamic-side-content>\r\n</ng-template>\r\n<ng-template\r\n    #searchpanelTemplate\r\n    let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\r\n    let-hideButtons=\"hideButtons\"\r\n>\r\n    @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\r\n    <bsu-search-panel\r\n        darkClass\r\n        [searchPanelUi]=\"searchPanelUi\"\r\n        [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\r\n        [hideButtons]=\"hideButtons\"\r\n        (moChanged)=\"onSearchPanelMoChanged()\"\r\n    ></bsu-search-panel>\r\n    } } @else {\r\n    <fd-card class=\"searchpanel-card\" darkClass>\r\n        <fd-card-header>\r\n            <fd-card-main-header>\r\n                <h2 fd-card-title>\r\n                    <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\r\n                </h2>\r\n            </fd-card-main-header>\r\n        </fd-card-header>\r\n        <fd-card-content style=\"flex-grow: 0\">\r\n            @if (!hideSearchPanel && searchPanelUi) {\r\n            <bsu-search-panel\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                [hideButtons]=\"true\"\r\n                [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n            }\r\n        </fd-card-content>\r\n        <fd-card-footer style=\"border-bottom: none\">\r\n            <button\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"emphasized\"\r\n                [label]=\"'Search' | bbbTranslate\"\r\n                (click)=\"onSearch()\"\r\n                [fdContentDensity]=\"contentDensity\"\r\n            ></button>\r\n            <button\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\r\n                (click)=\"onClearSearch()\"\r\n                [fdOverflowGroup]=\"1\"\r\n                [fdContentDensity]=\"contentDensity\"\r\n            ></button>\r\n        </fd-card-footer>\r\n    </fd-card>\r\n    }\r\n</ng-template>\r\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\r\n    <div\r\n        darkClass\r\n        class=\"viewer-container\"\r\n        fillEmptySpace\r\n        [shortcutHandler]=\"shortcuts\"\r\n        [disable]=\"!isReportPage || !fillPage\"\r\n        [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\r\n        [style.height]=\"viewerLoading && !hideViewerLoading ? '100%' : 'auto'\"\r\n        [style.min-height]=\"isReportPage ? '100%' : null\"\r\n        [style.position]=\"viewerLoading && !hideViewerLoading? 'relative' : null\"\r\n    >\r\n        @if (viewerLoading) {\r\n        <bsu-mask size=\"m\"></bsu-mask>\r\n        } @if (viewerControl) {\r\n        <ng-container\r\n            [renderUlvViewer]=\"viewerControl\"\r\n            [layoutInfo]=\"layoutInfo\"\r\n            [isReportPage]=\"isReportPage\"\r\n        ></ng-container>\r\n        }\r\n    </div>\r\n    @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing && !hidePaging) {\r\n    <ng-container\r\n        [renderUlvPaging]=\"context\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        (pageChange)=\"onPageChange($event)\"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\r\n            <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            <bsu-search-panel\r\n                [hideButtons]=\"true\"\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n        </fd-dialog-body>\r\n\r\n        <fd-dialog-footer>\r\n            <fd-dialog-footer-button>\r\n                <button\r\n                    fd-button\r\n                    fdkInitialFocus\r\n                    fdType=\"emphasized\"\r\n                    (click)=\"dialog.dismiss(); onSearch()\"\r\n                    [label]=\"'Search' | bbbTranslate\"\r\n                ></button>\r\n            </fd-dialog-footer-button>\r\n            <fd-dialog-footer-button>\r\n                <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\r\n            </fd-dialog-footer-button>\r\n            <fd-dialog-footer-button>\r\n                <button\r\n                    fd-button\r\n                    fdType=\"transparent\"\r\n                    (click)=\"dialog.dismiss('Close button')\"\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                ></button>\r\n            </fd-dialog-footer-button>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content{border:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content fd-dynamic-side-content-side{border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-right:none;border-left:1px solid #ccc!important}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content fd-dynamic-side-content-main fd-card{transition:.25s background-color!important;background-color:var(--sapBackgroundColor, #f7f7f7)}:host.custom-background ::ng-deep article.fd-dynamic-page,:host.custom-background ::ng-deep fd-dynamic-page-content,:host.custom-background ::ng-deep .report-view,:host.custom-background ::ng-deep fd-dynamic-side-content-main>fd-card{background-color:transparent!important}:host>fd-dynamic-page>fd-dynamic-page-header.hide-container ::ng-deep .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile).notitle.sideContentMode ::ng-deep>article>header .fd-dynamic-page__title-container,fd-dynamic-page:not(.mobile).notitle.nosearchpanel ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{min-height:100%;height:auto}fd-dynamic-side-content-main fd-card-content ::ng-deep>div{flex:1}fd-dynamic-side-content-main ::ng-deep fd-toolbar{border:none!important}fd-dynamic-side-content-main ::ng-deep bsu-ui-table-view{padding-bottom:0!important;overflow-y:hidden}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.RenderUlvViewerDirective, selector: "[renderUlvViewer]", inputs: ["mask", "isReportPage", "layoutInfo", "renderUlvViewer"] }, { kind: "directive", type: i2.RenderUlvPaginDirective, selector: "[renderUlvPaging]", inputs: ["mask", "pagingSetting", "renderUlvPaging"], outputs: ["pageChange"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i2.ShortcutHandlerDirective, selector: "[shortcutHandler]", inputs: ["shortcutHandler"], outputs: ["shortCutCommand"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i4$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$3.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i7$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i7$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i8$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i8$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i8$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i8$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i8$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i8$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i8$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i8$1.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i9.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i9.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i9.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$3.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i4$2.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: SearchPanelComponent, selector: "bsu-search-panel", inputs: ["searchPanelUi", "hideButtons", "isSearcPanelInSideContent"], outputs: ["moChanged"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "directive", type: DarkClassDirective, selector: "[darkClass]" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }, { kind: "pipe", type: SapSizePipe, name: "sapSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaUlvMainComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaUlvMainComponent, isStandalone: false, selector: "bsu-barsa-ulv-main", inputs: { component: "component", viewerControl: "viewerControl", hideViewerLoading: "hideViewerLoading", loading: "loading", hidePaging: "hidePaging", viewerLoading: "viewerLoading", isReportPage: "isReportPage", cssBackground: "cssBackground", deviceSize: "deviceSize", shortcuts: "shortcuts", title: "title", searchPanelUi: "searchPanelUi", breadCrumbs: "breadCrumbs", allSearchPanelSettings: "allSearchPanelSettings", isAnonymous: "isAnonymous", canSaveGridSetting: "canSaveGridSetting", rtl: "rtl", hideUlvPageTitle: "hideUlvPageTitle", selectedSearchPanelSettings: "selectedSearchPanelSettings", searchPanelMoChanged: "searchPanelMoChanged", selectedSearchPanelSettingsId: "selectedSearchPanelSettingsId", hideSearchPanel: "hideSearchPanel", pagingSetting: "pagingSetting", contentDensity: "contentDensity", context: "context", isMobile: "isMobile", standalone: "standalone", landscape: "landscape", simpleSearchPanel: "simpleSearchPanel", layoutInfo: "layoutInfo", formSetting: "formSetting", allowGridColumnSort: "allowGridColumnSort", useLayoutItemTextForControl: "useLayoutItemTextForControl", hideTitle: "hideTitle", deviceName: "deviceName", access: "access", hideToolbar: "hideToolbar", toolbarButtons: "toolbarButtons", inlineEditMode: "inlineEditMode", allowInlineEdit: "allowInlineEdit", gridSetting: "gridSetting", viewCollection: "viewCollection", reportView: "reportView", inDialog: "inDialog", isMultiSelect: "isMultiSelect", cls: "cls", hasSelected: "hasSelected" }, outputs: { groupbyClick: "groupbyClick", sortClick: "sortClick", columnClick: "columnClick", editModeClick: "editModeClick", viewClick: "viewClick", createNewInlineMo: "createNewInlineMo", closeEvent: "closeEvent", searchPanelMoChange: "searchPanelMoChange", openManageFilters: "openManageFilters", collapsedChange: "collapsedChange", hideSearchPanelClick: "hideSearchPanelClick", filterSave: "filterSave", filterSaveAs: "filterSaveAs", pageChange: "pageChange", showFilterFieldsSetting: "showFilterFieldsSetting", manageFilters: "manageFilters", clearSearch: "clearSearch", search: "search", selectSearchPanelSettings: "selectSearchPanelSettings" }, host: { properties: { "style.background-color": "this._backgroundColor", "style.background-image": "this._backgroundUrl", "style.background-repeat": "this._backgroundRepeat", "class.custom-background": "this._customBackground" } }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true }, { propertyName: "dialogTemplate", first: true, predicate: ["searchpanelDialog"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        isReportPage ? reportPageTemplate : reportTemplate;\r\n        context: {\r\n            $implicit: viewerControl,\r\n            tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n@if (loading) {\r\n<bsu-mask size=\"m\"></bsu-mask>\r\n}\r\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\r\n    <fd-dynamic-page\r\n        darkClass\r\n        formClose\r\n        mobile\r\n        [attr.isMobile]=\"isMobile ? true : null\"\r\n        [isMobile]=\"isMobile\"\r\n        [size]=\"deviceSize | dynamicPageSize\"\r\n        [attr.tabMode]=\"tabMode\"\r\n        [autoResponsive]=\"false\"\r\n        [class.notitle]=\"title.length < 2 || hideUlvPageTitle\"\r\n        [class.nosearchpanel]=\"!searchPanelUi\"\r\n        [class.hideSearchPanel]=\"hideSearchPanel\"\r\n        [class.sideContentMode]=\"sideContentMode\"\r\n    >\r\n        <fd-dynamic-page-header\r\n            [title]=\"\r\n                (title | bbbTranslate) && !hideUlvPageTitle\r\n                    ? (title | bbbTranslate)\r\n                    : isMobile && breadCrumbs.length\r\n                    ? breadCrumbs[breadCrumbs.length - 1].label\r\n                    : ''\r\n            \"\r\n            class=\"p-b0\"\r\n        >\r\n            <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n                <fd-breadcrumb>\r\n                    @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb.url; let i =\r\n                    $index; let last = $last) { @if(i>0) {\r\n                    <fd-breadcrumb-item>\r\n                        <bsu-breadcrumb\r\n                            [index]=\"i\"\r\n                            [isLast]=\"last\"\r\n                            [breadCrumb]=\"breadCrumb\"\r\n                            [allBreadCrumb]=\"breadCrumbs\"\r\n                        ></bsu-breadcrumb>\r\n                    </fd-breadcrumb-item>\r\n                    }}\r\n                </fd-breadcrumb>\r\n            </fd-dynamic-page-breadcrumb>\r\n            <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\r\n\r\n            <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\r\n                <fd-toolbar [shouldOverflow]=\"true\" style=\"display: none\"> </fd-toolbar>\r\n                <!-- added this because in mobile landscape toolbar disapper -->\r\n                @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\r\n                <fd-toolbar\r\n                    class=\"global-actions\"\r\n                    fdType=\"transparent\"\r\n                    [clearBorder]=\"true\"\r\n                    [shouldOverflow]=\"deviceSize === 's'\"\r\n                >\r\n                    @if (isAnonymous === false && canSaveGridSetting) {\r\n                    <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\r\n                        <fd-popover-control>\r\n                            <div style=\"display: flex; align-items: center\">\r\n                                <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\r\n                                    {{\r\n                                        selectedSearchPanelSettings?.IsStandard\r\n                                            ? ''\r\n                                            : selectedSearchPanelSettings?.Title\r\n                                    }}\r\n                                    @if (searchPanelMoChanged) {\r\n                                    <strong>*</strong>\r\n                                    }\r\n                                </h3>\r\n                                <button\r\n                                    fd-button\r\n                                    glyph=\"slim-arrow-down\"\r\n                                    fdType=\"transparent\"\r\n                                    [fdContentDensity]=\"contentDensity\"\r\n                                ></button>\r\n                            </div>\r\n                        </fd-popover-control>\r\n                        <fd-popover-body mobile>\r\n                            <div fd-popover-body-header>\r\n                                <div fd-bar [fdCozy]>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                            <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\r\n                                @for (option of allSearchPanelSettings; track option) {\r\n                                <li\r\n                                    fd-list-item\r\n                                    [selected]=\"option.Id === selectedSearchPanelSettingsId\"\r\n                                    (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\r\n                                >\r\n                                    <span fd-list-title>{{ option.Title }}</span>\r\n                                </li>\r\n                                }\r\n                            </ul>\r\n                            <div fd-popover-body-footer>\r\n                                <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\r\n                                    @if (selectedSearchPanelSettings) {\r\n                                    <div fd-bar-right>\r\n                                        @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\r\n                                        <fd-button-bar\r\n                                            [label]=\"'Save' | bbbTranslate\"\r\n                                            fdType=\"emphasized\"\r\n                                            (click)=\"onFilterSave(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                        } @if (searchPanelMoChanged) {\r\n                                        <fd-button-bar\r\n                                            [label]=\"'SaveAs' | bbbTranslate\"\r\n                                            [fdType]=\"\r\n                                                selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\r\n                                            \"\r\n                                            (click)=\"onFilterSaveAs(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                        }\r\n                                        <fd-button-bar\r\n                                            [label]=\"'Manage' | bbbTranslate\"\r\n                                            fdkInitialFocus\r\n                                            fdType=\"transparent\"\r\n                                            (click)=\"onManageFilters(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                    </div>\r\n                                    }\r\n                                </div>\r\n                            </div>\r\n                        </fd-popover-body>\r\n                    </fd-popover>\r\n                    } @if (deviceSize !== 's') {\r\n                    <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                    } @if (isMobile && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdOverflowPriority=\"never\"\r\n                        (click)=\"onShowSearchpanelDialog()\"\r\n                        [glyph]=\"'filter'\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && !simpleSearchPanel && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdOverflowPriority=\"never\"\r\n                        fdType=\"emphasized\"\r\n                        [label]=\"'Search' | bbbTranslate\"\r\n                        (click)=\"onSearch()\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <!-- <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [label]=\"'Filters' | bbbTranslate\"\r\n                        (click)=\"onShowFilterFieldsSetting()\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button> -->\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [label]=\"'Clear' | bbbTranslate\"\r\n                        (click)=\"onClearSearch()\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n                        (click)=\"onHideSearchPanelClick()\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    }\r\n                </fd-toolbar>\r\n                }\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\" (click)=\"closeEvent.emit()\" title=\"Close\">\r\n                        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n                    </button>\r\n                </fd-toolbar>\r\n            </fd-dynamic-page-layout-actions>\r\n        </fd-dynamic-page-header>\r\n        @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\r\n        <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\r\n            @if (!isMobile) {\r\n            <bsu-search-panel\r\n                [hideButtons]=\"!simpleSearchPanel\"\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n            }\r\n        </fd-dynamic-page-subheader>\r\n        } @if (!tabMode) {\r\n\r\n        <fd-dynamic-page-content>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    sideContentMode ? sideContentTemplate : viewerTemplate;\r\n                    context: { noRenderPageing: true }\r\n                \"\r\n            ></ng-container>\r\n        </fd-dynamic-page-content>\r\n\r\n        } @if (pagingSetting?.TotalPages) {\r\n        <fd-dynamic-page-footer>\r\n            <!-- page footer content goes here -->\r\n            <div fd-bar [barDesign]=\"'footer'\">\r\n                <div fd-bar-middle>\r\n                    <ng-container\r\n                        [renderUlvPaging]=\"context\"\r\n                        [pagingSetting]=\"pagingSetting\"\r\n                        (pageChange)=\"onPageChange($event)\"\r\n                    ></ng-container>\r\n                </div>\r\n            </div>\r\n        </fd-dynamic-page-footer>\r\n        }\r\n    </fd-dynamic-page>\r\n    @if (tabMode) {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template #reportTemplate>\r\n    @if (loading) {\r\n    <bsu-mask size=\"s\"></bsu-mask>\r\n    } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\r\n    <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\r\n    }\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            sideContentMode ? sideContentTemplate : viewerTemplate;\r\n            context: { simpleReport: 'simpleReport' }\r\n        \"\r\n    >\r\n    </ng-container>\r\n</ng-template>\r\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\r\n    <fd-dynamic-side-content\r\n        [class.rtl]=\"rtl\"\r\n        [size]=\"deviceSize | sapSize\"\r\n        fillEmptySpace\r\n        [decrement]=\"'2rem'\"\r\n        [disable]=\"isReportPage\"\r\n        [setMinHeight]=\"true\"\r\n        *untilInView=\"el\"\r\n    >\r\n        <fd-dynamic-side-content-side>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\r\n            ></ng-container>\r\n        </fd-dynamic-side-content-side>\r\n        <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\r\n            <fd-card>\r\n                <fd-card-content class=\"tw-flex tw-flex-col\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"viewerTemplate; context: { noRenderPageing: isReportPage ? true : false }\"\r\n                    ></ng-container>\r\n                </fd-card-content>\r\n            </fd-card>\r\n        </fd-dynamic-side-content-main>\r\n    </fd-dynamic-side-content>\r\n</ng-template>\r\n<ng-template\r\n    #searchpanelTemplate\r\n    let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\r\n    let-hideButtons=\"hideButtons\"\r\n>\r\n    @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\r\n    <bsu-search-panel\r\n        darkClass\r\n        [searchPanelUi]=\"searchPanelUi\"\r\n        [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\r\n        [hideButtons]=\"hideButtons\"\r\n        (moChanged)=\"onSearchPanelMoChanged()\"\r\n    ></bsu-search-panel>\r\n    } } @else {\r\n    <fd-card class=\"searchpanel-card\" darkClass>\r\n        <fd-card-header>\r\n            <fd-card-main-header>\r\n                <h2 fd-card-title>\r\n                    <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\r\n                </h2>\r\n            </fd-card-main-header>\r\n        </fd-card-header>\r\n        <fd-card-content style=\"flex-grow: 0\">\r\n            @if (!hideSearchPanel && searchPanelUi) {\r\n            <bsu-search-panel\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                [hideButtons]=\"true\"\r\n                [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n            }\r\n        </fd-card-content>\r\n        <fd-card-footer style=\"border-bottom: none\">\r\n            <button\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"emphasized\"\r\n                [label]=\"'Search' | bbbTranslate\"\r\n                (click)=\"onSearch()\"\r\n                [fdContentDensity]=\"contentDensity\"\r\n            ></button>\r\n            <button\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\r\n                (click)=\"onClearSearch()\"\r\n                [fdOverflowGroup]=\"1\"\r\n                [fdContentDensity]=\"contentDensity\"\r\n            ></button>\r\n        </fd-card-footer>\r\n    </fd-card>\r\n    }\r\n</ng-template>\r\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\r\n    <div\r\n        darkClass\r\n        class=\"viewer-container\"\r\n        fillEmptySpace\r\n        [shortcutHandler]=\"shortcuts\"\r\n        [disable]=\"!isReportPage || !fillPage\"\r\n        [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\r\n        [style.height]=\"viewerLoading && !hideViewerLoading ? '100%' : 'auto'\"\r\n        [style.min-height]=\"isReportPage ? '100%' : null\"\r\n        [style.position]=\"viewerLoading && !hideViewerLoading ? 'relative' : null\"\r\n    >\r\n        <bnrc-dynamic-ulv-toolbar-component\r\n            [component]=\"ulvToolbarComponent\"\r\n            [hideToolbar]=\"hideToolbar\"\r\n            [deviceName]=\"deviceName\"\r\n            [hideTitle]=\"true\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [toolbarButtons]=\"toolbarButtons\"\r\n            [gridSetting]=\"gridSetting\"\r\n            [title]=\"title\"\r\n            [hasSelected]=\"hasSelected\"\r\n            [access]=\"access\"\r\n            [inDialog]=\"inDialog\"\r\n            [isMultiSelect]=\"isMultiSelect\"\r\n            [contentDensity]=\"contentDensity\"\r\n            [inlineEditMode]=\"inlineEditMode && allowInlineEdit && formSetting\"\r\n            [allowInlineEdit]=\"allowInlineEdit && formSetting\"            \r\n            [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        ></bnrc-dynamic-ulv-toolbar-component>\r\n        @if (viewerLoading) {\r\n        <bsu-mask size=\"m\"></bsu-mask>\r\n        } @if (viewerControl) {\r\n\r\n        <ng-container\r\n            [renderUlvViewer]=\"viewerControl\"\r\n            [layoutInfo]=\"layoutInfo\"\r\n            [isReportPage]=\"isReportPage\"\r\n        ></ng-container>\r\n        }\r\n    </div>\r\n    @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing && !hidePaging) {\r\n    <ng-container\r\n        [renderUlvPaging]=\"context\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        (pageChange)=\"onPageChange($event)\"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\r\n            <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            <bsu-search-panel\r\n                [hideButtons]=\"true\"\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n        </fd-dialog-body>\r\n\r\n        <fd-dialog-footer>\r\n            <fd-dialog-footer-button>\r\n                <button\r\n                    fd-button\r\n                    fdkInitialFocus\r\n                    fdType=\"emphasized\"\r\n                    (click)=\"dialog.dismiss(); onSearch()\"\r\n                    [label]=\"'Search' | bbbTranslate\"\r\n                ></button>\r\n            </fd-dialog-footer-button>\r\n            <fd-dialog-footer-button>\r\n                <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\r\n            </fd-dialog-footer-button>\r\n            <fd-dialog-footer-button>\r\n                <button\r\n                    fd-button\r\n                    fdType=\"transparent\"\r\n                    (click)=\"dialog.dismiss('Close button')\"\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                ></button>\r\n            </fd-dialog-footer-button>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content{border:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content fd-dynamic-side-content-side{border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-right:none;border-left:1px solid #ccc!important}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content fd-dynamic-side-content-main fd-card{transition:.25s background-color!important;background-color:var(--sapBackgroundColor, #f7f7f7)}:host.custom-background ::ng-deep article.fd-dynamic-page,:host.custom-background ::ng-deep fd-dynamic-page-content,:host.custom-background ::ng-deep .report-view,:host.custom-background ::ng-deep fd-dynamic-side-content-main>fd-card{background-color:transparent!important}:host>fd-dynamic-page>fd-dynamic-page-header.hide-container ::ng-deep .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile).notitle.sideContentMode ::ng-deep>article>header .fd-dynamic-page__title-container,fd-dynamic-page:not(.mobile).notitle.nosearchpanel ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{min-height:100%;height:auto}fd-dynamic-side-content-main fd-card-content ::ng-deep>div{flex:1}fd-dynamic-side-content-main ::ng-deep fd-toolbar{border:none!important}fd-dynamic-side-content-main ::ng-deep bsu-ui-table-view{padding-bottom:0!important;overflow-y:hidden}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicUlvToolbarComponent, selector: "bnrc-dynamic-ulv-toolbar-component", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected", "config", "hidden", "buttons", "moDataListCount"] }, { kind: "directive", type: i2.RenderUlvViewerDirective, selector: "[renderUlvViewer]", inputs: ["mask", "isReportPage", "layoutInfo", "renderUlvViewer"] }, { kind: "directive", type: i2.RenderUlvPaginDirective, selector: "[renderUlvPaging]", inputs: ["mask", "pagingSetting", "renderUlvPaging"], outputs: ["pageChange"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i2.ShortcutHandlerDirective, selector: "[shortcutHandler]", inputs: ["shortcutHandler"], outputs: ["shortCutCommand"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i4$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$4.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$4.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i7$4.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i7$4.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i8.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i8.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i8.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i8.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i8.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i8.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i8.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i8.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i9.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i9.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i9.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$3.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i4$2.InitialFocusDirective, selector: "[fdkInitialFocus]", inputs: ["fdkInitialFocus", "enabled", "focusLastElement"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$3.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$3.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i7$2.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: SearchPanelComponent, selector: "bsu-search-panel", inputs: ["searchPanelUi", "hideButtons", "isSearcPanelInSideContent"], outputs: ["moChanged"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "directive", type: DarkClassDirective, selector: "[darkClass]" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }, { kind: "pipe", type: SapSizePipe, name: "sapSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaUlvMainComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-ulv-main', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        isReportPage ? reportPageTemplate : reportTemplate;\r\n        context: {\r\n            $implicit: viewerControl,\r\n            tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n@if (loading) {\r\n<bsu-mask size=\"m\"></bsu-mask>\r\n}\r\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\r\n    <fd-dynamic-page\r\n        darkClass\r\n        formClose\r\n        mobile\r\n        [attr.isMobile]=\"isMobile ? true : null\"\r\n        [isMobile]=\"isMobile\"\r\n        [size]=\"deviceSize | dynamicPageSize\"\r\n        [attr.tabMode]=\"tabMode\"\r\n        [autoResponsive]=\"false\"\r\n        [class.notitle]=\"title.length < 2 || hideUlvPageTitle\"\r\n        [class.nosearchpanel]=\"!searchPanelUi\"\r\n        [class.hideSearchPanel]=\"hideSearchPanel\"\r\n        [class.sideContentMode]=\"sideContentMode\"\r\n    >\r\n        <fd-dynamic-page-header\r\n            [title]=\"\r\n                (title | bbbTranslate) && !hideUlvPageTitle\r\n                    ? (title | bbbTranslate)\r\n                    : isMobile && breadCrumbs.length\r\n                    ? breadCrumbs[breadCrumbs.length - 1].label\r\n                    : ''\r\n            \"\r\n            class=\"p-b0\"\r\n        >\r\n            <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n                <fd-breadcrumb>\r\n                    @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb.url; let i =\r\n                    $index; let last = $last) {\r\n                  @if(i>0) {   <fd-breadcrumb-item>\r\n                        <bsu-breadcrumb\r\n                            [index]=\"i\"\r\n                            [isLast]=\"last\"\r\n                            [breadCrumb]=\"breadCrumb\"\r\n                            [allBreadCrumb]=\"breadCrumbs\"\r\n                        ></bsu-breadcrumb>\r\n                    </fd-breadcrumb-item>\r\n                    }}\r\n                </fd-breadcrumb>\r\n            </fd-dynamic-page-breadcrumb>\r\n            <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\r\n\r\n            <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\r\n                <fd-toolbar [shouldOverflow]=\"true\" style=\"display: none\"> </fd-toolbar>\r\n                <!-- added this because in mobile landscape toolbar disapper -->\r\n                @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\r\n                <fd-toolbar\r\n                    class=\"global-actions\"\r\n                    fdType=\"transparent\"\r\n                    [clearBorder]=\"true\"\r\n                    [shouldOverflow]=\"deviceSize === 's'\"\r\n                >\r\n                    @if (isAnonymous === false && canSaveGridSetting) {\r\n                    <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\r\n                        <fd-popover-control>\r\n                            <div style=\"display: flex; align-items: center\">\r\n                                <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\r\n                                    {{\r\n                                        selectedSearchPanelSettings?.IsStandard\r\n                                            ? ''\r\n                                            : selectedSearchPanelSettings?.Title\r\n                                    }}\r\n                                    @if (searchPanelMoChanged) {\r\n                                    <strong>*</strong>\r\n                                    }\r\n                                </h3>\r\n                                <button\r\n                                    fd-button\r\n                                    glyph=\"slim-arrow-down\"\r\n                                    fdType=\"transparent\"\r\n                                    [fdContentDensity]=\"contentDensity\"\r\n                                ></button>\r\n                            </div>\r\n                        </fd-popover-control>\r\n                        <fd-popover-body mobile>\r\n                            <div fd-popover-body-header>\r\n                                <div fd-bar [fdCozy]>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                            <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\r\n                                @for (option of allSearchPanelSettings; track option) {\r\n                                <li\r\n                                    fd-list-item\r\n                                    [selected]=\"option.Id === selectedSearchPanelSettingsId\"\r\n                                    (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\r\n                                >\r\n                                    <span fd-list-title>{{ option.Title }}</span>\r\n                                </li>\r\n                                }\r\n                            </ul>\r\n                            <div fd-popover-body-footer>\r\n                                <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\r\n                                    @if (selectedSearchPanelSettings) {\r\n                                    <div fd-bar-right>\r\n                                        @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\r\n                                        <fd-button-bar\r\n                                            [label]=\"'Save' | bbbTranslate\"\r\n                                            fdType=\"emphasized\"\r\n                                            (click)=\"onFilterSave(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                        } @if (searchPanelMoChanged) {\r\n                                        <fd-button-bar\r\n                                            [label]=\"'SaveAs' | bbbTranslate\"\r\n                                            [fdType]=\"\r\n                                                selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\r\n                                            \"\r\n                                            (click)=\"onFilterSaveAs(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                        }\r\n                                        <fd-button-bar\r\n                                            [label]=\"'Manage' | bbbTranslate\"\r\n                                            fdkInitialFocus\r\n                                            fdType=\"transparent\"\r\n                                            (click)=\"onManageFilters(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                    </div>\r\n                                    }\r\n                                </div>\r\n                            </div>\r\n                        </fd-popover-body>\r\n                    </fd-popover>\r\n                    } @if (deviceSize !== 's') {\r\n                    <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                    } @if (isMobile && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdOverflowPriority=\"never\"\r\n                        (click)=\"onShowSearchpanelDialog()\"\r\n                        [glyph]=\"'filter'\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && !simpleSearchPanel && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdOverflowPriority=\"never\"\r\n                        fdType=\"emphasized\"\r\n                        [label]=\"'Search' | bbbTranslate\"\r\n                        (click)=\"onSearch()\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <!-- <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [label]=\"'Filters' | bbbTranslate\"\r\n                        (click)=\"onShowFilterFieldsSetting()\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button> -->\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [label]=\"'Clear' | bbbTranslate\"\r\n                        (click)=\"onClearSearch()\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n                        (click)=\"onHideSearchPanelClick()\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    }\r\n                </fd-toolbar>\r\n                }\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\" (click)=\"closeEvent.emit()\" title=\"Close\">\r\n                        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n                    </button>\r\n                </fd-toolbar>\r\n            </fd-dynamic-page-layout-actions>\r\n        </fd-dynamic-page-header>\r\n        @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\r\n        <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\r\n            @if (!isMobile) {\r\n            <bsu-search-panel\r\n                [hideButtons]=\"!simpleSearchPanel\"\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n            }\r\n        </fd-dynamic-page-subheader>\r\n        } @if (!tabMode) {\r\n\r\n        <fd-dynamic-page-content>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    sideContentMode ? sideContentTemplate : viewerTemplate;\r\n                    context: { noRenderPageing: true }\r\n                \"\r\n            ></ng-container>\r\n            \r\n        </fd-dynamic-page-content>\r\n\r\n        } @if (pagingSetting?.TotalPages) {\r\n        <fd-dynamic-page-footer>\r\n            <!-- page footer content goes here -->\r\n            <div fd-bar [barDesign]=\"'footer'\">\r\n                <div fd-bar-middle>\r\n                    <ng-container\r\n                        [renderUlvPaging]=\"context\"\r\n                        [pagingSetting]=\"pagingSetting\"\r\n                        (pageChange)=\"onPageChange($event)\"\r\n                    ></ng-container>\r\n                </div>\r\n            </div>\r\n        </fd-dynamic-page-footer>\r\n        }\r\n    </fd-dynamic-page>\r\n    @if (tabMode) {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template #reportTemplate>\r\n    @if (loading) {\r\n    <bsu-mask size=\"s\"></bsu-mask>\r\n    } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\r\n    <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\r\n    }\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            sideContentMode ? sideContentTemplate : viewerTemplate;\r\n            context: { simpleReport: 'simpleReport' }\r\n        \"\r\n    >\r\n    </ng-container>\r\n</ng-template>\r\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\r\n    <fd-dynamic-side-content\r\n        [class.rtl]=\"rtl\"\r\n        [size]=\"deviceSize | sapSize\"\r\n        fillEmptySpace\r\n        [decrement]=\"'2rem'\"\r\n        [disable]=\"isReportPage\"\r\n        [setMinHeight]=\"true\"\r\n        *untilInView=\"el\"\r\n    >\r\n        <fd-dynamic-side-content-side>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\r\n            ></ng-container>\r\n        </fd-dynamic-side-content-side>\r\n        <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\r\n            <fd-card>\r\n                <fd-card-content class=\"tw-flex tw-flex-col\"> \r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"viewerTemplate; context: { noRenderPageing: isReportPage ? true : false }\"\r\n                    ></ng-container>\r\n                </fd-card-content>\r\n            </fd-card>\r\n        </fd-dynamic-side-content-main>\r\n    </fd-dynamic-side-content>\r\n</ng-template>\r\n<ng-template\r\n    #searchpanelTemplate\r\n    let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\r\n    let-hideButtons=\"hideButtons\"\r\n>\r\n    @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\r\n    <bsu-search-panel\r\n        darkClass\r\n        [searchPanelUi]=\"searchPanelUi\"\r\n        [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\r\n        [hideButtons]=\"hideButtons\"\r\n        (moChanged)=\"onSearchPanelMoChanged()\"\r\n    ></bsu-search-panel>\r\n    } } @else {\r\n    <fd-card class=\"searchpanel-card\" darkClass>\r\n        <fd-card-header>\r\n            <fd-card-main-header>\r\n                <h2 fd-card-title>\r\n                    <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\r\n                </h2>\r\n            </fd-card-main-header>\r\n        </fd-card-header>\r\n        <fd-card-content style=\"flex-grow: 0\">\r\n            @if (!hideSearchPanel && searchPanelUi) {\r\n            <bsu-search-panel\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                [hideButtons]=\"true\"\r\n                [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n            }\r\n        </fd-card-content>\r\n        <fd-card-footer style=\"border-bottom: none\">\r\n            <button\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"emphasized\"\r\n                [label]=\"'Search' | bbbTranslate\"\r\n                (click)=\"onSearch()\"\r\n                [fdContentDensity]=\"contentDensity\"\r\n            ></button>\r\n            <button\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\r\n                (click)=\"onClearSearch()\"\r\n                [fdOverflowGroup]=\"1\"\r\n                [fdContentDensity]=\"contentDensity\"\r\n            ></button>\r\n        </fd-card-footer>\r\n    </fd-card>\r\n    }\r\n</ng-template>\r\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\r\n    <div\r\n        darkClass\r\n        class=\"viewer-container\"\r\n        fillEmptySpace\r\n        [shortcutHandler]=\"shortcuts\"\r\n        [disable]=\"!isReportPage || !fillPage\"\r\n        [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\r\n        [style.height]=\"viewerLoading && !hideViewerLoading ? '100%' : 'auto'\"\r\n        [style.min-height]=\"isReportPage ? '100%' : null\"\r\n        [style.position]=\"viewerLoading && !hideViewerLoading? 'relative' : null\"\r\n    >\r\n        @if (viewerLoading) {\r\n        <bsu-mask size=\"m\"></bsu-mask>\r\n        } @if (viewerControl) {\r\n        <ng-container\r\n            [renderUlvViewer]=\"viewerControl\"\r\n            [layoutInfo]=\"layoutInfo\"\r\n            [isReportPage]=\"isReportPage\"\r\n        ></ng-container>\r\n        }\r\n    </div>\r\n    @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing && !hidePaging) {\r\n    <ng-container\r\n        [renderUlvPaging]=\"context\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        (pageChange)=\"onPageChange($event)\"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\r\n            <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            <bsu-search-panel\r\n                [hideButtons]=\"true\"\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n        </fd-dialog-body>\r\n\r\n        <fd-dialog-footer>\r\n            <fd-dialog-footer-button>\r\n                <button\r\n                    fd-button\r\n                    fdkInitialFocus\r\n                    fdType=\"emphasized\"\r\n                    (click)=\"dialog.dismiss(); onSearch()\"\r\n                    [label]=\"'Search' | bbbTranslate\"\r\n                ></button>\r\n            </fd-dialog-footer-button>\r\n            <fd-dialog-footer-button>\r\n                <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\r\n            </fd-dialog-footer-button>\r\n            <fd-dialog-footer-button>\r\n                <button\r\n                    fd-button\r\n                    fdType=\"transparent\"\r\n                    (click)=\"dialog.dismiss('Close button')\"\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                ></button>\r\n            </fd-dialog-footer-button>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content{border:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content fd-dynamic-side-content-side{border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-right:none;border-left:1px solid #ccc!important}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content fd-dynamic-side-content-main fd-card{transition:.25s background-color!important;background-color:var(--sapBackgroundColor, #f7f7f7)}:host.custom-background ::ng-deep article.fd-dynamic-page,:host.custom-background ::ng-deep fd-dynamic-page-content,:host.custom-background ::ng-deep .report-view,:host.custom-background ::ng-deep fd-dynamic-side-content-main>fd-card{background-color:transparent!important}:host>fd-dynamic-page>fd-dynamic-page-header.hide-container ::ng-deep .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile).notitle.sideContentMode ::ng-deep>article>header .fd-dynamic-page__title-container,fd-dynamic-page:not(.mobile).notitle.nosearchpanel ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{min-height:100%;height:auto}fd-dynamic-side-content-main fd-card-content ::ng-deep>div{flex:1}fd-dynamic-side-content-main ::ng-deep fd-toolbar{border:none!important}fd-dynamic-side-content-main ::ng-deep bsu-ui-table-view{padding-bottom:0!important;overflow-y:hidden}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"] }]
-        }], ctorParameters: () => [], propDecorators: { _dynamicPageComponent: [{
+            args: [{ selector: 'bsu-barsa-ulv-main', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        isReportPage ? reportPageTemplate : reportTemplate;\r\n        context: {\r\n            $implicit: viewerControl,\r\n            tabMode: viewerControl?.Setting?.ClassNames?.CustomUi?.Parameters?.TabMode\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n@if (loading) {\r\n<bsu-mask size=\"m\"></bsu-mask>\r\n}\r\n<ng-template #reportPageTemplate let-viewerControl let-tabMode=\"tabMode\">\r\n    <fd-dynamic-page\r\n        darkClass\r\n        formClose\r\n        mobile\r\n        [attr.isMobile]=\"isMobile ? true : null\"\r\n        [isMobile]=\"isMobile\"\r\n        [size]=\"deviceSize | dynamicPageSize\"\r\n        [attr.tabMode]=\"tabMode\"\r\n        [autoResponsive]=\"false\"\r\n        [class.notitle]=\"title.length < 2 || hideUlvPageTitle\"\r\n        [class.nosearchpanel]=\"!searchPanelUi\"\r\n        [class.hideSearchPanel]=\"hideSearchPanel\"\r\n        [class.sideContentMode]=\"sideContentMode\"\r\n    >\r\n        <fd-dynamic-page-header\r\n            [title]=\"\r\n                (title | bbbTranslate) && !hideUlvPageTitle\r\n                    ? (title | bbbTranslate)\r\n                    : isMobile && breadCrumbs.length\r\n                    ? breadCrumbs[breadCrumbs.length - 1].label\r\n                    : ''\r\n            \"\r\n            class=\"p-b0\"\r\n        >\r\n            <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n                <fd-breadcrumb>\r\n                    @for ( breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track breadCrumb.url; let i =\r\n                    $index; let last = $last) { @if(i>0) {\r\n                    <fd-breadcrumb-item>\r\n                        <bsu-breadcrumb\r\n                            [index]=\"i\"\r\n                            [isLast]=\"last\"\r\n                            [breadCrumb]=\"breadCrumb\"\r\n                            [allBreadCrumb]=\"breadCrumbs\"\r\n                        ></bsu-breadcrumb>\r\n                    </fd-breadcrumb-item>\r\n                    }}\r\n                </fd-breadcrumb>\r\n            </fd-dynamic-page-breadcrumb>\r\n            <!-- <fd-dynamic-page-title-content>\u06AF\u0632\u0627\u0631\u0634 </fd-dynamic-page-title-content> -->\r\n\r\n            <fd-dynamic-page-global-actions *untilInView=\"el\" style=\"min-width: auto\">\r\n                <fd-toolbar [shouldOverflow]=\"true\" style=\"display: none\"> </fd-toolbar>\r\n                <!-- added this because in mobile landscape toolbar disapper -->\r\n                @if (!hideSearchPanel ||( searchPanelUi && !sideContentMode)) {\r\n                <fd-toolbar\r\n                    class=\"global-actions\"\r\n                    fdType=\"transparent\"\r\n                    [clearBorder]=\"true\"\r\n                    [shouldOverflow]=\"deviceSize === 's'\"\r\n                >\r\n                    @if (isAnonymous === false && canSaveGridSetting) {\r\n                    <fd-popover fd-toolbar-item #popover fdOverflowPriority=\"never\">\r\n                        <fd-popover-control>\r\n                            <div style=\"display: flex; align-items: center\">\r\n                                <h3 class=\"header-search\" [attr.rtl]=\"rtl\" fd-title>\r\n                                    {{\r\n                                        selectedSearchPanelSettings?.IsStandard\r\n                                            ? ''\r\n                                            : selectedSearchPanelSettings?.Title\r\n                                    }}\r\n                                    @if (searchPanelMoChanged) {\r\n                                    <strong>*</strong>\r\n                                    }\r\n                                </h3>\r\n                                <button\r\n                                    fd-button\r\n                                    glyph=\"slim-arrow-down\"\r\n                                    fdType=\"transparent\"\r\n                                    [fdContentDensity]=\"contentDensity\"\r\n                                ></button>\r\n                            </div>\r\n                        </fd-popover-control>\r\n                        <fd-popover-body mobile>\r\n                            <div fd-popover-body-header>\r\n                                <div fd-bar [fdCozy]>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>{{ 'Filters' | bbbTranslate }}</fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                            <ul fd-list style=\"min-height: 200px; background-color: var(--sapBackgroundColor, #f7f7f7)\">\r\n                                @for (option of allSearchPanelSettings; track option) {\r\n                                <li\r\n                                    fd-list-item\r\n                                    [selected]=\"option.Id === selectedSearchPanelSettingsId\"\r\n                                    (click)=\"onSelectSearchPanelSettings(option.Id, popover)\"\r\n                                >\r\n                                    <span fd-list-title>{{ option.Title }}</span>\r\n                                </li>\r\n                                }\r\n                            </ul>\r\n                            <div fd-popover-body-footer>\r\n                                <div fd-bar [barDesign]=\"'footer'\" [fdCozy]>\r\n                                    @if (selectedSearchPanelSettings) {\r\n                                    <div fd-bar-right>\r\n                                        @if (!selectedSearchPanelSettings.IsPrimary && searchPanelMoChanged) {\r\n                                        <fd-button-bar\r\n                                            [label]=\"'Save' | bbbTranslate\"\r\n                                            fdType=\"emphasized\"\r\n                                            (click)=\"onFilterSave(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                        } @if (searchPanelMoChanged) {\r\n                                        <fd-button-bar\r\n                                            [label]=\"'SaveAs' | bbbTranslate\"\r\n                                            [fdType]=\"\r\n                                                selectedSearchPanelSettings.IsDefault ? 'emphasized' : 'transparent'\r\n                                            \"\r\n                                            (click)=\"onFilterSaveAs(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                        }\r\n                                        <fd-button-bar\r\n                                            [label]=\"'Manage' | bbbTranslate\"\r\n                                            fdkInitialFocus\r\n                                            fdType=\"transparent\"\r\n                                            (click)=\"onManageFilters(popover)\"\r\n                                        >\r\n                                        </fd-button-bar>\r\n                                    </div>\r\n                                    }\r\n                                </div>\r\n                            </div>\r\n                        </fd-popover-body>\r\n                    </fd-popover>\r\n                    } @if (deviceSize !== 's') {\r\n                    <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                    } @if (isMobile && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdOverflowPriority=\"never\"\r\n                        (click)=\"onShowSearchpanelDialog()\"\r\n                        [glyph]=\"'filter'\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && !simpleSearchPanel && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdOverflowPriority=\"never\"\r\n                        fdType=\"emphasized\"\r\n                        [label]=\"'Search' | bbbTranslate\"\r\n                        (click)=\"onSearch()\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <!-- <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [label]=\"'Filters' | bbbTranslate\"\r\n                        (click)=\"onShowFilterFieldsSetting()\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button> -->\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [label]=\"'Clear' | bbbTranslate\"\r\n                        (click)=\"onClearSearch()\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    } @if (!isMobile && !sideContentMode && searchPanelUi) {\r\n                    <button\r\n                        fd-button\r\n                        fd-toolbar-item\r\n                        fdType=\"transparent\"\r\n                        [label]=\"hideSearchPanel ? ('Show' | bbbTranslate) : ('Hide' | bbbTranslate)\"\r\n                        (click)=\"onHideSearchPanelClick()\"\r\n                        fdOverflowPriority=\"low\"\r\n                        [fdOverflowGroup]=\"1\"\r\n                        [fdContentDensity]=\"contentDensity\"\r\n                    ></button>\r\n                    }\r\n                </fd-toolbar>\r\n                }\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\" (click)=\"closeEvent.emit()\" title=\"Close\">\r\n                        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n                    </button>\r\n                </fd-toolbar>\r\n            </fd-dynamic-page-layout-actions>\r\n        </fd-dynamic-page-header>\r\n        @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\r\n        <fd-dynamic-page-subheader [pinnable]=\"true\" [collapsible]=\"false\">\r\n            @if (!isMobile) {\r\n            <bsu-search-panel\r\n                [hideButtons]=\"!simpleSearchPanel\"\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n            }\r\n        </fd-dynamic-page-subheader>\r\n        } @if (!tabMode) {\r\n\r\n        <fd-dynamic-page-content>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    sideContentMode ? sideContentTemplate : viewerTemplate;\r\n                    context: { noRenderPageing: true }\r\n                \"\r\n            ></ng-container>\r\n        </fd-dynamic-page-content>\r\n\r\n        } @if (pagingSetting?.TotalPages) {\r\n        <fd-dynamic-page-footer>\r\n            <!-- page footer content goes here -->\r\n            <div fd-bar [barDesign]=\"'footer'\">\r\n                <div fd-bar-middle>\r\n                    <ng-container\r\n                        [renderUlvPaging]=\"context\"\r\n                        [pagingSetting]=\"pagingSetting\"\r\n                        (pageChange)=\"onPageChange($event)\"\r\n                    ></ng-container>\r\n                </div>\r\n            </div>\r\n        </fd-dynamic-page-footer>\r\n        }\r\n    </fd-dynamic-page>\r\n    @if (tabMode) {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"sideContentMode ? sideContentTemplate : viewerTemplate; context: { noRenderPageing: true }\"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template #reportTemplate>\r\n    @if (loading) {\r\n    <bsu-mask size=\"s\"></bsu-mask>\r\n    } @if (!hideSearchPanel && searchPanelUi && !sideContentMode) {\r\n    <ng-container *ngTemplateOutlet=\"searchpanelTemplate; context: { hideButtons: false }\"></ng-container>\r\n    }\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            sideContentMode ? sideContentTemplate : viewerTemplate;\r\n            context: { simpleReport: 'simpleReport' }\r\n        \"\r\n    >\r\n    </ng-container>\r\n</ng-template>\r\n<ng-template #sideContentTemplate let-simpleReport=\"simpleReport\">\r\n    <fd-dynamic-side-content\r\n        [class.rtl]=\"rtl\"\r\n        [size]=\"deviceSize | sapSize\"\r\n        fillEmptySpace\r\n        [decrement]=\"'2rem'\"\r\n        [disable]=\"isReportPage\"\r\n        [setMinHeight]=\"true\"\r\n        *untilInView=\"el\"\r\n    >\r\n        <fd-dynamic-side-content-side>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"searchpanelTemplate; context: { isSearcPanelInSideContent: true }\"\r\n            ></ng-container>\r\n        </fd-dynamic-side-content-side>\r\n        <fd-dynamic-side-content-main [style.width]=\"deviceSize !== 's' ? mainContentWidth : null\">\r\n            <fd-card>\r\n                <fd-card-content class=\"tw-flex tw-flex-col\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"viewerTemplate; context: { noRenderPageing: isReportPage ? true : false }\"\r\n                    ></ng-container>\r\n                </fd-card-content>\r\n            </fd-card>\r\n        </fd-dynamic-side-content-main>\r\n    </fd-dynamic-side-content>\r\n</ng-template>\r\n<ng-template\r\n    #searchpanelTemplate\r\n    let-isSearcPanelInSideContent=\"isSearcPanelInSideContent\"\r\n    let-hideButtons=\"hideButtons\"\r\n>\r\n    @if (!isSearcPanelInSideContent) { @if (!hideSearchPanel && searchPanelUi) {\r\n    <bsu-search-panel\r\n        darkClass\r\n        [searchPanelUi]=\"searchPanelUi\"\r\n        [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\r\n        [hideButtons]=\"hideButtons\"\r\n        (moChanged)=\"onSearchPanelMoChanged()\"\r\n    ></bsu-search-panel>\r\n    } } @else {\r\n    <fd-card class=\"searchpanel-card\" darkClass>\r\n        <fd-card-header>\r\n            <fd-card-main-header>\r\n                <h2 fd-card-title>\r\n                    <fd-icon glyph=\"filter\"></fd-icon><span>{{ 'Filter' | bbbTranslate }}</span>\r\n                </h2>\r\n            </fd-card-main-header>\r\n        </fd-card-header>\r\n        <fd-card-content style=\"flex-grow: 0\">\r\n            @if (!hideSearchPanel && searchPanelUi) {\r\n            <bsu-search-panel\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                [hideButtons]=\"true\"\r\n                [isSearcPanelInSideContent]=\"isSearcPanelInSideContent\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n            }\r\n        </fd-card-content>\r\n        <fd-card-footer style=\"border-bottom: none\">\r\n            <button\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"emphasized\"\r\n                [label]=\"'Search' | bbbTranslate\"\r\n                (click)=\"onSearch()\"\r\n                [fdContentDensity]=\"contentDensity\"\r\n            ></button>\r\n            <button\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                [label]=\"('Delete' | bbbTranslate) + ' ' + ('Filters' | bbbTranslate)\"\r\n                (click)=\"onClearSearch()\"\r\n                [fdOverflowGroup]=\"1\"\r\n                [fdContentDensity]=\"contentDensity\"\r\n            ></button>\r\n        </fd-card-footer>\r\n    </fd-card>\r\n    }\r\n</ng-template>\r\n<ng-template #viewerTemplate let-noRenderPageing=\"noRenderPageing\">\r\n    <div\r\n        darkClass\r\n        class=\"viewer-container\"\r\n        fillEmptySpace\r\n        [shortcutHandler]=\"shortcuts\"\r\n        [disable]=\"!isReportPage || !fillPage\"\r\n        [decrement]=\"deviceSize !== 's' ? '100px' : '75px'\"\r\n        [style.height]=\"viewerLoading && !hideViewerLoading ? '100%' : 'auto'\"\r\n        [style.min-height]=\"isReportPage ? '100%' : null\"\r\n        [style.position]=\"viewerLoading && !hideViewerLoading ? 'relative' : null\"\r\n    >\r\n        <bnrc-dynamic-ulv-toolbar-component\r\n            [component]=\"ulvToolbarComponent\"\r\n            [hideToolbar]=\"hideToolbar\"\r\n            [deviceName]=\"deviceName\"\r\n            [hideTitle]=\"true\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [toolbarButtons]=\"toolbarButtons\"\r\n            [gridSetting]=\"gridSetting\"\r\n            [title]=\"title\"\r\n            [hasSelected]=\"hasSelected\"\r\n            [access]=\"access\"\r\n            [inDialog]=\"inDialog\"\r\n            [isMultiSelect]=\"isMultiSelect\"\r\n            [contentDensity]=\"contentDensity\"\r\n            [inlineEditMode]=\"inlineEditMode && allowInlineEdit && formSetting\"\r\n            [allowInlineEdit]=\"allowInlineEdit && formSetting\"            \r\n            [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        ></bnrc-dynamic-ulv-toolbar-component>\r\n        @if (viewerLoading) {\r\n        <bsu-mask size=\"m\"></bsu-mask>\r\n        } @if (viewerControl) {\r\n\r\n        <ng-container\r\n            [renderUlvViewer]=\"viewerControl\"\r\n            [layoutInfo]=\"layoutInfo\"\r\n            [isReportPage]=\"isReportPage\"\r\n        ></ng-container>\r\n        }\r\n    </div>\r\n    @if (!noRenderPageing && pagingSetting?.TotalPages && !hidePageing && !hidePaging) {\r\n    <ng-container\r\n        [renderUlvPaging]=\"context\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        (pageChange)=\"onPageChange($event)\"\r\n    ></ng-container>\r\n    }\r\n</ng-template>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #searchpanelDialog>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h1 id=\"fd-dialog-header-10\" fd-title>{{ 'Filters' | bbbTranslate }}</h1>\r\n            <button fd-dialog-close-button (click)=\"dialog.dismiss('Close button')\"></button>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            <bsu-search-panel\r\n                [hideButtons]=\"true\"\r\n                [searchPanelUi]=\"searchPanelUi\"\r\n                (moChanged)=\"onSearchPanelMoChanged()\"\r\n            ></bsu-search-panel>\r\n        </fd-dialog-body>\r\n\r\n        <fd-dialog-footer>\r\n            <fd-dialog-footer-button>\r\n                <button\r\n                    fd-button\r\n                    fdkInitialFocus\r\n                    fdType=\"emphasized\"\r\n                    (click)=\"dialog.dismiss(); onSearch()\"\r\n                    [label]=\"'Search' | bbbTranslate\"\r\n                ></button>\r\n            </fd-dialog-footer-button>\r\n            <fd-dialog-footer-button>\r\n                <button fd-button [label]=\"'Clear' | bbbTranslate\" (click)=\"onClearSearch()\"></button>\r\n            </fd-dialog-footer-button>\r\n            <fd-dialog-footer-button>\r\n                <button\r\n                    fd-button\r\n                    fdType=\"transparent\"\r\n                    (click)=\"dialog.dismiss('Close button')\"\r\n                    [label]=\"'Cancel' | bbbTranslate\"\r\n                ></button>\r\n            </fd-dialog-footer-button>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:100%;flex-grow:1}:host .searchpanel-card fd-card-header{pointer-events:none;cursor:default;padding:.5rem}:host .searchpanel-card h2[fd-card-title]{font-size:1rem;display:flex;align-items:center;gap:.5rem}:host .searchpanel-card h2[fd-card-title] fd-icon{font-size:1.2rem}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content{border:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content fd-dynamic-side-content-side{border-right:var(--sapList_BorderWidth) solid var(--sapList_BorderColor)}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-right:none;border-left:1px solid #ccc!important}:host[uiviewer=bsu-ui-card-view]>fd-dynamic-side-content fd-dynamic-side-content-main fd-card{transition:.25s background-color!important;background-color:var(--sapBackgroundColor, #f7f7f7)}:host.custom-background ::ng-deep article.fd-dynamic-page,:host.custom-background ::ng-deep fd-dynamic-page-content,:host.custom-background ::ng-deep .report-view,:host.custom-background ::ng-deep fd-dynamic-side-content-main>fd-card{background-color:transparent!important}:host>fd-dynamic-page>fd-dynamic-page-header.hide-container ::ng-deep .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile).notitle.sideContentMode ::ng-deep>article>header .fd-dynamic-page__title-container,fd-dynamic-page:not(.mobile).notitle.nosearchpanel ::ng-deep>article>header .fd-dynamic-page__title-container{display:none}fd-dynamic-page:not(.mobile) ::ng-deep>article>div{display:flex;flex:1}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page:not(.mobile) ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%}fd-dynamic-page[tabmode=true] ::ng-deep>article{height:auto!important}fd-dynamic-side-content{min-height:100%;height:auto}fd-dynamic-side-content-main fd-card-content ::ng-deep>div{flex:1}fd-dynamic-side-content-main ::ng-deep fd-toolbar{border:none!important}fd-dynamic-side-content-main ::ng-deep bsu-ui-table-view{padding-bottom:0!important;overflow-y:hidden}fd-dynamic-side-content-side fd-card-content{padding:.5rem}fd-dynamic-page-global-actions{flex:1;width:100%}h3[rtl=true]{margin-left:5px}h3[rtl=false]{margin-right:5px}.header-search{color:var(--sapButton_TextColor, #0854a0)!important}.filter-wrapper{border-bottom:1px solid var(--sapObjectHeader_BorderColor, #d9d9d9)}.report-toolbar-container{display:flex}.report-toolbar-container .global-actions{flex-grow:1}fd-popover-body{min-width:380px}fd-popover-body.mobile{min-width:80vw}@media (max-width: 599px){.report-toolbar-container{flex-direction:column-reverse}.report-toolbar-container .layout-actions{flex-grow:1}}\n"] }]
+        }], propDecorators: { _dynamicPageComponent: [{
                 type: ViewChild,
                 args: [DynamicPageComponent]
             }], dialogTemplate: [{
@@ -7416,6 +7423,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
             }], _customBackground: [{
                 type: HostBinding,
                 args: ['class.custom-background']
+            }], component: [{
+                type: Input
             }], viewerControl: [{
                 type: Input
             }], hideViewerLoading: [{
@@ -7474,6 +7483,52 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                 type: Input
             }], layoutInfo: [{
                 type: Input
+            }], formSetting: [{
+                type: Input
+            }], allowGridColumnSort: [{
+                type: Input
+            }], useLayoutItemTextForControl: [{
+                type: Input
+            }], hideTitle: [{
+                type: Input
+            }], deviceName: [{
+                type: Input
+            }], access: [{
+                type: Input
+            }], hideToolbar: [{
+                type: Input
+            }], toolbarButtons: [{
+                type: Input
+            }], inlineEditMode: [{
+                type: Input
+            }], allowInlineEdit: [{
+                type: Input
+            }], gridSetting: [{
+                type: Input
+            }], viewCollection: [{
+                type: Input
+            }], reportView: [{
+                type: Input
+            }], inDialog: [{
+                type: Input
+            }], isMultiSelect: [{
+                type: Input
+            }], cls: [{
+                type: Input
+            }], hasSelected: [{
+                type: Input
+            }], groupbyClick: [{
+                type: Output
+            }], sortClick: [{
+                type: Output
+            }], columnClick: [{
+                type: Output
+            }], editModeClick: [{
+                type: Output
+            }], viewClick: [{
+                type: Output
+            }], createNewInlineMo: [{
+                type: Output
             }], closeEvent: [{
                 type: Output
             }], searchPanelMoChange: [{
@@ -7518,6 +7573,15 @@ class UiUlvMainUiComponent extends BaseComponent {
         const _bradcrumbService = inject(BreadcrumbService);
         super();
         this.firstApplyAutomatically = true;
+        this.dialogConfig = {
+            responsivePadding: true,
+            verticalPadding: true,
+            minWidth: '40rem',
+            minHeight: '90vh',
+            maxWidth: '100vw',
+            maxHeight: '100vh',
+            resizable: true
+        };
         this._dialogService = inject(DialogService);
         this._ulvMainService = inject(UlvMainService);
         this._router = inject(Router);
@@ -7536,6 +7600,19 @@ class UiUlvMainUiComponent extends BaseComponent {
         this.contentDensity$ = contentDensityService.contentDensity;
         this.rtl$ = _portalService.rtl$;
         this.breadCrumbs$ = _bradcrumbService.breadcrumbs$;
+        this.toolbarButtons$ = this._ulvMainService.toolbarButtons$;
+        this.hideToolbar$ = this._ulvMainService.hideToolbar$;
+        this.gridSetting$ = this._ulvMainService.gridSetting$;
+        this.gridAllowSort$ = this._ulvMainService.gridAllowSort$;
+        this.hasSelected$ = this._ulvMainService.hasSelected$;
+        this.commandsAccess$ = this._ulvMainService.commandsAccess$;
+        this.inDialog$ = this._ulvMainService.inDialog$;
+        this.allowInlineEdit$ = this._ulvMainService.allowInlineEdit$;
+        this.inlineEditMode$ = this._ulvMainService.inlineEditMode$;
+        this.viewCollection$ = this._ulvMainService.viewCollection$;
+        this.isMultiSelect$ = this._ulvMainService.isMultiSelect$;
+        this.useLayoutItemTextForControl$ = this._ulvMainService.useLayoutItemTextForControl$;
+        this.hideTitle$ = this._ulvMainService.hideTitle$;
     }
     ngOnInit() {
         super.ngOnInit();
@@ -7674,6 +7751,60 @@ class UiUlvMainUiComponent extends BaseComponent {
     onSelectSearchPanelSettings(selectedSearchPanelSettingsId) {
         this._ulvMainService.changeSelectedSearchPanel(selectedSearchPanelSettingsId);
     }
+    onChangeView(viewSetting) {
+        this._ulvMainService.setSelectedView(viewSetting);
+    }
+    onToolbarCreateNewInlineMo() {
+        this._ulvMainService.newInlineMo(false);
+    }
+    onEditMode() {
+        this._ulvMainService.setInlineEdit(this._ulvMainService.inlineEditMode);
+    }
+    onColumnSettings(device) {
+        this._openSettings('columns', device);
+    }
+    onSortSettings(device) {
+        this._openSettings('sort', device);
+    }
+    onGroupbySettings(device) {
+        this._openSettings('groupby', device);
+    }
+    onSortSettingsChange(sortSettings) {
+        this._ulvMainService.sortSettingChange(sortSettings);
+    }
+    _openSettings(name, device) {
+        let component = null;
+        switch (name) {
+            case 'columns':
+                component = UlvColumnSettingsComponent;
+                break;
+            case 'sort':
+                component = UlvSortSettingsComponent;
+                break;
+            case 'groupby':
+                component = UlvGroupbySettingsComponent;
+                break;
+        }
+        const config = {
+            ...this.dialogConfig,
+            data: { context: this.context },
+            mobile: device === 'mobile',
+            minWidth: device === 'mobile' ? 'auto' : this.dialogConfig.minWidth,
+            minHeight: device === 'mobile' ? 'auto' : this.dialogConfig.minHeight,
+            maxHeight: device === 'mobile' ? '100%' : this.dialogConfig.maxHeight,
+            maxWidth: device === 'mobile' ? '100%' : this.dialogConfig.maxWidth
+        };
+        if (component !== null) {
+            const dialogRef = this._dialogService.open(component, config);
+            dialogRef.afterClosed.pipe(takeUntil(this._onDestroy$)).subscribe((setting) => {
+                if (setting) {
+                    const isSortChanged = name === 'sort' || name === 'groupby';
+                    this._ulvMainService.userChangeGridSetting(setting, isSortChanged);
+                    // this.context.moDataList = this.gridDataSource.items;
+                }
+            });
+        }
+    }
     _removeBugInChromeCssActive() {
         if (BarsaApi.Common.Util.RemoveBugInChromeCssActive) {
             return;
@@ -7781,11 +7912,11 @@ class UiUlvMainUiComponent extends BaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiUlvMainUiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiUlvMainUiComponent, isStandalone: false, selector: "bsu-ui-ulv-main-ui", inputs: { context: "context", isReportPage: "isReportPage", inDialog: "inDialog", isMultiSelect: "isMultiSelect", layoutInfo: "layoutInfo", fullscreen: "fullscreen" }, host: { properties: { "class.control-readonly": "this.readonly", "class.control-disabled": "this.disable", "class.margin-ulv": "this.marginUlv" } }, providers: [UlvMainService], viewQueries: [{ propertyName: "_barsaUlvComponent", first: true, predicate: BarsaUlvMainComponent, descendants: true }, { propertyName: "searchPanelComponent", first: true, predicate: SearchPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<bsu-barsa-ulv-main\r\n    [shortcutHandler]=\"shortCuts$ | async\"\r\n    [style.style.width]=\"!isMobile ? null : '100%'\"\r\n    [layoutInfo]=\"layoutInfo\"\r\n    [attr.isReportPage]=\"isReportPage\"\r\n    [simpleSearchPanel]=\"simpleSearchPanel\"\r\n    [viewerControl]=\"viewer$ | async\"\r\n    [loading]=\"(mask$ | async) === true\"\r\n    [viewerLoading]=\"(viwerMask$ | async) === true\"\r\n    [hideViewerLoading]=\"(hideViewerLoading$ | async) === true\"\r\n    [cssBackground]=\"cssBackground$ | async\"\r\n    [standalone]=\"(standalone$ | async) === true\"\r\n    [landscape]=\"(landscape$ | async) === true\"\r\n    [hideUlvPageTitle]=\"(hideUlvPageTitle$ | async) === true\"\r\n    [isReportPage]=\"isReportPage\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\r\n    [title]=\"title\"\r\n    [hidePaging]=\"(hidePaging$ | async) === true\"\r\n    [searchPanelUi]=\"(searchPanelUi$ | async)!!\"\r\n    [breadCrumbs]=\"(breadCrumbs$ | async)!!\"\r\n    [allSearchPanelSettings]=\"(allSearchPanelSettings$ | async)!!\"\r\n    [isAnonymous]=\"(isAnonymous$ | async)!!\"\r\n    [canSaveGridSetting]=\"(canSaveGridSetting$ | async) === true\"\r\n    [rtl]=\"(rtl$ | async)!!\"\r\n    [selectedSearchPanelSettings]=\"(selectedSearchPanelSettings$ | async)!!\"\r\n    [searchPanelMoChanged]=\"(searchPanelMoChanged$ | async)!!\"\r\n    [selectedSearchPanelSettingsId]=\"(selectedSearchPanelSettingsId$ | async)!!\"\r\n    [hideSearchPanel]=\"(hideSearchPanel$ | async)!!\"\r\n    [pagingSetting]=\"(pagingSetting$ | async)!!\"\r\n    [context]=\"context\"\r\n    [contentDensity]=\"contentDensity$ | async\"\r\n    (closeEvent)=\"onClose()\"\r\n    (searchPanelMoChange)=\"onSearchPanelMoChanged()\"\r\n    (openManageFilters)=\"onOpenManageFilters()\"\r\n    (collapsedChange)=\"onCollapsedChange($event)\"\r\n    (hideSearchPanelClick)=\"onHideSearchPanelClick()\"\r\n    (filterSave)=\"onFilterSave()\"\r\n    (filterSaveAs)=\"onFilterSaveAs()\"\r\n    (showFilterFieldsSetting)=\"onShowFilterFieldsSetting()\"\r\n    (manageFilters)=\"onManageFilters()\"\r\n    (clearSearch)=\"onClearSearch()\"\r\n    (search)=\"onSearch()\"\r\n    (pageChange)=\"onPageChange($event)\"\r\n    (selectSearchPanelSettings)=\"onSelectSearchPanelSettings($event)\"\r\n    (shortCutCommand)=\"onShortcutCommand($event)\"\r\n>\r\n</bsu-barsa-ulv-main>\r\n", styles: [":host{width:100%;min-height:100%;height:auto;display:flex;flex-direction:column;cursor:default}.margin-ulv{margin-bottom:.25rem;margin-top:.1875rem}\n"], dependencies: [{ kind: "directive", type: i2.ShortcutHandlerDirective, selector: "[shortcutHandler]", inputs: ["shortcutHandler"], outputs: ["shortCutCommand"] }, { kind: "component", type: BarsaUlvMainComponent, selector: "bsu-barsa-ulv-main", inputs: ["viewerControl", "hideViewerLoading", "loading", "hidePaging", "viewerLoading", "isReportPage", "cssBackground", "deviceSize", "shortcuts", "title", "searchPanelUi", "breadCrumbs", "allSearchPanelSettings", "isAnonymous", "canSaveGridSetting", "rtl", "hideUlvPageTitle", "selectedSearchPanelSettings", "searchPanelMoChanged", "selectedSearchPanelSettingsId", "hideSearchPanel", "pagingSetting", "contentDensity", "context", "isMobile", "standalone", "landscape", "simpleSearchPanel", "layoutInfo"], outputs: ["closeEvent", "searchPanelMoChange", "openManageFilters", "collapsedChange", "hideSearchPanelClick", "filterSave", "filterSaveAs", "pageChange", "showFilterFieldsSetting", "manageFilters", "clearSearch", "search", "selectSearchPanelSettings"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiUlvMainUiComponent, isStandalone: false, selector: "bsu-ui-ulv-main-ui", inputs: { context: "context", isReportPage: "isReportPage", inDialog: "inDialog", isMultiSelect: "isMultiSelect", layoutInfo: "layoutInfo", fullscreen: "fullscreen" }, host: { properties: { "class.control-readonly": "this.readonly", "class.control-disabled": "this.disable", "class.margin-ulv": "this.marginUlv" } }, providers: [UlvMainService], viewQueries: [{ propertyName: "_barsaUlvComponent", first: true, predicate: BarsaUlvMainComponent, descendants: true }, { propertyName: "searchPanelComponent", first: true, predicate: SearchPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<bsu-barsa-ulv-main\r\n    [shortcutHandler]=\"shortCuts$ | async\"\r\n    [style.style.width]=\"!isMobile ? null : '100%'\"\r\n    [layoutInfo]=\"layoutInfo\"\r\n    [attr.isReportPage]=\"isReportPage\"\r\n    [simpleSearchPanel]=\"simpleSearchPanel\"\r\n    [viewerControl]=\"viewer$ | async\"\r\n    [loading]=\"(mask$ | async) === true\"\r\n    [viewerLoading]=\"(viwerMask$ | async) === true\"\r\n    [hideViewerLoading]=\"(hideViewerLoading$ | async) === true\"\r\n    [cssBackground]=\"cssBackground$ | async\"\r\n    [standalone]=\"(standalone$ | async) === true\"\r\n    [landscape]=\"(landscape$ | async) === true\"\r\n    [hideUlvPageTitle]=\"(hideUlvPageTitle$ | async) === true\"\r\n    [isReportPage]=\"isReportPage\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\r\n    [title]=\"title\"\r\n    [allowGridColumnSort]=\"(gridAllowSort$ | async) === true\"\r\n    [hidePaging]=\"(hidePaging$ | async) === true\"\r\n    [searchPanelUi]=\"(searchPanelUi$ | async)!!\"\r\n    [breadCrumbs]=\"(breadCrumbs$ | async)!!\"\r\n    [allSearchPanelSettings]=\"(allSearchPanelSettings$ | async)!!\"\r\n    [isAnonymous]=\"(isAnonymous$ | async)!!\"\r\n    [canSaveGridSetting]=\"(canSaveGridSetting$ | async) === true\"\r\n    [rtl]=\"(rtl$ | async)!!\"\r\n    [hasSelected]=\"(hasSelected$ | async) === true\"\r\n    [toolbarButtons]=\"(toolbarButtons$ | async)!! | seperatorFix\"\r\n    [hideToolbar]=\"(hideToolbar$ | async) === true\"\r\n    [gridSetting]=\"(gridSetting$ | async)!!\"\r\n    [access]=\"(commandsAccess$ | async)!!\"\r\n    [inDialog]=\"(inDialog$ | async) === true\"\r\n    [inlineEditMode]=\"(inlineEditMode$ | async) === true\"\r\n    [allowInlineEdit]=\"(allowInlineEdit$ | async) === true\"\r\n    [viewCollection]=\"(viewCollection$ | async)!!\"\r\n    [isMultiSelect]=\"(isMultiSelect$ | async) === true\"\r\n    [useLayoutItemTextForControl]=\"(useLayoutItemTextForControl$ | async) === true\"\r\n    [formSetting]=\"context.Setting.FormTemplate\"\r\n    [hideTitle]=\"(hideTitle$ | async) === true\"\r\n    [selectedSearchPanelSettings]=\"(selectedSearchPanelSettings$ | async)!!\"\r\n    [searchPanelMoChanged]=\"(searchPanelMoChanged$ | async)!!\"\r\n    [selectedSearchPanelSettingsId]=\"(selectedSearchPanelSettingsId$ | async)!!\"\r\n    [hideSearchPanel]=\"(hideSearchPanel$ | async)!!\"\r\n    [pagingSetting]=\"(pagingSetting$ | async)!!\"\r\n    [context]=\"context\"\r\n    [contentDensity]=\"contentDensity$ | async\"\r\n    (closeEvent)=\"onClose()\"\r\n    (searchPanelMoChange)=\"onSearchPanelMoChanged()\"\r\n    (openManageFilters)=\"onOpenManageFilters()\"\r\n    (collapsedChange)=\"onCollapsedChange($event)\"\r\n    (hideSearchPanelClick)=\"onHideSearchPanelClick()\"\r\n    (filterSave)=\"onFilterSave()\"\r\n    (filterSaveAs)=\"onFilterSaveAs()\"\r\n    (showFilterFieldsSetting)=\"onShowFilterFieldsSetting()\"\r\n    (manageFilters)=\"onManageFilters()\"\r\n    (clearSearch)=\"onClearSearch()\"\r\n    (search)=\"onSearch()\"\r\n    (pageChange)=\"onPageChange($event)\"\r\n    (selectSearchPanelSettings)=\"onSelectSearchPanelSettings($event)\"\r\n    (shortCutCommand)=\"onShortcutCommand($event)\"\r\n    (sortClick)=\"onSortSettings($event)\"\r\n    (groupbyClick)=\"onGroupbySettings($event)\"\r\n    (columnClick)=\"onColumnSettings($event)\"\r\n    (editModeClick)=\"onEditMode()\"\r\n    (viewClick)=\"onChangeView($event)\"\r\n    (createNewInlineMo)=\"onToolbarCreateNewInlineMo()\"\r\n>\r\n</bsu-barsa-ulv-main>\r\n", styles: [":host{width:100%;min-height:100%;height:auto;display:flex;flex-direction:column;cursor:default}.margin-ulv{margin-bottom:.25rem;margin-top:.1875rem}\n"], dependencies: [{ kind: "directive", type: i2.ShortcutHandlerDirective, selector: "[shortcutHandler]", inputs: ["shortcutHandler"], outputs: ["shortCutCommand"] }, { kind: "component", type: BarsaUlvMainComponent, selector: "bsu-barsa-ulv-main", inputs: ["component", "viewerControl", "hideViewerLoading", "loading", "hidePaging", "viewerLoading", "isReportPage", "cssBackground", "deviceSize", "shortcuts", "title", "searchPanelUi", "breadCrumbs", "allSearchPanelSettings", "isAnonymous", "canSaveGridSetting", "rtl", "hideUlvPageTitle", "selectedSearchPanelSettings", "searchPanelMoChanged", "selectedSearchPanelSettingsId", "hideSearchPanel", "pagingSetting", "contentDensity", "context", "isMobile", "standalone", "landscape", "simpleSearchPanel", "layoutInfo", "formSetting", "allowGridColumnSort", "useLayoutItemTextForControl", "hideTitle", "deviceName", "access", "hideToolbar", "toolbarButtons", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected"], outputs: ["groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo", "closeEvent", "searchPanelMoChange", "openManageFilters", "collapsedChange", "hideSearchPanelClick", "filterSave", "filterSaveAs", "pageChange", "showFilterFieldsSetting", "manageFilters", "clearSearch", "search", "selectSearchPanelSettings"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiUlvMainUiComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-ulv-main-ui', providers: [UlvMainService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<bsu-barsa-ulv-main\r\n    [shortcutHandler]=\"shortCuts$ | async\"\r\n    [style.style.width]=\"!isMobile ? null : '100%'\"\r\n    [layoutInfo]=\"layoutInfo\"\r\n    [attr.isReportPage]=\"isReportPage\"\r\n    [simpleSearchPanel]=\"simpleSearchPanel\"\r\n    [viewerControl]=\"viewer$ | async\"\r\n    [loading]=\"(mask$ | async) === true\"\r\n    [viewerLoading]=\"(viwerMask$ | async) === true\"\r\n    [hideViewerLoading]=\"(hideViewerLoading$ | async) === true\"\r\n    [cssBackground]=\"cssBackground$ | async\"\r\n    [standalone]=\"(standalone$ | async) === true\"\r\n    [landscape]=\"(landscape$ | async) === true\"\r\n    [hideUlvPageTitle]=\"(hideUlvPageTitle$ | async) === true\"\r\n    [isReportPage]=\"isReportPage\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\r\n    [title]=\"title\"\r\n    [hidePaging]=\"(hidePaging$ | async) === true\"\r\n    [searchPanelUi]=\"(searchPanelUi$ | async)!!\"\r\n    [breadCrumbs]=\"(breadCrumbs$ | async)!!\"\r\n    [allSearchPanelSettings]=\"(allSearchPanelSettings$ | async)!!\"\r\n    [isAnonymous]=\"(isAnonymous$ | async)!!\"\r\n    [canSaveGridSetting]=\"(canSaveGridSetting$ | async) === true\"\r\n    [rtl]=\"(rtl$ | async)!!\"\r\n    [selectedSearchPanelSettings]=\"(selectedSearchPanelSettings$ | async)!!\"\r\n    [searchPanelMoChanged]=\"(searchPanelMoChanged$ | async)!!\"\r\n    [selectedSearchPanelSettingsId]=\"(selectedSearchPanelSettingsId$ | async)!!\"\r\n    [hideSearchPanel]=\"(hideSearchPanel$ | async)!!\"\r\n    [pagingSetting]=\"(pagingSetting$ | async)!!\"\r\n    [context]=\"context\"\r\n    [contentDensity]=\"contentDensity$ | async\"\r\n    (closeEvent)=\"onClose()\"\r\n    (searchPanelMoChange)=\"onSearchPanelMoChanged()\"\r\n    (openManageFilters)=\"onOpenManageFilters()\"\r\n    (collapsedChange)=\"onCollapsedChange($event)\"\r\n    (hideSearchPanelClick)=\"onHideSearchPanelClick()\"\r\n    (filterSave)=\"onFilterSave()\"\r\n    (filterSaveAs)=\"onFilterSaveAs()\"\r\n    (showFilterFieldsSetting)=\"onShowFilterFieldsSetting()\"\r\n    (manageFilters)=\"onManageFilters()\"\r\n    (clearSearch)=\"onClearSearch()\"\r\n    (search)=\"onSearch()\"\r\n    (pageChange)=\"onPageChange($event)\"\r\n    (selectSearchPanelSettings)=\"onSelectSearchPanelSettings($event)\"\r\n    (shortCutCommand)=\"onShortcutCommand($event)\"\r\n>\r\n</bsu-barsa-ulv-main>\r\n", styles: [":host{width:100%;min-height:100%;height:auto;display:flex;flex-direction:column;cursor:default}.margin-ulv{margin-bottom:.25rem;margin-top:.1875rem}\n"] }]
+            args: [{ selector: 'bsu-ui-ulv-main-ui', providers: [UlvMainService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<bsu-barsa-ulv-main\r\n    [shortcutHandler]=\"shortCuts$ | async\"\r\n    [style.style.width]=\"!isMobile ? null : '100%'\"\r\n    [layoutInfo]=\"layoutInfo\"\r\n    [attr.isReportPage]=\"isReportPage\"\r\n    [simpleSearchPanel]=\"simpleSearchPanel\"\r\n    [viewerControl]=\"viewer$ | async\"\r\n    [loading]=\"(mask$ | async) === true\"\r\n    [viewerLoading]=\"(viwerMask$ | async) === true\"\r\n    [hideViewerLoading]=\"(hideViewerLoading$ | async) === true\"\r\n    [cssBackground]=\"cssBackground$ | async\"\r\n    [standalone]=\"(standalone$ | async) === true\"\r\n    [landscape]=\"(landscape$ | async) === true\"\r\n    [hideUlvPageTitle]=\"(hideUlvPageTitle$ | async) === true\"\r\n    [isReportPage]=\"isReportPage\"\r\n    [deviceSize]=\"(deviceSize$ | async)!!\"\r\n    [title]=\"title\"\r\n    [allowGridColumnSort]=\"(gridAllowSort$ | async) === true\"\r\n    [hidePaging]=\"(hidePaging$ | async) === true\"\r\n    [searchPanelUi]=\"(searchPanelUi$ | async)!!\"\r\n    [breadCrumbs]=\"(breadCrumbs$ | async)!!\"\r\n    [allSearchPanelSettings]=\"(allSearchPanelSettings$ | async)!!\"\r\n    [isAnonymous]=\"(isAnonymous$ | async)!!\"\r\n    [canSaveGridSetting]=\"(canSaveGridSetting$ | async) === true\"\r\n    [rtl]=\"(rtl$ | async)!!\"\r\n    [hasSelected]=\"(hasSelected$ | async) === true\"\r\n    [toolbarButtons]=\"(toolbarButtons$ | async)!! | seperatorFix\"\r\n    [hideToolbar]=\"(hideToolbar$ | async) === true\"\r\n    [gridSetting]=\"(gridSetting$ | async)!!\"\r\n    [access]=\"(commandsAccess$ | async)!!\"\r\n    [inDialog]=\"(inDialog$ | async) === true\"\r\n    [inlineEditMode]=\"(inlineEditMode$ | async) === true\"\r\n    [allowInlineEdit]=\"(allowInlineEdit$ | async) === true\"\r\n    [viewCollection]=\"(viewCollection$ | async)!!\"\r\n    [isMultiSelect]=\"(isMultiSelect$ | async) === true\"\r\n    [useLayoutItemTextForControl]=\"(useLayoutItemTextForControl$ | async) === true\"\r\n    [formSetting]=\"context.Setting.FormTemplate\"\r\n    [hideTitle]=\"(hideTitle$ | async) === true\"\r\n    [selectedSearchPanelSettings]=\"(selectedSearchPanelSettings$ | async)!!\"\r\n    [searchPanelMoChanged]=\"(searchPanelMoChanged$ | async)!!\"\r\n    [selectedSearchPanelSettingsId]=\"(selectedSearchPanelSettingsId$ | async)!!\"\r\n    [hideSearchPanel]=\"(hideSearchPanel$ | async)!!\"\r\n    [pagingSetting]=\"(pagingSetting$ | async)!!\"\r\n    [context]=\"context\"\r\n    [contentDensity]=\"contentDensity$ | async\"\r\n    (closeEvent)=\"onClose()\"\r\n    (searchPanelMoChange)=\"onSearchPanelMoChanged()\"\r\n    (openManageFilters)=\"onOpenManageFilters()\"\r\n    (collapsedChange)=\"onCollapsedChange($event)\"\r\n    (hideSearchPanelClick)=\"onHideSearchPanelClick()\"\r\n    (filterSave)=\"onFilterSave()\"\r\n    (filterSaveAs)=\"onFilterSaveAs()\"\r\n    (showFilterFieldsSetting)=\"onShowFilterFieldsSetting()\"\r\n    (manageFilters)=\"onManageFilters()\"\r\n    (clearSearch)=\"onClearSearch()\"\r\n    (search)=\"onSearch()\"\r\n    (pageChange)=\"onPageChange($event)\"\r\n    (selectSearchPanelSettings)=\"onSelectSearchPanelSettings($event)\"\r\n    (shortCutCommand)=\"onShortcutCommand($event)\"\r\n    (sortClick)=\"onSortSettings($event)\"\r\n    (groupbyClick)=\"onGroupbySettings($event)\"\r\n    (columnClick)=\"onColumnSettings($event)\"\r\n    (editModeClick)=\"onEditMode()\"\r\n    (viewClick)=\"onChangeView($event)\"\r\n    (createNewInlineMo)=\"onToolbarCreateNewInlineMo()\"\r\n>\r\n</bsu-barsa-ulv-main>\r\n", styles: [":host{width:100%;min-height:100%;height:auto;display:flex;flex-direction:column;cursor:default}.margin-ulv{margin-bottom:.25rem;margin-top:.1875rem}\n"] }]
         }], ctorParameters: () => [], propDecorators: { context: [{
                 type: Input
             }], isReportPage: [{
@@ -7847,7 +7978,7 @@ class UiColorUiComponent extends FieldBaseComponent {
         this.selectedColor = $event;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiColorUiComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiColorUiComponent, isStandalone: false, selector: "bsu-ui-color-ui", usesInheritance: true, ngImport: i0, template: "@if (readonly$ | async) {\r\n<div class=\"read-only\">\r\n    <div [style.background-color]=\"value ? value : null\"></div>\r\n    <span>{{ value }}</span>\r\n    <button\r\n        fd-button\r\n        [cdkCopyToClipboard]=\"value\"\r\n        [fdType]=\"'transparent'\"\r\n        [glyph]=\"'copy'\"\r\n        aria-label=\"copy\"\r\n        title=\"copy\"\r\n    ></button>\r\n</div>\r\n} @else {\r\n<fd-popover #popover>\r\n    <fd-popover-control style=\"margin: 0.25rem 0\">\r\n        <button fd-button [fdMenu]=\"true\" fdType=\"transparent\">\r\n            <span [style.background-color]=\"value\" style=\"width: 16px; height: 16px; border-radius: 50%\"></span>\r\n        </button>\r\n    </fd-popover-control>\r\n    <fd-popover-body>\r\n        @if (!isVisibleSwatches) {\r\n        <color-chrome [color]=\"value\" className=\"color-box\" (colorChange)=\"onColorChang($event)\"></color-chrome>\r\n        } @if (isVisibleSwatches) {\r\n        <color-swatches [color]=\"value\" (colorChange)=\"onColorChang($event)\"></color-swatches>\r\n        }\r\n        <fd-toolbar style=\"background-color: white\">\r\n            <button\r\n                fd-toolbar-item\r\n                fd-button\r\n                [label]=\"'Cancel' | bbbTranslate\"\r\n                (click)=\"onCancel(popover)\"\r\n                [compact]=\"true\"\r\n            ></button>\r\n            <button\r\n                fd-toolbar-item\r\n                fd-button\r\n                [label]=\"'Ok' | bbbTranslate\"\r\n                (click)=\"onApply(popover)\"\r\n                [compact]=\"true\"\r\n            ></button>\r\n            <fd-toolbar-spacer></fd-toolbar-spacer>\r\n            <button fd-toolbar-item fd-button [label]=\"switchText\" (click)=\"onSwatchClick()\" [compact]=\"true\"></button>\r\n        </fd-toolbar>\r\n    </fd-popover-body>\r\n</fd-popover>\r\n}\r\n", styles: [":host{display:block;margin:.25rem 0}.read-only{display:flex;justify-content:flex-start;column-gap:3px}.read-only div{width:25px;height:20px;border-radius:5px}\n"], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i8.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i4$6.SwatchesComponent, selector: "color-swatches", inputs: ["width", "height", "colors", "zDepth", "radius", "background"] }, { kind: "component", type: i5$4.ChromeComponent, selector: "color-chrome", inputs: ["disableAlpha"] }, { kind: "directive", type: i6.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiColorUiComponent, isStandalone: false, selector: "bsu-ui-color-ui", usesInheritance: true, ngImport: i0, template: "@if (readonly$ | async) {\r\n<div class=\"read-only\">\r\n    <div [style.background-color]=\"value ? value : null\"></div>\r\n    <span>{{ value }}</span>\r\n    <button\r\n        fd-button\r\n        [cdkCopyToClipboard]=\"value\"\r\n        [fdType]=\"'transparent'\"\r\n        [glyph]=\"'copy'\"\r\n        aria-label=\"copy\"\r\n        title=\"copy\"\r\n    ></button>\r\n</div>\r\n} @else {\r\n<fd-popover #popover>\r\n    <fd-popover-control style=\"margin: 0.25rem 0\">\r\n        <button fd-button [fdMenu]=\"true\" fdType=\"transparent\">\r\n            <span [style.background-color]=\"value\" style=\"width: 16px; height: 16px; border-radius: 50%\"></span>\r\n        </button>\r\n    </fd-popover-control>\r\n    <fd-popover-body>\r\n        @if (!isVisibleSwatches) {\r\n        <color-chrome [color]=\"value\" className=\"color-box\" (colorChange)=\"onColorChang($event)\"></color-chrome>\r\n        } @if (isVisibleSwatches) {\r\n        <color-swatches [color]=\"value\" (colorChange)=\"onColorChang($event)\"></color-swatches>\r\n        }\r\n        <fd-toolbar style=\"background-color: white\">\r\n            <button\r\n                fd-toolbar-item\r\n                fd-button\r\n                [label]=\"'Cancel' | bbbTranslate\"\r\n                (click)=\"onCancel(popover)\"\r\n                [compact]=\"true\"\r\n            ></button>\r\n            <button\r\n                fd-toolbar-item\r\n                fd-button\r\n                [label]=\"'Ok' | bbbTranslate\"\r\n                (click)=\"onApply(popover)\"\r\n                [compact]=\"true\"\r\n            ></button>\r\n            <fd-toolbar-spacer></fd-toolbar-spacer>\r\n            <button fd-toolbar-item fd-button [label]=\"switchText\" (click)=\"onSwatchClick()\" [compact]=\"true\"></button>\r\n        </fd-toolbar>\r\n    </fd-popover-body>\r\n</fd-popover>\r\n}\r\n", styles: [":host{display:block;margin:.25rem 0}.read-only{display:flex;justify-content:flex-start;column-gap:3px}.read-only div{width:25px;height:20px;border-radius:5px}\n"], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "directive", type: i7$2.ToolbarSpacerDirective, selector: "fd-toolbar-spacer", inputs: ["width", "class", "fixed"] }, { kind: "component", type: i4$6.SwatchesComponent, selector: "color-swatches", inputs: ["width", "height", "colors", "zDepth", "radius", "background"] }, { kind: "component", type: i5$4.ChromeComponent, selector: "color-chrome", inputs: ["disableAlpha"] }, { kind: "directive", type: i6.CdkCopyToClipboard, selector: "[cdkCopyToClipboard]", inputs: ["cdkCopyToClipboard", "cdkCopyToClipboardAttempts"], outputs: ["cdkCopyToClipboardCopied"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiColorUiComponent, decorators: [{
             type: Component,
@@ -8706,7 +8837,7 @@ class UiPdfViewerComponent extends DeviceInfoFieldBaseComponent {
         BarsaApi.Ul.LoadingMask.Mask(this._el.nativeElement);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiPdfViewerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiPdfViewerComponent, isStandalone: false, selector: "bsu-ui-pdf-viewer", host: { properties: { "style.min-height": "this._minheight" } }, providers: [UploadService], viewQueries: [{ propertyName: "_pdfViewerOnDemand", first: true, predicate: ["pdfViewerOnDemand"], descendants: true }, { propertyName: "_dialogTpl", first: true, predicate: ["dialogTpl"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\r\n    @switch (parameters?.ShowMode) { @case ('2') {\r\n    <div>\r\n        <ng-container *ngTemplateOutlet=\"toolbar; context: { dialogMode: true }\"></ng-container>\r\n    </div>\r\n    } @default {\r\n    <div>\r\n        <ng-container *ngTemplateOutlet=\"toolbar\"></ng-container>\r\n        <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\r\n    </div>\r\n    } }\r\n</ng-container>\r\n\r\n<ng-template #toolbar let-dialogMode=\"dialogMode\">\r\n    @if ((disableOrReadonly$ | async) !== true) {\r\n    <fd-toolbar [class.dialogMode]=\"dialogMode\" [transparent]=\"true\" [shouldOverflow]=\"true\">\r\n        <fd-file-uploader\r\n            #uploader\r\n            [style.display]=\"'none'\"\r\n            fd-toolbar-item\r\n            [id]=\"id\"\r\n            [name]=\"'pdf_' + id\"\r\n            [placeholder]=\"'AttachFile' | bbbTranslate\"\r\n            [buttonLabel]=\"'AttachFile' | bbbTranslate\"\r\n            [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\r\n            [accept]=\"validExtension\"\r\n            [(ngModel)]=\"files\"\r\n            [multiple]=\"false\"\r\n            (selectedFilesChanged)=\"onFileSelection($event)\"\r\n            [contentDensity]=\"(contentDensity$ | async)!!\"\r\n        ></fd-file-uploader>\r\n        @if (!parameters?.HideDelete) {\r\n        <button\r\n            [disabled]=\"!(canDelete && value)\"\r\n            fd-button\r\n            fd-toolbar-item\r\n            class=\"delete\"\r\n            glyph=\"delete\"\r\n            [fdType]=\"'transparent'\"\r\n            (click)=\"onDelete()\"\r\n        ></button>\r\n        } @if (!parameters?.HideAttach) {\r\n        <button\r\n            fd-button\r\n            fd-toolbar-item\r\n            glyph=\"attachment\"\r\n            [fdType]=\"'transparent'\"\r\n            [disabled]=\"!canUpload\"\r\n            (click)=\"uploader.open()\"\r\n        ></button>\r\n        } @if (canEdit) {\r\n        <button fd-toolbar-item fd-button glyph=\"edit\" [fdType]=\"'transparent'\" (click)=\"onEdit()\"></button>\r\n        } @if (useWordEditor) {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            glyph=\"doc-attachment\"\r\n            [fdType]=\"'transparent'\"\r\n            [label]=\"'Edit' | bbbTranslate\"\r\n            (click)=\"onEditInWord()\"\r\n        ></button>\r\n        } @if (officeOnline) {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            glyph=\"doc-attachment\"\r\n            [fdType]=\"'transparent'\"\r\n            [label]=\"'OfficeOnline' | bbbTranslate\"\r\n            (click)=\"onOfficeOnline($event)\"\r\n        ></button>\r\n        } @if (dialogMode) {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [glyph]=\"'show'\"\r\n            [attr.fdOverflowPriority]=\"'low'\"\r\n            [fdType]=\"'transparent'\"\r\n            [label]=\"!dialogMode ? '' : ('View' | bbbTranslate)\"\r\n            (click)=\"onOpenPreviewInDialog()\"\r\n            bodyClick\r\n        ></button>\r\n        } @if (canDownload && value) {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [attr.fdOverflowPriority]=\"'low'\"\r\n            [glyph]=\"'download'\"\r\n            [label]=\"!dialogMode ? '' : ('Download' | bbbTranslate)\"\r\n            [fdType]=\"'transparent'\"\r\n            (click)=\"onDownload()\"\r\n            bodyClick\r\n        ></button>\r\n        } @if (!parameters?.HideRefresh && value) {\r\n        <button\r\n            [attr.fdOverflowPriority]=\"'low'\"\r\n            fd-toolbar-item\r\n            fd-button\r\n            [glyph]=\"dialogMode ? null : 'refresh'\"\r\n            [label]=\"!dialogMode ? '' : ('Refresh' | bbbTranslate)\"\r\n            [fdType]=\"'transparent'\"\r\n            bodyClick\r\n            (click)=\"onRefresh()\"\r\n        ></button>\r\n        }\r\n        <fd-busy-indicator\r\n            fd-toolbar-item\r\n            [loading]=\"(uploadingState$ | async)?.uploading === true\"\r\n        ></fd-busy-indicator>\r\n    </fd-toolbar>\r\n    }\r\n</ng-template>\r\n<ng-template #preview>\r\n    @if (isMobile) {\r\n    <div\r\n        [style.border]=\"!blobUrl ? '.0625rem solid var(--sapGroup_TitleBorderColor)' : null\"\r\n        style=\"height: calc(70vh - 40px); position: relative\"\r\n    >\r\n        @if(value && hasPdf){\r\n        <bsu-blob-viewer [file]=\"value\" [style.width]=\"width\" [decrement]=\"'25px'\"></bsu-blob-viewer>\r\n        }@else{\r\n        <ng-container *ngTemplateOutlet=\"previewOtherPdf\"></ng-container>\r\n\r\n        }\r\n        <!-- <ng2-pdfjs-viewer\r\n            fillEmptySpace\r\n            [containerDom]=\"formContainer\"\r\n            [dontUseTopBound]=\"true\"\r\n            #pdfViewerOnDemand\r\n            [externalWindow]=\"false\"\r\n            [downloadFileName]=\"blobUrl\"\r\n            [openFile]=\"false\"\r\n            [viewBookmark]=\"false\"\r\n            [showSpinner]=\"true\"\r\n            [download]=\"true\"\r\n        ></ng2-pdfjs-viewer> -->\r\n    </div>\r\n    } @else { @if (hasPdf) {\r\n    <object\r\n        fillEmptySpace\r\n        [containerDom]=\"formContainer\"\r\n        [dontUseTopBound]=\"true\"\r\n        [disable]=\"inlineEdit\"\r\n        style=\"flex-grow: 1\"\r\n        [attr.data]=\"valueUrl\"\r\n        type=\"application/pdf\"\r\n        width=\"100%\"\r\n        [style.height]=\"inlineEdit ? 'auto' : formHeight - 30 > 0 ? formHeight - 30 + 'px' : '100vh'\"\r\n        [attr.html]=\"fallbackLink\"\r\n    ></object>\r\n    } @else {\r\n    <ng-container *ngTemplateOutlet=\"previewOtherPdf\"></ng-container>\r\n    } }\r\n</ng-template>\r\n\r\n<ng-template #previewOtherPdf>\r\n    @if (singleControl && value && !value.IsDeleted) {\r\n    <div class=\"tw-flex tw-justify-center\">\r\n        @if (singleFileThumbnailUrl) {\r\n        <bsu-file-viewer-content\r\n            [attr.title]=\"value.FileName\"\r\n            [file]=\"value\"\r\n            [imageOnly]=\"true\"\r\n            [fillWidth]=\"true\"\r\n            [isImageGallery]=\"false\"\r\n        ></bsu-file-viewer-content>\r\n        <!-- <img [src]=\"singleFileThumbnailUrl\" /> -->\r\n        }\r\n    </div>\r\n    } @else {\r\n    <div\r\n        fillEmptySpace\r\n        [containerDom]=\"formContainer\"\r\n        [dontUseTopBound]=\"true\"\r\n        class=\"hatchBackground\"\r\n        [disable]=\"inlineEdit\"\r\n        [class.tw-h-4]=\"inlineEdit\"\r\n    ></div>\r\n    }\r\n</ng-template>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTpl>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" class=\"vertical\">\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                <div fd-bar-left>\r\n                    <fd-bar-element>\r\n                        <h3 fd-title>edit in word</h3>\r\n                    </fd-bar-element>\r\n                </div>\r\n                <div fd-bar-right>\r\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onDialogClose()\"></fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\r\n        </fd-dialog-body>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:flex;flex-direction:column}:host fd-toolbar.dialogMode ::ng-deep .fd-toolbar{border-bottom:none}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}:host ::ng-deep .fd-file-uploader input{display:none}.single-control{height:50px}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "ariaValueText", "title", "label", "ariaLive"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: ["fillWidth", "imageOnly", "isImageGallery", "cardMode", "showFooter", "showContent", "selected", "width", "deviceSize", "cardContentHeight", "file", "isThumbnail"], outputs: ["cantView", "imageLoaded"] }, { kind: "component", type: BlobViewerComponent, selector: "bsu-blob-viewer", inputs: ["file"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiPdfViewerComponent, isStandalone: false, selector: "bsu-ui-pdf-viewer", host: { properties: { "style.min-height": "this._minheight" } }, providers: [UploadService], viewQueries: [{ propertyName: "_pdfViewerOnDemand", first: true, predicate: ["pdfViewerOnDemand"], descendants: true }, { propertyName: "_dialogTpl", first: true, predicate: ["dialogTpl"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\r\n    @switch (parameters?.ShowMode) { @case ('2') {\r\n    <div>\r\n        <ng-container *ngTemplateOutlet=\"toolbar; context: { dialogMode: true }\"></ng-container>\r\n    </div>\r\n    } @default {\r\n    <div>\r\n        <ng-container *ngTemplateOutlet=\"toolbar\"></ng-container>\r\n        <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\r\n    </div>\r\n    } }\r\n</ng-container>\r\n\r\n<ng-template #toolbar let-dialogMode=\"dialogMode\">\r\n    @if ((disableOrReadonly$ | async) !== true) {\r\n    <fd-toolbar [class.dialogMode]=\"dialogMode\" [transparent]=\"true\" [shouldOverflow]=\"true\">\r\n        <fd-file-uploader\r\n            #uploader\r\n            [style.display]=\"'none'\"\r\n            fd-toolbar-item\r\n            [id]=\"id\"\r\n            [name]=\"'pdf_' + id\"\r\n            [placeholder]=\"'AttachFile' | bbbTranslate\"\r\n            [buttonLabel]=\"'AttachFile' | bbbTranslate\"\r\n            [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\r\n            [accept]=\"validExtension\"\r\n            [(ngModel)]=\"files\"\r\n            [multiple]=\"false\"\r\n            (selectedFilesChanged)=\"onFileSelection($event)\"\r\n            [contentDensity]=\"(contentDensity$ | async)!!\"\r\n        ></fd-file-uploader>\r\n        @if (!parameters?.HideDelete) {\r\n        <button\r\n            [disabled]=\"!(canDelete && value)\"\r\n            fd-button\r\n            fd-toolbar-item\r\n            class=\"delete\"\r\n            glyph=\"delete\"\r\n            [fdType]=\"'transparent'\"\r\n            (click)=\"onDelete()\"\r\n        ></button>\r\n        } @if (!parameters?.HideAttach) {\r\n        <button\r\n            fd-button\r\n            fd-toolbar-item\r\n            glyph=\"attachment\"\r\n            [fdType]=\"'transparent'\"\r\n            [disabled]=\"!canUpload\"\r\n            (click)=\"uploader.open()\"\r\n        ></button>\r\n        } @if (canEdit) {\r\n        <button fd-toolbar-item fd-button glyph=\"edit\" [fdType]=\"'transparent'\" (click)=\"onEdit()\"></button>\r\n        } @if (useWordEditor) {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            glyph=\"doc-attachment\"\r\n            [fdType]=\"'transparent'\"\r\n            [label]=\"'Edit' | bbbTranslate\"\r\n            (click)=\"onEditInWord()\"\r\n        ></button>\r\n        } @if (officeOnline) {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            glyph=\"doc-attachment\"\r\n            [fdType]=\"'transparent'\"\r\n            [label]=\"'OfficeOnline' | bbbTranslate\"\r\n            (click)=\"onOfficeOnline($event)\"\r\n        ></button>\r\n        } @if (dialogMode) {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [glyph]=\"'show'\"\r\n            [attr.fdOverflowPriority]=\"'low'\"\r\n            [fdType]=\"'transparent'\"\r\n            [label]=\"!dialogMode ? '' : ('View' | bbbTranslate)\"\r\n            (click)=\"onOpenPreviewInDialog()\"\r\n            bodyClick\r\n        ></button>\r\n        } @if (canDownload && value) {\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [attr.fdOverflowPriority]=\"'low'\"\r\n            [glyph]=\"'download'\"\r\n            [label]=\"!dialogMode ? '' : ('Download' | bbbTranslate)\"\r\n            [fdType]=\"'transparent'\"\r\n            (click)=\"onDownload()\"\r\n            bodyClick\r\n        ></button>\r\n        } @if (!parameters?.HideRefresh && value) {\r\n        <button\r\n            [attr.fdOverflowPriority]=\"'low'\"\r\n            fd-toolbar-item\r\n            fd-button\r\n            [glyph]=\"dialogMode ? null : 'refresh'\"\r\n            [label]=\"!dialogMode ? '' : ('Refresh' | bbbTranslate)\"\r\n            [fdType]=\"'transparent'\"\r\n            bodyClick\r\n            (click)=\"onRefresh()\"\r\n        ></button>\r\n        }\r\n        <fd-busy-indicator\r\n            fd-toolbar-item\r\n            [loading]=\"(uploadingState$ | async)?.uploading === true\"\r\n        ></fd-busy-indicator>\r\n    </fd-toolbar>\r\n    }\r\n</ng-template>\r\n<ng-template #preview>\r\n    @if (isMobile) {\r\n    <div\r\n        [style.border]=\"!blobUrl ? '.0625rem solid var(--sapGroup_TitleBorderColor)' : null\"\r\n        style=\"height: calc(70vh - 40px); position: relative\"\r\n    >\r\n        @if(value && hasPdf){\r\n        <bsu-blob-viewer [file]=\"value\" [style.width]=\"width\" [decrement]=\"'25px'\"></bsu-blob-viewer>\r\n        }@else{\r\n        <ng-container *ngTemplateOutlet=\"previewOtherPdf\"></ng-container>\r\n\r\n        }\r\n        <!-- <ng2-pdfjs-viewer\r\n            fillEmptySpace\r\n            [containerDom]=\"formContainer\"\r\n            [dontUseTopBound]=\"true\"\r\n            #pdfViewerOnDemand\r\n            [externalWindow]=\"false\"\r\n            [downloadFileName]=\"blobUrl\"\r\n            [openFile]=\"false\"\r\n            [viewBookmark]=\"false\"\r\n            [showSpinner]=\"true\"\r\n            [download]=\"true\"\r\n        ></ng2-pdfjs-viewer> -->\r\n    </div>\r\n    } @else { @if (hasPdf) {\r\n    <object\r\n        fillEmptySpace\r\n        [containerDom]=\"formContainer\"\r\n        [dontUseTopBound]=\"true\"\r\n        [disable]=\"inlineEdit\"\r\n        style=\"flex-grow: 1\"\r\n        [attr.data]=\"valueUrl\"\r\n        type=\"application/pdf\"\r\n        width=\"100%\"\r\n        [style.height]=\"inlineEdit ? 'auto' : formHeight - 30 > 0 ? formHeight - 30 + 'px' : '100vh'\"\r\n        [attr.html]=\"fallbackLink\"\r\n    ></object>\r\n    } @else {\r\n    <ng-container *ngTemplateOutlet=\"previewOtherPdf\"></ng-container>\r\n    } }\r\n</ng-template>\r\n\r\n<ng-template #previewOtherPdf>\r\n    @if (singleControl && value && !value.IsDeleted) {\r\n    <div class=\"tw-flex tw-justify-center\">\r\n        @if (singleFileThumbnailUrl) {\r\n        <bsu-file-viewer-content\r\n            [attr.title]=\"value.FileName\"\r\n            [file]=\"value\"\r\n            [imageOnly]=\"true\"\r\n            [fillWidth]=\"true\"\r\n            [isImageGallery]=\"false\"\r\n        ></bsu-file-viewer-content>\r\n        <!-- <img [src]=\"singleFileThumbnailUrl\" /> -->\r\n        }\r\n    </div>\r\n    } @else {\r\n    <div\r\n        fillEmptySpace\r\n        [containerDom]=\"formContainer\"\r\n        [dontUseTopBound]=\"true\"\r\n        class=\"hatchBackground\"\r\n        [disable]=\"inlineEdit\"\r\n        [class.tw-h-4]=\"inlineEdit\"\r\n    ></div>\r\n    }\r\n</ng-template>\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialogTpl>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" class=\"vertical\">\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                <div fd-bar-left>\r\n                    <fd-bar-element>\r\n                        <h3 fd-title>edit in word</h3>\r\n                    </fd-bar-element>\r\n                </div>\r\n                <div fd-bar-right>\r\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onDialogClose()\"></fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            <ng-container *ngTemplateOutlet=\"preview\"></ng-container>\r\n        </fd-dialog-body>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:flex;flex-direction:column}:host fd-toolbar.dialogMode ::ng-deep .fd-toolbar{border-bottom:none}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}:host ::ng-deep .fd-file-uploader input{display:none}.single-control{height:50px}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i5$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "ariaValueText", "title", "label", "ariaLive"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: ["fillWidth", "imageOnly", "isImageGallery", "cardMode", "showFooter", "showContent", "selected", "width", "deviceSize", "cardContentHeight", "file", "isThumbnail"], outputs: ["cantView", "imageLoaded"] }, { kind: "component", type: BlobViewerComponent, selector: "bsu-blob-viewer", inputs: ["file"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiPdfViewerComponent, decorators: [{
             type: Component,
@@ -8854,7 +8985,7 @@ class UiFileLinearListBoxComponent extends DeviceInfoFieldBaseComponent {
         this._fileCountSource.next(value?.filter((c) => !c.IsDeleted).length);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiFileLinearListBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiFileLinearListBoxComponent, isStandalone: false, selector: "bsu-ui-file-linear-list-box", inputs: { value: "value" }, providers: [UploadService], viewQueries: [{ propertyName: "fileUploadComponent", first: true, predicate: FileUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<input fd-form-control class=\"hide\" />\r\n@if (value) {\r\n<div\r\n    class=\"token-container fd-input\"\r\n    contentDensity\r\n    [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\r\n    [disabled]=\"(disable$ | async) === true ? true : null\"\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n    style=\"height: auto !important\"\r\n>\r\n    <div class=\"token-wrapper\">\r\n        @for (file of value; track trackById(file,$index)) { @if (!file.IsDeleted) {\r\n        <fd-popover #popover>\r\n            <fd-popover-control>\r\n                <fd-token (onCloseClick)=\"onFileDeleted(file.Id)\" [readOnly]=\"(disableOrReadonly$ | async)!!\"\r\n                    >{{ file.FileName }}\r\n                    @if (file.IsNew) { @if (valueExtra$ | async; as valueExtra) { @if (valueExtra[file.Id].UploadState\r\n                    !== 'Complete') {\r\n                    <span\r\n                        fd-object-status\r\n                        [status]=\"file.Id | uploadFileStatus: valueExtra\"\r\n                        [label]=\"valueExtra[file.Id]?.UploadState || ''\"\r\n                        [title]=\"valueExtra[file.Id]?.UploadState\"\r\n                        [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\r\n                    ></span>\r\n                    } @if (valueExtra[file.Id].Progress) {\r\n                    <fd-object-number\r\n                        [number]=\"valueExtra[file.Id].Progress || 0\"\r\n                        unit=\"%\"\r\n                        status=\"informative\"\r\n                    ></fd-object-number>\r\n                    } @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n                    <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\"></fd-busy-indicator>\r\n                    } } }\r\n                </fd-token>\r\n            </fd-popover-control>\r\n            <fd-popover-body>\r\n                @if (valueExtra$ | async; as valueExtra) { @if ( (valueExtra[file.Id].UploadState !== 'Error' ||\r\n                valueExtra[file.Id].UploadState === 'Complete') && !file.IsNew ) {\r\n                <bsu-file-viewer-content\r\n                    [file]=\"file\"\r\n                    [width]=\"isMobile ? '100vw' : '30vw'\"\r\n                    [cardMode]=\"true\"\r\n                    [showContent]=\"true\"\r\n                    [showFooter]=\"true\"\r\n                    [deviceSize]=\"(deviceSize$ | async) || 's'\"\r\n                    (cantView)=\"file.cantView = true\"\r\n                ></bsu-file-viewer-content>\r\n                <div fd-popover-body-footer>\r\n                    <bsu-barsa-bar-download-file\r\n                        [isMobile]=\"false\"\r\n                        [popover]=\"popover\"\r\n                        [canPrint]=\"file.Type | isImageType\"\r\n                        [files]=\"[file]\"\r\n                        [hideFullScreen]=\"file.cantView\"\r\n                        [deviceSize]=\"(deviceSize$ | async) || 's'\"\r\n                    ></bsu-barsa-bar-download-file>\r\n                </div>\r\n                <!-- <ul fd-list>\r\n                    <li fd-list-item>\r\n                        <a fd-list-link (click)=\"onDownloadFile(file)\">\r\n                            <i fd-list-icon glyph=\"download\"></i>\r\n                            <span fd-list-title>\r\n                                {{ 'Download' | bbbTranslate }}\r\n                            </span>\r\n                            <fd-busy-indicator [loading]=\"fileDownloading\" [size]=\"'s'\"></fd-busy-indicator>\r\n                        </a>\r\n                    </li>\r\n                </ul> -->\r\n                } }\r\n            </fd-popover-body>\r\n        </fd-popover>\r\n        } }\r\n        <div style=\"display: flex\">\r\n            @if (loading) {\r\n            <div style=\"position: relative; width: 3rem\">\r\n                <bsu-mask [size]=\"'s'\" style=\"background: transparent\"></bsu-mask>\r\n            </div>\r\n            } @if ((fileCount$ | async) | canUploadFile: maxFileCount:(disable$ | async)===true:(readonly$ |\r\n            async)===true) {\r\n            <fd-file-uploader\r\n                class=\"file-linear-upload\"\r\n                fd-toolbar-item\r\n                [id]=\"id\"\r\n                [name]=\"'linear_' + id\"\r\n                [placeholder]=\"'AttachFile' | bbbTranslate\"\r\n                [buttonLabel]=\"'AttachFile' | bbbTranslate\"\r\n                [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\r\n                [accept]=\"validExtension\"\r\n                [multiple]=\"maxFileCount > 1 || Setting.IsMultiSelect\"\r\n                (selectedFilesChanged)=\"onFileSelection($event)\"\r\n                [contentDensity]=\"(contentDensity$ | async)!!\"\r\n            ></fd-file-uploader>\r\n            }\r\n        </div>\r\n    </div>\r\n</div>\r\n}\r\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}:host.isMobile ::ng-deep fd-token>span{-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:pre-wrap;height:auto;text-align:right}:host.isMobile ::ng-deep body[dir=ltr] fd-token>span{text-align:left}.token-container{padding:3px;display:flex;width:100%}.token-container[readonly=true]{border:none}.token-wrapper{align-items:center;flex-grow:1;display:flex;flex-wrap:wrap;width:100%}.token-wrapper fd-token,.token-wrapper .file-linear-upload{padding:4px}\n"], dependencies: [{ kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "component", type: i5$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "ariaValueText", "title", "label", "ariaLive"] }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i5$6.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: BarsaBarDownloadFileComponent, selector: "bsu-barsa-bar-download-file", inputs: ["popover", "file", "files", "hideFullScreen", "isMobile", "canPrint", "selectedIndex", "deviceSize"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: ["fillWidth", "imageOnly", "isImageGallery", "cardMode", "showFooter", "showContent", "selected", "width", "deviceSize", "cardContentHeight", "file", "isThumbnail"], outputs: ["cantView", "imageLoaded"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.CanUploadFilePipe, name: "canUploadFile" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.IsImagePipe, name: "isImageType" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiFileLinearListBoxComponent, isStandalone: false, selector: "bsu-ui-file-linear-list-box", inputs: { value: "value" }, providers: [UploadService], viewQueries: [{ propertyName: "fileUploadComponent", first: true, predicate: FileUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<input fd-form-control class=\"hide\" />\r\n@if (value) {\r\n<div\r\n    class=\"token-container fd-input\"\r\n    contentDensity\r\n    [attr.readonly]=\"(readonly$ | async) === true ? true : null\"\r\n    [disabled]=\"(disable$ | async) === true ? true : null\"\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n    style=\"height: auto !important\"\r\n>\r\n    <div class=\"token-wrapper\">\r\n        @for (file of value; track trackById(file,$index)) { @if (!file.IsDeleted) {\r\n        <fd-popover #popover>\r\n            <fd-popover-control>\r\n                <fd-token (onCloseClick)=\"onFileDeleted(file.Id)\" [readOnly]=\"(disableOrReadonly$ | async)!!\"\r\n                    >{{ file.FileName }}\r\n                    @if (file.IsNew) { @if (valueExtra$ | async; as valueExtra) { @if (valueExtra[file.Id].UploadState\r\n                    !== 'Complete') {\r\n                    <span\r\n                        fd-object-status\r\n                        [status]=\"file.Id | uploadFileStatus: valueExtra\"\r\n                        [label]=\"valueExtra[file.Id]?.UploadState || ''\"\r\n                        [title]=\"valueExtra[file.Id]?.UploadState\"\r\n                        [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\r\n                    ></span>\r\n                    } @if (valueExtra[file.Id].Progress) {\r\n                    <fd-object-number\r\n                        [number]=\"valueExtra[file.Id].Progress || 0\"\r\n                        unit=\"%\"\r\n                        status=\"informative\"\r\n                    ></fd-object-number>\r\n                    } @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n                    <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\"></fd-busy-indicator>\r\n                    } } }\r\n                </fd-token>\r\n            </fd-popover-control>\r\n            <fd-popover-body>\r\n                @if (valueExtra$ | async; as valueExtra) { @if ( (valueExtra[file.Id].UploadState !== 'Error' ||\r\n                valueExtra[file.Id].UploadState === 'Complete') && !file.IsNew ) {\r\n                <bsu-file-viewer-content\r\n                    [file]=\"file\"\r\n                    [width]=\"isMobile ? '100vw' : '30vw'\"\r\n                    [cardMode]=\"true\"\r\n                    [showContent]=\"true\"\r\n                    [showFooter]=\"true\"\r\n                    [deviceSize]=\"(deviceSize$ | async) || 's'\"\r\n                    (cantView)=\"file.cantView = true\"\r\n                ></bsu-file-viewer-content>\r\n                <div fd-popover-body-footer>\r\n                    <bsu-barsa-bar-download-file\r\n                        [isMobile]=\"false\"\r\n                        [popover]=\"popover\"\r\n                        [canPrint]=\"file.Type | isImageType\"\r\n                        [files]=\"[file]\"\r\n                        [hideFullScreen]=\"file.cantView\"\r\n                        [deviceSize]=\"(deviceSize$ | async) || 's'\"\r\n                    ></bsu-barsa-bar-download-file>\r\n                </div>\r\n                <!-- <ul fd-list>\r\n                    <li fd-list-item>\r\n                        <a fd-list-link (click)=\"onDownloadFile(file)\">\r\n                            <i fd-list-icon glyph=\"download\"></i>\r\n                            <span fd-list-title>\r\n                                {{ 'Download' | bbbTranslate }}\r\n                            </span>\r\n                            <fd-busy-indicator [loading]=\"fileDownloading\" [size]=\"'s'\"></fd-busy-indicator>\r\n                        </a>\r\n                    </li>\r\n                </ul> -->\r\n                } }\r\n            </fd-popover-body>\r\n        </fd-popover>\r\n        } }\r\n        <div style=\"display: flex\">\r\n            @if (loading) {\r\n            <div style=\"position: relative; width: 3rem\">\r\n                <bsu-mask [size]=\"'s'\" style=\"background: transparent\"></bsu-mask>\r\n            </div>\r\n            } @if ((fileCount$ | async) | canUploadFile: maxFileCount:(disable$ | async)===true:(readonly$ |\r\n            async)===true) {\r\n            <fd-file-uploader\r\n                class=\"file-linear-upload\"\r\n                fd-toolbar-item\r\n                [id]=\"id\"\r\n                [name]=\"'linear_' + id\"\r\n                [placeholder]=\"'AttachFile' | bbbTranslate\"\r\n                [buttonLabel]=\"'AttachFile' | bbbTranslate\"\r\n                [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\r\n                [accept]=\"validExtension\"\r\n                [multiple]=\"maxFileCount > 1 || Setting.IsMultiSelect\"\r\n                (selectedFilesChanged)=\"onFileSelection($event)\"\r\n                [contentDensity]=\"(contentDensity$ | async)!!\"\r\n            ></fd-file-uploader>\r\n            }\r\n        </div>\r\n    </div>\r\n</div>\r\n}\r\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}:host.isMobile ::ng-deep fd-token>span{-webkit-line-clamp:2;-webkit-box-orient:vertical;white-space:pre-wrap;height:auto;text-align:right}:host.isMobile ::ng-deep body[dir=ltr] fd-token>span{text-align:left}.token-container{padding:3px;display:flex;width:100%}.token-container[readonly=true]{border:none}.token-wrapper{align-items:center;flex-grow:1;display:flex;flex-wrap:wrap;width:100%}.token-wrapper fd-token,.token-wrapper .file-linear-upload{padding:4px}\n"], dependencies: [{ kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "component", type: i5$1.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "ariaValueText", "title", "label", "ariaLive"] }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i5$6.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$3.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: BarsaBarDownloadFileComponent, selector: "bsu-barsa-bar-download-file", inputs: ["popover", "file", "files", "hideFullScreen", "isMobile", "canPrint", "selectedIndex", "deviceSize"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: FileViewerContentComponent, selector: "bsu-file-viewer-content", inputs: ["fillWidth", "imageOnly", "isImageGallery", "cardMode", "showFooter", "showContent", "selected", "width", "deviceSize", "cardContentHeight", "file", "isThumbnail"], outputs: ["cantView", "imageLoaded"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.CanUploadFilePipe, name: "canUploadFile" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.IsImagePipe, name: "isImageType" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiFileLinearListBoxComponent, decorators: [{
             type: Component,
@@ -8880,7 +9011,7 @@ class BarsaListFileLinearComponent extends UiFileLinearListBoxComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaListFileLinearComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaListFileLinearComponent, isStandalone: false, selector: "bsu-barsa-list-file-linear", providers: [UploadService], usesInheritance: true, ngImport: i0, template: "@if (parameters.ModeValue === '1') {\r\n<ul fd-list class=\"file-viewer-attachments\">\r\n    @for (file of value; track file) { @if (!file.IsDeleted) {\r\n    <li fd-list-item style=\"background-color: #f5f5f5; margin: 0 0 0 30%; width: 100%\">\r\n        @if (file.inEdit) {\r\n        <input\r\n            style=\"width: 90%\"\r\n            fd-form-control\r\n            [(ngModel)]=\"file.FileName\"\r\n            (click)=\"$event.preventDefault(); $event.stopPropagation()\"\r\n            (keydown.enter)=\"onHandleRenameFile(file)\"\r\n        />\r\n        } @if (!file.inEdit) {\r\n        <span fd-list-title>\r\n            {{ file.FileName }}\r\n        </span>\r\n        }\r\n        <span fd-list-secondary>\r\n            <button\r\n                ariaLabel=\"Edit Or Save\"\r\n                fdType=\"transparent\"\r\n                class=\"fd-button--compact\"\r\n                fd-button\r\n                fdCompact\r\n                [glyph]=\"file.inEdit ? 'save' : 'edit'\"\r\n                (click)=\"onHandleRenameFile(file)\"\r\n            ></button>\r\n            @if (!file.inEdit) {\r\n            <button\r\n                ariaLabel=\"Remove\"\r\n                fdType=\"transparent\"\r\n                title=\"Remove\"\r\n                fd-button\r\n                glyph=\"delete\"\r\n                (click)=\"onFileDeleted(file.Id)\"\r\n            ></button>\r\n            }\r\n        </span>\r\n    </li>\r\n    } } @if (valueExtra$ | async; as valueExtra) { @for (file of valueExtra | keyvalue; track file) { @if\r\n    (file.value.UploadState === 'Uploading') {\r\n    <li style=\"background-color: #f5f5f5; margin: 0 0 0 30%; width: 100%\">\r\n        @if (file.value.Progress) {\r\n        <fd-progress-indicator state=\"informative\" [valueNow]=\"file.value.Progress\"></fd-progress-indicator>\r\n        }\r\n    </li>\r\n    } } }\r\n</ul>\r\n} @if (parameters.ModeValue === '2') {\r\n<ul fd-list [byline]=\"true\">\r\n    @if (fileCount$ | async; as fileCount) { @if (fileCount === 0) {\r\n    <li fd-list-item>\r\n        <div fd-list-content style=\"text-align: center\">\r\n            <span>{{ 'NoFiles' | bbbTranslate }}</span>\r\n        </div>\r\n    </li>\r\n    } } @for (file of value; track file) { @if (valueExtra$ | async; as valueExtra) { @if (!file.IsDeleted) {\r\n    <li fd-list-item>\r\n        <span fd-list-thumbnail>\r\n            @if (valueExtra[file.Id].IsIcon) {\r\n            <fd-icon [glyph]=\"valueExtra[file.Id].FileUrl\"></fd-icon>\r\n            } @else {\r\n            <fd-avatar size=\"m\" [image]=\"valueExtra[file.Id].FileUrl || ''\"></fd-avatar>\r\n            }\r\n        </span>\r\n        <!-- for byline, fd-list-content is mandatory -->\r\n        <div fd-list-content>\r\n            <div fd-list-title>{{ file.FileName }}</div>\r\n            <div fd-list-byline [twoCol]=\"true\">\r\n                <div fd-list-byline-left></div>\r\n                <div fd-list-byline-right style=\"display: flex; justify-content: flex-end\">\r\n                    <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n                        @if (file.IsNew) {\r\n                        <span\r\n                            fd-toolbar-item\r\n                            fd-object-status\r\n                            [status]=\"file.Id | uploadFileStatus: valueExtra\"\r\n                            [label]=\"valueExtra[file.Id]?.UploadState || ''\"\r\n                            [title]=\"valueExtra[file.Id]?.UploadState\"\r\n                            [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\r\n                        ></span>\r\n                        @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n                        <fd-slider\r\n                            [contentDensity]=\"(contentDensity$ | async)!!\"\r\n                            [(ngModel)]=\"valueExtra[file.Id].Progress\"\r\n                            [name]=\"'filerLinear_' + id\"\r\n                            fd-toolbar-item\r\n                            [id]=\"id\"\r\n                            [min]=\"0\"\r\n                            [max]=\"100\"\r\n                            [step]=\"1\"\r\n                        >\r\n                        </fd-slider>\r\n                        } }\r\n                    </fd-toolbar>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        @if ((disableOrReadonly$ | async) === false && valueExtra[file.Id].UploadState !== 'Uploading') {\r\n        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onFileDeleted(file.Id)\"></button>\r\n        } @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'stop'\" (click)=\"onTerminate(file)\"></button>\r\n        } @if (valueExtra[file.Id].UploadState === 'Error') {\r\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'refresh'\" (click)=\"onRetry(file)\"></button>\r\n        }\r\n    </li>\r\n    } } }\r\n</ul>\r\n} @if ((disableOrReadonly$ | async) !== true) {\r\n<fd-toolbar\r\n    style=\"display: block\"\r\n    [style.height.px]=\"parameters.ModeValue === '1' ? 0 : null\"\r\n    [fdType]=\"'transparent'\"\r\n    [clearBorder]=\"true\"\r\n>\r\n    <fd-file-uploader\r\n        fd-toolbar-item\r\n        [class.hide-file-uploader]=\"parameters?.HideAttachButton\"\r\n        [id]=\"id\"\r\n        [name]=\"id\"\r\n        [placeholder]=\"'AttachFile' | bbbTranslate\"\r\n        [buttonLabel]=\"'AttachFile' | bbbTranslate\"\r\n        [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\r\n        [accept]=\"Setting.ValidExtensions || ''\"\r\n        [multiple]=\"maxFileCount > 1\"\r\n        (selectedFilesChanged)=\"onFileSelection($event)\"\r\n        [contentDensity]=\"(contentDensity$ | async)!!\"\r\n    ></fd-file-uploader>\r\n</fd-toolbar>\r\n}\r\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}:host ::ng-deep fd-file-uploader .fd-button{background-color:var(--sapButton_Lite_Background);border-color:var(--sapButton_Lite_BorderColor);color:var(--sapButton_Lite_TextColor)}:host .hide-file-uploader{visibility:hidden;height:0;width:0}\n"], dependencies: [{ kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListBylineLeftDirective, selector: "[fdListBylineLeft], [fd-list-byline-left]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListBylineRightDirective, selector: "[fdListBylineRight], [fd-list-byline-right]", inputs: ["status", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "component", type: i12$1.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaListFileLinearComponent, isStandalone: false, selector: "bsu-barsa-list-file-linear", providers: [UploadService], usesInheritance: true, ngImport: i0, template: "@if (parameters.ModeValue === '1') {\r\n<ul fd-list class=\"file-viewer-attachments\">\r\n    @for (file of value; track file) { @if (!file.IsDeleted) {\r\n    <li fd-list-item style=\"background-color: #f5f5f5; margin: 0 0 0 30%; width: 100%\">\r\n        @if (file.inEdit) {\r\n        <input\r\n            style=\"width: 90%\"\r\n            fd-form-control\r\n            [(ngModel)]=\"file.FileName\"\r\n            (click)=\"$event.preventDefault(); $event.stopPropagation()\"\r\n            (keydown.enter)=\"onHandleRenameFile(file)\"\r\n        />\r\n        } @if (!file.inEdit) {\r\n        <span fd-list-title>\r\n            {{ file.FileName }}\r\n        </span>\r\n        }\r\n        <span fd-list-secondary>\r\n            <button\r\n                ariaLabel=\"Edit Or Save\"\r\n                fdType=\"transparent\"\r\n                class=\"fd-button--compact\"\r\n                fd-button\r\n                fdCompact\r\n                [glyph]=\"file.inEdit ? 'save' : 'edit'\"\r\n                (click)=\"onHandleRenameFile(file)\"\r\n            ></button>\r\n            @if (!file.inEdit) {\r\n            <button\r\n                ariaLabel=\"Remove\"\r\n                fdType=\"transparent\"\r\n                title=\"Remove\"\r\n                fd-button\r\n                glyph=\"delete\"\r\n                (click)=\"onFileDeleted(file.Id)\"\r\n            ></button>\r\n            }\r\n        </span>\r\n    </li>\r\n    } } @if (valueExtra$ | async; as valueExtra) { @for (file of valueExtra | keyvalue; track file) { @if\r\n    (file.value.UploadState === 'Uploading') {\r\n    <li style=\"background-color: #f5f5f5; margin: 0 0 0 30%; width: 100%\">\r\n        @if (file.value.Progress) {\r\n        <fd-progress-indicator state=\"informative\" [valueNow]=\"file.value.Progress\"></fd-progress-indicator>\r\n        }\r\n    </li>\r\n    } } }\r\n</ul>\r\n} @if (parameters.ModeValue === '2') {\r\n<ul fd-list [byline]=\"true\">\r\n    @if (fileCount$ | async; as fileCount) { @if (fileCount === 0) {\r\n    <li fd-list-item>\r\n        <div fd-list-content style=\"text-align: center\">\r\n            <span>{{ 'NoFiles' | bbbTranslate }}</span>\r\n        </div>\r\n    </li>\r\n    } } @for (file of value; track file) { @if (valueExtra$ | async; as valueExtra) { @if (!file.IsDeleted) {\r\n    <li fd-list-item>\r\n        <span fd-list-thumbnail>\r\n            @if (valueExtra[file.Id].IsIcon) {\r\n            <fd-icon [glyph]=\"valueExtra[file.Id].FileUrl\"></fd-icon>\r\n            } @else {\r\n            <fd-avatar size=\"m\" [image]=\"valueExtra[file.Id].FileUrl || ''\"></fd-avatar>\r\n            }\r\n        </span>\r\n        <!-- for byline, fd-list-content is mandatory -->\r\n        <div fd-list-content>\r\n            <div fd-list-title>{{ file.FileName }}</div>\r\n            <div fd-list-byline [twoCol]=\"true\">\r\n                <div fd-list-byline-left></div>\r\n                <div fd-list-byline-right style=\"display: flex; justify-content: flex-end\">\r\n                    <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n                        @if (file.IsNew) {\r\n                        <span\r\n                            fd-toolbar-item\r\n                            fd-object-status\r\n                            [status]=\"file.Id | uploadFileStatus: valueExtra\"\r\n                            [label]=\"valueExtra[file.Id]?.UploadState || ''\"\r\n                            [title]=\"valueExtra[file.Id]?.UploadState\"\r\n                            [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\r\n                        ></span>\r\n                        @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n                        <fd-slider\r\n                            [contentDensity]=\"(contentDensity$ | async)!!\"\r\n                            [(ngModel)]=\"valueExtra[file.Id].Progress\"\r\n                            [name]=\"'filerLinear_' + id\"\r\n                            fd-toolbar-item\r\n                            [id]=\"id\"\r\n                            [min]=\"0\"\r\n                            [max]=\"100\"\r\n                            [step]=\"1\"\r\n                        >\r\n                        </fd-slider>\r\n                        } }\r\n                    </fd-toolbar>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        @if ((disableOrReadonly$ | async) === false && valueExtra[file.Id].UploadState !== 'Uploading') {\r\n        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onFileDeleted(file.Id)\"></button>\r\n        } @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'stop'\" (click)=\"onTerminate(file)\"></button>\r\n        } @if (valueExtra[file.Id].UploadState === 'Error') {\r\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'refresh'\" (click)=\"onRetry(file)\"></button>\r\n        }\r\n    </li>\r\n    } } }\r\n</ul>\r\n} @if ((disableOrReadonly$ | async) !== true) {\r\n<fd-toolbar\r\n    style=\"display: block\"\r\n    [style.height.px]=\"parameters.ModeValue === '1' ? 0 : null\"\r\n    [fdType]=\"'transparent'\"\r\n    [clearBorder]=\"true\"\r\n>\r\n    <fd-file-uploader\r\n        fd-toolbar-item\r\n        [class.hide-file-uploader]=\"parameters?.HideAttachButton\"\r\n        [id]=\"id\"\r\n        [name]=\"id\"\r\n        [placeholder]=\"'AttachFile' | bbbTranslate\"\r\n        [buttonLabel]=\"'AttachFile' | bbbTranslate\"\r\n        [buttonAriaLabel]=\"'AttachFile' | bbbTranslate\"\r\n        [accept]=\"Setting.ValidExtensions || ''\"\r\n        [multiple]=\"maxFileCount > 1\"\r\n        (selectedFilesChanged)=\"onFileSelection($event)\"\r\n        [contentDensity]=\"(contentDensity$ | async)!!\"\r\n    ></fd-file-uploader>\r\n</fd-toolbar>\r\n}\r\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}:host ::ng-deep fd-file-uploader .fd-button{background-color:var(--sapButton_Lite_Background);border-color:var(--sapButton_Lite_BorderColor);color:var(--sapButton_Lite_TextColor)}:host .hide-file-uploader{visibility:hidden;height:0;width:0}\n"], dependencies: [{ kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListBylineLeftDirective, selector: "[fdListBylineLeft], [fd-list-byline-left]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListBylineRightDirective, selector: "[fdListBylineRight], [fd-list-byline-right]", inputs: ["status", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "component", type: i12$1.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i1.KeyValuePipe, name: "keyvalue" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaListFileLinearComponent, decorators: [{
             type: Component,
@@ -9076,7 +9207,7 @@ class UlvFormMultiSelectComponent extends BaseComponent {
         return item.Id;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UlvFormMultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UlvFormMultiSelectComponent, isStandalone: false, selector: "bsu-ulv-form-multi-select", inputs: { Show: "Show" }, viewQueries: [{ propertyName: "dialogContainer", first: true, predicate: ["container"], descendants: true, read: TemplateRef }, { propertyName: "dialogComponent", first: true, predicate: ["dialogTpl"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl>\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                <div fd-bar-left>\r\n                    <fd-bar-element>\r\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.title }}</h1>\r\n                    </fd-bar-element>\r\n                </div>\r\n                <div fd-bar-right>\r\n                    @if (!dialogConfig.fullscreen && !dialogConfig.mobile) {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"\r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"dialog.toggleFullScreen()\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onCancel(dialog)\"></fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n            <!-- <h3 fd-title>{{ dialog.data.title }}</h3>\r\n      <button fd-dialog-close-button></button> -->\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body>\r\n            @if (dialog.data.ulv1; as ulv1) {\r\n            <bsu-ui-ulv-main-ui\r\n                class=\"ulv-form-multi-select\"\r\n                [context]=\"ulv1\"\r\n                [inDialog]=\"true\"\r\n                [isMultiSelect]=\"dialog.data.ShowSecondPanel\"\r\n                [fullscreen]=\"dialog.data.fullscreen\"\r\n            ></bsu-ui-ulv-main-ui>\r\n            }\r\n        </fd-dialog-body>\r\n        @if (dialog.data.ulv2 && dialog.data.ShowSecondPanel) {\r\n        <fd-dialog-footer class=\"ulvSelection\">\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div\r\n                    class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\r\n                    [aria-label]=\"'SelectedItemsAndConditions' | bbbTranslate\"\r\n                >\r\n                    <h5 fd-title class=\"selected-and-condition-title !tw-pb-2\">\r\n                        <ng-container>\r\n                            <ng-container>{{ 'SelectedItemsAndConditions' | bbbTranslate }} </ng-container>\r\n                            ({{ dialog.data.selectedItems?.MoDataList?.length || 0 }})\r\n                        </ng-container>\r\n                    </h5>\r\n                    <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\r\n                        <div class=\"ulv-selection-form-dialog__tokens\">\r\n                            @if (dialog.data.selectedItems) {\r\n                            <fd-toolbar [shouldOverflow]=\"true\">\r\n                                <!-- Selected items -->\r\n                                @for ( item of dialog.data.selectedItems.MoDataList; track\r\n                                _trackBySelectedFn(selectedIndex, item); let selectedIndex = $index) {\r\n                                <fd-token\r\n                                    fd-toolbar-item\r\n                                    fdOverflowPriority=\"high\"\r\n                                    class=\"fdp-value-help-dialog__selection-token\"\r\n                                    (onCloseClick)=\"onRemoveSelected(dialog, item)\"\r\n                                    >{{ item.$Caption }}\r\n                                </fd-token>\r\n                                }\r\n                            </fd-toolbar>\r\n                            }\r\n                        </div>\r\n                        <button\r\n                            class=\"ulv-selection-form-dialog__tokens-clear\"\r\n                            fd-button\r\n                            fdType=\"transparent\"\r\n                            glyph=\"decline\"\r\n                            [aria-label]=\"'Clear' | bbbTranslate\"\r\n                            (click)=\"onClear(dialog)\"\r\n                        ></button>\r\n                    </div>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n        } @if (dialog.data.ulv1 && !dialog.data.ulv1?.HideOkCancelButtons) {\r\n        <fd-dialog-footer>\r\n            <ng-template fdkTemplate=\"footer\">\r\n                @if (dialog.data.adapter?.ShowOkCancelButtons !== false) {\r\n                <div class=\"fd-bar__right\">\r\n                    <button\r\n                        fd-button\r\n                        data-succes\r\n                        [label]=\"'OK' | bbbTranslate\"\r\n                        fdType=\"emphasized\"\r\n                        (click)=\"onOk(dialog)\"\r\n                    ></button>\r\n                    <button\r\n                        fd-button\r\n                        data-dismiss-dialog\r\n                        fd-dialog-decisive-button\r\n                        [label]=\"'Cancel' | bbbTranslate\"\r\n                        [fdType]=\"'transparent'\"\r\n                        (click)=\"onCancel(dialog)\"\r\n                    ></button>\r\n                </div>\r\n                }\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n        }\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [".ulv-selection-form-dialog{cursor:default}.ulv-selection-form-dialog .fd-dialog__body bsu-ui-table-view{overflow-x:inherit!important}.ulv-selection-form-dialog__advanced-filters{padding-top:1rem}.ulv-selection-form-dialog__advanced-filters label{height:auto}.ulv-selection-form-dialog__toggle-filters{display:flex;justify-content:flex-end;align-items:flex-end}.ulv-selection-form-dialog__toggle-filters .fd-button{margin-bottom:.25rem}.ulv-selection-form-dialog__advanced-actions{display:flex;align-items:center;justify-content:flex-end}.ulv-selection-form-dialog-mobile .ulv-selection-form-dialog__advanced-actions{justify-content:flex-start}.ulv-selection-form-dialog__advanced-actions .fd-toolbar{padding:0}.ulv-selection-form-dialog fd-dialog-body{height:100%;display:flex;flex-direction:column}.ulv-selection-form-dialog bsu-ui-ulv-main-ui{height:100%;flex-grow:1}.ulv-selection-form-dialog bsu-ui-ulv-main-ui .viewer-container{height:auto;overflow:auto}.ulv-selection-form-dialog .ulv-selection-form-dialog__row{border-top:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9);padding-top:.5rem}.ulv-selection-form-dialog bsu-search-panel{border-bottom:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}.ulv-selection-form-dialog fd-dialog-footer{height:auto}.ulv-selection-form-dialog fd-dialog-footer.ulvSelection .fd-bar{padding:0!important;height:6rem!important}.ulv-selection-form-dialog fd-dialog-footer.ulvSelection .fd-bar>div{width:100%}.ulv-selection-form-dialog__content-holder{padding:0 2rem 1rem;display:flex;flex-direction:column;height:100%;width:100%;overflow:hidden}.ulv-selection-form-dialog__row{padding:0 1rem}.ulv-selection-form-dialog__row.ulv-selection-form-dialog__selection-row{background-color:#f7f7f7;background-color:var(--sapBackgroundColor, #f7f7f7)}.ulv-selection-form-dialog__tokens-wrapper{display:flex}.ulv-selection-form-dialog__tokens{display:flex;flex:1 1 auto;overflow:hidden;align-items:center;border:1px solid #89919a;border-color:var(--sapContent_ForegroundBorderColor, #89919a);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem);background:none}.ulv-selection-form-dialog__tokens fd-toolbar{flex:1 1 auto;overflow:hidden}.ulv-selection-form-dialog__tokens-clear{height:auto;min-width:2rem;padding:.125rem 0;justify-content:center}.ulv-selection-form-dialog__actions-row{padding:.5rem 0;display:flex;align-items:center;justify-content:flex-end;border-top:.0625rem solid #d9d9d9;border-top:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}.ulv-selection-form-dialog__actions-row .fd-button{margin-left:.5rem}.ulv-selection-form-dialog__tokens-wrapper{align-items:center}\n"], dependencies: [{ kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UlvFormMultiSelectComponent, isStandalone: false, selector: "bsu-ulv-form-multi-select", inputs: { Show: "Show" }, viewQueries: [{ propertyName: "dialogContainer", first: true, predicate: ["container"], descendants: true, read: TemplateRef }, { propertyName: "dialogComponent", first: true, predicate: ["dialogTpl"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl>\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                <div fd-bar-left>\r\n                    <fd-bar-element>\r\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.title }}</h1>\r\n                    </fd-bar-element>\r\n                </div>\r\n                <div fd-bar-right>\r\n                    @if (!dialogConfig.fullscreen && !dialogConfig.mobile) {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"\r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"dialog.toggleFullScreen()\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onCancel(dialog)\"></fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n            <!-- <h3 fd-title>{{ dialog.data.title }}</h3>\r\n      <button fd-dialog-close-button></button> -->\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body>\r\n            @if (dialog.data.ulv1; as ulv1) {\r\n            <bsu-ui-ulv-main-ui\r\n                class=\"ulv-form-multi-select\"\r\n                [context]=\"ulv1\"\r\n                [inDialog]=\"true\"\r\n                [isMultiSelect]=\"dialog.data.ShowSecondPanel\"\r\n                [fullscreen]=\"dialog.data.fullscreen\"\r\n            ></bsu-ui-ulv-main-ui>\r\n            }\r\n        </fd-dialog-body>\r\n        @if (dialog.data.ulv2 && dialog.data.ShowSecondPanel) {\r\n        <fd-dialog-footer class=\"ulvSelection\">\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div\r\n                    class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\r\n                    [aria-label]=\"'SelectedItemsAndConditions' | bbbTranslate\"\r\n                >\r\n                    <h5 fd-title class=\"selected-and-condition-title !tw-pb-2\">\r\n                        <ng-container>\r\n                            <ng-container>{{ 'SelectedItemsAndConditions' | bbbTranslate }} </ng-container>\r\n                            ({{ dialog.data.selectedItems?.MoDataList?.length || 0 }})\r\n                        </ng-container>\r\n                    </h5>\r\n                    <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\r\n                        <div class=\"ulv-selection-form-dialog__tokens\">\r\n                            @if (dialog.data.selectedItems) {\r\n                            <fd-toolbar [shouldOverflow]=\"true\">\r\n                                <!-- Selected items -->\r\n                                @for ( item of dialog.data.selectedItems.MoDataList; track\r\n                                _trackBySelectedFn(selectedIndex, item); let selectedIndex = $index) {\r\n                                <fd-token\r\n                                    fd-toolbar-item\r\n                                    fdOverflowPriority=\"high\"\r\n                                    class=\"fdp-value-help-dialog__selection-token\"\r\n                                    (onCloseClick)=\"onRemoveSelected(dialog, item)\"\r\n                                    >{{ item.$Caption }}\r\n                                </fd-token>\r\n                                }\r\n                            </fd-toolbar>\r\n                            }\r\n                        </div>\r\n                        <button\r\n                            class=\"ulv-selection-form-dialog__tokens-clear\"\r\n                            fd-button\r\n                            fdType=\"transparent\"\r\n                            glyph=\"decline\"\r\n                            [aria-label]=\"'Clear' | bbbTranslate\"\r\n                            (click)=\"onClear(dialog)\"\r\n                        ></button>\r\n                    </div>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n        } @if (dialog.data.ulv1 && !dialog.data.ulv1?.HideOkCancelButtons) {\r\n        <fd-dialog-footer>\r\n            <ng-template fdkTemplate=\"footer\">\r\n                @if (dialog.data.adapter?.ShowOkCancelButtons !== false) {\r\n                <div class=\"fd-bar__right\">\r\n                    <button\r\n                        fd-button\r\n                        data-succes\r\n                        [label]=\"'OK' | bbbTranslate\"\r\n                        fdType=\"emphasized\"\r\n                        (click)=\"onOk(dialog)\"\r\n                    ></button>\r\n                    <button\r\n                        fd-button\r\n                        data-dismiss-dialog\r\n                        fd-dialog-decisive-button\r\n                        [label]=\"'Cancel' | bbbTranslate\"\r\n                        [fdType]=\"'transparent'\"\r\n                        (click)=\"onCancel(dialog)\"\r\n                    ></button>\r\n                </div>\r\n                }\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n        }\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [".ulv-selection-form-dialog{cursor:default}.ulv-selection-form-dialog .fd-dialog__body bsu-ui-table-view{overflow-x:inherit!important}.ulv-selection-form-dialog__advanced-filters{padding-top:1rem}.ulv-selection-form-dialog__advanced-filters label{height:auto}.ulv-selection-form-dialog__toggle-filters{display:flex;justify-content:flex-end;align-items:flex-end}.ulv-selection-form-dialog__toggle-filters .fd-button{margin-bottom:.25rem}.ulv-selection-form-dialog__advanced-actions{display:flex;align-items:center;justify-content:flex-end}.ulv-selection-form-dialog-mobile .ulv-selection-form-dialog__advanced-actions{justify-content:flex-start}.ulv-selection-form-dialog__advanced-actions .fd-toolbar{padding:0}.ulv-selection-form-dialog fd-dialog-body{height:100%;display:flex;flex-direction:column}.ulv-selection-form-dialog bsu-ui-ulv-main-ui{height:100%;flex-grow:1}.ulv-selection-form-dialog bsu-ui-ulv-main-ui .viewer-container{height:auto;overflow:auto}.ulv-selection-form-dialog .ulv-selection-form-dialog__row{border-top:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9);padding-top:.5rem}.ulv-selection-form-dialog bsu-search-panel{border-bottom:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}.ulv-selection-form-dialog fd-dialog-footer{height:auto}.ulv-selection-form-dialog fd-dialog-footer.ulvSelection .fd-bar{padding:0!important;height:6rem!important}.ulv-selection-form-dialog fd-dialog-footer.ulvSelection .fd-bar>div{width:100%}.ulv-selection-form-dialog__content-holder{padding:0 2rem 1rem;display:flex;flex-direction:column;height:100%;width:100%;overflow:hidden}.ulv-selection-form-dialog__row{padding:0 1rem}.ulv-selection-form-dialog__row.ulv-selection-form-dialog__selection-row{background-color:#f7f7f7;background-color:var(--sapBackgroundColor, #f7f7f7)}.ulv-selection-form-dialog__tokens-wrapper{display:flex}.ulv-selection-form-dialog__tokens{display:flex;flex:1 1 auto;overflow:hidden;align-items:center;border:1px solid #89919a;border-color:var(--sapContent_ForegroundBorderColor, #89919a);border-radius:.25rem;border-radius:var(--sapElement_BorderCornerRadius, .25rem);background:none}.ulv-selection-form-dialog__tokens fd-toolbar{flex:1 1 auto;overflow:hidden}.ulv-selection-form-dialog__tokens-clear{height:auto;min-width:2rem;padding:.125rem 0;justify-content:center}.ulv-selection-form-dialog__actions-row{padding:.5rem 0;display:flex;align-items:center;justify-content:flex-end;border-top:.0625rem solid #d9d9d9;border-top:.0625rem solid var(--sapPageFooter_BorderColor, #d9d9d9)}.ulv-selection-form-dialog__actions-row .fd-button{margin-left:.5rem}.ulv-selection-form-dialog__tokens-wrapper{align-items:center}\n"], dependencies: [{ kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UlvFormMultiSelectComponent, decorators: [{
             type: Component,
@@ -9098,7 +9229,7 @@ class UiUlvFormMultiSelectUiComponent extends BaseComponent {
         this.dialogRef = inject(DialogRef);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiUlvFormMultiSelectUiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiUlvFormMultiSelectUiComponent, isStandalone: false, selector: "bsu-ui-ulv-form-multi-select-ui", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <h1 fd-title>{{ dialogRef.data.title }}</h1>\r\n        <button fd-dialog-close-button (click)=\"dialogRef.dismiss('Close button')\"></button>\r\n    </fd-dialog-header>\r\n\r\n    <fd-dialog-body>\r\n        @if (dialogRef.data.ulv1; as ulv1) {\r\n        <bsu-ui-ulv-main-ui [context]=\"ulv1\"></bsu-ui-ulv-main-ui>\r\n        }\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <ng-template fdkTemplate=\"footer\">\r\n            <div\r\n                class=\"fdp-value-help-dialog__row fdp-value-help-dialog__selection-row\"\r\n                aria-label=\"Selected and condition items\"\r\n                i18n-aria-label=\"@@platformI18nValueHelpDialog.SelectionBarLabel\"\r\n            >\r\n                <h5 fd-title class=\"selected-and-condition-title\">\r\n                    <ng-container>\r\n                        <ng-container i18n=\"@@platformI18nValueHelpDialog.SelectedAndConditionLabel\"\r\n                            >Selected Items and Conditions\r\n                        </ng-container>\r\n                        ()\r\n                    </ng-container>\r\n                </h5>\r\n\r\n                <div class=\"fdp-value-help-dialog__tokens-wrapper\">\r\n                    <div class=\"fdp-value-help-dialog__tokens\">\r\n                        <fd-toolbar [shouldOverflow]=\"true\">\r\n                            <!-- Selected items -->\r\n                        </fd-toolbar>\r\n                    </div>\r\n                    <button\r\n                        class=\"fdp-value-help-dialog__tokens-clear\"\r\n                        fd-button\r\n                        fdType=\"transparent\"\r\n                        glyph=\"decline\"\r\n                        i18n-aria-label=\"@@platformI18nValueHelpDialog.ClearSelectedAriaLabel\"\r\n                        aria-label=\"clear selected items\"\r\n                    ></button>\r\n                </div>\r\n            </div>\r\n            <div class=\"fdp-value-help-dialog__actions-row\">\r\n                <button\r\n                    fd-button\r\n                    data-go-advanced\r\n                    i18n-label=\"@@platformI18nValueHelpDialog.SearchButton\"\r\n                    label=\"Go\"\r\n                    fdType=\"emphasized\"\r\n                ></button>\r\n                <button\r\n                    fd-button\r\n                    data-succes\r\n                    i18n-label=\"@@platformI18nValueHelpDialog.SuccessButton\"\r\n                    label=\"OK\"\r\n                    fdType=\"emphasized\"\r\n                ></button>\r\n                <button\r\n                    fd-button\r\n                    data-dismiss-dialog\r\n                    fd-dialog-decisive-button\r\n                    i18n-label=\"@@platformI18nValueHelpDialog.CancelButton\"\r\n                    label=\"Cancel\"\r\n                    fdType=\"transparent\"\r\n                ></button>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$3.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiUlvFormMultiSelectUiComponent, isStandalone: false, selector: "bsu-ui-ulv-form-multi-select-ui", usesInheritance: true, ngImport: i0, template: "<fd-dialog>\r\n    <fd-dialog-header>\r\n        <h1 fd-title>{{ dialogRef.data.title }}</h1>\r\n        <button fd-dialog-close-button (click)=\"dialogRef.dismiss('Close button')\"></button>\r\n    </fd-dialog-header>\r\n\r\n    <fd-dialog-body>\r\n        @if (dialogRef.data.ulv1; as ulv1) {\r\n        <bsu-ui-ulv-main-ui [context]=\"ulv1\"></bsu-ui-ulv-main-ui>\r\n        }\r\n    </fd-dialog-body>\r\n\r\n    <fd-dialog-footer>\r\n        <ng-template fdkTemplate=\"footer\">\r\n            <div\r\n                class=\"fdp-value-help-dialog__row fdp-value-help-dialog__selection-row\"\r\n                aria-label=\"Selected and condition items\"\r\n                i18n-aria-label=\"@@platformI18nValueHelpDialog.SelectionBarLabel\"\r\n            >\r\n                <h5 fd-title class=\"selected-and-condition-title\">\r\n                    <ng-container>\r\n                        <ng-container i18n=\"@@platformI18nValueHelpDialog.SelectedAndConditionLabel\"\r\n                            >Selected Items and Conditions\r\n                        </ng-container>\r\n                        ()\r\n                    </ng-container>\r\n                </h5>\r\n\r\n                <div class=\"fdp-value-help-dialog__tokens-wrapper\">\r\n                    <div class=\"fdp-value-help-dialog__tokens\">\r\n                        <fd-toolbar [shouldOverflow]=\"true\">\r\n                            <!-- Selected items -->\r\n                        </fd-toolbar>\r\n                    </div>\r\n                    <button\r\n                        class=\"fdp-value-help-dialog__tokens-clear\"\r\n                        fd-button\r\n                        fdType=\"transparent\"\r\n                        glyph=\"decline\"\r\n                        i18n-aria-label=\"@@platformI18nValueHelpDialog.ClearSelectedAriaLabel\"\r\n                        aria-label=\"clear selected items\"\r\n                    ></button>\r\n                </div>\r\n            </div>\r\n            <div class=\"fdp-value-help-dialog__actions-row\">\r\n                <button\r\n                    fd-button\r\n                    data-go-advanced\r\n                    i18n-label=\"@@platformI18nValueHelpDialog.SearchButton\"\r\n                    label=\"Go\"\r\n                    fdType=\"emphasized\"\r\n                ></button>\r\n                <button\r\n                    fd-button\r\n                    data-succes\r\n                    i18n-label=\"@@platformI18nValueHelpDialog.SuccessButton\"\r\n                    label=\"OK\"\r\n                    fdType=\"emphasized\"\r\n                ></button>\r\n                <button\r\n                    fd-button\r\n                    data-dismiss-dialog\r\n                    fd-dialog-decisive-button\r\n                    i18n-label=\"@@platformI18nValueHelpDialog.CancelButton\"\r\n                    label=\"Cancel\"\r\n                    fdType=\"transparent\"\r\n                ></button>\r\n            </div>\r\n        </ng-template>\r\n    </fd-dialog-footer>\r\n</fd-dialog>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$3.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiUlvFormMultiSelectUiComponent, decorators: [{
             type: Component,
@@ -9233,7 +9364,7 @@ class LayoutActionsComponent extends FormToolbarBaseComponent {
         this.hasButtons.set(workflowButtons?.length > 0 || buttons?.length > 0);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LayoutActionsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LayoutActionsComponent, isStandalone: false, selector: "bsu-layout-actions", inputs: { workflowButtons: "workflowButtons", workflowButtonsComboMode: "workflowButtonsComboMode", canSend: "canSend", simple: "simple", footerDesign: "footerDesign" }, outputs: { workflowChoiceSelect: "workflowChoiceSelect" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"simple ? buttonsMode : defaultTemplate\"> </ng-container>\r\n<ng-template #defaultTemplate>\r\n    @if (visible) { @if (hasButtons()) {\r\n    <div fd-bar [barDesign]=\"footerDesign ? footerDesign : 'footer'\" [inPage]=\"false\">\r\n        @if (canSend && false) {\r\n        <div fd-bar-left>\r\n            <fd-bar-element class=\"forward\">\r\n                <fd-popover\r\n                    [focusTrapped]=\"true\"\r\n                    [focusAutoCapture]=\"true\"\r\n                    [closeOnOutsideClick]=\"false\"\r\n                    [scrollStrategy]=\"repositionScrollStrategy\"\r\n                    #forwardPopover\r\n                >\r\n                    <fd-popover-control class=\"forward\">\r\n                        <button fd-button [fdType]=\"'standard'\" [label]=\"'Forward' | bbbTranslate\"></button>\r\n                    </fd-popover-control>\r\n                    <fd-popover-body style=\"min-width: 30vw; max-width: 30vw; min-height: 30vh\">\r\n                        <div fd-popover-body-header>\r\n                            <div fd-bar barDesign=\"header\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-bar-element\r\n                                        ><button\r\n                                            fd-button\r\n                                            (click)=\"forwardPopover.close()\"\r\n                                            [fdType]=\"'transparent'\"\r\n                                            [glyph]=\"'decline'\"\r\n                                        ></button>\r\n                                    </fd-bar-element>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>\u0627\u0631\u062C\u0627\u0639 \u0641\u0631\u0645 \u0628\u0647 \u0634\u062E\u0635 \u062F\u06CC\u06AF\u0631 </fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <bnrc-form-new\r\n                            class=\"form-erja\"\r\n                            [settings]=\"{\r\n                                MetaTypeDef: { Id: '', $Caption: '' },\r\n                                MetaView: { Id: '', $Caption: '' },\r\n                                DisableGenerateId: true\r\n                            }\"\r\n                        ></bnrc-form-new>\r\n                        <div fd-popover-body-footer>\r\n                            <div fd-bar barDesign=\"footer\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-button-bar [label]=\"'Send' | bbbTranslate\" fdType=\"emphasized\"></fd-button-bar>\r\n                                    <fd-button-bar\r\n                                        [label]=\"'Cancel' | bbbTranslate\"\r\n                                        [fdType]=\"'transparent'\"\r\n                                        (click)=\"forwardPopover.close()\"\r\n                                    ></fd-button-bar>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </fd-popover-body>\r\n                </fd-popover>\r\n            </fd-bar-element>\r\n        </div>\r\n        }\r\n        <div fd-bar-right>\r\n            @if (workflowButtonsComboMode && workflowButtons.length) { @if(workflowButtons.length === 1){\r\n            <fd-button-bar\r\n                [fdType]=\"'emphasized'\"\r\n                [label]=\"workflowButtons[0].text | bbbTranslate\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onWorkflowButtonSelected(workflowButtons[0]); onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } @else{\r\n            <button\r\n                fd-button\r\n                [fdMenu]=\"true\"\r\n                fdType=\"emphasized\"\r\n                [label]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [ariaLabel]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [fdMenuTrigger]=\"menu\"\r\n            ></button>\r\n            <fd-menu #menu>\r\n                @for (btn of workflowButtons; track btn) {\r\n                <li fd-menu-item (click)=\"menu.close(); onWorkflowButtonSelected(btn)\">\r\n                    <div fd-menu-interactive>\r\n                        <span fd-menu-title>{{ btn.text }}</span>\r\n                    </div>\r\n                </li>\r\n                }\r\n            </fd-menu>\r\n            <fd-button-bar\r\n                [fdType]=\"'positive'\"\r\n                [label]=\"'Send' | bbbTranslate\"\r\n                [disabled]=\"!selectedWorkflowButton\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } }@for (btn of buttons; track btn; let i = $index) { @if (btn.Data?.CustomUi?.Selector) {\r\n            <bnrc-dynamic-form-toolbaritem\r\n                class=\"fd-bar__element\"\r\n                [component]=\"btn.Data.CustomUi\"\r\n                [context]=\"btn\"\r\n                [isEnable]=\"btn.Command?._isEnable\"\r\n                (btnClick)=\"onToolClick(btn)\"\r\n            ></bnrc-dynamic-form-toolbaritem>\r\n            } @if (btn !== '-' && !btn.Data?.CustomUi?.Selector) {\r\n            <fd-button-bar\r\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                [label]=\"btn.text | bbbTranslate\"\r\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                (click)=\"onToolClick(btn)\"\r\n            ></fd-button-bar>\r\n            } }\r\n        </div>\r\n    </div>\r\n    } } \r\n</ng-template>\r\n<ng-template #buttonsMode>\r\n    @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\r\n    <fd-button-bar\r\n        [attr.workflowButton]=\"true\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n        (click)=\"onToolClick(btn)\"\r\n    ></fd-button-bar>\r\n    } }\r\n</ng-template>\r\n", styles: [":host[rtl=true] fd-split-button{margin-left:.5rem}:host[rtl=false] fd-split-button{margin-right:.5rem}.forward button{min-width:6rem}.form-erja{padding-top:1rem;padding-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormNewComponent, selector: "bnrc-form-new", inputs: ["settings"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LayoutActionsComponent, isStandalone: false, selector: "bsu-layout-actions", inputs: { workflowButtons: "workflowButtons", workflowButtonsComboMode: "workflowButtonsComboMode", canSend: "canSend", simple: "simple", footerDesign: "footerDesign" }, outputs: { workflowChoiceSelect: "workflowChoiceSelect" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"simple ? buttonsMode : defaultTemplate\"> </ng-container>\r\n<ng-template #defaultTemplate>\r\n    @if (visible) { @if (hasButtons()) {\r\n    <div fd-bar [barDesign]=\"footerDesign ? footerDesign : 'footer'\" [inPage]=\"false\">\r\n        @if (canSend && false) {\r\n        <div fd-bar-left>\r\n            <fd-bar-element class=\"forward\">\r\n                <fd-popover\r\n                    [focusTrapped]=\"true\"\r\n                    [focusAutoCapture]=\"true\"\r\n                    [closeOnOutsideClick]=\"false\"\r\n                    [scrollStrategy]=\"repositionScrollStrategy\"\r\n                    #forwardPopover\r\n                >\r\n                    <fd-popover-control class=\"forward\">\r\n                        <button fd-button [fdType]=\"'standard'\" [label]=\"'Forward' | bbbTranslate\"></button>\r\n                    </fd-popover-control>\r\n                    <fd-popover-body style=\"min-width: 30vw; max-width: 30vw; min-height: 30vh\">\r\n                        <div fd-popover-body-header>\r\n                            <div fd-bar barDesign=\"header\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-bar-element\r\n                                        ><button\r\n                                            fd-button\r\n                                            (click)=\"forwardPopover.close()\"\r\n                                            [fdType]=\"'transparent'\"\r\n                                            [glyph]=\"'decline'\"\r\n                                        ></button>\r\n                                    </fd-bar-element>\r\n                                    <div fd-bar-left>\r\n                                        <fd-bar-element>\u0627\u0631\u062C\u0627\u0639 \u0641\u0631\u0645 \u0628\u0647 \u0634\u062E\u0635 \u062F\u06CC\u06AF\u0631 </fd-bar-element>\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <bnrc-form-new\r\n                            class=\"form-erja\"\r\n                            [settings]=\"{\r\n                                MetaTypeDef: { Id: '', $Caption: '' },\r\n                                MetaView: { Id: '', $Caption: '' },\r\n                                DisableGenerateId: true\r\n                            }\"\r\n                        ></bnrc-form-new>\r\n                        <div fd-popover-body-footer>\r\n                            <div fd-bar barDesign=\"footer\" [cozy]=\"true\">\r\n                                <div fd-bar-right>\r\n                                    <fd-button-bar [label]=\"'Send' | bbbTranslate\" fdType=\"emphasized\"></fd-button-bar>\r\n                                    <fd-button-bar\r\n                                        [label]=\"'Cancel' | bbbTranslate\"\r\n                                        [fdType]=\"'transparent'\"\r\n                                        (click)=\"forwardPopover.close()\"\r\n                                    ></fd-button-bar>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                    </fd-popover-body>\r\n                </fd-popover>\r\n            </fd-bar-element>\r\n        </div>\r\n        }\r\n        <div fd-bar-right>\r\n            @if (workflowButtonsComboMode && workflowButtons.length) { @if(workflowButtons.length === 1){\r\n            <fd-button-bar\r\n                [fdType]=\"'emphasized'\"\r\n                [label]=\"workflowButtons[0].text | bbbTranslate\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onWorkflowButtonSelected(workflowButtons[0]); onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } @else{\r\n            <button\r\n                fd-button\r\n                [fdMenu]=\"true\"\r\n                fdType=\"emphasized\"\r\n                [label]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [ariaLabel]=\"selectedWorkflowButton?.text || 'Select' | bbbTranslate\"\r\n                [fdMenuTrigger]=\"menu\"\r\n            ></button>\r\n            <fd-menu #menu>\r\n                @for (btn of workflowButtons; track btn) {\r\n                <li fd-menu-item (click)=\"menu.close(); onWorkflowButtonSelected(btn)\">\r\n                    <div fd-menu-interactive>\r\n                        <span fd-menu-title>{{ btn.text }}</span>\r\n                    </div>\r\n                </li>\r\n                }\r\n            </fd-menu>\r\n            <fd-button-bar\r\n                [fdType]=\"'positive'\"\r\n                [label]=\"'Send' | bbbTranslate\"\r\n                [disabled]=\"!selectedWorkflowButton\"\r\n                [glyph]=\"'accept'\"\r\n                (click)=\"onAcceptWorkflow()\"\r\n            ></fd-button-bar>\r\n            } }@for (btn of buttons; track btn; let i = $index) { @if (btn.Data?.CustomUi?.Selector) {\r\n            <bnrc-dynamic-form-toolbaritem\r\n                class=\"fd-bar__element\"\r\n                [component]=\"btn.Data.CustomUi\"\r\n                [context]=\"btn\"\r\n                [isEnable]=\"btn.Command?._isEnable\"\r\n                (btnClick)=\"onToolClick(btn)\"\r\n            ></bnrc-dynamic-form-toolbaritem>\r\n            } @if (btn !== '-' && !btn.Data?.CustomUi?.Selector) {\r\n            <fd-button-bar\r\n                [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n                [label]=\"btn.text | bbbTranslate\"\r\n                [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n                (click)=\"onToolClick(btn)\"\r\n            ></fd-button-bar>\r\n            } }\r\n        </div>\r\n    </div>\r\n    } } \r\n</ng-template>\r\n<ng-template #buttonsMode>\r\n    @for (btn of workflowButtons; track btn; let i = $index) { @if (btn !== '-') {\r\n    <fd-button-bar\r\n        [attr.workflowButton]=\"true\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n        (click)=\"onToolClick(btn)\"\r\n    ></fd-button-bar>\r\n    } }\r\n</ng-template>\r\n", styles: [":host[rtl=true] fd-split-button{margin-left:.5rem}:host[rtl=false] fd-split-button{margin-right:.5rem}.forward button{min-width:6rem}.form-erja{padding-top:1rem;padding-bottom:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormNewComponent, selector: "bnrc-form-new", inputs: ["settings"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$3.PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "directive", type: i7$3.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LayoutActionsComponent, decorators: [{
             type: Component,
@@ -9334,7 +9465,7 @@ class FormToolbarComponent extends FormToolbarBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormToolbarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormToolbarComponent, isStandalone: false, selector: "bsu-form-toolbar", outputs: { toolbarClick: "toolbarClick" }, viewQueries: [{ propertyName: "_tlbCmp", first: true, predicate: ["formToolbar"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-toolbar\r\n    #formToolbar\r\n    fdType=\"transparent\"\r\n    [clearBorder]=\"true\"\r\n    [shouldOverflow]=\"deviceSize === 's' || shouldOverflow\"\r\n    [style.width]=\"width\"\r\n    [class.firefox]=\"isFirefox\"\r\n>\r\n    @for (btn of buttons; track btn; let i = $index; let last = $last; let first = $first) { @if ((btn === '-' ||\r\n    btn.text === '-') && !last && !first && deviceSize !== 's') {\r\n    <fd-toolbar-separator [attr.i]=\"i\" [attr.last]=\"last\" [attr.first]=\"first\"></fd-toolbar-separator>\r\n    } @if (btn.IAmMenu) { @if (btn.isBuiltin) {\r\n    <fd-split-button\r\n        [dir]=\"dirValue === 'rtl' ? 'rtl' : 'ltr'\"\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"'low'\"\r\n        [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        (primaryButtonClicked)=\"btn.isBuiltin && onToolbarClick(btn)\"\r\n        (click)=\"menu2.open()\"\r\n    >\r\n        <fd-menu #menu2>\r\n            @for (menuItem of btn.menu.items; track menuItem) {\r\n            <li fd-menu-item [disabled]=\"menuItem.disabled\" (click)=\"onToolbarClick(menuItem, menu2)\">\r\n                <div fd-menu-interactive>\r\n                    <fd-menu-addon\r\n                        position=\"before\"\r\n                        [glyph]=\"menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\"\r\n                    >\r\n                    </fd-menu-addon>\r\n                    @if (!menuItem.newIcon && menuItem.icon) {\r\n                    <img class=\"mr8\" [src]=\"menuItem.icon\" />\r\n                    }\r\n                    <span fd-menu-title>{{ menuItem.text }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </fd-split-button>\r\n    } @if (!btn.isBuiltin) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdMenu]=\"true\"\r\n        [attr.text]=\"btn.text\"\r\n        [attr.itemId]=\"btn.itemId\"\r\n        [attr.name]=\"btn.name\"\r\n        [glyph]=\"btn.FontIcon\"\r\n        [style.color]=\"btn.IconColor\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [ariaLabel]=\"btn.text | bbbTranslate\"\r\n        [fdMenuTrigger]=\"menu\"\r\n    >\r\n        @if (!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon) {\r\n        <img width=\"16\" [src]=\"btn.icon\" />\r\n        }\r\n        <fd-menu #menu>\r\n            @for (menuItem of btn.menu.items; track menuItem) {\r\n            <li fd-menu-item [disabled]=\"menuItem.disabled\" (click)=\"onToolbarClick(menuItem, menu)\">\r\n                <div fd-menu-interactive>\r\n                    @if ( menuItem.newIcon || menuItem.Data?.JsonExtraProp?.Icon || menuItem.FontIcon ||\r\n                    menuItem.Data?.CustomUi?.Parameters?.Icon ) {\r\n                    <fd-menu-addon\r\n                        position=\"before\"\r\n                        [ngClass]=\"\r\n                            menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\r\n                                ? 'fd-button--' + menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\r\n                                : ''\r\n                        \"\r\n                        [style.color]=\"menuItem.IconColor\"\r\n                        [attr.name]=\"menuItem.name\"\r\n                        [attr.itemId]=\"menuItem.itemId\" \r\n                        [attr.text]=\"menuItem.text\"\r\n                        [glyph]=\"\r\n                            menuItem.newIcon ||\r\n                            menuItem.Data?.JsonExtraProp?.Icon ||\r\n                            menuItem.FontIcon ||\r\n                            menuItem.Data?.CustomUi?.Parameters?.Icon\r\n                        \"\r\n                    >\r\n                    </fd-menu-addon>\r\n                    } @if ( !( menuItem.newIcon || menuItem.Data?.JsonExtraProp?.Icon ||\r\n                    menuItem.Data?.CustomUi?.Parameters?.Icon || menuItem.FontIcon ) && menuItem.icon ) {\r\n                    <img class=\"mr8\" [src]=\"menuItem.icon\" />\r\n                    }\r\n                    <span fd-menu-title>{{ menuItem.text }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </button>\r\n    } } @else { @if (!(btn === '-' || btn.text === '-')) {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate; context: { $implicit: btn }\"\r\n    ></ng-container>\r\n    <ng-template #btnTemplate let-btn>\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [disabled]=\"btn.disabled\"\r\n            [attr.text]=\"btn.text\"\r\n            [attr.itemId]=\"btn.itemId\"\r\n            [attr.name]=\"btn.name\"\r\n            [attr.fdOverflowPriority]=\"btn.priority\"\r\n            [fdType]=\"btn.isWorkflow ? 'positive' : btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n            [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n            (click)=\"onToolbarClick(btn)\"\r\n        >\r\n            @if (!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon) {\r\n            <img width=\"16\" [src]=\"btn.icon\" />\r\n            } @if (btn.text) {\r\n            <span>{{ btn.text }}</span>\r\n            }\r\n        </button>\r\n    </ng-template>\r\n    <ng-template #dynamicBtnTemplate let-btn>\r\n        <bnrc-dynamic-form-toolbaritem\r\n            fd-toolbar-item\r\n            [attr.text]=\"btn.text\"\r\n            [attr.itemId]=\"btn.itemId\"\r\n            [attr.name]=\"btn.name\"\r\n            [component]=\"btn.Data.CustomUi\"\r\n            [context]=\"btn\"\r\n            [isEnable]=\"btn.Command?._isEnable\"\r\n            (btnClick)=\"onToolbarClick(btn)\"\r\n        ></bnrc-dynamic-form-toolbaritem>\r\n    </ng-template>\r\n    } } }\r\n</fd-toolbar>\r\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i5$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "directive", type: i2$7.ɵɵDir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormToolbarComponent, isStandalone: false, selector: "bsu-form-toolbar", outputs: { toolbarClick: "toolbarClick" }, viewQueries: [{ propertyName: "_tlbCmp", first: true, predicate: ["formToolbar"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-toolbar\r\n    #formToolbar\r\n    fdType=\"transparent\"\r\n    [clearBorder]=\"true\"\r\n    [shouldOverflow]=\"deviceSize === 's' || shouldOverflow\"\r\n    [style.width]=\"width\"\r\n    [class.firefox]=\"isFirefox\"\r\n>\r\n    @for (btn of buttons; track btn; let i = $index; let last = $last; let first = $first) { @if ((btn === '-' ||\r\n    btn.text === '-') && !last && !first && deviceSize !== 's') {\r\n    <fd-toolbar-separator [attr.i]=\"i\" [attr.last]=\"last\" [attr.first]=\"first\"></fd-toolbar-separator>\r\n    } @if (btn.IAmMenu) { @if (btn.isBuiltin) {\r\n    <fd-split-button\r\n        [dir]=\"dirValue === 'rtl' ? 'rtl' : 'ltr'\"\r\n        fd-toolbar-item\r\n        [attr.fdOverflowPriority]=\"'low'\"\r\n        [mainAction]=\"{ mainActionTitle: btn.text, keepMainAction: true }\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        (primaryButtonClicked)=\"btn.isBuiltin && onToolbarClick(btn)\"\r\n        (click)=\"menu2.open()\"\r\n    >\r\n        <fd-menu #menu2>\r\n            @for (menuItem of btn.menu.items; track menuItem) {\r\n            <li fd-menu-item [disabled]=\"menuItem.disabled\" (click)=\"onToolbarClick(menuItem, menu2)\">\r\n                <div fd-menu-interactive>\r\n                    <fd-menu-addon\r\n                        position=\"before\"\r\n                        [glyph]=\"menuItem.newIcon ? menuItem.newIcon : menuItem.Data?.JsonExtraProp?.Icon\"\r\n                    >\r\n                    </fd-menu-addon>\r\n                    @if (!menuItem.newIcon && menuItem.icon) {\r\n                    <img class=\"mr8\" [src]=\"menuItem.icon\" />\r\n                    }\r\n                    <span fd-menu-title>{{ menuItem.text }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </fd-split-button>\r\n    } @if (!btn.isBuiltin) {\r\n    <button\r\n        fd-button\r\n        fd-toolbar-item\r\n        [fdMenu]=\"true\"\r\n        [attr.text]=\"btn.text\"\r\n        [attr.itemId]=\"btn.itemId\"\r\n        [attr.name]=\"btn.name\"\r\n        [glyph]=\"btn.FontIcon\"\r\n        [style.color]=\"btn.IconColor\"\r\n        [fdType]=\"btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n        [label]=\"btn.text | bbbTranslate\"\r\n        [ariaLabel]=\"btn.text | bbbTranslate\"\r\n        [fdMenuTrigger]=\"menu\"\r\n    >\r\n        @if (!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon) {\r\n        <img width=\"16\" [src]=\"btn.icon\" />\r\n        }\r\n        <fd-menu #menu>\r\n            @for (menuItem of btn.menu.items; track menuItem) {\r\n            <li fd-menu-item [disabled]=\"menuItem.disabled\" (click)=\"onToolbarClick(menuItem, menu)\">\r\n                <div fd-menu-interactive>\r\n                    @if ( menuItem.newIcon || menuItem.Data?.JsonExtraProp?.Icon || menuItem.FontIcon ||\r\n                    menuItem.Data?.CustomUi?.Parameters?.Icon ) {\r\n                    <fd-menu-addon\r\n                        position=\"before\"\r\n                        [ngClass]=\"\r\n                            menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\r\n                                ? 'fd-button--' + menuItem.Data?.CustomUi?.Parameters?.FdType$Caption\r\n                                : ''\r\n                        \"\r\n                        [style.color]=\"menuItem.IconColor\"\r\n                        [attr.name]=\"menuItem.name\"\r\n                        [attr.itemId]=\"menuItem.itemId\" \r\n                        [attr.text]=\"menuItem.text\"\r\n                        [glyph]=\"\r\n                            menuItem.newIcon ||\r\n                            menuItem.Data?.JsonExtraProp?.Icon ||\r\n                            menuItem.FontIcon ||\r\n                            menuItem.Data?.CustomUi?.Parameters?.Icon\r\n                        \"\r\n                    >\r\n                    </fd-menu-addon>\r\n                    } @if ( !( menuItem.newIcon || menuItem.Data?.JsonExtraProp?.Icon ||\r\n                    menuItem.Data?.CustomUi?.Parameters?.Icon || menuItem.FontIcon ) && menuItem.icon ) {\r\n                    <img class=\"mr8\" [src]=\"menuItem.icon\" />\r\n                    }\r\n                    <span fd-menu-title>{{ menuItem.text }}</span>\r\n                </div>\r\n            </li>\r\n            }\r\n        </fd-menu>\r\n    </button>\r\n    } } @else { @if (!(btn === '-' || btn.text === '-')) {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate; context: { $implicit: btn }\"\r\n    ></ng-container>\r\n    <ng-template #btnTemplate let-btn>\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [disabled]=\"btn.disabled\"\r\n            [attr.text]=\"btn.text\"\r\n            [attr.itemId]=\"btn.itemId\"\r\n            [attr.name]=\"btn.name\"\r\n            [attr.fdOverflowPriority]=\"btn.priority\"\r\n            [fdType]=\"btn.isWorkflow ? 'positive' : btn.design ? btn.design : btn.Data?.JsonExtraProp?.Design\"\r\n            [glyph]=\"btn.newIcon ? btn.newIcon : btn.Data?.JsonExtraProp?.Icon\"\r\n            (click)=\"onToolbarClick(btn)\"\r\n        >\r\n            @if (!btn.Data?.JsonExtraProp?.Icon && !btn.newIcon && btn.icon) {\r\n            <img width=\"16\" [src]=\"btn.icon\" />\r\n            } @if (btn.text) {\r\n            <span>{{ btn.text }}</span>\r\n            }\r\n        </button>\r\n    </ng-template>\r\n    <ng-template #dynamicBtnTemplate let-btn>\r\n        <bnrc-dynamic-form-toolbaritem\r\n            fd-toolbar-item\r\n            [attr.text]=\"btn.text\"\r\n            [attr.itemId]=\"btn.itemId\"\r\n            [attr.name]=\"btn.name\"\r\n            [component]=\"btn.Data.CustomUi\"\r\n            [context]=\"btn\"\r\n            [isEnable]=\"btn.Command?._isEnable\"\r\n            (btnClick)=\"onToolbarClick(btn)\"\r\n        ></bnrc-dynamic-form-toolbaritem>\r\n    </ng-template>\r\n    } } }\r\n</fd-toolbar>\r\n", styles: [":host{display:contents}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i5$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$1.SplitButtonComponent, selector: "fd-split-button", inputs: ["glyph", "glyphFont", "disabled", "fdType", "expandButtonTitle", "selected", "fixedWidth", "mainAction", "arialLabel"], outputs: ["primaryButtonClicked"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i7$2.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "directive", type: i2$7.ɵɵDir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormToolbarComponent, decorators: [{
             type: Component,
@@ -9445,7 +9576,7 @@ class FundamentalDynamicFormComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FundamentalDynamicFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FundamentalDynamicFormComponent, isStandalone: false, selector: "bsu-fundamental-dynamic-form", inputs: { breadCrumbs: "breadCrumbs", toolbarVisible: "toolbarVisible", toolbarItems: "toolbarItems", layoutActions: "layoutActions", layout94: "layout94", parameters: "parameters", workflowPanelUi: "workflowPanelUi", context: "context", title: "title", subtitle: "subtitle", description: "description", facetList: "facetList", infobars: "infobars", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", hideBreadCrumb: "hideBreadCrumb", rtl: "rtl", hideFooter: "hideFooter", hideTitle: "hideTitle", hideClose: "hideClose", hidePin: "hidePin", fullscreen: "fullscreen", mask: "mask", canSend: "canSend", contentIsPage: "contentIsPage", contentDensity: "contentDensity", deviceSize: "deviceSize", dirValue: "dirValue", landscape: "landscape", standalone: "standalone", modernTabs: "modernTabs", modernTabContainerComponent: "modernTabContainerComponent", layoutGridCol: "layoutGridCol", colLg: "colLg", colXl: "colXl", colMd: "colMd", footerDesign: "footerDesign", formContentMaxWidth: "formContentMaxWidth", workflowButtons: "workflowButtons" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest", dismissInfobar: "dismissInfobar" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "_toolbarComponent", first: true, predicate: ["formToolbar"], descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }, { propertyName: "closeFormTemplate", first: true, predicate: ["closeForm"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (mask) {\r\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\r\n    <bsu-mask size=\"m\"></bsu-mask>\r\n</div>\r\n}\r\n\r\n<fd-dynamic-page\r\n    [size]=\"isMobile ? 'small' : 'large'\"\r\n    [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\r\n    [class.header-border]=\"!removeHeaderBorder\"\r\n    [attr.isMobile]=\"isMobile\"\r\n    [attr.contentIsPage]=\"contentIsPage\"\r\n    mobile\r\n    formClose\r\n    [isMobile]=\"isMobile\"\r\n>\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"!description\"\r\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\r\n        [class.notitle]=\"title.length < 2 || hideTitle\"\r\n        [class.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        [class.hide-breadcrumb]=\"hideBreadCrumb\"\r\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\r\n        [mWidthTitle]=\"title\"\r\n        #titleRef\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile || hideBreadCrumb\" *ngIf=\"breadCrumbs?.length;else noBreadcrumbs\">\r\n            <fd-breadcrumb>\r\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\r\n                trackBreadCrumb($index, breadCrumb); let i = $index; let last = $last) {\r\n              @if(i>0) { <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }}\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <ng-template #noBreadcrumbs></ng-template>\r\n        <fd-dynamic-page-global-actions>\r\n            <!-- global actions -->\r\n\r\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\r\n            <!-- added this because in mobile landscape toolbar disapper -->\r\n            @if (toolbarVisible) {\r\n            <bsu-form-toolbar\r\n                [deviceSize]=\"deviceSize\"\r\n                [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\r\n                [dirValue]=\"dirValue\"\r\n                [isFirefox]=\"isFirefox\"\r\n                (toolbarClick)=\"toolbarClick.emit($event)\"\r\n                #formToolbar\r\n            ></bsu-form-toolbar>\r\n            }\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <!-- layout actions -->\r\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\r\n            @if (!hideClose) {\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                @if (deviceSize !== 's') {\r\n                <fd-toolbar-separator></fd-toolbar-separator>\r\n                }\r\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\r\n            </fd-toolbar>\r\n            }\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n    @if (description || facetList.length > 0 || workflowInfoText || avatar || infobars?.length) {}\r\n    <fd-dynamic-page-subheader\r\n        [class.header-no-description]=\"!(description || workflowInfoText || infobars?.length)\"\r\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText && !infobars?.length)\"\r\n        [collapsible]=\"!hidePin\"\r\n        [pinnable]=\"false\"\r\n        [collapsed]=\"!facetList?.length && !workflowInfoText && !infobars?.length\"\r\n    >\r\n        @if (workflowInfoText) {\r\n        <fd-message-strip\r\n            [type]=\"'warning'\"\r\n            [dismissible]=\"false\"\r\n            [innerHtml]=\"workflowInfoText | bbbTranslate | sanitizeText\"\r\n        >\r\n        </fd-message-strip>\r\n        }\r\n        <bsu-barsa-infobars [infobars]=\"infobars\" (dismiss)=\"dismissInfobar.emit($event)\"></bsu-barsa-infobars>\r\n        <fd-facet-group ariaLabel=\"Facet Group\">\r\n            @if (avatar) {\r\n            <fd-facet type=\"image\">\r\n                <fd-avatar\r\n                    title=\"avatar\"\r\n                    [glyph]=\"avatar\"\r\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\r\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\r\n                    [transparent]=\"true\"\r\n                    [circle]=\"circleAvatar\"\r\n                ></fd-avatar>\r\n                <!-- <div\r\n                  class=\"fd-avatar fd-avatar--circle\"\r\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\r\n                  >\r\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\r\n                </div> -->\r\n            </fd-facet>\r\n            } @for (facet of facetList; track facet) {\r\n            <fd-facet\r\n                [type]=\"facet.type\"\r\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\r\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\r\n            >\r\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\r\n                <fd-facet-content>\r\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title | bbbTranslate }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue | bbbTranslate\" id=\"form-value-10\"></fd-text>\r\n                </fd-facet-content>\r\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\r\n                <span\r\n                    fd-object-status\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue | bbbTranslate)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue | bbbTranslate\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue | bbbTranslate\"\r\n                    [glyph]=\"facet.mo.Icon\"\r\n                >\r\n                </span>\r\n                } @else {\r\n                <bnrc-dynamic-component\r\n                    [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\r\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\r\n                    [component]=\"facet.mo.Component\"\r\n                    [value]=\"facet.mo.Text | bbbTranslate\"\r\n                ></bnrc-dynamic-component>\r\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\r\n                <fd-object-number\r\n                    [number]=\"facet.mo.Text | facetValue\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [unit]=\"facet.mo.Unit | facetValue | bbbTranslate\"\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\r\n                ></fd-object-number>\r\n                } @if (facet.type === 'plain-text') {\r\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\r\n                    <fd-text [text]=\"facet.mo.Text | facetValue | bbbTranslate\" hyphenation=\"auto\"></fd-text>\r\n                </div>\r\n                } @if (facet.type === 'rating-indicator') {\r\n                <fd-facet-content>\r\n                    <fd-rating-indicator\r\n                        style=\"pointer-events: none\"\r\n                        size=\"md\"\r\n                        [dynamicTextIndicator]=\"facet.mo.Footer | bbbTranslate\"\r\n                        [displayMode]=\"true\"\r\n                        [value]=\"facet.mo | facetValue: facet.type\"\r\n                    ></fd-rating-indicator>\r\n                </fd-facet-content>\r\n                } @if (facet.type === 'progress') {\r\n                <div [style.width]=\"'10rem'\">\r\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\r\n                    <fd-progress-indicator\r\n                        class=\"facet-progress\"\r\n                        style=\"width: 10r em\"\r\n                        [state]=\"facet.mo.State\"\r\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647' | bbbTranslate\"\r\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\r\n                        [valueMax]=\"10\"\r\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\r\n                    ></fd-progress-indicator>\r\n                    <!-- <ui5-progress-indicator\r\n                    style=\"width: 10rem\"\r\n                    [valueState]=\"facet.mo.State\"\r\n                    [value]=\"getNumber(facet.mo.Value)\"\r\n                  ></ui5-progress-indicator> -->\r\n                </div>\r\n                } @if (facet.type === 'microcharts') {\r\n                <div>\r\n                    <label wrap>in progress ...</label>\r\n                </div>\r\n                }\r\n            </fd-facet>\r\n            }\r\n        </fd-facet-group>\r\n        @if (description) {\r\n        <span>{{ description | bbbTranslate }}</span>\r\n        }\r\n    </fd-dynamic-page-subheader>\r\n    @if((!modernTabs.length && !contentIsPage) || (modernTabs.length && !contentIsPage && parameters?.LayoutComponent))\r\n    {\r\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\r\n        <fd-layout-grid class=\"!tw-p-0\" style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\r\n            <div fdLayoutGridRow class=\"!tw-p-0\">\r\n                <div\r\n                    class=\"!tw-p-0\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\r\n                    [class.hide]=\"disableGrid\"\r\n                    [fdLayoutGridCol]=\"0\"\r\n                    [colMd]=\"layout1.colMd\"\r\n                    [colLg]=\"layout1.colLg\"\r\n                    [colXl]=\"layout1.colXl\"\r\n                ></div>\r\n                <div class=\"!tw-p-0\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\r\n                            context: {\r\n                                $implicit: parameters?.LayoutComponent,\r\n                                layout94: layout94\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </div>\r\n                <div\r\n                    class=\"!tw-p-0\"\r\n                    [class.hide]=\"disableGrid\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\r\n                    [fdLayoutGridCol]=\"0\"\r\n                    [colMd]=\"layout2.colMd\"\r\n                    [colLg]=\"layout2.colLg\"\r\n                    [colXl]=\"layout2.colXl\"\r\n                ></div>\r\n            </div>\r\n        </fd-layout-grid>\r\n    </fd-dynamic-page-content>\r\n    } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\r\n    <fdp-icon-tab-bar\r\n        [stackContent]=\"false\"\r\n        [collapseOverflow]=\"true\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        [iconTabType]=\"modernTabContainerComponent?.Settings?.TabType.$Caption || 'text'\"\r\n        [layoutMode]=\"modernTabContainerComponent?.Settings?.LayoutMode$Caption\"\r\n    >\r\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\r\n        <fdp-icon-tab-bar-tab\r\n            [id]=\"tab.id\"\r\n            [label]=\"tab.Title!! | bbbTranslate\"\r\n            [title]=\"tab.Title!! | bbbTranslate\"\r\n            [color]=\"tab.SemanticColor?.$Caption\"\r\n            [icon]=\"tab.FontIcon\"\r\n            [iconFont]=\"tab.IconFontName?.$Caption\"\r\n            [counter]=\"tab.CustomUi?.Settings?.CounterValue\"\r\n            [class.is-expanded]=\"selectedTab === tab.Title\"\r\n            #tablist\r\n        >\r\n            <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\r\n                <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\" class=\"!tw-p-0\">\r\n                    <div fdLayoutGridRow>\r\n                        <div\r\n                            class=\"!tw-p-0\"\r\n                            [fdLayoutGridCol]=\"0\"\r\n                            [colMd]=\"layout1.colMd\"\r\n                            [colLg]=\"layout1.colLg\"\r\n                            [colXl]=\"layout1.colXl\"\r\n                            [class.hide]=\"disableGrid\"\r\n                        ></div>\r\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\" class=\"!tw-p-0\">\r\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\r\n                        </div>\r\n                        <div\r\n                            class=\"!tw-p-0\"\r\n                            [fdLayoutGridCol]=\"0\"\r\n                            [colMd]=\"layout2.colMd\"\r\n                            [colLg]=\"layout2.colLg\"\r\n                            [colXl]=\"layout2.colXl\"\r\n                            [class.hide]=\"disableGrid\"\r\n                        ></div>\r\n                    </div>\r\n                </fd-layout-grid>\r\n            </fd-dynamic-page-content>\r\n        </fdp-icon-tab-bar-tab>\r\n        }\r\n    </fdp-icon-tab-bar>\r\n    } @if(!hideFooter && hasLayoutButtons || (workflowButtons.length && isMobile)){\r\n    <fd-dynamic-page-footer>\r\n        <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\r\n    </fd-dynamic-page-footer>\r\n    }\r\n</fd-dynamic-page>\r\n@if (contentIsPage) {\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderLayoutComponent;\r\n        context: {\r\n            $implicit: parameters?.LayoutComponent,\r\n            layout94: layout94\r\n        }\r\n    \"\r\n></ng-container>\r\n}\r\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\r\n    <bsu-ly-layout-container-of-root\r\n        [config]=\"layout94\"\r\n        [isPanel]=\"false\"\r\n        [isRoot]=\"true\"\r\n    ></bsu-ly-layout-container-of-root>\r\n</ng-template>\r\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\r\n    <bnrc-dynamic-form-component\r\n        [component]=\"component\"\r\n        [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\r\n        [removeContentPadding]=\"removeContentPadding\"\r\n        [breadCrumbs]=\"breadCrumbs\"\r\n        [description]=\"description\"\r\n        [title]=\"title\"\r\n        [subtitle]=\"subtitle\"\r\n        [toolbarItems]=\"toolbarItems\"\r\n        [layoutActions]=\"layoutActions\"\r\n        [footerDesign]=\"footerDesign\"\r\n        [facetList]=\"facetList\"\r\n        [settings]=\"component.Settings\"\r\n        [workflowButtons]=\"workflowButtons\"\r\n        [workflowPanelUi]=\"workflowPanelUi\"\r\n        [isMobile]=\"isMobile\"\r\n        [mo]=\"mo\"\r\n        [layout94]=\"layout94\"\r\n        [context]=\"context\"\r\n        [rtl]=\"rtl\"\r\n        [fieldDict]=\"fieldDict\"\r\n        [mask]=\"mask\"\r\n        [dirValue]=\"dirValue\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [modernTabs]=\"modernTabs\"\r\n        [avatar]=\"avatar\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-dynamic-form-component>\r\n</ng-template>\r\n<ng-template #closeForm>\r\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\r\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n    </button>\r\n</ng-template>\r\n<ng-template #fullscreenForm>\r\n    @if (canFullscreen) {\r\n    <button\r\n        fd-button\r\n        fdType=\"transparent\"\r\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\r\n        (click)=\"fullscreenRequest.emit()\"\r\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\r\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\r\n    ></button>\r\n    }\r\n</ng-template>\r\n<ng-template #layoutActionsTemplateRef>\r\n    <bsu-layout-actions\r\n        [canSend]=\"canSend\"\r\n        [buttons]=\"isMobile && hideFooter ? [] : layoutActions\"\r\n        [isMobile]=\"isMobile\"\r\n        [landscape]=\"landscape\"\r\n        [standalone]=\"standalone\"\r\n        [footerDesign]=\"footerDesign\"\r\n        [workflowButtons]=\"workflowButtons\"\r\n        [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [rtl]=\"rtl\"\r\n        (toolClick)=\"toolbarClick.emit($event)\"\r\n        (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\r\n    >\r\n    </bsu-layout-actions>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto;width:100%}:host>fd-dynamic-page[contentispage=false]:not([ismobile=true]) ::ng-deep fd-dynamic-page-header .fd-dynamic-page__title{max-width:50svw}:host ::ng-deep .fd-facet .fd-title{font-family:B-Font Medium}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important;min-height:auto!important}:host ::ng-deep .facet-progress .fd-progress-indicator__container,:host ::ng-deep .facet-progress .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}.no-toolbar-items ::ng-deep .fd-dynamic-page__toolbar-container{width:auto}fd-dynamic-page[ismobile=true] fd-dynamic-page-header.notitle ::ng-deep .fd-dynamic-page__title{width:auto}fd-dynamic-page[ismobile=true] fd-dynamic-page-header.notitle ::ng-deep>article{height:calc(100svh - var(--shellbar-height) - env(safe-area-inset-bottom) - constant(safe-area-inset-bottom))!important}fd-dynamic-page ::ng-deep>article{min-height:calc(100svh - var(--shellbar-height))}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%;overflow:hidden}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded bsu-ly-layout-container-of-root{min-height:100%}fd-dynamic-page ::ng-deep>article>.fd-scrollbar{height:inherit}fd-dynamic-page fd-dynamic-page-content.limit-content-width{display:flex;justify-content:center}fd-facet{display:flex;flex-direction:column}.hide-title ::ng-deep .fd-dynamic-page__title-container{display:none!important}.hide-title.hide-breadcrumb{display:none}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container{display:none!important}fd-toolbar.firefox ::ng-deep .fd-toolbar{flex-direction:row-reverse}fd-toolbar.firefox ::ng-deep .fd-toolbar>:first-child{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.DynamicFormComponent, selector: "bnrc-dynamic-form-component", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layoutActionsTemplateRef", "workflowButtons", "layout94", "footerDesign", "settings", "workflowPanelUi", "title", "subtitle", "description", "facetList", "removeHeaderBorder", "removeContentPadding", "isMobile", "avatar", "rtl", "mask", "mo", "contentDensity", "deviceSize", "dirValue", "fieldDict", "modernTabs"] }, { kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "value"], outputs: ["events"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i2.MeasureFormTitleWidthDirective, selector: "[mWidthTitle]", inputs: ["mWidthTitle", "enableMobile"] }, { kind: "directive", type: i3$1.ɵɵCdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i4$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i8$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i8$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i8$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i8$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i8$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i8$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i8$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i8$1.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i8$2.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i8$2.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i8$2.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i10.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i10.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i10.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i2$8.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "ariaLabelledBy", "dismissBtnTitle", "noIcon", "type", "id", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i5$6.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i14.RatingIndicatorComponent, selector: "fd-rating-indicator", inputs: ["class", "name", "ariaLabel", "ariaLabelledBy", "disabled", "displayMode", "nonInteractive", "indicatorCapacity", "allowHalves", "value", "totalRatings", "ratingAverage", "ratings", "displayAllRatings", "ratedIcon", "unratedIcon", "size", "dynamicTextIndicator"], outputs: ["ratingChanged"] }, { kind: "component", type: i5$3.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i12$1.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "component", type: BarsaInfobarsComponent, selector: "bsu-barsa-infobars", inputs: ["infobars"], outputs: ["dismiss"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.SanitizeTextPipe, name: "sanitizeText" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FundamentalDynamicFormComponent, isStandalone: false, selector: "bsu-fundamental-dynamic-form", inputs: { breadCrumbs: "breadCrumbs", toolbarVisible: "toolbarVisible", toolbarItems: "toolbarItems", layoutActions: "layoutActions", layout94: "layout94", parameters: "parameters", workflowPanelUi: "workflowPanelUi", context: "context", title: "title", subtitle: "subtitle", description: "description", facetList: "facetList", infobars: "infobars", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", hideBreadCrumb: "hideBreadCrumb", rtl: "rtl", hideFooter: "hideFooter", hideTitle: "hideTitle", hideClose: "hideClose", hidePin: "hidePin", fullscreen: "fullscreen", mask: "mask", canSend: "canSend", contentIsPage: "contentIsPage", contentDensity: "contentDensity", deviceSize: "deviceSize", dirValue: "dirValue", landscape: "landscape", standalone: "standalone", modernTabs: "modernTabs", modernTabContainerComponent: "modernTabContainerComponent", layoutGridCol: "layoutGridCol", colLg: "colLg", colXl: "colXl", colMd: "colMd", footerDesign: "footerDesign", formContentMaxWidth: "formContentMaxWidth", workflowButtons: "workflowButtons" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest", dismissInfobar: "dismissInfobar" }, viewQueries: [{ propertyName: "_dynamicPageComponent", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "_toolbarComponent", first: true, predicate: ["formToolbar"], descendants: true }, { propertyName: "titleRef", first: true, predicate: ["titleRef"], descendants: true, read: ViewContainerRef }, { propertyName: "headerAvatarRef", first: true, predicate: ["headerAvatar"], descendants: true }, { propertyName: "closeFormTemplate", first: true, predicate: ["closeForm"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if (mask) {\r\n<div style=\"position: absolute; top: 0; left: 0; width: 100%; height: 100%\">\r\n    <bsu-mask size=\"m\"></bsu-mask>\r\n</div>\r\n}\r\n\r\n<fd-dynamic-page\r\n    [size]=\"isMobile ? 'small' : 'large'\"\r\n    [ngClass]=\"{ 'floating-footer': footerDesign === 'floating-footer' }\"\r\n    [class.header-border]=\"!removeHeaderBorder\"\r\n    [attr.isMobile]=\"isMobile\"\r\n    [attr.contentIsPage]=\"contentIsPage\"\r\n    mobile\r\n    formClose\r\n    [isMobile]=\"isMobile\"\r\n>\r\n    <fd-dynamic-page-header\r\n        [class.simple-title]=\"!description\"\r\n        [title]=\"(hideTitle === true ? '' : title) | bbbTranslate\"\r\n        [class.notitle]=\"title.length < 2 || hideTitle\"\r\n        [class.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        [class.hide-breadcrumb]=\"hideBreadCrumb\"\r\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\r\n        [mWidthTitle]=\"title\"\r\n        #titleRef\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile || hideBreadCrumb\" *ngIf=\"breadCrumbs?.length;else noBreadcrumbs\">\r\n            <fd-breadcrumb>\r\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\r\n                trackBreadCrumb($index, breadCrumb); let i = $index; let last = $last) {\r\n              @if(i>0) { <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }}\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <ng-template #noBreadcrumbs></ng-template>\r\n        <fd-dynamic-page-global-actions>\r\n            <!-- global actions -->\r\n\r\n            <fd-toolbar [shouldOverflow]=\"true\" Style=\"display:none\"> </fd-toolbar>\r\n            <!-- added this because in mobile landscape toolbar disapper -->\r\n            @if (toolbarVisible) {\r\n            <bsu-form-toolbar\r\n                [deviceSize]=\"deviceSize\"\r\n                [buttons]=\"toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter\"\r\n                [dirValue]=\"dirValue\"\r\n                [isFirefox]=\"isFirefox\"\r\n                (toolbarClick)=\"toolbarClick.emit($event)\"\r\n                #formToolbar\r\n            ></bsu-form-toolbar>\r\n            }\r\n        </fd-dynamic-page-global-actions>\r\n        <fd-dynamic-page-layout-actions>\r\n            <!-- layout actions -->\r\n            <!-- <div [formActions]=\"this.toolbar\"></div> -->\r\n            @if (!hideClose) {\r\n            <fd-toolbar fdType=\"transparent\" [clearBorder]=\"true\">\r\n                @if (deviceSize !== 's') {\r\n                <fd-toolbar-separator></fd-toolbar-separator>\r\n                }\r\n                <ng-container *ngTemplateOutlet=\"fullscreenForm\"></ng-container>\r\n                <ng-container *ngTemplateOutlet=\"closeForm\"></ng-container>\r\n            </fd-toolbar>\r\n            }\r\n        </fd-dynamic-page-layout-actions>\r\n    </fd-dynamic-page-header>\r\n    @if (description || facetList.length > 0 || workflowInfoText || avatar || infobars?.length) {}\r\n    <fd-dynamic-page-subheader\r\n        [class.header-no-description]=\"!(description || workflowInfoText || infobars?.length)\"\r\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText && !infobars?.length)\"\r\n        [collapsible]=\"!hidePin\"\r\n        [pinnable]=\"false\"\r\n        [collapsed]=\"!facetList?.length && !workflowInfoText && !infobars?.length\"\r\n    >\r\n        @if (workflowInfoText) {\r\n        <fd-message-strip\r\n            [type]=\"'warning'\"\r\n            [dismissible]=\"false\"\r\n            [innerHtml]=\"workflowInfoText | bbbTranslate | sanitizeText\"\r\n        >\r\n        </fd-message-strip>\r\n        }\r\n        <bsu-barsa-infobars [infobars]=\"infobars\" (dismiss)=\"dismissInfobar.emit($event)\"></bsu-barsa-infobars>\r\n        <fd-facet-group ariaLabel=\"Facet Group\">\r\n            @if (avatar) {\r\n            <fd-facet type=\"image\">\r\n                <fd-avatar\r\n                    title=\"avatar\"\r\n                    [glyph]=\"avatar\"\r\n                    [image]=\"!avatar?.FileId ? null : (avatar?.FileId | picFieldSrc: 'ID':null)\"\r\n                    [size]=\"deviceSize === 'xl' ? 'l' : deviceSize\"\r\n                    [transparent]=\"true\"\r\n                    [circle]=\"circleAvatar\"\r\n                ></fd-avatar>\r\n                <!-- <div\r\n                  class=\"fd-avatar fd-avatar--circle\"\r\n                  [class]=\"'fd-avatar--' + (deviceSize === 'xl' ? 'l' : deviceSize)\"\r\n                  >\r\n                  <i *ngIf=\"avatar\" class=\"fd-avatar__icon\" [class]=\"avatar | sapFontClass\" role=\"presentation\"> </i>\r\n                </div> -->\r\n            </fd-facet>\r\n            } @for (facet of facetList; track facet) {\r\n            <fd-facet\r\n                [type]=\"facet.type\"\r\n                [facetTitle]=\"facet.mo.Title | bbbTranslate\"\r\n                [subtitle]=\"facet.mo.SubTitle | facetValue | bbbTranslate\"\r\n            >\r\n                @for (item of facet.mo.ItemList?.MoDataList; track item) {\r\n                <fd-facet-content>\r\n                    <label fd-form-label [colon]=\"true\" for=\"form-value-10\">{{ item.Title | bbbTranslate }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue | bbbTranslate\" id=\"form-value-10\"></fd-text>\r\n                </fd-facet-content>\r\n                } @if ( !facet.mo.IsNumber && facet.type === 'key-value' && !facet.mo.Component?.Selector) {\r\n                <span\r\n                    fd-object-status\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [label]=\"facet.mo.Component?.Selector ? '' : (facet.mo.Text | facetValue | bbbTranslate)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue | bbbTranslate\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue | bbbTranslate\"\r\n                    [glyph]=\"facet.mo.Icon\"\r\n                >\r\n                </span>\r\n                } @else {\r\n                <bnrc-dynamic-component\r\n                    [class]=\"'fd-object-status fd-object-status--' + facet.mo.Status | facetValue\"\r\n                    [class.fd-object-status--large]=\"facet.mo.IsLarge\"\r\n                    [component]=\"facet.mo.Component\"\r\n                    [value]=\"facet.mo.Text | bbbTranslate\"\r\n                ></bnrc-dynamic-component>\r\n                } @if (facet.mo.IsNumber && facet.type === 'key-value') {\r\n                <fd-object-number\r\n                    [number]=\"facet.mo.Text | facetValue\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [unit]=\"facet.mo.Unit | facetValue | bbbTranslate\"\r\n                    [status]=\"facet.mo.Status | facetValue\"\r\n                    [decimal]=\"facet.mo.DecimalValue | facetValue\"\r\n                ></fd-object-number>\r\n                } @if (facet.type === 'plain-text') {\r\n                <div [style.width.px]=\"facet.mo.Width\" style=\"white-space: normal\">\r\n                    <fd-text [text]=\"facet.mo.Text | facetValue | bbbTranslate\" hyphenation=\"auto\"></fd-text>\r\n                </div>\r\n                } @if (facet.type === 'rating-indicator') {\r\n                <fd-facet-content>\r\n                    <fd-rating-indicator\r\n                        style=\"pointer-events: none\"\r\n                        size=\"md\"\r\n                        [dynamicTextIndicator]=\"facet.mo.Footer | bbbTranslate\"\r\n                        [displayMode]=\"true\"\r\n                        [value]=\"facet.mo | facetValue: facet.type\"\r\n                    ></fd-rating-indicator>\r\n                </fd-facet-content>\r\n                } @if (facet.type === 'progress') {\r\n                <div [style.width]=\"'10rem'\">\r\n                    <!-- <span fd-form-label>{{ facet.mo.Subtitle | facetValue }}</span> -->\r\n                    <fd-progress-indicator\r\n                        class=\"facet-progress\"\r\n                        style=\"width: 10r em\"\r\n                        [state]=\"facet.mo.State\"\r\n                        [valueText]=\"(facet.mo | facetValue: facet.type) + ' \u0627\u0632 10 \u0645\u0631\u062D\u0644\u0647' | bbbTranslate\"\r\n                        [valueNow]=\"facet.mo | facetValue: facet.type\"\r\n                        [valueMax]=\"10\"\r\n                        [unit]=\"'\u0645\u0631\u062D\u0644\u0647'\"\r\n                    ></fd-progress-indicator>\r\n                    <!-- <ui5-progress-indicator\r\n                    style=\"width: 10rem\"\r\n                    [valueState]=\"facet.mo.State\"\r\n                    [value]=\"getNumber(facet.mo.Value)\"\r\n                  ></ui5-progress-indicator> -->\r\n                </div>\r\n                } @if (facet.type === 'microcharts') {\r\n                <div>\r\n                    <label wrap>in progress ...</label>\r\n                </div>\r\n                }\r\n            </fd-facet>\r\n            }\r\n        </fd-facet-group>\r\n        @if (description) {\r\n        <span>{{ description | bbbTranslate }}</span>\r\n        }\r\n    </fd-dynamic-page-subheader>\r\n    @if((!modernTabs.length && !contentIsPage) || (modernTabs.length && !contentIsPage && parameters?.LayoutComponent))\r\n    {\r\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\r\n        <fd-layout-grid class=\"!tw-p-0\" style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\r\n            <div fdLayoutGridRow class=\"!tw-p-0\">\r\n                <div\r\n                    class=\"!tw-p-0\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\r\n                    [class.hide]=\"disableGrid\"\r\n                    [fdLayoutGridCol]=\"0\"\r\n                    [colMd]=\"layout1.colMd\"\r\n                    [colLg]=\"layout1.colLg\"\r\n                    [colXl]=\"layout1.colXl\"\r\n                ></div>\r\n                <div class=\"!tw-p-0\" [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            parameters?.LayoutComponent ? renderLayoutComponent : renderDefaultLayout;\r\n                            context: {\r\n                                $implicit: parameters?.LayoutComponent,\r\n                                layout94: layout94\r\n                            }\r\n                        \"\r\n                    ></ng-container>\r\n                </div>\r\n                <div\r\n                    class=\"!tw-p-0\"\r\n                    [class.hide]=\"disableGrid\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\r\n                    [fdLayoutGridCol]=\"0\"\r\n                    [colMd]=\"layout2.colMd\"\r\n                    [colLg]=\"layout2.colLg\"\r\n                    [colXl]=\"layout2.colXl\"\r\n                ></div>\r\n            </div>\r\n        </fd-layout-grid>\r\n    </fd-dynamic-page-content>\r\n    } @else if(modernTabs.length && !contentIsPage && !parameters?.LayoutComponent){\r\n    <fdp-icon-tab-bar\r\n        [stackContent]=\"false\"\r\n        [collapseOverflow]=\"true\"\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        [iconTabType]=\"modernTabContainerComponent?.Settings?.TabType.$Caption || 'text'\"\r\n        [layoutMode]=\"modernTabContainerComponent?.Settings?.LayoutMode$Caption\"\r\n    >\r\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\r\n        <fdp-icon-tab-bar-tab\r\n            [id]=\"tab.id\"\r\n            [label]=\"tab.Title!! | bbbTranslate\"\r\n            [title]=\"tab.Title!! | bbbTranslate\"\r\n            [color]=\"tab.SemanticColor?.$Caption\"\r\n            [icon]=\"tab.FontIcon\"\r\n            [iconFont]=\"tab.IconFontName?.$Caption\"\r\n            [counter]=\"tab.CustomUi?.Settings?.CounterValue\"\r\n            [class.is-expanded]=\"selectedTab === tab.Title\"\r\n            #tablist\r\n        >\r\n            <fd-dynamic-page-content [id]=\"tab.id\" [class.limit-content-width]=\"formContentMaxWidth > 0\">\r\n                <fd-layout-grid [style.max-width.px]=\"formContentMaxWidth\" class=\"!tw-p-0\">\r\n                    <div fdLayoutGridRow>\r\n                        <div\r\n                            class=\"!tw-p-0\"\r\n                            [fdLayoutGridCol]=\"0\"\r\n                            [colMd]=\"layout1.colMd\"\r\n                            [colLg]=\"layout1.colLg\"\r\n                            [colXl]=\"layout1.colXl\"\r\n                            [class.hide]=\"disableGrid\"\r\n                        ></div>\r\n                        <div [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\" class=\"!tw-p-0\">\r\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\r\n                        </div>\r\n                        <div\r\n                            class=\"!tw-p-0\"\r\n                            [fdLayoutGridCol]=\"0\"\r\n                            [colMd]=\"layout2.colMd\"\r\n                            [colLg]=\"layout2.colLg\"\r\n                            [colXl]=\"layout2.colXl\"\r\n                            [class.hide]=\"disableGrid\"\r\n                        ></div>\r\n                    </div>\r\n                </fd-layout-grid>\r\n            </fd-dynamic-page-content>\r\n        </fdp-icon-tab-bar-tab>\r\n        }\r\n    </fdp-icon-tab-bar>\r\n    } @if(!hideFooter && hasLayoutButtons || (workflowButtons.length && isMobile)){\r\n    <fd-dynamic-page-footer>\r\n        <ng-container *ngTemplateOutlet=\"layoutActionsTemplateRef\"></ng-container>\r\n    </fd-dynamic-page-footer>\r\n    }\r\n</fd-dynamic-page>\r\n@if (contentIsPage) {\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderLayoutComponent;\r\n        context: {\r\n            $implicit: parameters?.LayoutComponent,\r\n            layout94: layout94\r\n        }\r\n    \"\r\n></ng-container>\r\n}\r\n<ng-template #renderDefaultLayout let-layout94=\"layout94\">\r\n    <bsu-ly-layout-container-of-root\r\n        [config]=\"layout94\"\r\n        [isPanel]=\"false\"\r\n        [isRoot]=\"true\"\r\n    ></bsu-ly-layout-container-of-root>\r\n</ng-template>\r\n<ng-template #renderLayoutComponent let-component let-layout94=\"layout94\">\r\n    <bnrc-dynamic-form-component\r\n        [component]=\"component\"\r\n        [layoutActionsTemplateRef]=\"layoutActionsTemplateRef\"\r\n        [removeContentPadding]=\"removeContentPadding\"\r\n        [breadCrumbs]=\"breadCrumbs\"\r\n        [description]=\"description\"\r\n        [title]=\"title\"\r\n        [subtitle]=\"subtitle\"\r\n        [toolbarItems]=\"toolbarItems\"\r\n        [layoutActions]=\"layoutActions\"\r\n        [footerDesign]=\"footerDesign\"\r\n        [facetList]=\"facetList\"\r\n        [settings]=\"component.Settings\"\r\n        [workflowButtons]=\"workflowButtons\"\r\n        [workflowPanelUi]=\"workflowPanelUi\"\r\n        [isMobile]=\"isMobile\"\r\n        [mo]=\"mo\"\r\n        [layout94]=\"layout94\"\r\n        [context]=\"context\"\r\n        [rtl]=\"rtl\"\r\n        [fieldDict]=\"fieldDict\"\r\n        [mask]=\"mask\"\r\n        [dirValue]=\"dirValue\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [modernTabs]=\"modernTabs\"\r\n        [avatar]=\"avatar\"\r\n        (events)=\"onDynamicComponentEvents($event)\"\r\n    ></bnrc-dynamic-form-component>\r\n</ng-template>\r\n<ng-template #closeForm>\r\n    <button fd-button fdType=\"transparent\" aria-label=\"Close\" (click)=\"close.emit()\" title=\"Close\">\r\n        <i [class]=\"'sap-icon--' + (isMobile ? (rtl ? 'arrow-right' : 'arrow-left') : 'decline')\"></i>\r\n    </button>\r\n</ng-template>\r\n<ng-template #fullscreenForm>\r\n    @if (canFullscreen) {\r\n    <button\r\n        fd-button\r\n        fdType=\"transparent\"\r\n        [attr.aria-label]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\r\n        (click)=\"fullscreenRequest.emit()\"\r\n        [title]=\"fullscreen ? 'exit fullscreen' : 'fullscreen'\"\r\n        [glyph]=\"fullscreen ? 'exitfullscreen' : 'resize'\"\r\n    ></button>\r\n    }\r\n</ng-template>\r\n<ng-template #layoutActionsTemplateRef>\r\n    <bsu-layout-actions\r\n        [canSend]=\"canSend\"\r\n        [buttons]=\"isMobile && hideFooter ? [] : layoutActions\"\r\n        [isMobile]=\"isMobile\"\r\n        [landscape]=\"landscape\"\r\n        [standalone]=\"standalone\"\r\n        [footerDesign]=\"footerDesign\"\r\n        [workflowButtons]=\"workflowButtons\"\r\n        [workflowButtonsComboMode]=\"workflowButtonsComboMode || worfklowButtonsOnFooter\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [rtl]=\"rtl\"\r\n        (toolClick)=\"toolbarClick.emit($event)\"\r\n        (workflowChoiceSelect)=\"onWfChoiceSelect($event)\"\r\n    >\r\n    </bsu-layout-actions>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto;width:100%}:host>fd-dynamic-page[contentispage=false]:not([ismobile=true]) ::ng-deep fd-dynamic-page-header .fd-dynamic-page__title{max-width:50svw}:host ::ng-deep .fd-facet .fd-title{font-family:B-Font Medium}:host ::ng-deep fd-dynamic-page[contentIsPage=true] .fd-dynamic-page{height:auto!important;min-height:auto!important}:host ::ng-deep .facet-progress .fd-progress-indicator__container,:host ::ng-deep .facet-progress .fd-progress-indicator__progress-bar{height:1.5rem}:host ::ng-deep fd-facet .fd-object-status--large{font-size:1.1rem}.no-toolbar-items ::ng-deep .fd-dynamic-page__toolbar-container{width:auto}fd-dynamic-page[ismobile=true] fd-dynamic-page-header.notitle ::ng-deep .fd-dynamic-page__title{width:auto}fd-dynamic-page[ismobile=true] fd-dynamic-page-header.notitle ::ng-deep>article{height:calc(100svh - var(--shellbar-height) - env(safe-area-inset-bottom) - constant(safe-area-inset-bottom))!important}fd-dynamic-page ::ng-deep>article{min-height:calc(100svh - var(--shellbar-height))}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded{min-height:100%;display:flex}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded>fd-dynamic-page-content{min-height:100%;overflow:hidden}fd-dynamic-page ::ng-deep>article>fd-tab-list>.fd-tabs__content fd-tab.is-expanded bsu-ly-layout-container-of-root{min-height:100%}fd-dynamic-page ::ng-deep>article>.fd-scrollbar{height:inherit}fd-dynamic-page fd-dynamic-page-content.limit-content-width{display:flex;justify-content:center}fd-facet{display:flex;flex-direction:column}.hide-title ::ng-deep .fd-dynamic-page__title-container{display:none!important}.hide-title.hide-breadcrumb{display:none}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container{display:none!important}fd-toolbar.firefox ::ng-deep .fd-toolbar{flex-direction:row-reverse}fd-toolbar.firefox ::ng-deep .fd-toolbar>:first-child{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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.DynamicFormComponent, selector: "bnrc-dynamic-form-component", inputs: ["breadCrumbs", "toolbarVisible", "toolbarItems", "layoutActions", "layoutActionsTemplateRef", "workflowButtons", "layout94", "footerDesign", "settings", "workflowPanelUi", "title", "subtitle", "description", "facetList", "removeHeaderBorder", "removeContentPadding", "isMobile", "avatar", "rtl", "mask", "mo", "contentDensity", "deviceSize", "dirValue", "fieldDict", "modernTabs"] }, { kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "FnHandleEvents", "value"], outputs: ["events"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "directive", type: i2.MeasureFormTitleWidthDirective, selector: "[mWidthTitle]", inputs: ["mWidthTitle", "enableMobile"] }, { kind: "directive", type: i3$1.ɵɵCdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i4$5.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i4$5.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i8.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i8.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i8.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i8.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i8.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i8.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i8.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i8.DynamicPageBreadcrumbComponent, selector: "fd-dynamic-page-breadcrumb" }, { kind: "component", type: i8$1.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i8$1.FacetGroupComponent, selector: "fd-facet-group", inputs: ["ariaLabel"] }, { kind: "component", type: i8$1.FacetContentComponent, selector: "fd-facet-content" }, { kind: "component", type: i2$1.FormLabelComponent, selector: "[fd-form-label]", inputs: ["required", "colon", "alignLabelEnd", "inlineHelpContent", "inlineHelpGlyph", "inlineHelpTriggers", "inlineHelpBodyPlacement", "inlineHelpPlacement", "allowWrap", "inlineHelpLabel", "id"] }, { kind: "component", type: i10.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i10.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i10.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "component", type: i2$8.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "ariaLabelledBy", "dismissBtnTitle", "noIcon", "type", "id", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i5$6.ObjectNumberComponent, selector: "fd-object-number", inputs: ["number", "decimal", "unit", "emphasized", "large", "status", "class", "ariaLabelledBy", "ariaLabel"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i14.RatingIndicatorComponent, selector: "fd-rating-indicator", inputs: ["class", "name", "ariaLabel", "ariaLabelledBy", "disabled", "displayMode", "nonInteractive", "indicatorCapacity", "allowHalves", "value", "totalRatings", "ratingAverage", "ratings", "displayAllRatings", "ratedIcon", "unratedIcon", "size", "dynamicTextIndicator"], outputs: ["ratingChanged"] }, { kind: "component", type: i5$3.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i7$2.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: i12$1.ProgressIndicatorComponent, selector: "fd-progress-indicator", inputs: ["valueText", "unit", "valueMin", "valueMax", "valueNow", "state", "animate"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyLayoutContainerOfRootComponent, selector: "bsu-ly-layout-container-of-root" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: BreadcrumbComponent, selector: "bsu-breadcrumb", inputs: ["breadCrumb", "allBreadCrumb", "isLast", "index"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "component", type: BarsaInfobarsComponent, selector: "bsu-barsa-infobars", inputs: ["infobars"], outputs: ["dismiss"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }, { kind: "pipe", type: i2.HeaderFacetValuePipe, name: "facetValue" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.SanitizeTextPipe, name: "sanitizeText" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FundamentalDynamicFormComponent, decorators: [{
             type: Component,
@@ -9921,7 +10052,7 @@ class UiLinearListContainerWithButtonComponent extends DeviceInfoFieldBaseCompon
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiLinearListContainerWithButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiLinearListContainerWithButtonComponent, isStandalone: false, selector: "bsu-ui-linear-list-container-with-button", inputs: { UlvUi: "UlvUi", GetTextItemValue: "GetTextItemValue", show: "show", hide: "hide", hidden: "hidden", GetSelectionData: "GetSelectionData" }, host: { listeners: { "keydown.enter": "onKeyEnter($event)", "keydown.arrowdown": "onKeyDown($event)", "keydown.esc": "onKeyEsc($event)" } }, viewQueries: [{ propertyName: "multiInputComponent", first: true, predicate: MultiInputComponent, descendants: true, static: true }, { propertyName: "dialogContainer", first: true, predicate: ["container"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<fd-multi-input\r\n    [inputId]=\"id\"\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n    [class.control-readonly]=\"(readonly$ | async) === true\"\r\n    [dropdownValues]=\"(dropDownValues$ | async)!!\"\r\n    [placeholder]=\"Setting.ControlFieldCaptionTranslated | bbbTranslate\"\r\n    [displayFn]=\"displayFunc\"\r\n    [showAllButton]=\"false\"\r\n    [displayAddonButton]=\"(disableOrReadonly$ | async) !== true\"\r\n    [allowNewTokens]=\"false\"\r\n    [includes]=\"true\"\r\n    [(ngModel)]=\"idsOfMo\"\r\n    [disabled]=\"(disable$ | async) === true\"\r\n    [valueFn]=\"valueFn\"\r\n    (searchTermChange)=\"onSearchTermChange($event)\"\r\n    (selectedChange)=\"onSelectedChange($event)\"\r\n    (addOnButtonClicked)=\"_handleAddonButtonClicked()\"\r\n></fd-multi-input>\r\n\r\n<!-- <button\r\n*ngIf=\"report\"\r\nfd-button\r\n[attr.rtl]=\"rtl\"\r\n[aria-label]=\"'Advanced' | bbbTranslate\"\r\nglyph=\"value-help\"\r\n[disabled]=\"(disableOrReadonly$ | async)!!\"\r\n(click)=\"onOpenReport()\"\r\n></button> -->\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl>\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                <div fd-bar-left>\r\n                    <fd-bar-element>\r\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.title }}</h1>\r\n                    </fd-bar-element>\r\n                </div>\r\n                <div fd-bar-right>\r\n                    @if (dialogConfig.height !== '100vh') {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"                        \r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"dialog.toggleFullScreen()\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onDismiss()\"></fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n            <!-- <h3 fd-title>{{ dialog.data.title }}</h3>\r\n      <button fd-dialog-close-button></button> -->\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            @if (dialog.data.ulvUi; as ulvUi) {\r\n            <bsu-ui-ulv-main-ui [context]=\"ulvUi\" class=\"linear-list-selection\"></bsu-ui-ulv-main-ui>\r\n\r\n            }\r\n        </fd-dialog-body>\r\n\r\n        <fd-dialog-footer class=\"ulvSelection\">\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div\r\n                    class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\r\n                    [aria-label]=\"'SelectedItemsAndConditions' | bbbTranslate\"\r\n                >\r\n                    <h5 fd-title class=\"selected-and-condition-title\">\r\n                        <ng-container>\r\n                            <ng-container>{{ 'SelectedItemsAndConditions' | bbbTranslate }} </ng-container>\r\n                            ({{ dialog.data.selectedItems?.length || 0 }})\r\n                        </ng-container>\r\n                    </h5>\r\n                    <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\r\n                        <div class=\"ulv-selection-form-dialog__tokens\">\r\n                            @if (dialog.data.selectedItems) {\r\n                            <fd-toolbar [shouldOverflow]=\"true\" style=\"overflow-y:auto\">\r\n                                <!-- Selected items -->\r\n                                @for ( item of dialog.data.selectedItems; track _trackBySelectedFn(selectedIndex, item);\r\n                                let selectedIndex = $index) {\r\n                                <fd-token\r\n                                    fd-toolbar-item\r\n                                    fdOverflowPriority=\"high\"\r\n                                    class=\"fdp-value-help-dialog__selection-token\"\r\n                                    (onCloseClick)=\"onRemoveSelected(item)\"\r\n                                    >{{ item.Text }}\r\n                                </fd-token>\r\n                                }\r\n                            </fd-toolbar>\r\n                            }\r\n                        </div>\r\n                        <button\r\n                            class=\"ulv-selection-form-dialog__tokens-clear\"\r\n                            fd-button\r\n                            fdType=\"transparent\"\r\n                            glyph=\"decline\"\r\n                            [aria-label]=\"'Clear' | bbbTranslate\"\r\n                            (click)=\"onClear()\"\r\n                        ></button>\r\n                    </div>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n        <fd-dialog-footer>\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div class=\"fd-bar__right\">\r\n                    <button\r\n                        fd-button\r\n                        data-succes\r\n                        [label]=\"'OK' | bbbTranslate\"\r\n                        fdType=\"emphasized\"\r\n                        (click)=\"onOk()\"\r\n                    ></button>\r\n                    <button\r\n                        fd-button\r\n                        data-dismiss-dialog\r\n                        fd-dialog-decisive-button\r\n                        [label]=\"'Cancel' | bbbTranslate\"\r\n                        fdType=\"transparent\"\r\n                        (click)=\"onDismiss()\"\r\n                    ></button>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:flex;align-items:center}:host ::ng-deep fd-multi-input .fd-input-group{cursor:default}fd-multi-input{flex-grow:1}button[rtl=true]{margin-right:5px}button[rtl=false]{margin-left:5px}::ng-deep .fd-toolbar{display:flex;flex-wrap:wrap;row-gap:5px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8$3.MultiInputComponent, selector: "fd-multi-input", inputs: ["placeholder", "disabled", "required", "compactCollapse", "maxHeight", "glyph", "glyphFont", "dropdownValues", "openDropdownOnAddOnClicked", "addonIconTitle", "searchTerm", "inputId", "highlight", "selected", "class", "filterFn", "valueFn", "displayFn", "newTokenParseFn", "optionItemIdentifier", "newTokenValidateFn", "ariaLabel", "ariaLabelledBy", "fillControlMode", "state", "buttonFocusable", "allowNewTokens", "mobile", "showAllButton", "bodyMaxWidth", "mobileConfig", "includes", "itemTemplate", "title", "byline", "autoComplete", "open", "displayAddonButton", "addOnButtonAriaLabel"], outputs: ["searchTermChange", "selectedChange", "openChange", "addOnButtonClicked", "allItemsSelectedChange"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiLinearListContainerWithButtonComponent, isStandalone: false, selector: "bsu-ui-linear-list-container-with-button", inputs: { UlvUi: "UlvUi", GetTextItemValue: "GetTextItemValue", show: "show", hide: "hide", hidden: "hidden", GetSelectionData: "GetSelectionData" }, host: { listeners: { "keydown.enter": "onKeyEnter($event)", "keydown.arrowdown": "onKeyDown($event)", "keydown.esc": "onKeyEsc($event)" } }, viewQueries: [{ propertyName: "multiInputComponent", first: true, predicate: MultiInputComponent, descendants: true, static: true }, { propertyName: "dialogContainer", first: true, predicate: ["container"], descendants: true, read: TemplateRef }], usesInheritance: true, ngImport: i0, template: "<fd-multi-input\r\n    [inputId]=\"id\"\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n    [class.control-readonly]=\"(readonly$ | async) === true\"\r\n    [dropdownValues]=\"(dropDownValues$ | async)!!\"\r\n    [placeholder]=\"Setting.ControlFieldCaptionTranslated | bbbTranslate\"\r\n    [displayFn]=\"displayFunc\"\r\n    [showAllButton]=\"false\"\r\n    [displayAddonButton]=\"(disableOrReadonly$ | async) !== true\"\r\n    [allowNewTokens]=\"false\"\r\n    [includes]=\"true\"\r\n    [(ngModel)]=\"idsOfMo\"\r\n    [disabled]=\"(disable$ | async) === true\"\r\n    [valueFn]=\"valueFn\"\r\n    (searchTermChange)=\"onSearchTermChange($event)\"\r\n    (selectedChange)=\"onSelectedChange($event)\"\r\n    (addOnButtonClicked)=\"_handleAddonButtonClicked()\"\r\n></fd-multi-input>\r\n\r\n<!-- <button\r\n*ngIf=\"report\"\r\nfd-button\r\n[attr.rtl]=\"rtl\"\r\n[aria-label]=\"'Advanced' | bbbTranslate\"\r\nglyph=\"value-help\"\r\n[disabled]=\"(disableOrReadonly$ | async)!!\"\r\n(click)=\"onOpenReport()\"\r\n></button> -->\r\n\r\n<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\" #dialogTpl>\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                <div fd-bar-left>\r\n                    <fd-bar-element>\r\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.title }}</h1>\r\n                    </fd-bar-element>\r\n                </div>\r\n                <div fd-bar-right>\r\n                    @if (dialogConfig.height !== '100vh') {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"                        \r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"dialog.toggleFullScreen()\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"onDismiss()\"></fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n            <!-- <h3 fd-title>{{ dialog.data.title }}</h3>\r\n      <button fd-dialog-close-button></button> -->\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            @if (dialog.data.ulvUi; as ulvUi) {\r\n            <bsu-ui-ulv-main-ui [context]=\"ulvUi\" class=\"linear-list-selection\"></bsu-ui-ulv-main-ui>\r\n\r\n            }\r\n        </fd-dialog-body>\r\n\r\n        <fd-dialog-footer class=\"ulvSelection\">\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div\r\n                    class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\r\n                    [aria-label]=\"'SelectedItemsAndConditions' | bbbTranslate\"\r\n                >\r\n                    <h5 fd-title class=\"selected-and-condition-title\">\r\n                        <ng-container>\r\n                            <ng-container>{{ 'SelectedItemsAndConditions' | bbbTranslate }} </ng-container>\r\n                            ({{ dialog.data.selectedItems?.length || 0 }})\r\n                        </ng-container>\r\n                    </h5>\r\n                    <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\r\n                        <div class=\"ulv-selection-form-dialog__tokens\">\r\n                            @if (dialog.data.selectedItems) {\r\n                            <fd-toolbar [shouldOverflow]=\"true\" style=\"overflow-y:auto\">\r\n                                <!-- Selected items -->\r\n                                @for ( item of dialog.data.selectedItems; track _trackBySelectedFn(selectedIndex, item);\r\n                                let selectedIndex = $index) {\r\n                                <fd-token\r\n                                    fd-toolbar-item\r\n                                    fdOverflowPriority=\"high\"\r\n                                    class=\"fdp-value-help-dialog__selection-token\"\r\n                                    (onCloseClick)=\"onRemoveSelected(item)\"\r\n                                    >{{ item.Text }}\r\n                                </fd-token>\r\n                                }\r\n                            </fd-toolbar>\r\n                            }\r\n                        </div>\r\n                        <button\r\n                            class=\"ulv-selection-form-dialog__tokens-clear\"\r\n                            fd-button\r\n                            fdType=\"transparent\"\r\n                            glyph=\"decline\"\r\n                            [aria-label]=\"'Clear' | bbbTranslate\"\r\n                            (click)=\"onClear()\"\r\n                        ></button>\r\n                    </div>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n        <fd-dialog-footer>\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div class=\"fd-bar__right\">\r\n                    <button\r\n                        fd-button\r\n                        data-succes\r\n                        [label]=\"'OK' | bbbTranslate\"\r\n                        fdType=\"emphasized\"\r\n                        (click)=\"onOk()\"\r\n                    ></button>\r\n                    <button\r\n                        fd-button\r\n                        data-dismiss-dialog\r\n                        fd-dialog-decisive-button\r\n                        [label]=\"'Cancel' | bbbTranslate\"\r\n                        fdType=\"transparent\"\r\n                        (click)=\"onDismiss()\"\r\n                    ></button>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:flex;align-items:center}:host ::ng-deep fd-multi-input .fd-input-group{cursor:default}fd-multi-input{flex-grow:1}button[rtl=true]{margin-right:5px}button[rtl=false]{margin-left:5px}::ng-deep .fd-toolbar{display:flex;flex-wrap:wrap;row-gap:5px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8$2.MultiInputComponent, selector: "fd-multi-input", inputs: ["placeholder", "disabled", "required", "compactCollapse", "maxHeight", "glyph", "glyphFont", "dropdownValues", "openDropdownOnAddOnClicked", "addonIconTitle", "searchTerm", "inputId", "highlight", "selected", "class", "filterFn", "valueFn", "displayFn", "newTokenParseFn", "optionItemIdentifier", "newTokenValidateFn", "ariaLabel", "ariaLabelledBy", "fillControlMode", "state", "buttonFocusable", "allowNewTokens", "mobile", "showAllButton", "bodyMaxWidth", "mobileConfig", "includes", "itemTemplate", "title", "byline", "autoComplete", "open", "displayAddonButton", "addOnButtonAriaLabel"], outputs: ["searchTermChange", "selectedChange", "openChange", "addOnButtonClicked", "allItemsSelectedChange"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiLinearListContainerWithButtonComponent, decorators: [{
             type: Component,
@@ -10120,7 +10251,7 @@ class LySimpleLabelComponent extends LayoutItemBaseComponent {
         this.flex = Bounds.width;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LySimpleLabelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LySimpleLabelComponent, isStandalone: false, selector: "bsu-ly-simple-label", host: { properties: { "style.flex": "this.flex" } }, usesInheritance: true, ngImport: i0, template: "<!-- <label fd-form-label [wrap]=\"true\">{{ config.Text }}</label> -->\r\n@if (!config.CustomUi) {\r\n<h6 fd-title [wrap]=\"true\">{{ config.Text }}</h6>\r\n} @if (config.CustomUi) {\r\n<bnrc-dynamic-component [component]=\"config.CustomUi\" [value]=\"config.Text\"></bnrc-dynamic-component>\r\n}\r\n", styles: [":host{display:flex;align-items:center}:host:not(.isMobile){min-height:var(--sapElement_Height)}:host.isMobile{width:100%}h6{overflow:hidden}\n"], dependencies: [{ kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "value"], outputs: ["events"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LySimpleLabelComponent, isStandalone: false, selector: "bsu-ly-simple-label", host: { properties: { "style.flex": "this.flex" } }, usesInheritance: true, ngImport: i0, template: "<!-- <label fd-form-label [wrap]=\"true\">{{ config.Text }}</label> -->\r\n@if (!config.CustomUi) {\r\n<h6 fd-title [wrap]=\"true\">{{ config.Text }}</h6>\r\n} @if (config.CustomUi) {\r\n<bnrc-dynamic-component [component]=\"config.CustomUi\" [value]=\"config.Text\"></bnrc-dynamic-component>\r\n}\r\n", styles: [":host{display:flex;align-items:center}:host:not(.isMobile){min-height:var(--sapElement_Height)}:host.isMobile{width:100%}h6{overflow:hidden}\n"], dependencies: [{ kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "FnHandleEvents", "value"], outputs: ["events"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LySimpleLabelComponent, decorators: [{
             type: Component,
@@ -10228,7 +10359,6 @@ class UlLoadingMaskUiComponent extends BaseComponent {
     }
     maskBody(duration) {
         const body = this.getBody();
-        this._unmask(body);
         this._mask(body, { delay: duration });
     }
     unmaskBody() {
@@ -10244,9 +10374,6 @@ class UlLoadingMaskUiComponent extends BaseComponent {
         return document.querySelector('body');
     }
     _mask(containerRef, _option) {
-        if (containerRef.maskDialog) {
-            return;
-        }
         // const maskDelay = 15000;
         const containerId = getUniqueId(3);
         if (!containerRef.__id) {
@@ -10259,6 +10386,7 @@ class UlLoadingMaskUiComponent extends BaseComponent {
         else {
             containerRef.maskSubject = new Subject();
             containerRef.unmaskSubject = new Subject();
+            const delayTime = _option?.delay ? _option.delay : 0;
             containerRef.maskSubject
                 .asObservable()
                 .pipe(takeUntil(containerRef.unmaskSubject), switchMap((_c) => {
@@ -10270,7 +10398,7 @@ class UlLoadingMaskUiComponent extends BaseComponent {
                     mobile: true,
                     dialogPanelClass: 'maskloading-container'
                 }));
-            }), delay(_option?.delay || 0))
+            }), delay(delayTime))
                 .subscribe((c) => {
                 c.close();
                 this._dialogRefList = this._dialogRefList.filter((c) => c.__id !== containerId);
@@ -10527,7 +10655,7 @@ class LyTabContainerComponent extends LayoutItemBaseComponent {
         this._tabsSource.next(visibleTabs);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LyTabContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LyTabContainerComponent, isStandalone: false, selector: "bsu-ly-tab-container", host: { properties: { "attr.ismobile": "this.isMobile", "style.flex": "this.flex" } }, viewQueries: [{ propertyName: "tabListComponent", first: true, predicate: IconTabBarComponent, descendants: true }, { propertyName: "tabpages", predicate: TabPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fdp-icon-tab-bar\r\n    [collapseOverflow]=\"true\"\r\n    [expandOverflowText]=\"'More' | bbbTranslate\"\r\n    iconTabSize=\"responsive-paddings\"\r\n    [iconTabType]=\"iconTabType\"\r\n    [layoutMode]=\"layoutMode\"\r\n    [fixTabMore]=\"tabListComponent\"\r\n>\r\n    @for (tabPage of tabs$ | async; track tabPage; let tabindex = $index) {\r\n    <fdp-icon-tab-bar-tab\r\n        [id]=\"tabPage.ControlId\"\r\n        [label]=\"tabPage.Title || '' | bbbTranslate\"\r\n        [title]=\"tabPage.Title || '' | bbbTranslate\"\r\n        [active]=\"config.SelectedTabPageName === tabPage.ControlId\"\r\n        [disabled]=\"tabPage.disabled\"\r\n        [class.control-disabled]=\"tabPage.Enable === false\"\r\n        [class.readonly]=\"tabPage.Readonly\"\r\n        [color]=\"tabPage.SemanticColor?.$Caption\"\r\n        [icon]=\"tabPage.FontIcon\"\r\n        [counter]=\"tabPage.CustomUi?.Settings?.CounterValue\"\r\n        [iconFont]=\"tabPage.IconFontName?.$Caption\"\r\n    >\r\n        <fd-dynamic-page-content [attr.icon]=\"tabPage.FontIcon\" [attr.iconFont]=\"tabPage.IconFontName?.$Caption\">\r\n            <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\r\n        </fd-dynamic-page-content>\r\n    </fdp-icon-tab-bar-tab>\r\n    }\r\n</fdp-icon-tab-bar>\r\n", styles: [":host{width:100%;display:block}fdp-icon-tab-bar ::ng-deep>div{border:var(--sapField_BorderWidth) solid var(--sapGroup_TitleBorderColor)}fdp-icon-tab-bar ::ng-deep>div>div.fd-icon-tab-bar__content>fdp-icon-tab-bar-tab-content>fd-dynamic-page-content{padding-block:var(--fdPanel_Content_Padding_Block, .625rem);padding-inline:var(--fdPanel_Content_Padding_Inline, 1rem);display:flex;flex-direction:column}fdp-icon-tab-bar ::ng-deep>div>div.fd-icon-tab-bar__content>fdp-icon-tab-bar-tab-content>fd-dynamic-page-content>bsu-ly-tab-page{flex:1!important}\n"], dependencies: [{ kind: "component", type: i8$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems"] }, { kind: "directive", type: FixTabMoreDirective, selector: "[fixTabMore]", inputs: ["fixTabMore"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LyTabContainerComponent, isStandalone: false, selector: "bsu-ly-tab-container", host: { properties: { "attr.ismobile": "this.isMobile", "style.flex": "this.flex" } }, viewQueries: [{ propertyName: "tabListComponent", first: true, predicate: IconTabBarComponent, descendants: true }, { propertyName: "tabpages", predicate: TabPanelComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fdp-icon-tab-bar\r\n    [collapseOverflow]=\"true\"\r\n    [expandOverflowText]=\"'More' | bbbTranslate\"\r\n    iconTabSize=\"responsive-paddings\"\r\n    [iconTabType]=\"iconTabType\"\r\n    [layoutMode]=\"layoutMode\"\r\n    [fixTabMore]=\"tabListComponent\"\r\n>\r\n    @for (tabPage of tabs$ | async; track tabPage; let tabindex = $index) {\r\n    <fdp-icon-tab-bar-tab\r\n        [id]=\"tabPage.ControlId\"\r\n        [label]=\"tabPage.Title || '' | bbbTranslate\"\r\n        [title]=\"tabPage.Title || '' | bbbTranslate\"\r\n        [active]=\"config.SelectedTabPageName === tabPage.ControlId\"\r\n        [disabled]=\"tabPage.disabled\"\r\n        [class.control-disabled]=\"tabPage.Enable === false\"\r\n        [class.readonly]=\"tabPage.Readonly\"\r\n        [color]=\"tabPage.SemanticColor?.$Caption\"\r\n        [icon]=\"tabPage.FontIcon\"\r\n        [counter]=\"tabPage.CustomUi?.Settings?.CounterValue\"\r\n        [iconFont]=\"tabPage.IconFontName?.$Caption\"\r\n    >\r\n        <fd-dynamic-page-content [attr.icon]=\"tabPage.FontIcon\" [attr.iconFont]=\"tabPage.IconFontName?.$Caption\">\r\n            <bsu-ly-tab-page [config]=\"tabPage\"></bsu-ly-tab-page>\r\n        </fd-dynamic-page-content>\r\n    </fdp-icon-tab-bar-tab>\r\n    }\r\n</fdp-icon-tab-bar>\r\n", styles: [":host{width:100%;display:block}fdp-icon-tab-bar ::ng-deep>div{border:var(--sapField_BorderWidth) solid var(--sapGroup_TitleBorderColor)}fdp-icon-tab-bar ::ng-deep>div>div.fd-icon-tab-bar__content>fdp-icon-tab-bar-tab-content>fd-dynamic-page-content{padding-block:var(--fdPanel_Content_Padding_Block, .625rem);padding-inline:var(--fdPanel_Content_Padding_Inline, 1rem);display:flex;flex-direction:column}fdp-icon-tab-bar ::ng-deep>div>div.fd-icon-tab-bar__content>fdp-icon-tab-bar-tab-content>fd-dynamic-page-content>bsu-ly-tab-page{flex:1!important}\n"], dependencies: [{ kind: "component", type: i8.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: ["renderItems"] }, { kind: "directive", type: FixTabMoreDirective, selector: "[fixTabMore]", inputs: ["fixTabMore"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LyTabContainerComponent, decorators: [{
             type: Component,
@@ -10889,7 +11017,7 @@ class UiPicturesInfoComponent extends DeviceInfoFieldBaseComponent {
         this.value = value;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiPicturesInfoComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiPicturesInfoComponent, isStandalone: false, selector: "bsu-ui-pictures-info", inputs: { value: "value" }, providers: [UploadService], viewQueries: [{ propertyName: "_fileUploader", first: true, predicate: FileUploaderComponent, descendants: true }, { propertyName: "_fileGalleryViewer", first: true, predicate: FileGalleryViewerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-file-uploader\r\n    #uploader\r\n    [style.display]=\"'none'\"\r\n    [id]=\"id\"\r\n    [name]=\"'pictures_' + id\"\r\n    [placeholder]=\"'AttachPicture' | bbbTranslate\"\r\n    [buttonLabel]=\"'AttachPicture' | bbbTranslate\"\r\n    [buttonAriaLabel]=\"'AttachPicture' | bbbTranslate\"\r\n    accept=\".png,.jpg,.bpm,.jpeg,.gif,.png,.tif,.pdf\"    \r\n    [multiple]=\"maxFileCount === 0 || maxFileCount > 1\"\r\n    (selectedFilesChanged)=\"onFileSelection($event)\"\r\n    (selectedInvalidFiles)=\"onInvalidFiles($event)\"\r\n></fd-file-uploader>\r\n\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        isInlineGallery ? inlineGallery : layoutGridTpl;\r\n        context: {\r\n            disableOrReadonly: (disableOrReadonly$ | async),\r\n            mediaData: (mediaData$ | async),\r\n            deviceSize: (deviceSize$ | async)\r\n        }\r\n    \"\r\n></ng-container>\r\n<ng-template #inlineGallery let-mediaData=\"mediaData\" let-deviceSize=\"deviceSize\">\r\n    <fd-toolbar [shouldOverflow]=\"true\">\r\n        @if(mediaData.length && selectedIndex >-1){\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            [label]=\"'Download' | bbbTranslate\"\r\n            glyph=\"download\"\r\n            [name]=\"mediaData[selectedIndex].label\"\r\n            [src]=\"mediaData[selectedIndex].mediaUrl\"\r\n            saveImage\r\n        ></button>\r\n        }\r\n        <button\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            [label]=\"'Scan' | bbbTranslate\"\r\n            fd-toolbar-item\r\n            [glyph]=\"'x-ray'\"\r\n            [fdMenuTrigger]=\"menu\"\r\n        ></button>\r\n\r\n        <button\r\n            fd-button\r\n            fd-toolbar-item\r\n            glyph=\"add-photo\"\r\n            fdType=\"transparent\"\r\n            [label]=\"'AttachFile' | bbbTranslate\"\r\n            (click)=\"uploader.open()\"\r\n        ></button>\r\n\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            [label]=\"'Rotate' | bbbTranslate\"\r\n            glyph=\"rotate\"\r\n            (click)=\"onRotate2()\"\r\n        ></button>\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            [label]=\"'Delete' | bbbTranslate\"\r\n            glyph=\"delete\"\r\n            (click)=\"onDelete(selectedIndex)\"\r\n        ></button>\r\n        <fd-toolbar-separator></fd-toolbar-separator>\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [glyph]=\"'text-align-justified'\"\r\n            [fdType]=\"fillWidth ? 'emphasized' : 'transparent'\"\r\n            fdType=\"transparent\"\r\n            (click)=\"fillWidth = !fillWidth\"\r\n        ></button>\r\n        <button glyph=\"print\" fdType=\"transparent\" fd-toolbar-item fd-button [files]=\"mediaData\" printFiles></button>\r\n    </fd-toolbar>\r\n\r\n    <bsu-file-gallery-viewer\r\n        [style.max-height]=\"'100svh'\"\r\n        [style.min-height.px]=\"layoutInfo.Bounds.height || 480\"\r\n        fillEmptySpace\r\n        [decrement]=\"'4.5rem'\"\r\n        [fillWidth]=\"true\"\r\n        [fillWidth]=\"fillWidth\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [title]=\"'AttachPicture' | bbbTranslate\"\r\n        [files]=\"mediaData\"\r\n        [isImageGallery]=\"true\"\r\n        [isHorizontal]=\"isThumbnailHorizontal\"\r\n        [selectedIndex]=\"selectedIndex\"\r\n        (selectedIndexChange)=\"selectedIndex = $event\"\r\n    ></bsu-file-gallery-viewer>\r\n</ng-template>\r\n<ng-template\r\n    #layoutGridTpl\r\n    let-inDialog=\"inDialog\"\r\n    let-gallery=\"gallery\"\r\n    let-disableOrReadonly=\"disableOrReadonly\"\r\n    let-mediaData=\"mediaData\"\r\n>\r\n    <div resizeHandler [fnResize]=\"ResizeRefresh\">\r\n        <div class=\"tw-grid tw-gap-4 tw-transition-all tw-duration-300\" [ngClass]=\"gridColsClass()\">\r\n            @for (media of mediaData; track media; let i = $index) {\r\n            <div>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        cardTpl;\r\n                        context: {\r\n                            $implicit: media,\r\n                            mediaData: mediaData,\r\n                            inDialog: inDialog,\r\n                            index: i,\r\n                            disableOrReadonly: disableOrReadonly\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </div>\r\n            } @if (!inDialog && !disableOrReadonly) {\r\n            <div>\r\n                <ng-container *ngTemplateOutlet=\"newFile\"></ng-container>\r\n            </div>\r\n            }\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n    #cardTpl\r\n    let-media\r\n    let-mediaData=\"mediaData\"\r\n    let-inDialog=\"inDialog\"\r\n    let-index=\"index\"\r\n    let-disableOrReadonly=\"disableOrReadonly\"\r\n>\r\n    <fd-card class=\"media\" [class.inDialog]=\"inDialog\">\r\n        <fd-card-content class=\"tw-flex tw-h-32\">\r\n            <img class=\"tw-w-full\" imgLazy [imgLazy]=\"media.thumbnailUrl\" [src]=\"media.thumbnailUrl\" #img />\r\n        </fd-card-content>\r\n        @if (!inDialog) {\r\n        <fd-card-footer>\r\n            <button\r\n                glyph=\"print\"\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                [files]=\"[media]\"\r\n                printFiles\r\n            ></button>\r\n            <button\r\n                glyph=\"full-screen\"\r\n                [title]=\"'FullScreen' | bbbTranslate\"\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                fullscreenFiles\r\n                [deviceSize]=\"(deviceSize$ | async)!!\"\r\n                [isImageGallery]=\"true\"\r\n                [selectedIndex]=\"index\"\r\n                [files]=\"mediaData\"\r\n            ></button>\r\n\r\n            <button fd-button [glyph]=\"'overflow'\" [fdType]=\"'transparent'\" [fdMenuTrigger]=\"menu\"></button>\r\n            <fd-menu #menu>\r\n                <li fd-menu-item [files]=\"mediaData\" printFiles>\r\n                    <a fd-menu-interactive>\r\n                        <fd-menu-addon position=\"before\" glyph=\"print\"></fd-menu-addon>\r\n                        <span fd-menu-title>{{ 'Print' | bbbTranslate }} {{ 'All' | bbbTranslate }}</span>\r\n                    </a>\r\n                </li>\r\n                <li fd-menu-item [name]=\"media.label\" [src]=\"media.mediaUrl\" saveImage>\r\n                    <a fd-menu-interactive>\r\n                        <fd-menu-addon position=\"before\" glyph=\"download\"></fd-menu-addon>\r\n                        <span fd-menu-title>{{ 'Download' | bbbTranslate }}</span>\r\n                    </a>\r\n                </li>\r\n                @if (!disableOrReadonly) {\r\n                <li fd-menu-item (click)=\"onRotate(img, media, index)\">\r\n                    <a fd-menu-interactive>\r\n                        <fd-menu-addon position=\"before\" glyph=\"rotate\"></fd-menu-addon>\r\n                        <span fd-menu-title>{{ 'Rotate' | bbbTranslate }}</span>\r\n                    </a>\r\n                </li>\r\n                <li fd-menu-item (click)=\"onDelete(index)\">\r\n                    <a fd-menu-interactive>\r\n                        <fd-menu-addon position=\"before\" glyph=\"delete\"></fd-menu-addon>\r\n                        <span fd-menu-title>{{ 'Delete' | bbbTranslate }}</span>\r\n                    </a>\r\n                </li>\r\n                }\r\n            </fd-menu>\r\n        </fd-card-footer>\r\n        }\r\n    </fd-card>\r\n</ng-template>\r\n<ng-template #newFile>\r\n    <div style=\"position: relative; height: 100%\">\r\n        <fd-card>\r\n            <fd-card-content style=\"display: flex; align-items: center; justify-content: center; min-height: 120px\">\r\n                <button\r\n                    fd-button\r\n                    glyph=\"add-photo\"\r\n                    fdType=\"transparent\"\r\n                    [label]=\"'AttachFile' | bbbTranslate\"\r\n                    (click)=\"uploader.open()\"\r\n                ></button>\r\n            </fd-card-content>\r\n\r\n            <fd-card-footer style=\"border-top: 1px solid #ccc\">\r\n                <button fd-button [glyph]=\"'overflow'\" [fdType]=\"'transparent'\" [fdMenuTrigger]=\"menu\"></button>\r\n            </fd-card-footer>\r\n        </fd-card>\r\n        @if ((uploadingState$ | async)?.uploading === true) {\r\n        <bsu-mask></bsu-mask>\r\n        }\r\n    </div>\r\n</ng-template>\r\n\r\n<fd-menu #menu>\r\n    <li fd-menu-item (click)=\"onScan()\">\r\n        <a fd-menu-interactive>\r\n            <span fd-menu-title>{{ 'Scan' | bbbTranslate }}</span>\r\n        </a>\r\n    </li>\r\n    <li fd-menu-item (click)=\"onAdvanceScan()\">\r\n        <a fd-menu-interactive>\r\n            <span fd-menu-title>{{ 'AdvancedScan' | bbbTranslate }}</span>\r\n        </a>\r\n    </li>\r\n</fd-menu>\r\n", styles: [":host{position:relative}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}.big-imgs-box{position:relative}.big-imgs-box>fd-toolbar{position:absolute;z-index:5;opacity:.5}.big-imgs-box>fd-toolbar:hover{opacity:1}fd-toolbar{width:100%}fd-dialog-footer{justify-content:center}.hatchBackground{min-height:100px}.gallery{display:flex;width:100%;height:400px;column-gap:1px;background-color:var(--sapField_Background, #fff)}.gallery ::-webkit-scrollbar{width:7px;height:7px}.gallery ::-webkit-scrollbar-track{box-shadow:inset 0 0 5px gray;border-radius:4px}.gallery ::-webkit-scrollbar-thumb{background:#555454;border-radius:4px}.gallery ::-webkit-scrollbar-thumb:hover{background:#2c2b2b}.gallery .column{overflow-y:scroll;display:flex;flex-direction:column;row-gap:3%;align-items:center}.gallery .column .pics{width:100%;display:flex;justify-content:center}.gallery .column .pics img{border-radius:5px}.gallery .column.small-imgs-box{flex:10%}.gallery .column.big-imgs-box{flex:90%}.gallery .selected{background-color:#fff;border:3px solid #0294d8;padding:10px}.gallery .fill-all .pics{height:100%}.gallery .fill-all img{width:100%!important;height:100%!important;object-fit:fill!important}.gallery .fill-original img{width:unset;height:unset}.gallery .zoom1 img{zoom:1}.gallery .zoom1-5 img{zoom:1.5}.gallery .zoom2 img{zoom:2}fd-dialog .gallery{overflow:auto}fd-dialog .gallery .column{overflow:initial}fd-dialog .gallery .pics{position:relative}fd-dialog fd-dialog-body{display:flex}fd-dialog.horizontal fd-dialog-body{flex-direction:column}fd-dialog.horizontal .gallery{flex-direction:row}fd-dialog.horizontal .thumbnail{border-top:1px solid #ccc;overflow-x:auto}fd-dialog.vertical fd-dialog-body{flex-direction:row-reverse}fd-dialog.vertical .gallery{flex-direction:column;height:100%}fd-dialog.vertical .thumbnail{border-left:1px solid #ccc;height:100%;width:200px;overflow-y:auto}fd-dialog.vertical .thumbnail ::ng-deep .fd-row>div{width:100%;min-width:100%}fd-card.media fd-card-footer button{border:none}fd-card.inDialog fd-card-header{padding-top:5px;padding-bottom:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.PrintFilesDirective, selector: "[printFiles]", inputs: ["files", "file", "isImageGallery", "component"] }, { kind: "directive", type: i2.SaveImageDirective, selector: "[saveImage]", inputs: ["name", "src"] }, { kind: "directive", type: i2.ResizeHandlerDirective, selector: "[resizeHandler]", inputs: ["fnResize"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i7$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i7$3.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i5$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: FileGalleryViewerComponent, selector: "bsu-file-gallery-viewer", inputs: ["fillWidth", "deviceSize", "title", "files", "contentDensity", "isImageGallery", "isHorizontal", "selectedFile", "selectedIndex", "scrollToThumbnailIndex"], outputs: ["selectedIndexChange"] }, { kind: "directive", type: FullscreenFilesDirective, selector: "[fullscreenFiles]", inputs: ["files", "selectedIndex", "title", "deviceSize", "isImageGallery", "component"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiPicturesInfoComponent, isStandalone: false, selector: "bsu-ui-pictures-info", inputs: { value: "value" }, providers: [UploadService], viewQueries: [{ propertyName: "_fileUploader", first: true, predicate: FileUploaderComponent, descendants: true }, { propertyName: "_fileGalleryViewer", first: true, predicate: FileGalleryViewerComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-file-uploader\r\n    #uploader\r\n    [style.display]=\"'none'\"\r\n    [id]=\"id\"\r\n    [name]=\"'pictures_' + id\"\r\n    [placeholder]=\"'AttachPicture' | bbbTranslate\"\r\n    [buttonLabel]=\"'AttachPicture' | bbbTranslate\"\r\n    [buttonAriaLabel]=\"'AttachPicture' | bbbTranslate\"\r\n    accept=\".png,.jpg,.bpm,.jpeg,.gif,.png,.tif,.pdf\"    \r\n    [multiple]=\"maxFileCount === 0 || maxFileCount > 1\"\r\n    (selectedFilesChanged)=\"onFileSelection($event)\"\r\n    (selectedInvalidFiles)=\"onInvalidFiles($event)\"\r\n></fd-file-uploader>\r\n\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        isInlineGallery ? inlineGallery : layoutGridTpl;\r\n        context: {\r\n            disableOrReadonly: (disableOrReadonly$ | async),\r\n            mediaData: (mediaData$ | async),\r\n            deviceSize: (deviceSize$ | async)\r\n        }\r\n    \"\r\n></ng-container>\r\n<ng-template #inlineGallery let-mediaData=\"mediaData\" let-deviceSize=\"deviceSize\">\r\n    <fd-toolbar [shouldOverflow]=\"true\">\r\n        @if(mediaData.length && selectedIndex >-1){\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            [label]=\"'Download' | bbbTranslate\"\r\n            glyph=\"download\"\r\n            [name]=\"mediaData[selectedIndex].label\"\r\n            [src]=\"mediaData[selectedIndex].mediaUrl\"\r\n            saveImage\r\n        ></button>\r\n        }\r\n        <button\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            [label]=\"'Scan' | bbbTranslate\"\r\n            fd-toolbar-item\r\n            [glyph]=\"'x-ray'\"\r\n            [fdMenuTrigger]=\"menu\"\r\n        ></button>\r\n\r\n        <button\r\n            fd-button\r\n            fd-toolbar-item\r\n            glyph=\"add-photo\"\r\n            fdType=\"transparent\"\r\n            [label]=\"'AttachFile' | bbbTranslate\"\r\n            (click)=\"uploader.open()\"\r\n        ></button>\r\n\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            [label]=\"'Rotate' | bbbTranslate\"\r\n            glyph=\"rotate\"\r\n            (click)=\"onRotate2()\"\r\n        ></button>\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            [label]=\"'Delete' | bbbTranslate\"\r\n            glyph=\"delete\"\r\n            (click)=\"onDelete(selectedIndex)\"\r\n        ></button>\r\n        <fd-toolbar-separator></fd-toolbar-separator>\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            [glyph]=\"'text-align-justified'\"\r\n            [fdType]=\"fillWidth ? 'emphasized' : 'transparent'\"\r\n            fdType=\"transparent\"\r\n            (click)=\"fillWidth = !fillWidth\"\r\n        ></button>\r\n        <button glyph=\"print\" fdType=\"transparent\" fd-toolbar-item fd-button [files]=\"mediaData\" printFiles></button>\r\n    </fd-toolbar>\r\n\r\n    <bsu-file-gallery-viewer\r\n        [style.max-height]=\"'100svh'\"\r\n        [style.min-height.px]=\"layoutInfo.Bounds.height || 480\"\r\n        fillEmptySpace\r\n        [decrement]=\"'4.5rem'\"\r\n        [fillWidth]=\"true\"\r\n        [fillWidth]=\"fillWidth\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [title]=\"'AttachPicture' | bbbTranslate\"\r\n        [files]=\"mediaData\"\r\n        [isImageGallery]=\"true\"\r\n        [isHorizontal]=\"isThumbnailHorizontal\"\r\n        [selectedIndex]=\"selectedIndex\"\r\n        (selectedIndexChange)=\"selectedIndex = $event\"\r\n    ></bsu-file-gallery-viewer>\r\n</ng-template>\r\n<ng-template\r\n    #layoutGridTpl\r\n    let-inDialog=\"inDialog\"\r\n    let-gallery=\"gallery\"\r\n    let-disableOrReadonly=\"disableOrReadonly\"\r\n    let-mediaData=\"mediaData\"\r\n>\r\n    <div resizeHandler [fnResize]=\"ResizeRefresh\">\r\n        <div class=\"tw-grid tw-gap-4 tw-transition-all tw-duration-300\" [ngClass]=\"gridColsClass()\">\r\n            @for (media of mediaData; track media; let i = $index) {\r\n            <div>\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        cardTpl;\r\n                        context: {\r\n                            $implicit: media,\r\n                            mediaData: mediaData,\r\n                            inDialog: inDialog,\r\n                            index: i,\r\n                            disableOrReadonly: disableOrReadonly\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </div>\r\n            } @if (!inDialog && !disableOrReadonly) {\r\n            <div>\r\n                <ng-container *ngTemplateOutlet=\"newFile\"></ng-container>\r\n            </div>\r\n            }\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n    #cardTpl\r\n    let-media\r\n    let-mediaData=\"mediaData\"\r\n    let-inDialog=\"inDialog\"\r\n    let-index=\"index\"\r\n    let-disableOrReadonly=\"disableOrReadonly\"\r\n>\r\n    <fd-card class=\"media\" [class.inDialog]=\"inDialog\">\r\n        <fd-card-content class=\"tw-flex tw-h-32\">\r\n            <img class=\"tw-w-full\" imgLazy [imgLazy]=\"media.thumbnailUrl\" [src]=\"media.thumbnailUrl\" #img />\r\n        </fd-card-content>\r\n        @if (!inDialog) {\r\n        <fd-card-footer>\r\n            <button\r\n                glyph=\"print\"\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                [files]=\"[media]\"\r\n                printFiles\r\n            ></button>\r\n            <button\r\n                glyph=\"full-screen\"\r\n                [title]=\"'FullScreen' | bbbTranslate\"\r\n                *fdCardFooterActionItem\r\n                fd-button\r\n                fdType=\"transparent\"\r\n                fullscreenFiles\r\n                [deviceSize]=\"(deviceSize$ | async)!!\"\r\n                [isImageGallery]=\"true\"\r\n                [selectedIndex]=\"index\"\r\n                [files]=\"mediaData\"\r\n            ></button>\r\n\r\n            <button fd-button [glyph]=\"'overflow'\" [fdType]=\"'transparent'\" [fdMenuTrigger]=\"menu\"></button>\r\n            <fd-menu #menu>\r\n                <li fd-menu-item [files]=\"mediaData\" printFiles>\r\n                    <a fd-menu-interactive>\r\n                        <fd-menu-addon position=\"before\" glyph=\"print\"></fd-menu-addon>\r\n                        <span fd-menu-title>{{ 'Print' | bbbTranslate }} {{ 'All' | bbbTranslate }}</span>\r\n                    </a>\r\n                </li>\r\n                <li fd-menu-item [name]=\"media.label\" [src]=\"media.mediaUrl\" saveImage>\r\n                    <a fd-menu-interactive>\r\n                        <fd-menu-addon position=\"before\" glyph=\"download\"></fd-menu-addon>\r\n                        <span fd-menu-title>{{ 'Download' | bbbTranslate }}</span>\r\n                    </a>\r\n                </li>\r\n                @if (!disableOrReadonly) {\r\n                <li fd-menu-item (click)=\"onRotate(img, media, index)\">\r\n                    <a fd-menu-interactive>\r\n                        <fd-menu-addon position=\"before\" glyph=\"rotate\"></fd-menu-addon>\r\n                        <span fd-menu-title>{{ 'Rotate' | bbbTranslate }}</span>\r\n                    </a>\r\n                </li>\r\n                <li fd-menu-item (click)=\"onDelete(index)\">\r\n                    <a fd-menu-interactive>\r\n                        <fd-menu-addon position=\"before\" glyph=\"delete\"></fd-menu-addon>\r\n                        <span fd-menu-title>{{ 'Delete' | bbbTranslate }}</span>\r\n                    </a>\r\n                </li>\r\n                }\r\n            </fd-menu>\r\n        </fd-card-footer>\r\n        }\r\n    </fd-card>\r\n</ng-template>\r\n<ng-template #newFile>\r\n    <div style=\"position: relative; height: 100%\">\r\n        <fd-card>\r\n            <fd-card-content style=\"display: flex; align-items: center; justify-content: center; min-height: 120px\">\r\n                <button\r\n                    fd-button\r\n                    glyph=\"add-photo\"\r\n                    fdType=\"transparent\"\r\n                    [label]=\"'AttachFile' | bbbTranslate\"\r\n                    (click)=\"uploader.open()\"\r\n                ></button>\r\n            </fd-card-content>\r\n\r\n            <fd-card-footer style=\"border-top: 1px solid #ccc\">\r\n                <button fd-button [glyph]=\"'overflow'\" [fdType]=\"'transparent'\" [fdMenuTrigger]=\"menu\"></button>\r\n            </fd-card-footer>\r\n        </fd-card>\r\n        @if ((uploadingState$ | async)?.uploading === true) {\r\n        <bsu-mask></bsu-mask>\r\n        }\r\n    </div>\r\n</ng-template>\r\n\r\n<fd-menu #menu>\r\n    <li fd-menu-item (click)=\"onScan()\">\r\n        <a fd-menu-interactive>\r\n            <span fd-menu-title>{{ 'Scan' | bbbTranslate }}</span>\r\n        </a>\r\n    </li>\r\n    <li fd-menu-item (click)=\"onAdvanceScan()\">\r\n        <a fd-menu-interactive>\r\n            <span fd-menu-title>{{ 'AdvancedScan' | bbbTranslate }}</span>\r\n        </a>\r\n    </li>\r\n</fd-menu>\r\n", styles: [":host{position:relative}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}.big-imgs-box{position:relative}.big-imgs-box>fd-toolbar{position:absolute;z-index:5;opacity:.5}.big-imgs-box>fd-toolbar:hover{opacity:1}fd-toolbar{width:100%}fd-dialog-footer{justify-content:center}.hatchBackground{min-height:100px}.gallery{display:flex;width:100%;height:400px;column-gap:1px;background-color:var(--sapField_Background, #fff)}.gallery ::-webkit-scrollbar{width:7px;height:7px}.gallery ::-webkit-scrollbar-track{box-shadow:inset 0 0 5px gray;border-radius:4px}.gallery ::-webkit-scrollbar-thumb{background:#555454;border-radius:4px}.gallery ::-webkit-scrollbar-thumb:hover{background:#2c2b2b}.gallery .column{overflow-y:scroll;display:flex;flex-direction:column;row-gap:3%;align-items:center}.gallery .column .pics{width:100%;display:flex;justify-content:center}.gallery .column .pics img{border-radius:5px}.gallery .column.small-imgs-box{flex:10%}.gallery .column.big-imgs-box{flex:90%}.gallery .selected{background-color:#fff;border:3px solid #0294d8;padding:10px}.gallery .fill-all .pics{height:100%}.gallery .fill-all img{width:100%!important;height:100%!important;object-fit:fill!important}.gallery .fill-original img{width:unset;height:unset}.gallery .zoom1 img{zoom:1}.gallery .zoom1-5 img{zoom:1.5}.gallery .zoom2 img{zoom:2}fd-dialog .gallery{overflow:auto}fd-dialog .gallery .column{overflow:initial}fd-dialog .gallery .pics{position:relative}fd-dialog fd-dialog-body{display:flex}fd-dialog.horizontal fd-dialog-body{flex-direction:column}fd-dialog.horizontal .gallery{flex-direction:row}fd-dialog.horizontal .thumbnail{border-top:1px solid #ccc;overflow-x:auto}fd-dialog.vertical fd-dialog-body{flex-direction:row-reverse}fd-dialog.vertical .gallery{flex-direction:column;height:100%}fd-dialog.vertical .thumbnail{border-left:1px solid #ccc;height:100%;width:200px;overflow-y:auto}fd-dialog.vertical .thumbnail ::ng-deep .fd-row>div{width:100%;min-width:100%}fd-card.media fd-card-footer button{border:none}fd-card.inDialog fd-card-header{padding-top:5px;padding-bottom:5px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "directive", type: i2.PrintFilesDirective, selector: "[printFiles]", inputs: ["files", "file", "isImageGallery", "component"] }, { kind: "directive", type: i2.SaveImageDirective, selector: "[saveImage]", inputs: ["name", "src"] }, { kind: "directive", type: i2.ResizeHandlerDirective, selector: "[resizeHandler]", inputs: ["fnResize"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i7$4.CardFooterComponent, selector: "fd-card-footer" }, { kind: "directive", type: i7$4.CardFooterActionItemDirective, selector: "[fdCardFooterActionItem]" }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i5$2.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i5$2.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i5$2.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i5$2.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i5$2.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i5$2.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i7$2.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: FileGalleryViewerComponent, selector: "bsu-file-gallery-viewer", inputs: ["fillWidth", "deviceSize", "title", "files", "contentDensity", "isImageGallery", "isHorizontal", "selectedFile", "selectedIndex", "scrollToThumbnailIndex"], outputs: ["selectedIndexChange"] }, { kind: "directive", type: FullscreenFilesDirective, selector: "[fullscreenFiles]", inputs: ["files", "selectedIndex", "title", "deviceSize", "isImageGallery", "component"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiPicturesInfoComponent, decorators: [{
             type: Component,
@@ -11651,7 +11779,7 @@ class ResponsiveToolbarComponent extends BaseComponent {
         this.btnClick.emit(button);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ResponsiveToolbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: ResponsiveToolbarComponent, isStandalone: false, selector: "bsu-responsive-toolbar", inputs: { buttons: "buttons" }, outputs: { btnClick: "btnClick" }, viewQueries: [{ propertyName: "btnListRef", predicate: ["btnRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- <div style=\"width: 100%; height: 0; visibility: hidden\" #containerRef>\r\n<ng-container\r\n  *ngTemplateOutlet=\"renderToolbar; context: { $implicit: buttons }\"\r\n></ng-container>\r\n</div>\r\n<bsu-responsive-toolbar-renderer\r\n  *ngIf=\"buttonsCalculated\"\r\n  [buttons]=\"buttonsCalculated\"\r\n  (btnClick)=\"onButtonClick($event)\"\r\n  [renderToolbar]=\"renderToolbar\"\r\n></bsu-responsive-toolbar-renderer>\r\n\r\n<ng-template #renderToolbar let-btnList>\r\n  <ng-container *ngFor=\"let btn of btnList\">\r\n    <ng-container *ngIf=\"btn === '-' || btn.text === '-'; else btnCommand\">\r\n      <span #btnRef class=\"toolbar-btn toolbar-vseperator\"></span>\r\n    </ng-container>\r\n    <ng-template #btnCommand>\r\n      <ui5-button\r\n        #btnRef\r\n        (click)=\"onButtonClick(btn)\"\r\n        [attr.disabled]=\"btn.enable === false ? true : null\"\r\n        [attr.disabled]=\"btn.readonly === true ? true : null\"\r\n        class=\"toolbar-btn\"\r\n        [attr.design]=\"btn.emphasized ? 'Emphasized' : 'Transparent'\"\r\n        [attr.icon]=\"btn.newIcon ? btn.newIcon : null\"\r\n        >{{ btn.text }}\r\n        <img *ngIf=\"!btn.newIcon && !btn.isBuiltin\" width=\"16\" [src]=\"btn.icon\"\r\n        /></ui5-button>\r\n      </ng-template>\r\n    </ng-container>\r\n  </ng-template> -->\r\n\r\n<fd-toolbar [shouldOverflow]=\"true\" [style.direction]=\"dirValue$ | async\">\r\n    @for (btn of btns; track btn) { @if (btn === '-' || btn.text === '-') {\r\n    <fd-toolbar-separator></fd-toolbar-separator>\r\n    } @else {\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        (click)=\"onButtonClick(btn)\"\r\n        [attr.disabled]=\"btn.enable === false ? true : null\"\r\n        [attr.disabled]=\"btn.readonly === true ? true : null\"\r\n        [fdType]=\"btn.emphasized ? 'emphasized' : 'transparent'\"\r\n        [label]=\"btn.text\"\r\n        [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n    >\r\n        @if (!btn.newIcon && !btn.isBuiltin) {\r\n        <img width=\"16\" [src]=\"btn.icon\" />\r\n        }\r\n    </button>\r\n    }\r\n    <ng-template #btnCommand>\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            (click)=\"onButtonClick(btn)\"\r\n            [attr.disabled]=\"btn.enable === false ? true : null\"\r\n            [attr.disabled]=\"btn.readonly === true ? true : null\"\r\n            [fdType]=\"btn.emphasized ? 'emphasized' : 'transparent'\"\r\n            [label]=\"btn.text\"\r\n            [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n        >\r\n            @if (!btn.newIcon && !btn.isBuiltin) {\r\n            <img width=\"16\" [src]=\"btn.icon\" />\r\n            }\r\n        </button>\r\n    </ng-template>\r\n    }\r\n</fd-toolbar>\r\n", styles: [":host{display:block;width:100%;position:relative}:host ::ng-deep .fd-toolbar--solid{background-color:var(--sapBackgroundColor, #f7f7f7);border:none}\n"], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i8.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: ResponsiveToolbarComponent, isStandalone: false, selector: "bsu-responsive-toolbar", inputs: { buttons: "buttons" }, outputs: { btnClick: "btnClick" }, viewQueries: [{ propertyName: "btnListRef", predicate: ["btnRef"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- <div style=\"width: 100%; height: 0; visibility: hidden\" #containerRef>\r\n<ng-container\r\n  *ngTemplateOutlet=\"renderToolbar; context: { $implicit: buttons }\"\r\n></ng-container>\r\n</div>\r\n<bsu-responsive-toolbar-renderer\r\n  *ngIf=\"buttonsCalculated\"\r\n  [buttons]=\"buttonsCalculated\"\r\n  (btnClick)=\"onButtonClick($event)\"\r\n  [renderToolbar]=\"renderToolbar\"\r\n></bsu-responsive-toolbar-renderer>\r\n\r\n<ng-template #renderToolbar let-btnList>\r\n  <ng-container *ngFor=\"let btn of btnList\">\r\n    <ng-container *ngIf=\"btn === '-' || btn.text === '-'; else btnCommand\">\r\n      <span #btnRef class=\"toolbar-btn toolbar-vseperator\"></span>\r\n    </ng-container>\r\n    <ng-template #btnCommand>\r\n      <ui5-button\r\n        #btnRef\r\n        (click)=\"onButtonClick(btn)\"\r\n        [attr.disabled]=\"btn.enable === false ? true : null\"\r\n        [attr.disabled]=\"btn.readonly === true ? true : null\"\r\n        class=\"toolbar-btn\"\r\n        [attr.design]=\"btn.emphasized ? 'Emphasized' : 'Transparent'\"\r\n        [attr.icon]=\"btn.newIcon ? btn.newIcon : null\"\r\n        >{{ btn.text }}\r\n        <img *ngIf=\"!btn.newIcon && !btn.isBuiltin\" width=\"16\" [src]=\"btn.icon\"\r\n        /></ui5-button>\r\n      </ng-template>\r\n    </ng-container>\r\n  </ng-template> -->\r\n\r\n<fd-toolbar [shouldOverflow]=\"true\" [style.direction]=\"dirValue$ | async\">\r\n    @for (btn of btns; track btn) { @if (btn === '-' || btn.text === '-') {\r\n    <fd-toolbar-separator></fd-toolbar-separator>\r\n    } @else {\r\n    <button\r\n        fd-toolbar-item\r\n        fd-button\r\n        (click)=\"onButtonClick(btn)\"\r\n        [attr.disabled]=\"btn.enable === false ? true : null\"\r\n        [attr.disabled]=\"btn.readonly === true ? true : null\"\r\n        [fdType]=\"btn.emphasized ? 'emphasized' : 'transparent'\"\r\n        [label]=\"btn.text\"\r\n        [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n    >\r\n        @if (!btn.newIcon && !btn.isBuiltin) {\r\n        <img width=\"16\" [src]=\"btn.icon\" />\r\n        }\r\n    </button>\r\n    }\r\n    <ng-template #btnCommand>\r\n        <button\r\n            fd-toolbar-item\r\n            fd-button\r\n            (click)=\"onButtonClick(btn)\"\r\n            [attr.disabled]=\"btn.enable === false ? true : null\"\r\n            [attr.disabled]=\"btn.readonly === true ? true : null\"\r\n            [fdType]=\"btn.emphasized ? 'emphasized' : 'transparent'\"\r\n            [label]=\"btn.text\"\r\n            [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n        >\r\n            @if (!btn.newIcon && !btn.isBuiltin) {\r\n            <img width=\"16\" [src]=\"btn.icon\" />\r\n            }\r\n        </button>\r\n    </ng-template>\r\n    }\r\n</fd-toolbar>\r\n", styles: [":host{display:block;width:100%;position:relative}:host ::ng-deep .fd-toolbar--solid{background-color:var(--sapBackgroundColor, #f7f7f7);border:none}\n"], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i7$2.ToolbarSeparatorComponent, selector: "fd-toolbar-separator" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: ResponsiveToolbarComponent, decorators: [{
             type: Component,
@@ -11918,7 +12046,7 @@ class FormDialogComponent extends BaseComponent {
         this.caption = typeDefName + ':' + moCaption;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormDialogComponent, isStandalone: false, selector: "bsu-form-dialog", providers: [ContainerService], viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialog"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_dialogForm", first: true, predicate: ["dialogTplRef"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialog>\r\n    <fd-dialog\r\n        [dialogConfig]=\"dialogConfig\"\r\n        [dialogRef]=\"dialog\"\r\n        #dialogTplRef\r\n        class=\"form-dialog\"\r\n        intersectionObserver\r\n        [intersectionThreshold]=\"0.5\"\r\n        (visibilityChange)=\"onBarRightVisibilityChange($event, dialogBody, dialogTplRef)\"\r\n    >\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                @if(formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':false:true;as toolbarItems){\r\n                <div\r\n                    fd-bar-left\r\n                    #barLeft\r\n                    intersectionObserver\r\n                    [intersectionThreshold]=\"0.5\"\r\n                    (visibilityChange)=\"onHeaderTitleVisibilityChange($event, barLeft)\"\r\n                >\r\n                    <h1 fd-title>\r\n                        {{ title }}\r\n                    </h1>\r\n                </div>\r\n                <div fd-bar-center style=\"flex: 1; display: none\"></div>\r\n                <div fd-bar-right #barRight class=\"bar-right\" [attr.items]=\"toolbarItems.length\">\r\n                    <bsu-form-toolbar\r\n                        fd-bar-right\r\n                        class=\"toolbar-hide-spacer\"\r\n                        [width]=\"'100%'\"\r\n                        [shouldOverflow]=\"true\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems | filterWorkflowInMobile: showWorkflowButtonsOnFooter\"\r\n                        [dirValue]=\"(formUi()?.dirValue$ | async)!!\"\r\n                        [isFirefox]=\"isFirefox\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (dialogConfig.data.canFullscreen) {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"\r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"onFullscreenToggle(dialog, dialogBody, dialogTplRef)\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar\r\n                        ariaLabel=\"close\"\r\n                        glyph=\"decline\"\r\n                        (click)=\"onCancel()\"\r\n                        [style.width]=\"\"\r\n                    ></fd-button-bar>\r\n                </div>\r\n                }\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body #dialogBody>\r\n            <bnrc-form\r\n                [formPanelCtrl]=\"formPanelCtrlr\"\r\n                [params]=\"params\"\r\n                (formClose)=\"onFormClose()\"\r\n                (uiComponent)=\"onFormUiComponentReady($event)\"\r\n            ></bnrc-form>\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer [style.display]=\"!showFooter ? 'none' : null\">\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div fd-bar-right>\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            layoutactions;\r\n                            context: {\r\n                                workflowButtons: (formUi()?.workflowButtons$ | async),\r\n                                extendToolbarItems:\r\n                                    (formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':true)\r\n                            }\r\n                        \"\r\n                    >\r\n                    </ng-container>\r\n                    <ng-template\r\n                        #layoutactions\r\n                        let-workflowButtons=\"workflowButtons\"\r\n                        let-extendToolbarItems=\"extendToolbarItems\"\r\n                    >\r\n                        @if(workflowButtons.length && showWorkflowButtonsOnFooter ){\r\n                        <bsu-layout-actions\r\n                            [canSend]=\"false\"\r\n                            [buttons]=\"[]\"\r\n                            [isMobile]=\"isMobile\"\r\n                            [landscape]=\"(formUi()?.landscape$ | async) === true\"\r\n                            [standalone]=\"(formUi()?.standalone$ | async) === true\"\r\n                            [workflowButtons]=\"workflowButtons\"\r\n                            [workflowButtonsComboMode]=\"true\"\r\n                            [deviceSize]=\"deviceSize\"\r\n                            [rtl]=\"(formUi()?.rtl$ | async) === true\"\r\n                            (toolClick)=\"onToolbarClick($event)\"\r\n                            (workflowChoiceSelect)=\"onWorkflowChoiceClick($event)\"\r\n                        >\r\n                        </bsu-layout-actions>\r\n                        }@if(!hideFooter){ @for (btn of extendToolbarItems ; track btn.Id) { @if (!(btn === '-' ||\r\n                        btn.text === '-') ) {\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                            btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                            context: { $implicit: btn ,}\r\n                        \"\r\n                        ></ng-container>\r\n                        <ng-template #btnTemplate let-btn>\r\n                            <fd-dialog-footer-button>\r\n                                <fd-button-bar\r\n                                    [fdType]=\"\r\n                                        workflowButtons?.length && btn.design === 'emphasized' ? 'ghost' : btn.design\r\n                                    \"\r\n                                    [label]=\"btn.text | bbbTranslate\"\r\n                                    [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n                                    (click)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                                ></fd-button-bar>\r\n                            </fd-dialog-footer-button>\r\n                        </ng-template>\r\n                        <ng-template #dynamicBtnTemplate let-btn>\r\n                            <fd-dialog-footer-button>\r\n                                <bnrc-dynamic-form-toolbaritem\r\n                                    fd-toolbar-item\r\n                                    [component]=\"btn.Data.CustomUi\"\r\n                                    [context]=\"btn\"\r\n                                    [isEnable]=\"btn.Command?._isEnable\"\r\n                                    (btnClick)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                                ></bnrc-dynamic-form-toolbaritem>\r\n                            </fd-dialog-footer-button>\r\n                        </ng-template>\r\n                        } } @if (!isNonePersistance && showSaveButton !== false) {\r\n                        <fd-dialog-footer-button>\r\n                            <fd-button-bar\r\n                                fd-initial-focus\r\n                                fd-dialog-decisive-button\r\n                                [label]=\"'Cancel' | bbbTranslate\"\r\n                                (click)=\"onCancel()\"\r\n                            ></fd-button-bar>\r\n                        </fd-dialog-footer-button>\r\n                        } }\r\n                    </ng-template>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto}fd-dialog-body{display:flex;flex-direction:column;height:100%;align-items:stretch;justify-content:stretch}fd-dialog-body>bnrc-form{flex-grow:1;display:flex;flex-direction:row;height:100%;justify-content:stretch;align-items:stretch}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "UlvMainCtrlr", "formPanelCtrlId", "saveOnChange", "inlineEditInReport"], outputs: ["titleChanged", "moChanged", "formClose", "uiComponent", "formRendered", "bruleAction", "beforeTransition", "afterTransition"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TlbButtonsPipe, name: "tlbButtons" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormDialogComponent, isStandalone: false, selector: "bsu-form-dialog", providers: [ContainerService], viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialog"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_dialogForm", first: true, predicate: ["dialogTplRef"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #dialog>\r\n    <fd-dialog\r\n        [dialogConfig]=\"dialogConfig\"\r\n        [dialogRef]=\"dialog\"\r\n        #dialogTplRef\r\n        class=\"form-dialog\"\r\n        intersectionObserver\r\n        [intersectionThreshold]=\"0.5\"\r\n        (visibilityChange)=\"onBarRightVisibilityChange($event, dialogBody, dialogTplRef)\"\r\n    >\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                @if(formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':false:true;as toolbarItems){\r\n                <div\r\n                    fd-bar-left\r\n                    #barLeft\r\n                    intersectionObserver\r\n                    [intersectionThreshold]=\"0.5\"\r\n                    (visibilityChange)=\"onHeaderTitleVisibilityChange($event, barLeft)\"\r\n                >\r\n                    <h1 fd-title>\r\n                        {{ title }}\r\n                    </h1>\r\n                </div>\r\n                <div fd-bar-center style=\"flex: 1; display: none\"></div>\r\n                <div fd-bar-right #barRight class=\"bar-right\" [attr.items]=\"toolbarItems.length\">\r\n                    <bsu-form-toolbar\r\n                        fd-bar-right\r\n                        class=\"toolbar-hide-spacer\"\r\n                        [width]=\"'100%'\"\r\n                        [shouldOverflow]=\"true\"\r\n                        [deviceSize]=\"deviceSize\"\r\n                        [buttons]=\"toolbarItems | filterWorkflowInMobile: showWorkflowButtonsOnFooter\"\r\n                        [dirValue]=\"(formUi()?.dirValue$ | async)!!\"\r\n                        [isFirefox]=\"isFirefox\"\r\n                        (toolbarClick)=\"onToolbarClick($event)\"\r\n                        #formToolbar\r\n                    ></bsu-form-toolbar>\r\n                    @if (dialogConfig.data.canFullscreen) {\r\n                    <fd-button-bar\r\n                        ariaLabel=\"fullscreen\"\r\n                        fullscreenDialog\r\n                        [glyph]=\"(dialog.fullScreen | async) === true ? 'exitfullscreen' : 'resize'\"\r\n                        (click)=\"onFullscreenToggle(dialog, dialogBody, dialogTplRef)\"\r\n                    ></fd-button-bar>\r\n                    }\r\n                    <fd-button-bar\r\n                        ariaLabel=\"close\"\r\n                        glyph=\"decline\"\r\n                        (click)=\"onCancel()\"\r\n                        [style.width]=\"\"\r\n                    ></fd-button-bar>\r\n                </div>\r\n                }\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body #dialogBody>\r\n            <bnrc-form\r\n                [formPanelCtrl]=\"formPanelCtrlr\"\r\n                [params]=\"params\"\r\n                (formClose)=\"onFormClose()\"\r\n                (uiComponent)=\"onFormUiComponentReady($event)\"\r\n            ></bnrc-form>\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer [style.display]=\"!showFooter ? 'none' : null\">\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div fd-bar-right>\r\n                    <ng-container\r\n                        *ngTemplateOutlet=\"\r\n                            layoutactions;\r\n                            context: {\r\n                                workflowButtons: (formUi()?.workflowButtons$ | async),\r\n                                extendToolbarItems:\r\n                                    (formUi()?.extendToolbarItems$ | async | tlbButtons: 'inFooter':true)\r\n                            }\r\n                        \"\r\n                    >\r\n                    </ng-container>\r\n                    <ng-template\r\n                        #layoutactions\r\n                        let-workflowButtons=\"workflowButtons\"\r\n                        let-extendToolbarItems=\"extendToolbarItems\"\r\n                    >\r\n                        @if(workflowButtons.length && showWorkflowButtonsOnFooter ){\r\n                        <bsu-layout-actions\r\n                            [canSend]=\"false\"\r\n                            [buttons]=\"[]\"\r\n                            [isMobile]=\"isMobile\"\r\n                            [landscape]=\"(formUi()?.landscape$ | async) === true\"\r\n                            [standalone]=\"(formUi()?.standalone$ | async) === true\"\r\n                            [workflowButtons]=\"workflowButtons\"\r\n                            [workflowButtonsComboMode]=\"true\"\r\n                            [deviceSize]=\"deviceSize\"\r\n                            [rtl]=\"(formUi()?.rtl$ | async) === true\"\r\n                            (toolClick)=\"onToolbarClick($event)\"\r\n                            (workflowChoiceSelect)=\"onWorkflowChoiceClick($event)\"\r\n                        >\r\n                        </bsu-layout-actions>\r\n                        }@if(!hideFooter){ @for (btn of extendToolbarItems ; track btn.Id) { @if (!(btn === '-' ||\r\n                        btn.text === '-') ) {\r\n                        <ng-container\r\n                            *ngTemplateOutlet=\"\r\n                            btn.Data?.CustomUi?.Selector ? dynamicBtnTemplate : btnTemplate;\r\n                            context: { $implicit: btn ,}\r\n                        \"\r\n                        ></ng-container>\r\n                        <ng-template #btnTemplate let-btn>\r\n                            <fd-dialog-footer-button>\r\n                                <fd-button-bar\r\n                                    [fdType]=\"\r\n                                        workflowButtons?.length && btn.design === 'emphasized' ? 'ghost' : btn.design\r\n                                    \"\r\n                                    [label]=\"btn.text | bbbTranslate\"\r\n                                    [glyph]=\"btn.newIcon ? btn.newIcon : null\"\r\n                                    (click)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                                ></fd-button-bar>\r\n                            </fd-dialog-footer-button>\r\n                        </ng-template>\r\n                        <ng-template #dynamicBtnTemplate let-btn>\r\n                            <fd-dialog-footer-button>\r\n                                <bnrc-dynamic-form-toolbaritem\r\n                                    fd-toolbar-item\r\n                                    [component]=\"btn.Data.CustomUi\"\r\n                                    [context]=\"btn\"\r\n                                    [isEnable]=\"btn.Command?._isEnable\"\r\n                                    (btnClick)=\"btn.handler(btn, formPanelCtrlr?.Adapter?.Control)\"\r\n                                ></bnrc-dynamic-form-toolbaritem>\r\n                            </fd-dialog-footer-button>\r\n                        </ng-template>\r\n                        } } @if (!isNonePersistance && showSaveButton !== false) {\r\n                        <fd-dialog-footer-button>\r\n                            <fd-button-bar\r\n                                fd-initial-focus\r\n                                fd-dialog-decisive-button\r\n                                [label]=\"'Cancel' | bbbTranslate\"\r\n                                (click)=\"onCancel()\"\r\n                            ></fd-button-bar>\r\n                        </fd-dialog-footer-button>\r\n                        } }\r\n                    </ng-template>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [":host{display:block;height:auto}fd-dialog-body{display:flex;flex-direction:column;height:100%;align-items:stretch;justify-content:stretch}fd-dialog-body>bnrc-form{flex-grow:1;display:flex;flex-direction:row;height:100%;justify-content:stretch;align-items:stretch}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.FormComponent, selector: "bnrc-form", inputs: ["params", "customFormPanelUi", "formPanelCtrl", "UlvMainCtrlr", "formPanelCtrlId", "saveOnChange", "inlineEditInReport"], outputs: ["titleChanged", "moChanged", "formClose", "uiComponent", "formRendered", "bruleAction", "beforeTransition", "afterTransition"] }, { kind: "component", type: i2.DynamicFormToolbaritemComponent, selector: "bnrc-dynamic-form-toolbaritem", inputs: ["mo", "index", "deviceName", "deviceSize", "context", "btn", "isEnable", "showText", "allColumns", "conditionalFormats"], outputs: ["btnClick"] }, { kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: LayoutActionsComponent, selector: "bsu-layout-actions", inputs: ["workflowButtons", "workflowButtonsComboMode", "canSend", "simple", "footerDesign"], outputs: ["workflowChoiceSelect"] }, { kind: "component", type: FormToolbarComponent, selector: "bsu-form-toolbar", outputs: ["toolbarClick"] }, { kind: "directive", type: FullscreenDialogDirective, selector: "[fullscreenDialog]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.TlbButtonsPipe, name: "tlbButtons" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormDialogComponent, decorators: [{
             type: Component,
@@ -12382,7 +12510,7 @@ class UlvSelectionComponent extends BaseComponent {
         this.visibility = this.visibility ? true : false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UlvSelectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UlvSelectionComponent, isStandalone: false, selector: "bsu-ulv-selection", inputs: { context: "context", config: "config", body: "body" }, viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialogRef"], descendants: true, read: TemplateRef }, { propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h3 fd-title>{{ data.title }}</h3>\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body>\r\n            @if (data.ulvUi; as ulvUi) {\r\n            <bsu-ui-ulv-main-ui [context]=\"ulvUi\"></bsu-ui-ulv-main-ui>\r\n            }\r\n            <div\r\n                class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\r\n                aria-label=\"Selected and condition items\"\r\n                i18n-aria-label=\"@@platformI18nValueHelpDialog.SelectionBarLabel\"\r\n            >\r\n                <h5 fd-title class=\"selected-and-condition-title\">\r\n                    <ng-container>\r\n                        <ng-container i18n=\"@@platformI18nValueHelpDialog.SelectedAndConditionLabel\"\r\n                            >Selected Items and Conditions\r\n                        </ng-container>\r\n                        ({{ data.selectedItems?.length || 0 }})\r\n                    </ng-container>\r\n                </h5>\r\n\r\n                <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\r\n                    <div class=\"ulv-selection-form-dialog__tokens\">\r\n                        @if (data.selectedItems) {\r\n                        <fd-toolbar [shouldOverflow]=\"true\">\r\n                            <!-- Selected items -->\r\n                            @for ( item of data.selectedItems; track _trackBySelectedFn(selectedIndex, item); let\r\n                            selectedIndex = $index) {\r\n                            <fd-token\r\n                                fd-toolbar-item\r\n                                fdOverflowPriority=\"high\"\r\n                                class=\"fdp-value-help-dialog__selection-token\"\r\n                                (onCloseClick)=\"onRemoveSelected()\"\r\n                                >{{ item.$Caption }}\r\n                            </fd-token>\r\n                            }\r\n                        </fd-toolbar>\r\n                        }\r\n                    </div>\r\n                    <button\r\n                        class=\"ulv-selection-form-dialog__tokens-clear\"\r\n                        fd-button\r\n                        fdType=\"transparent\"\r\n                        glyph=\"decline\"\r\n                        i18n-aria-label=\"@@platformI18nValueHelpDialog.ClearSelectedAriaLabel\"\r\n                        aria-label=\"clear selected items\"\r\n                        (click)=\"onClear()\"\r\n                    ></button>\r\n                </div>\r\n            </div>\r\n        </fd-dialog-body>\r\n\r\n        <fd-dialog-footer>\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div class=\"fd-bar__right\">\r\n                    <button\r\n                        fd-button\r\n                        data-succes\r\n                        i18n-label=\"@@platformI18nValueHelpDialog.SuccessButton\"\r\n                        label=\"OK\"\r\n                        fdType=\"emphasized\"\r\n                        (click)=\"onOk()\"\r\n                    ></button>\r\n                    <button\r\n                        fd-button\r\n                        data-dismiss-dialog\r\n                        fd-dialog-decisive-button\r\n                        i18n-label=\"@@platformI18nValueHelpDialog.CancelButton\"\r\n                        label=\"Cancel\"\r\n                        fdType=\"transparent\"\r\n                        (click)=\"onDismiss()\"\r\n                    ></button>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UlvSelectionComponent, isStandalone: false, selector: "bsu-ulv-selection", inputs: { context: "context", config: "config", body: "body" }, viewQueries: [{ propertyName: "dialogTemplateRef", first: true, predicate: ["dialogRef"], descendants: true, read: TemplateRef }, { propertyName: "contentRef", first: true, predicate: ["content"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template let-dialog let-dialogConfig=\"dialogConfig\" #container>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h3 fd-title>{{ data.title }}</h3>\r\n        </fd-dialog-header>\r\n\r\n        <fd-dialog-body>\r\n            @if (data.ulvUi; as ulvUi) {\r\n            <bsu-ui-ulv-main-ui [context]=\"ulvUi\"></bsu-ui-ulv-main-ui>\r\n            }\r\n            <div\r\n                class=\"ulv-selection-form-dialog__row ulv-selection-form-dialog__selection-row\"\r\n                aria-label=\"Selected and condition items\"\r\n                i18n-aria-label=\"@@platformI18nValueHelpDialog.SelectionBarLabel\"\r\n            >\r\n                <h5 fd-title class=\"selected-and-condition-title\">\r\n                    <ng-container>\r\n                        <ng-container i18n=\"@@platformI18nValueHelpDialog.SelectedAndConditionLabel\"\r\n                            >Selected Items and Conditions\r\n                        </ng-container>\r\n                        ({{ data.selectedItems?.length || 0 }})\r\n                    </ng-container>\r\n                </h5>\r\n\r\n                <div class=\"ulv-selection-form-dialog__tokens-wrapper\">\r\n                    <div class=\"ulv-selection-form-dialog__tokens\">\r\n                        @if (data.selectedItems) {\r\n                        <fd-toolbar [shouldOverflow]=\"true\">\r\n                            <!-- Selected items -->\r\n                            @for ( item of data.selectedItems; track _trackBySelectedFn(selectedIndex, item); let\r\n                            selectedIndex = $index) {\r\n                            <fd-token\r\n                                fd-toolbar-item\r\n                                fdOverflowPriority=\"high\"\r\n                                class=\"fdp-value-help-dialog__selection-token\"\r\n                                (onCloseClick)=\"onRemoveSelected()\"\r\n                                >{{ item.$Caption }}\r\n                            </fd-token>\r\n                            }\r\n                        </fd-toolbar>\r\n                        }\r\n                    </div>\r\n                    <button\r\n                        class=\"ulv-selection-form-dialog__tokens-clear\"\r\n                        fd-button\r\n                        fdType=\"transparent\"\r\n                        glyph=\"decline\"\r\n                        i18n-aria-label=\"@@platformI18nValueHelpDialog.ClearSelectedAriaLabel\"\r\n                        aria-label=\"clear selected items\"\r\n                        (click)=\"onClear()\"\r\n                    ></button>\r\n                </div>\r\n            </div>\r\n        </fd-dialog-body>\r\n\r\n        <fd-dialog-footer>\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div class=\"fd-bar__right\">\r\n                    <button\r\n                        fd-button\r\n                        data-succes\r\n                        i18n-label=\"@@platformI18nValueHelpDialog.SuccessButton\"\r\n                        label=\"OK\"\r\n                        fdType=\"emphasized\"\r\n                        (click)=\"onOk()\"\r\n                    ></button>\r\n                    <button\r\n                        fd-button\r\n                        data-dismiss-dialog\r\n                        fd-dialog-decisive-button\r\n                        i18n-label=\"@@platformI18nValueHelpDialog.CancelButton\"\r\n                        label=\"Cancel\"\r\n                        fdType=\"transparent\"\r\n                        (click)=\"onDismiss()\"\r\n                    ></button>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i13.TokenComponent, selector: "fd-token", inputs: ["disabled", "selected", "readOnly"], outputs: ["onCloseClick", "onRemove", "onTokenClick", "onTokenKeydown", "elementFocused"] }, { kind: "component", type: UiUlvMainUiComponent, selector: "bsu-ui-ulv-main-ui", inputs: ["context", "isReportPage", "inDialog", "isMultiSelect", "layoutInfo", "fullscreen"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UlvSelectionComponent, decorators: [{
             type: Component,
@@ -12632,7 +12760,7 @@ class UiMultiSelectComboComponent extends FieldBaseComponent {
         this.fireContextEvent('select', this.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiMultiSelectComboComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiMultiSelectComboComponent, isStandalone: false, selector: "bsu-ui-multi-select-combo", viewQueries: [{ propertyName: "multiInputComponent", first: true, predicate: MultiInputComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-multi-input\r\n    #multiInput\r\n    inputId=\"multiInput\"\r\n    [disabled]=\"(disableOrReadonly$ | async)!!\"\r\n    [dropdownValues]=\"dataList\"\r\n    [placeholder]=\"'Search' | bbbTranslate\"\r\n    [(ngModel)]=\"selectedItems\"\r\n    [displayFn]=\"displayFunc\"\r\n    [valueFn]=\"valueFunc\"\r\n    [itemTemplate]=\"template\"\r\n    (openChange)=\"onOpenChange($event, multiInput)\"\r\n    (selectedChange)=\"onSelectedChange()\"\r\n    [style.max-width.px]=\"maxWidth\"\r\n></fd-multi-input>\r\n<ng-template #template let-item>\r\n    <div style=\"display: flex; align-items: center\">\r\n        @if (item.url) {\r\n        <img [attrRtl] [src]=\"item.url\" />\r\n        }\r\n        <span fd-list-title>{{ item.txt | bbbTranslate }}</span>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "component", type: i8$3.MultiInputComponent, selector: "fd-multi-input", inputs: ["placeholder", "disabled", "required", "compactCollapse", "maxHeight", "glyph", "glyphFont", "dropdownValues", "openDropdownOnAddOnClicked", "addonIconTitle", "searchTerm", "inputId", "highlight", "selected", "class", "filterFn", "valueFn", "displayFn", "newTokenParseFn", "optionItemIdentifier", "newTokenValidateFn", "ariaLabel", "ariaLabelledBy", "fillControlMode", "state", "buttonFocusable", "allowNewTokens", "mobile", "showAllButton", "bodyMaxWidth", "mobileConfig", "includes", "itemTemplate", "title", "byline", "autoComplete", "open", "displayAddonButton", "addOnButtonAriaLabel"], outputs: ["searchTermChange", "selectedChange", "openChange", "addOnButtonClicked", "allItemsSelectedChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiMultiSelectComboComponent, isStandalone: false, selector: "bsu-ui-multi-select-combo", viewQueries: [{ propertyName: "multiInputComponent", first: true, predicate: MultiInputComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<fd-multi-input\r\n    #multiInput\r\n    inputId=\"multiInput\"\r\n    [disabled]=\"(disableOrReadonly$ | async)!!\"\r\n    [dropdownValues]=\"dataList\"\r\n    [placeholder]=\"'Search' | bbbTranslate\"\r\n    [(ngModel)]=\"selectedItems\"\r\n    [displayFn]=\"displayFunc\"\r\n    [valueFn]=\"valueFunc\"\r\n    [itemTemplate]=\"template\"\r\n    (openChange)=\"onOpenChange($event, multiInput)\"\r\n    (selectedChange)=\"onSelectedChange()\"\r\n    [style.max-width.px]=\"maxWidth\"\r\n></fd-multi-input>\r\n<ng-template #template let-item>\r\n    <div style=\"display: flex; align-items: center\">\r\n        @if (item.url) {\r\n        <img [attrRtl] [src]=\"item.url\" />\r\n        }\r\n        <span fd-list-title>{{ item.txt | bbbTranslate }}</span>\r\n    </div>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "component", type: i8$2.MultiInputComponent, selector: "fd-multi-input", inputs: ["placeholder", "disabled", "required", "compactCollapse", "maxHeight", "glyph", "glyphFont", "dropdownValues", "openDropdownOnAddOnClicked", "addonIconTitle", "searchTerm", "inputId", "highlight", "selected", "class", "filterFn", "valueFn", "displayFn", "newTokenParseFn", "optionItemIdentifier", "newTokenValidateFn", "ariaLabel", "ariaLabelledBy", "fillControlMode", "state", "buttonFocusable", "allowNewTokens", "mobile", "showAllButton", "bodyMaxWidth", "mobileConfig", "includes", "itemTemplate", "title", "byline", "autoComplete", "open", "displayAddonButton", "addOnButtonAriaLabel"], outputs: ["searchTermChange", "selectedChange", "openChange", "addOnButtonClicked", "allItemsSelectedChange"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiMultiSelectComboComponent, decorators: [{
             type: Component,
@@ -12671,6 +12799,10 @@ class UiMoInfoUlvComboComponent extends FieldBaseComponent {
         /* eslint-disable */
         this.Expand = (type) => {
             this.ulvAdapter = this.UlvMainCtrlr[type];
+            const searchPanel = BarsaApi.Common.Util.TryGetValue(this.ulvAdapter, 'Setting.SearchPanel', null);
+            if (searchPanel) {
+                this.onSearch();
+            }
         };
         /* eslint-disable */
         this.on = () => { };
@@ -13153,7 +13285,7 @@ class UiPictureFileComponent extends FieldBaseComponent {
         }))));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiPictureFileComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiPictureFileComponent, isStandalone: false, selector: "bsu-ui-picture-file", inputs: { imageUrl: "imageUrl", sizeMode: "sizeMode", hideUpload: "hideUpload" }, host: { properties: { "class.editable": "this._editable" } }, providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<div\r\n    [style.max-height]=\"Setting.SizeMode === '2' ? null : layoutHeight\"\r\n    [class.no-inlineEdit]=\"!inlineEdit\"\r\n    [style.min-height.px]=\"!value && !inlineEdit ? null : 140\"\r\n    [class.inlineEdit]=\"inlineEdit\"\r\n>\r\n    @if (!((disableOrReadonly$ | async) === true || Setting.IsReadOnly === true)) {\r\n    <div>\r\n        <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"value && imageUrl ? false : true\">\r\n            <fd-file-uploader\r\n                #uploader\r\n                fd-toolbar-item\r\n                [style.display]=\"'none'\"\r\n                [id]=\"id\"\r\n                [name]=\"'uploader_' + id\"\r\n                [placeholder]=\"'AttachPicture' | bbbTranslate\"\r\n                [buttonLabel]=\"'AttachPicture' | bbbTranslate\"\r\n                [buttonAriaLabel]=\"'AttachPicture' | bbbTranslate\"\r\n                [accept]=\"validExtensions\"\r\n                [(ngModel)]=\"files\"\r\n                [multiple]=\"false\"\r\n                (selectedFilesChanged)=\"onFileSelection($event)\"\r\n            ></fd-file-uploader>\r\n            @if(value && !value?.IsDeleted){\r\n            <button\r\n                fd-button\r\n                fd-toolbar-item\r\n                glyph=\"print\"\r\n                fdType=\"transparent\"\r\n                printFiles\r\n                [files]=\"[{ Id: '0', IsNew: true, IsDeleted: false, Type: 'image', mediaUrl: imageUrl }]\"\r\n            ></button>\r\n            <button\r\n                fd-button\r\n                fd-toolbar-item\r\n                glyph=\"download\"\r\n                fdType=\"transparent\"\r\n                [name]=\"Setting.ControlFieldCaption + value.Ext\"\r\n                [src]=\"imageUrl\"\r\n                saveImage\r\n            ></button>\r\n            }\r\n            <button\r\n                class=\"delete\"\r\n                fd-button\r\n                fd-toolbar-item\r\n                [disabled]=\"!this.value || value?.IsDeleted\"\r\n                glyph=\"delete\"\r\n                [fdType]=\"'transparent'\"\r\n                (click)=\"onFileDeleted(uploader)\"\r\n            ></button>\r\n            @if(!hideUpload){\r\n            <button\r\n                fd-toolbar-item\r\n                fd-button\r\n                [disabled]=\"this.value && value?.IsDeleted !== true\"\r\n                glyph=\"attachment\"\r\n                [fdType]=\"'transparent'\"\r\n                (click)=\"uploader.open()\"\r\n            ></button>\r\n            }\r\n            <ng-content select=\"[fd-toolbar-item]\"></ng-content>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    loadingTpl;\r\n                    context: {\r\n                        uploadingState: uploadingState$ | async\r\n                    }\r\n                \"\r\n            >\r\n            </ng-container>\r\n        </fd-toolbar>\r\n    </div>\r\n    } @if (!inlineEdit) {\r\n    <div\r\n        [style.max-height.px]=\"Setting.SizeMode === '0' ? layoutInfo.ControlBounds.height : null\"\r\n        [style.max-width.px]=\"Setting.SizeMode === '0' ? layoutInfo.ControlBounds.width : null\"\r\n        [class.centerImage]=\"Setting.SizeMode === '3'\"\r\n        [style.min-height.px]=\"140\"\r\n    >\r\n        @if (value && imageUrl) {\r\n        <bsu-mask [top]=\"'0px'\"></bsu-mask>\r\n        } @if ((value && imageUrl) || Setting.HasDefaultPicture) {\r\n        <img\r\n            imgLazy\r\n            [imgLazy]=\"imageUrl\"\r\n            [src]=\"imageUrl\"\r\n            [ngClass]=\"Setting.SizeMode === '1' ? 'cover' : 'contain'\"\r\n            [style.height.px]=\"Setting.SizeMode !== '2' ? layoutInfo.ControlBounds.height : null\"\r\n             [style.min-height.px]=\"!value && !inlineEdit ? null : 140\"\r\n        />\r\n        }\r\n    </div>\r\n    } @else {\r\n    <fd-avatar [size]=\"'m'\" [image]=\"imageUrl\"></fd-avatar>\r\n    }\r\n</div>\r\n<ng-template #loadingTpl let-uploadingState=\"uploadingState\">\r\n    @if (uploadingState && uploadingState.state !== 'Complete' && uploadingState.uploading) {\r\n    <fd-slider\r\n        [(ngModel)]=\"uploadingState.progress\"\r\n        [name]=\"'slider_' + id\"\r\n        fd-toolbar-item\r\n        [id]=\"id + '1'\"\r\n        [min]=\"0\"\r\n        [max]=\"100\"\r\n        [step]=\"1\"\r\n    >\r\n    </fd-slider>\r\n    @if (uploadingState.state === 'Uploading') {\r\n    <button fd-toolbar-item fd-button glyph=\"stop\" fdType=\"transparent\" (click)=\"onTerminate()\"></button>\r\n    } @if (uploadingState.state === 'Error') {\r\n    <button fd-toolbar-item fd-button glyph=\"refresh\" [fdType]=\"'transparent'\" (click)=\"onRetry()\"></button>\r\n    } }\r\n</ng-template>\r\n", styles: [":host{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;overflow:hidden;margin-bottom:.25rem;margin-top:.1875rem}:host.editable{border:.0625rem solid var(--sapGroup_TitleBorderColor)}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}img{width:100%}.pic-wrapper{background-repeat:no-repeat;background-position:center}.cover{max-width:100%;max-height:100%;min-height:100%;width:100%;height:100%;background-size:cover}.contain{max-width:100%;max-height:100%;min-height:100%;width:auto;height:100%;background-size:contain}.no-inlineEdit{width:100%;position:relative;display:flex;flex-direction:column}.inlineEdit{width:100%;position:relative;display:flex;flex-direction:row-reverse;align-items:flex-end;justify-content:flex-start}.centerImage{display:flex;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i2.PrintFilesDirective, selector: "[printFiles]", inputs: ["files", "file", "isImageGallery", "component"] }, { kind: "directive", type: i2.SaveImageDirective, selector: "[saveImage]", inputs: ["name", "src"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiPictureFileComponent, isStandalone: false, selector: "bsu-ui-picture-file", inputs: { imageUrl: "imageUrl", sizeMode: "sizeMode", hideUpload: "hideUpload" }, host: { properties: { "class.editable": "this._editable" } }, providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<div\r\n    [style.max-height]=\"Setting.SizeMode === '2' ? null : layoutHeight\"\r\n    [class.no-inlineEdit]=\"!inlineEdit\"\r\n    [style.min-height.px]=\"!value && !inlineEdit ? null : 140\"\r\n    [class.inlineEdit]=\"inlineEdit\"\r\n>\r\n    @if (!((disableOrReadonly$ | async) === true || Setting.IsReadOnly === true)) {\r\n    <div>\r\n        <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"value && imageUrl ? false : true\">\r\n            <fd-file-uploader\r\n                #uploader\r\n                fd-toolbar-item\r\n                [style.display]=\"'none'\"\r\n                [id]=\"id\"\r\n                [name]=\"'uploader_' + id\"\r\n                [placeholder]=\"'AttachPicture' | bbbTranslate\"\r\n                [buttonLabel]=\"'AttachPicture' | bbbTranslate\"\r\n                [buttonAriaLabel]=\"'AttachPicture' | bbbTranslate\"\r\n                [accept]=\"validExtensions\"\r\n                [(ngModel)]=\"files\"\r\n                [multiple]=\"false\"\r\n                (selectedFilesChanged)=\"onFileSelection($event)\"\r\n            ></fd-file-uploader>\r\n            @if(value && !value?.IsDeleted){\r\n            <button\r\n                fd-button\r\n                fd-toolbar-item\r\n                glyph=\"print\"\r\n                fdType=\"transparent\"\r\n                printFiles\r\n                [files]=\"[{ Id: '0', IsNew: true, IsDeleted: false, Type: 'image', mediaUrl: imageUrl }]\"\r\n            ></button>\r\n            <button\r\n                fd-button\r\n                fd-toolbar-item\r\n                glyph=\"download\"\r\n                fdType=\"transparent\"\r\n                [name]=\"Setting.ControlFieldCaption + value.Ext\"\r\n                [src]=\"imageUrl\"\r\n                saveImage\r\n            ></button>\r\n            }\r\n            <button\r\n                class=\"delete\"\r\n                fd-button\r\n                fd-toolbar-item\r\n                [disabled]=\"!this.value || value?.IsDeleted\"\r\n                glyph=\"delete\"\r\n                [fdType]=\"'transparent'\"\r\n                (click)=\"onFileDeleted(uploader)\"\r\n            ></button>\r\n            @if(!hideUpload){\r\n            <button\r\n                fd-toolbar-item\r\n                fd-button\r\n                [disabled]=\"this.value && value?.IsDeleted !== true\"\r\n                glyph=\"attachment\"\r\n                [fdType]=\"'transparent'\"\r\n                (click)=\"uploader.open()\"\r\n            ></button>\r\n            }\r\n            <ng-content select=\"[fd-toolbar-item]\"></ng-content>\r\n            <ng-container\r\n                *ngTemplateOutlet=\"\r\n                    loadingTpl;\r\n                    context: {\r\n                        uploadingState: uploadingState$ | async\r\n                    }\r\n                \"\r\n            >\r\n            </ng-container>\r\n        </fd-toolbar>\r\n    </div>\r\n    } @if (!inlineEdit) {\r\n    <div\r\n        [style.max-height.px]=\"Setting.SizeMode === '0' ? layoutInfo.ControlBounds.height : null\"\r\n        [style.max-width.px]=\"Setting.SizeMode === '0' ? layoutInfo.ControlBounds.width : null\"\r\n        [class.centerImage]=\"Setting.SizeMode === '3'\"\r\n        [style.min-height.px]=\"140\"\r\n    >\r\n        @if (value && imageUrl) {\r\n        <bsu-mask [top]=\"'0px'\"></bsu-mask>\r\n        } @if ((value && imageUrl) || Setting.HasDefaultPicture) {\r\n        <img\r\n            imgLazy\r\n            [imgLazy]=\"imageUrl\"\r\n            [src]=\"imageUrl\"\r\n            [ngClass]=\"Setting.SizeMode === '1' ? 'cover' : 'contain'\"\r\n            [style.height.px]=\"Setting.SizeMode !== '2' ? layoutInfo.ControlBounds.height : null\"\r\n             [style.min-height.px]=\"!value && !inlineEdit ? null : 140\"\r\n        />\r\n        }\r\n    </div>\r\n    } @else {\r\n    <fd-avatar [size]=\"'m'\" [image]=\"imageUrl\"></fd-avatar>\r\n    }\r\n</div>\r\n<ng-template #loadingTpl let-uploadingState=\"uploadingState\">\r\n    @if (uploadingState && uploadingState.state !== 'Complete' && uploadingState.uploading) {\r\n    <fd-slider\r\n        [(ngModel)]=\"uploadingState.progress\"\r\n        [name]=\"'slider_' + id\"\r\n        fd-toolbar-item\r\n        [id]=\"id + '1'\"\r\n        [min]=\"0\"\r\n        [max]=\"100\"\r\n        [step]=\"1\"\r\n    >\r\n    </fd-slider>\r\n    @if (uploadingState.state === 'Uploading') {\r\n    <button fd-toolbar-item fd-button glyph=\"stop\" fdType=\"transparent\" (click)=\"onTerminate()\"></button>\r\n    } @if (uploadingState.state === 'Error') {\r\n    <button fd-toolbar-item fd-button glyph=\"refresh\" [fdType]=\"'transparent'\" (click)=\"onRetry()\"></button>\r\n    } }\r\n</ng-template>\r\n", styles: [":host{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;overflow:hidden;margin-bottom:.25rem;margin-top:.1875rem}:host.editable{border:.0625rem solid var(--sapGroup_TitleBorderColor)}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .delete button{border-color:transparent!important;background-color:transparent!important}img{width:100%}.pic-wrapper{background-repeat:no-repeat;background-position:center}.cover{max-width:100%;max-height:100%;min-height:100%;width:100%;height:100%;background-size:cover}.contain{max-width:100%;max-height:100%;min-height:100%;width:auto;height:100%;background-size:contain}.no-inlineEdit{width:100%;position:relative;display:flex;flex-direction:column}.inlineEdit{width:100%;position:relative;display:flex;flex-direction:row-reverse;align-items:flex-end;justify-content:flex-start}.centerImage{display:flex;justify-content:center}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.ImageLazyDirective, selector: "[imgLazy]", inputs: ["auto", "threshold", "imgLazy"], outputs: ["imageLoaded"] }, { kind: "directive", type: i2.PrintFilesDirective, selector: "[printFiles]", inputs: ["files", "file", "isImageGallery", "component"] }, { kind: "directive", type: i2.SaveImageDirective, selector: "[saveImage]", inputs: ["name", "src"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i5$5.FileUploaderComponent, selector: "fd-file-uploader", inputs: ["disabled", "required", "multiple", "accept", "dragndrop", "maxFileSize", "minFileSize", "id", "ariaLabel", "ariaLabelledBy", "placeholder", "buttonLabel", "buttonAriaLabel", "state", "fileLimit", "inputHidden", "width"], outputs: ["selectedFilesChanged", "selectedInvalidFiles", "onDragEnter", "onDragLeave"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiPictureFileComponent, decorators: [{
             type: Component,
@@ -13311,11 +13443,11 @@ class UiGridComponent extends SapUiReportBaseComponent {
         this.widthTypeEnum = WidthTypeEnum;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiGridComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiGridComponent, isStandalone: false, selector: "bsu-ui-grid", inputs: { showOkCancelButtons: "showOkCancelButtons" }, usesInheritance: true, ngImport: i0, template: "<!--render container-->\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderContainer;\r\n        context: {\r\n            $implicit: gridDataSource.data$ | async,\r\n            allChecked: allChecked$ | async,\r\n            groupby: groupby$ | async,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            hasSummary: context.Setting.View?.HasSummaryRow,\r\n            columns: columns$ | async,\r\n            columnsCount: columnsCount$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            onlyInlineEdit: onlyInlineEdit$ | async,\r\n            secondaryColumns: secondaryColumns$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            popin: (secondaryColumnsCount$ | async)!! > 0 ? true : false,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            mobileOrTablet: mobileOrTablet$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            extraRelation: context.Setting.Extra?.Relation,\r\n            title: title$ | async,\r\n            rtl: rtl$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            allColumns: allColumns,\r\n            gridSetting: gridSetting$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            formSetting: context.Setting.FormTemplate,\r\n            hasSelected: hasSelected$ | async,\r\n            showOkCancelButtons: showOkCancelButtons,\r\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\r\n            navigationArrow: navigationArrow$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            newInlineEditMo: newInlineEditMo$ | async,\r\n            typeDefId: context.Setting.Extra.Report.TypeDefId,\r\n            reportId: context.Setting.Extra.Report.Id,\r\n            listEditViewId: context.Setting.Extra.Report.ListEditViewId,\r\n            typeViewId: context.Setting.Extra.Report.TypeViewId,\r\n            contextView: context.Setting.View,\r\n            cartableTemplates: cartableTemplates$ | async,\r\n            cartableChildsMo: cartableChildsMo$ | async,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            disableResponsive: disableResponsive$ | async,\r\n            fullscreen: fullscreen$ | async,\r\n            selectedMo: selectedMo$ | async,\r\n            gridFreeColumnSizing: gridFreeColumnSizing$ | async,\r\n            allowGridColumnSort: context.ViewSetting?.AllowGridColumnSort,\r\n            UlvMainCtrlr: context.Adapter?.UlvMainCtrlr,\r\n            pagingSetting: pagingSetting$ | async,\r\n            simpleInlineEdit: simpleInlineEdit,\r\n            groupSummary: groupSummary\r\n        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\r\n    let-allChecked=\"allChecked\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-columns=\"columns\"\r\n    let-columnsCount=\"columnsCount\"\r\n    let-groupby=\"groupby\"\r\n    let-secondaryColumns=\"secondaryColumns\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-access=\"access\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-popin=\"popin\"\r\n    let-mobileOrTablet=\"mobileOrTablet\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-formSetting=\"formSetting\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-showOkCancelButtons=\"showOkCancelButtons\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-containerWidth=\"containerWidth\"\r\n    let-newInlineEditMo=\"newInlineEditMo\"\r\n    let-hasSummary=\"hasSummary\"\r\n    let-extraRelation=\"extraRelation\"\r\n    let-typeDefId=\"typeDefId\"\r\n    let-contextView=\"contextView\"\r\n    let-cartableTemplates=\"cartableTemplates\"\r\n    let-cartableChildsMo=\"cartableChildsMo\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-fullscreen=\"fullscreen\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-disableResponsive=\"disableResponsive\"\r\n    let-gridFreeColumnSizing=\"gridFreeColumnSizing\"\r\n    let-reportId=\"reportId\"\r\n    let-listEditViewId=\"listEditViewId\"\r\n    let-typeViewId=\"typeViewId\"\r\n    let-UlvMainCtrlr=\"UlvMainCtrlr\"\r\n    let-rtl=\"rtl\"\r\n    let-allColumns=\"allColumns\"\r\n    let-allowGridColumnSort=\"allowGridColumnSort\"\r\n    let-pagingSetting=\"pagingSetting\"\r\n    let-simpleInlineEdit=\"simpleInlineEdit\"\r\n    let-groupSummary=\"groupSummary\"\r\n>\r\n    <bsu-ulv-toolbar\r\n        [cls]=\"contextView.Grid_HideHeader ? null : 'border-b-0'\"\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [deviceName]=\"deviceName\"\r\n        [hideTitle]=\"true\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [gridSetting]=\"gridSetting\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [title]=\"title\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [access]=\"access\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit && formSetting\"\r\n        [allowInlineEdit]=\"allowInlineEdit && formSetting\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        (sortClick)=\"onSortSettings(deviceName)\"\r\n        (groupbyClick)=\"onGroupbySettings(deviceName)\"\r\n        (columnClick)=\"onColumnSettings(deviceName)\"\r\n        (editModeClick)=\"onEditMode()\"\r\n        (createNewInlineMo)=\"onToolbarCreateNewInlineMo()\"\r\n    ></bsu-ulv-toolbar>\r\n    <bsu-ui-table-view\r\n        [groupSummary]=\"groupSummary\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [simpleInlineEdit]=\"simpleInlineEdit\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [fullscreen]=\"fullscreen\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [rtl]=\"rtl\"\r\n        [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [allColumns]=\"allColumns\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [contextView]=\"contextView\"\r\n        [containerWidth]=\"containerWidth\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [groupby]=\"groupby\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit && formSetting\"\r\n        [columns]=\"columns\"\r\n        [columnWidth]=\"100 / columns.length\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [rowHoverable]=\"rowHoverable\"\r\n        [rowActivable]=\"rowActivable\"\r\n        [formSetting]=\"formSetting\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [reportId]=\"reportId\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        [fitWidth]=\"false\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [rowResizer]=\"rowResizer\"\r\n        [enableResizing]=\"enableResizing\"\r\n        [newInlineEditMo]=\"newInlineEditMo\"\r\n        (columnSummary)=\"onColumnSummary($event)\"\r\n        (escapeKey)=\"onEscapeKey($event)\"\r\n        (deselectAll)=\"onDeselectAll()\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (columnResized)=\"onColumnResized($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n        (resetGridSettings)=\"onResetGridSettings()\"\r\n    >\r\n    </bsu-ui-table-view>\r\n</ng-template>\r\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiTableViewComponent, selector: "bsu-ui-table-view", inputs: ["columnWidth", "minWidth", "minHeight", "disableResize", "disableHeaderContextMenu", "rowResizer", "enableResizing", "disableFixedTableLayout"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: UiGridComponent, isStandalone: false, selector: "bsu-ui-grid", inputs: { showOkCancelButtons: "showOkCancelButtons" }, usesInheritance: true, ngImport: i0, template: "<!--render container-->\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderContainer;\r\n        context: {\r\n            $implicit: gridDataSource.data$ | async,\r\n            allChecked: allChecked$ | async,\r\n            groupby: groupby$ | async,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            hasSummary: context.Setting.View?.HasSummaryRow,\r\n            columns: columns$ | async,\r\n            columnsCount: columnsCount$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            onlyInlineEdit: onlyInlineEdit$ | async,\r\n            secondaryColumns: secondaryColumns$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            popin: (secondaryColumnsCount$ | async)!! > 0 ? true : false,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            mobileOrTablet: mobileOrTablet$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            extraRelation: context.Setting.Extra?.Relation,\r\n            title: title$ | async,\r\n            rtl: rtl$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            allColumns: allColumns,\r\n            gridSetting: gridSetting$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            formSetting: context.Setting.FormTemplate,\r\n            hasSelected: hasSelected$ | async,\r\n            showOkCancelButtons: showOkCancelButtons,\r\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\r\n            navigationArrow: navigationArrow$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            newInlineEditMo: newInlineEditMo$ | async,\r\n            typeDefId: context.Setting.Extra.Report.TypeDefId,\r\n            reportId: context.Setting.Extra.Report.Id,\r\n            listEditViewId: context.Setting.Extra.Report.ListEditViewId,\r\n            typeViewId: context.Setting.Extra.Report.TypeViewId,\r\n            contextView: context.Setting.View,\r\n            cartableTemplates: cartableTemplates$ | async,\r\n            cartableChildsMo: cartableChildsMo$ | async,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            disableResponsive: disableResponsive$ | async,\r\n            fullscreen: fullscreen$ | async,\r\n            selectedMo: selectedMo$ | async,\r\n            gridFreeColumnSizing: gridFreeColumnSizing$ | async,\r\n            allowGridColumnSort: context.ViewSetting?.AllowGridColumnSort,\r\n            UlvMainCtrlr: context.Adapter?.UlvMainCtrlr,\r\n            pagingSetting: pagingSetting$ | async,\r\n            simpleInlineEdit: simpleInlineEdit,\r\n            groupSummary: groupSummary\r\n        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\r\n    let-allChecked=\"allChecked\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-columns=\"columns\"\r\n    let-columnsCount=\"columnsCount\"\r\n    let-groupby=\"groupby\"\r\n    let-secondaryColumns=\"secondaryColumns\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-access=\"access\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-popin=\"popin\"\r\n    let-mobileOrTablet=\"mobileOrTablet\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-formSetting=\"formSetting\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-showOkCancelButtons=\"showOkCancelButtons\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-containerWidth=\"containerWidth\"\r\n    let-newInlineEditMo=\"newInlineEditMo\"\r\n    let-hasSummary=\"hasSummary\"\r\n    let-extraRelation=\"extraRelation\"\r\n    let-typeDefId=\"typeDefId\"\r\n    let-contextView=\"contextView\"\r\n    let-cartableTemplates=\"cartableTemplates\"\r\n    let-cartableChildsMo=\"cartableChildsMo\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-fullscreen=\"fullscreen\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-disableResponsive=\"disableResponsive\"\r\n    let-gridFreeColumnSizing=\"gridFreeColumnSizing\"\r\n    let-reportId=\"reportId\"\r\n    let-listEditViewId=\"listEditViewId\"\r\n    let-typeViewId=\"typeViewId\"\r\n    let-UlvMainCtrlr=\"UlvMainCtrlr\"\r\n    let-rtl=\"rtl\"\r\n    let-allColumns=\"allColumns\"\r\n    let-allowGridColumnSort=\"allowGridColumnSort\"\r\n    let-pagingSetting=\"pagingSetting\"\r\n    let-simpleInlineEdit=\"simpleInlineEdit\"\r\n    let-groupSummary=\"groupSummary\"\r\n>\r\n    \r\n    <bsu-ui-table-view\r\n        [groupSummary]=\"groupSummary\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [simpleInlineEdit]=\"simpleInlineEdit\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [fullscreen]=\"fullscreen\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [rtl]=\"rtl\"\r\n        [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [allColumns]=\"allColumns\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [contextView]=\"contextView\"\r\n        [containerWidth]=\"containerWidth\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [groupby]=\"groupby\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit && formSetting\"\r\n        [columns]=\"columns\"\r\n        [columnWidth]=\"100 / columns.length\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [rowHoverable]=\"rowHoverable\"\r\n        [rowActivable]=\"rowActivable\"\r\n        [formSetting]=\"formSetting\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [reportId]=\"reportId\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        [fitWidth]=\"false\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [rowResizer]=\"rowResizer\"\r\n        [enableResizing]=\"enableResizing\"\r\n        [newInlineEditMo]=\"newInlineEditMo\"\r\n        (columnSummary)=\"onColumnSummary($event)\"\r\n        (escapeKey)=\"onEscapeKey($event)\"\r\n        (deselectAll)=\"onDeselectAll()\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (columnResized)=\"onColumnResized($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n        (resetGridSettings)=\"onResetGridSettings()\"\r\n    >\r\n    </bsu-ui-table-view>\r\n</ng-template>\r\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UiTableViewComponent, selector: "bsu-ui-table-view", inputs: ["columnWidth", "minWidth", "minHeight", "disableResize", "disableHeaderContextMenu", "rowResizer", "enableResizing", "disableFixedTableLayout"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SeperatorFixPipe, name: "seperatorFix" }, { kind: "pipe", type: i2.ContextMenuPipe, name: "contextMenu" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiGridComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-grid', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!--render container-->\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderContainer;\r\n        context: {\r\n            $implicit: gridDataSource.data$ | async,\r\n            allChecked: allChecked$ | async,\r\n            groupby: groupby$ | async,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            hasSummary: context.Setting.View?.HasSummaryRow,\r\n            columns: columns$ | async,\r\n            columnsCount: columnsCount$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            onlyInlineEdit: onlyInlineEdit$ | async,\r\n            secondaryColumns: secondaryColumns$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            popin: (secondaryColumnsCount$ | async)!! > 0 ? true : false,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            mobileOrTablet: mobileOrTablet$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            extraRelation: context.Setting.Extra?.Relation,\r\n            title: title$ | async,\r\n            rtl: rtl$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            allColumns: allColumns,\r\n            gridSetting: gridSetting$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            formSetting: context.Setting.FormTemplate,\r\n            hasSelected: hasSelected$ | async,\r\n            showOkCancelButtons: showOkCancelButtons,\r\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\r\n            navigationArrow: navigationArrow$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            newInlineEditMo: newInlineEditMo$ | async,\r\n            typeDefId: context.Setting.Extra.Report.TypeDefId,\r\n            reportId: context.Setting.Extra.Report.Id,\r\n            listEditViewId: context.Setting.Extra.Report.ListEditViewId,\r\n            typeViewId: context.Setting.Extra.Report.TypeViewId,\r\n            contextView: context.Setting.View,\r\n            cartableTemplates: cartableTemplates$ | async,\r\n            cartableChildsMo: cartableChildsMo$ | async,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            disableResponsive: disableResponsive$ | async,\r\n            fullscreen: fullscreen$ | async,\r\n            selectedMo: selectedMo$ | async,\r\n            gridFreeColumnSizing: gridFreeColumnSizing$ | async,\r\n            allowGridColumnSort: context.ViewSetting?.AllowGridColumnSort,\r\n            UlvMainCtrlr: context.Adapter?.UlvMainCtrlr,\r\n            pagingSetting: pagingSetting$ | async,\r\n            simpleInlineEdit: simpleInlineEdit,\r\n            groupSummary: groupSummary\r\n        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\r\n    let-allChecked=\"allChecked\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-columns=\"columns\"\r\n    let-columnsCount=\"columnsCount\"\r\n    let-groupby=\"groupby\"\r\n    let-secondaryColumns=\"secondaryColumns\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-access=\"access\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-popin=\"popin\"\r\n    let-mobileOrTablet=\"mobileOrTablet\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-formSetting=\"formSetting\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-showOkCancelButtons=\"showOkCancelButtons\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-containerWidth=\"containerWidth\"\r\n    let-newInlineEditMo=\"newInlineEditMo\"\r\n    let-hasSummary=\"hasSummary\"\r\n    let-extraRelation=\"extraRelation\"\r\n    let-typeDefId=\"typeDefId\"\r\n    let-contextView=\"contextView\"\r\n    let-cartableTemplates=\"cartableTemplates\"\r\n    let-cartableChildsMo=\"cartableChildsMo\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-fullscreen=\"fullscreen\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-disableResponsive=\"disableResponsive\"\r\n    let-gridFreeColumnSizing=\"gridFreeColumnSizing\"\r\n    let-reportId=\"reportId\"\r\n    let-listEditViewId=\"listEditViewId\"\r\n    let-typeViewId=\"typeViewId\"\r\n    let-UlvMainCtrlr=\"UlvMainCtrlr\"\r\n    let-rtl=\"rtl\"\r\n    let-allColumns=\"allColumns\"\r\n    let-allowGridColumnSort=\"allowGridColumnSort\"\r\n    let-pagingSetting=\"pagingSetting\"\r\n    let-simpleInlineEdit=\"simpleInlineEdit\"\r\n    let-groupSummary=\"groupSummary\"\r\n>\r\n    <bsu-ulv-toolbar\r\n        [cls]=\"contextView.Grid_HideHeader ? null : 'border-b-0'\"\r\n        [hideToolbar]=\"hideToolbar\"\r\n        [deviceName]=\"deviceName\"\r\n        [hideTitle]=\"true\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [gridSetting]=\"gridSetting\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [title]=\"title\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [access]=\"access\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit && formSetting\"\r\n        [allowInlineEdit]=\"allowInlineEdit && formSetting\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        (sortClick)=\"onSortSettings(deviceName)\"\r\n        (groupbyClick)=\"onGroupbySettings(deviceName)\"\r\n        (columnClick)=\"onColumnSettings(deviceName)\"\r\n        (editModeClick)=\"onEditMode()\"\r\n        (createNewInlineMo)=\"onToolbarCreateNewInlineMo()\"\r\n    ></bsu-ulv-toolbar>\r\n    <bsu-ui-table-view\r\n        [groupSummary]=\"groupSummary\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [simpleInlineEdit]=\"simpleInlineEdit\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [fullscreen]=\"fullscreen\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [rtl]=\"rtl\"\r\n        [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [allColumns]=\"allColumns\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [contextView]=\"contextView\"\r\n        [containerWidth]=\"containerWidth\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [groupby]=\"groupby\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit && formSetting\"\r\n        [columns]=\"columns\"\r\n        [columnWidth]=\"100 / columns.length\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [rowHoverable]=\"rowHoverable\"\r\n        [rowActivable]=\"rowActivable\"\r\n        [formSetting]=\"formSetting\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [reportId]=\"reportId\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        [fitWidth]=\"false\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [rowResizer]=\"rowResizer\"\r\n        [enableResizing]=\"enableResizing\"\r\n        [newInlineEditMo]=\"newInlineEditMo\"\r\n        (columnSummary)=\"onColumnSummary($event)\"\r\n        (escapeKey)=\"onEscapeKey($event)\"\r\n        (deselectAll)=\"onDeselectAll()\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (columnResized)=\"onColumnResized($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n        (resetGridSettings)=\"onResetGridSettings()\"\r\n    >\r\n    </bsu-ui-table-view>\r\n</ng-template>\r\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}\n"] }]
+            args: [{ selector: 'bsu-ui-grid', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<!--render container-->\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        renderContainer;\r\n        context: {\r\n            $implicit: gridDataSource.data$ | async,\r\n            allChecked: allChecked$ | async,\r\n            groupby: groupby$ | async,\r\n            isCheckList: context.Setting.View?.IsCheckList,\r\n            hasSummary: context.Setting.View?.HasSummaryRow,\r\n            columns: columns$ | async,\r\n            columnsCount: columnsCount$ | async,\r\n            allowInlineEdit: allowInlineEdit$ | async,\r\n            inlineEditMode: inlineEditMode$ | async,\r\n            onlyInlineEdit: onlyInlineEdit$ | async,\r\n            secondaryColumns: secondaryColumns$ | async,\r\n            toolbarButtons: (toolbarButtons$ | async)!! | seperatorFix,\r\n            popin: (secondaryColumnsCount$ | async)!! > 0 ? true : false,\r\n            contextMenuItems: menuItems$ | async | contextMenu: context.Setting.View?.IsCheckList,\r\n            conditionalFormats: conditionalFormats$ | async,\r\n            deviceName: deviceName$ | async,\r\n            deviceSize: deviceSize$ | async,\r\n            mobileOrTablet: mobileOrTablet$ | async,\r\n            access: context.Setting.Extra?.DefaultCommandsAccess,\r\n            extraRelation: context.Setting.Extra?.Relation,\r\n            title: title$ | async,\r\n            rtl: rtl$ | async,\r\n            hideToolbar: hideToolbar$ | async,\r\n            allColumns: allColumns,\r\n            gridSetting: gridSetting$ | async,\r\n            contentDensity: contentDensity$ | async,\r\n            formSetting: context.Setting.FormTemplate,\r\n            hasSelected: hasSelected$ | async,\r\n            showOkCancelButtons: showOkCancelButtons,\r\n            disableOverflowContextMenu: viewSetting?.DisableOverflowContextMenu,\r\n            navigationArrow: navigationArrow$ | async,\r\n            containerWidth: containerWidth$ | async,\r\n            newInlineEditMo: newInlineEditMo$ | async,\r\n            typeDefId: context.Setting.Extra.Report.TypeDefId,\r\n            reportId: context.Setting.Extra.Report.Id,\r\n            listEditViewId: context.Setting.Extra.Report.ListEditViewId,\r\n            typeViewId: context.Setting.Extra.Report.TypeViewId,\r\n            contextView: context.Setting.View,\r\n            cartableTemplates: cartableTemplates$ | async,\r\n            cartableChildsMo: cartableChildsMo$ | async,\r\n            inDialog: inDialog$ | async,\r\n            isMultiSelect: isMultiSelect$ | async,\r\n            disableResponsive: disableResponsive$ | async,\r\n            fullscreen: fullscreen$ | async,\r\n            selectedMo: selectedMo$ | async,\r\n            gridFreeColumnSizing: gridFreeColumnSizing$ | async,\r\n            allowGridColumnSort: context.ViewSetting?.AllowGridColumnSort,\r\n            UlvMainCtrlr: context.Adapter?.UlvMainCtrlr,\r\n            pagingSetting: pagingSetting$ | async,\r\n            simpleInlineEdit: simpleInlineEdit,\r\n            groupSummary: groupSummary\r\n        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\r\n    let-allChecked=\"allChecked\"\r\n    let-isCheckList=\"isCheckList\"\r\n    let-columns=\"columns\"\r\n    let-columnsCount=\"columnsCount\"\r\n    let-groupby=\"groupby\"\r\n    let-secondaryColumns=\"secondaryColumns\"\r\n    let-contextMenuItems=\"contextMenuItems\"\r\n    let-conditionalFormats=\"conditionalFormats\"\r\n    let-deviceName=\"deviceName\"\r\n    let-deviceSize=\"deviceSize\"\r\n    let-access=\"access\"\r\n    let-toolbarButtons=\"toolbarButtons\"\r\n    let-popin=\"popin\"\r\n    let-mobileOrTablet=\"mobileOrTablet\"\r\n    let-title=\"title\"\r\n    let-inlineEditMode=\"inlineEditMode\"\r\n    let-allowInlineEdit=\"allowInlineEdit\"\r\n    let-hideToolbar=\"hideToolbar\"\r\n    let-gridSetting=\"gridSetting\"\r\n    let-contentDensity=\"contentDensity\"\r\n    let-formSetting=\"formSetting\"\r\n    let-hasSelected=\"hasSelected\"\r\n    let-showOkCancelButtons=\"showOkCancelButtons\"\r\n    let-disableOverflowContextMenu=\"disableOverflowContextMenu\"\r\n    let-navigationArrow=\"navigationArrow\"\r\n    let-containerWidth=\"containerWidth\"\r\n    let-newInlineEditMo=\"newInlineEditMo\"\r\n    let-hasSummary=\"hasSummary\"\r\n    let-extraRelation=\"extraRelation\"\r\n    let-typeDefId=\"typeDefId\"\r\n    let-contextView=\"contextView\"\r\n    let-cartableTemplates=\"cartableTemplates\"\r\n    let-cartableChildsMo=\"cartableChildsMo\"\r\n    let-inDialog=\"inDialog\"\r\n    let-isMultiSelect=\"isMultiSelect\"\r\n    let-fullscreen=\"fullscreen\"\r\n    let-selectedMo=\"selectedMo\"\r\n    let-disableResponsive=\"disableResponsive\"\r\n    let-gridFreeColumnSizing=\"gridFreeColumnSizing\"\r\n    let-reportId=\"reportId\"\r\n    let-listEditViewId=\"listEditViewId\"\r\n    let-typeViewId=\"typeViewId\"\r\n    let-UlvMainCtrlr=\"UlvMainCtrlr\"\r\n    let-rtl=\"rtl\"\r\n    let-allColumns=\"allColumns\"\r\n    let-allowGridColumnSort=\"allowGridColumnSort\"\r\n    let-pagingSetting=\"pagingSetting\"\r\n    let-simpleInlineEdit=\"simpleInlineEdit\"\r\n    let-groupSummary=\"groupSummary\"\r\n>\r\n    \r\n    <bsu-ui-table-view\r\n        [groupSummary]=\"groupSummary\"\r\n        [gridFreeColumnSizing]=\"gridFreeColumnSizing\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [simpleInlineEdit]=\"simpleInlineEdit\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [pagingSetting]=\"pagingSetting\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [fullscreen]=\"fullscreen\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [rtl]=\"rtl\"\r\n        [allowGridColumnSort]=\"allowGridColumnSort\"\r\n        [inDialog]=\"inDialog\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [allColumns]=\"allColumns\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [contextView]=\"contextView\"\r\n        [containerWidth]=\"containerWidth\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [groupby]=\"groupby\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit && formSetting\"\r\n        [columns]=\"columns\"\r\n        [columnWidth]=\"100 / columns.length\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [rowHoverable]=\"rowHoverable\"\r\n        [rowActivable]=\"rowActivable\"\r\n        [formSetting]=\"formSetting\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [reportId]=\"reportId\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        [fitWidth]=\"false\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [rowResizer]=\"rowResizer\"\r\n        [enableResizing]=\"enableResizing\"\r\n        [newInlineEditMo]=\"newInlineEditMo\"\r\n        (columnSummary)=\"onColumnSummary($event)\"\r\n        (escapeKey)=\"onEscapeKey($event)\"\r\n        (deselectAll)=\"onDeselectAll()\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (columnResized)=\"onColumnResized($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n        (resetGridSettings)=\"onResetGridSettings()\"\r\n    >\r\n    </bsu-ui-table-view>\r\n</ng-template>\r\n", styles: [":host{display:flex;width:100%;height:100%;flex-direction:column}\n"] }]
         }], propDecorators: { showOkCancelButtons: [{
                 type: Input
             }] } });
@@ -13409,7 +13541,7 @@ class UiSimpleComboComponent extends FieldBaseComponent {
         this.fireContextEvent('select', this.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiSimpleComboComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiSimpleComboComponent, isStandalone: false, selector: "bsu-ui-simple-combo", inputs: { MinSize: "MinSize" }, viewQueries: [{ propertyName: "fdComboRef", first: true, predicate: ComboboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (Setting.IconDisplayType !== 'Image' && !popupMode) {\r\n<!-- <fd-select\r\n    style=\"width: 100%\"\r\n    [placeholder]=\"'Select' | bbbTranslate\"\r\n    [value]=\"value\"\r\n    [mobile]=\"(deviceSize$ | async) === 's'\"\r\n    [mobileConfig]=\"mobileConfig\"\r\n    (valueChange)=\"onValueChange($event)\"\r\n    [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\r\n    [style.text-align]=\"Setting.IsLtr === true ? 'left' : null\"\r\n    [readonly]=\"(readonly$ | async) === true ? true : false\"\r\n    [disabled]=\"(disable$ | async) === true ? true : false\"\r\n>\r\n    @for (item of context.store.data[context.store.root]; track item) {\r\n    <fd-option\r\n        [value]=\"item.id\"\r\n        [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\r\n        [class.control-disabled]=\"item.IsEmpty\"\r\n        [class.list-empty-item]=\"item.IsEmpty\"\r\n    >\r\n        <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, popupMode: true }\"></ng-container>\r\n    </fd-option>\r\n    }\r\n</fd-select> -->\r\n<fd-combobox\r\n    [inputId]=\"id\"\r\n    [placeholder]=\"'Select' | bbbTranslate\"\r\n    [displayFn]=\"displayFn\"\r\n    [(ngModel)]=\"tvalue\"\r\n    [readOnly]=\"(readonly$ | async) === true ? true : false\"\r\n    [disabled]=\"(disable$ | async) === true ? true : false\"\r\n    [attr.dir]=\"Setting.IsLtr === true ? 'ltr' : null\"\r\n    [class.ltr]=\"Setting.IsLtr === true\"\r\n    [fillOnSelect]=\"true\"\r\n    [dropdownValues]=\"context.store.data[context.store.root]\"\r\n    (itemClicked)=\"onItemClick($event)\"\r\n    (change)=\"onChange($event)\"\r\n>\r\n    <ng-container *fdComboboxItem=\"let item; use: rowDataOption; inputText as search\">\r\n        <!-- Note that in this case you are responsible for highlighting. -->\r\n        @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\r\n        <img fd-list-icon [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\r\n        } } @if (Setting.IconDisplayType !== 'Image') {\r\n        <span fd-list-title [innerHTML]=\"item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate)\"></span>\r\n        }\r\n    </ng-container>\r\n</fd-combobox>\r\n} @if (Setting.IconDisplayType === 'Image' || popupMode) {\r\n<fd-popover #popover [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\r\n    <fd-popover-control>\r\n        <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\r\n            @if (value && value !== '0') {\r\n            <img [src]=\"value | comboRowImg: context.store.data.Rows\" />\r\n            }\r\n        </button>\r\n    </fd-popover-control>\r\n    <fd-popover-body class=\"combo-popupmode\">\r\n        @for (item of context.store.data[context.store.root]; track item) {\r\n        <button fd-button fdType=\"transparent\" [title]=\"item.txt\" (click)=\"popover.close(); onValueChange(item.id)\">\r\n            @if (item.url) {\r\n            <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\r\n            }\r\n        </button>\r\n        }\r\n    </fd-popover-body>\r\n</fd-popover>\r\n}\r\n<ng-template #itemTemplate let-item let-popupMode=\"popupMode\">\r\n    @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\r\n    <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\r\n    } } @if (Setting.IconDisplayType !== 'Image') {\r\n    {{ item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate) }}\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:flex;align-self:center;align-items:center;width:100%;height:100%}:host ::ng-deep fd-select fd-popover{width:100%}:host fd-combobox{width:100%}:host fd-combobox ::ng-deep fd-popover{width:100%}:host fd-combobox ::ng-deep .ltr input{text-align:left!important}:host ::ng-deep .fd-popover-custom{width:100%}:host ::ng-deep fd-combobox-mobile fd-dialog-footer{position:absolute;bottom:0;width:100%}:host ::ng-deep fd-combobox-mobile .fd-dialog__content.fd-dialog__content--mobile{width:80svw;height:60svh}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}fd-popover{margin:.25rem 0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i4$7.ComboboxComponent, selector: "fd-combobox", inputs: ["comboboxId", "inputId", "ariaLabel", "ariaLabelledBy", "required", "dropdownValues", "filterFn", "disabled", "placeholder", "isSearch", "glyph", "glyphFont", "showClearButton", "triggers", "closeOnOutsideClick", "openOnKeyboardEvent", "state", "itemTemplate", "groupFn", "maxHeight", "dropDownMaxWidthPx", "noDropDownMaxWidth", "width", "searchFn", "highlighting", "closeOnSelect", "fillOnSelect", "autoComplete", "fillControlMode", "communicateByObject", "displayFn", "buttonFocusable", "clearButtonFocusable", "readOnly", "mobile", "mobileConfig", "showDropdownButton", "includes", "title", "byline", "tabOutStrategy"], outputs: ["itemClicked", "openChange", "inputTextChange"] }, { kind: "directive", type: i4$7.ComboboxItemDirective, selector: "[fdComboboxItem]", inputs: ["fdComboboxItemUse"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ComboRowImagePipe, name: "comboRowImg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiSimpleComboComponent, isStandalone: false, selector: "bsu-ui-simple-combo", inputs: { MinSize: "MinSize" }, viewQueries: [{ propertyName: "fdComboRef", first: true, predicate: ComboboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@if (Setting.IconDisplayType !== 'Image' && !popupMode) {\r\n<!-- <fd-select\r\n    style=\"width: 100%\"\r\n    [placeholder]=\"'Select' | bbbTranslate\"\r\n    [value]=\"value\"\r\n    [mobile]=\"(deviceSize$ | async) === 's'\"\r\n    [mobileConfig]=\"mobileConfig\"\r\n    (valueChange)=\"onValueChange($event)\"\r\n    [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\r\n    [style.text-align]=\"Setting.IsLtr === true ? 'left' : null\"\r\n    [readonly]=\"(readonly$ | async) === true ? true : false\"\r\n    [disabled]=\"(disable$ | async) === true ? true : false\"\r\n>\r\n    @for (item of context.store.data[context.store.root]; track item) {\r\n    <fd-option\r\n        [value]=\"item.id\"\r\n        [style.direction]=\"Setting.IsLtr === true ? 'ltr' : null\"\r\n        [class.control-disabled]=\"item.IsEmpty\"\r\n        [class.list-empty-item]=\"item.IsEmpty\"\r\n    >\r\n        <ng-container *ngTemplateOutlet=\"itemTemplate; context: { $implicit: item, popupMode: true }\"></ng-container>\r\n    </fd-option>\r\n    }\r\n</fd-select> -->\r\n<fd-combobox\r\n    [inputId]=\"id\"\r\n    [placeholder]=\"'Select' | bbbTranslate\"\r\n    [displayFn]=\"displayFn\"\r\n    [(ngModel)]=\"tvalue\"\r\n    [readOnly]=\"(readonly$ | async) === true ? true : false\"\r\n    [disabled]=\"(disable$ | async) === true ? true : false\"\r\n    [attr.dir]=\"Setting.IsLtr === true ? 'ltr' : null\"\r\n    [class.ltr]=\"Setting.IsLtr === true\"\r\n    [fillOnSelect]=\"true\"\r\n    [dropdownValues]=\"context.store.data[context.store.root]\"\r\n    (itemClicked)=\"onItemClick($event)\"\r\n    (change)=\"onChange($event)\"\r\n>\r\n    <ng-container *fdComboboxItem=\"let item; use: rowDataOption; inputText as search\">\r\n        <!-- Note that in this case you are responsible for highlighting. -->\r\n        @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\r\n        <img fd-list-icon [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\r\n        } } @if (Setting.IconDisplayType !== 'Image') {\r\n        <span fd-list-title [innerHTML]=\"item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate)\"></span>\r\n        }\r\n    </ng-container>\r\n</fd-combobox>\r\n} @if (Setting.IconDisplayType === 'Image' || popupMode) {\r\n<fd-popover #popover [focusTrapped]=\"true\" [focusAutoCapture]=\"true\">\r\n    <fd-popover-control>\r\n        <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\r\n            @if (value && value !== '0') {\r\n            <img [src]=\"value | comboRowImg: context.store.data.Rows\" />\r\n            }\r\n        </button>\r\n    </fd-popover-control>\r\n    <fd-popover-body class=\"combo-popupmode\">\r\n        @for (item of context.store.data[context.store.root]; track item) {\r\n        <button fd-button fdType=\"transparent\" [title]=\"item.txt\" (click)=\"popover.close(); onValueChange(item.id)\">\r\n            @if (item.url) {\r\n            <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\r\n            }\r\n        </button>\r\n        }\r\n    </fd-popover-body>\r\n</fd-popover>\r\n}\r\n<ng-template #itemTemplate let-item let-popupMode=\"popupMode\">\r\n    @if (Setting.IconDisplayType !== 'NoImage') { @if (item.url) {\r\n    <img [attrRtl]=\"Setting.IsLtr === true ? false : undefined\" [src]=\"item.url\" />\r\n    } } @if (Setting.IconDisplayType !== 'Image') {\r\n    {{ item.IsEmpty ? ('Select' | bbbTranslate) : (item.txt | bbbTranslate) }}\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:flex;align-self:center;align-items:center;width:100%;height:100%}:host ::ng-deep fd-select fd-popover{width:100%}:host fd-combobox{width:100%}:host fd-combobox ::ng-deep fd-popover{width:100%}:host fd-combobox ::ng-deep .ltr input{text-align:left!important}:host ::ng-deep .fd-popover-custom{width:100%}:host ::ng-deep fd-combobox-mobile fd-dialog-footer{position:absolute;bottom:0;width:100%}:host ::ng-deep fd-combobox-mobile .fd-dialog__content.fd-dialog__content--mobile{width:80svw;height:60svh}img[rtl=true]{margin-left:5px}img[rtl=false]{margin-right:5px}fd-popover{margin:.25rem 0}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i4$7.ComboboxComponent, selector: "fd-combobox", inputs: ["comboboxId", "inputId", "ariaLabel", "ariaLabelledBy", "required", "dropdownValues", "filterFn", "disabled", "placeholder", "isSearch", "glyph", "glyphFont", "showClearButton", "triggers", "closeOnOutsideClick", "openOnKeyboardEvent", "state", "itemTemplate", "groupFn", "maxHeight", "dropDownMaxWidthPx", "noDropDownMaxWidth", "width", "searchFn", "highlighting", "closeOnSelect", "fillOnSelect", "autoComplete", "fillControlMode", "communicateByObject", "displayFn", "buttonFocusable", "clearButtonFocusable", "readOnly", "mobile", "mobileConfig", "showDropdownButton", "includes", "title", "byline", "tabOutStrategy"], outputs: ["itemClicked", "openChange", "inputTextChange"] }, { kind: "directive", type: i4$7.ComboboxItemDirective, selector: "[fdComboboxItem]", inputs: ["fdComboboxItemUse"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListIconDirective, selector: "[fdListIcon], [fd-list-icon]", inputs: ["glyph", "glyphFont", "class", "role", "ariaHidden"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ComboRowImagePipe, name: "comboRowImg" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiSimpleComboComponent, decorators: [{
             type: Component,
@@ -13663,7 +13795,7 @@ class UiCardViewHorizontalGroupComponent extends UiCardViewComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiCardViewHorizontalGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiCardViewHorizontalGroupComponent, isStandalone: false, selector: "bsu-ui-card-view-horizontal-group", providers: [CardViewService], viewQueries: [{ propertyName: "dynamicPage", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "tabListComponent", first: true, predicate: IconTabBarComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #dynPageTpl></div>\r\n<fd-dynamic-page [size]=\"deviceSize | dynamicPageSize\">\r\n    <fd-dynamic-page-header [class.simple-title]=\"true\" [title]=\"''\" class=\"no-toolbar-items hide\">\r\n    </fd-dynamic-page-header>\r\n    <fd-dynamic-page-subheader class=\"hide\"> </fd-dynamic-page-subheader>\r\n\r\n    <fdp-icon-tab-bar\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        layoutMode=\"row\"\r\n        [stackContent]=\"true\"\r\n        [shouldOverflow]=\"false\"\r\n        [fixTabMore]=\"tabListComponent\"\r\n        [style.width.px]=\"dynPageTpl.offsetWidth\"\r\n    >\r\n        @for ( tab of moDataList | groupBy: groupby[0].Name | reverse: isFirefox; track _trackByRow(index, tab); let\r\n        index = $index;let last=$last) {\r\n        <fdp-icon-tab-bar-tab [label]=\"tab.key | bbbTranslate\" [title]=\"tab.key | bbbTranslate\" [id]=\"'h_' + index\">\r\n            <fd-dynamic-page-content [id]=\"'h_' + index\" cdkScrollable>\r\n                <h4 fd-title [id]=\"index\">{{ tab.key | bbbTranslate }}</h4>\r\n                <bsu-card-view-content\r\n                    [moDataList]=\"tab.value\"\r\n                    [groupby]=\"[]\"\r\n                    [maxHeightHeader]=\"(maxHeightHeader$ | async)!!\"\r\n                    [title]=\"tab.key\"\r\n                    [setting]=\"cardSetting\"\r\n                    [editMode]=\"inlineEditMode\"\r\n                    [rtl]=\"rtl\"\r\n                    [detailsColumns]=\"detailsColumns\"\r\n                    [deviceName]=\"deviceName\"\r\n                    [deviceSize]=\"deviceSize\"\r\n                    [allColumns]=\"allColumns\"\r\n                    [contextMenuItems]=\"contextMenuItems\"\r\n                    [canView]=\"canView\"\r\n                    [conditionalFormats]=\"conditionalFormats\"\r\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n                    [navigationArrow]=\"navigationArrow\"\r\n                    [isCheckList]=\"isCheckList\"\r\n                    (rowCheck)=\"onRowCheck($event)\"\r\n                    (rowClick)=\"onRowClick($event)\"\r\n                    (ulvCommand)=\"onUlvCommand($event)\"\r\n                    (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n                    (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n                    (action)=\"onAction($event)\"\r\n                ></bsu-card-view-content>                \r\n            </fd-dynamic-page-content>\r\n        </fdp-icon-tab-bar-tab>\r\n        }\r\n    </fdp-icon-tab-bar>\r\n    <fd-dynamic-page-content>\r\n        <bsu-no-data [simple]=\"true\"></bsu-no-data>\r\n    </fd-dynamic-page-content>\r\n</fd-dynamic-page>\r\n", styles: [":host fd-dynamic-page-content{height:auto!important}:host ::ng-deep .fd-container.card-list{padding:0!important}\n"], dependencies: [{ kind: "directive", type: i3$1.ɵɵCdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i8$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i8$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i8$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i8$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: CardViewContentComponent, selector: "bsu-card-view-content" }, { kind: "directive", type: FixTabMoreDirective, selector: "[fixTabMore]", inputs: ["fixTabMore"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.GroupByPipe, name: "groupBy" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ReversePipe, name: "reverse" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiCardViewHorizontalGroupComponent, isStandalone: false, selector: "bsu-ui-card-view-horizontal-group", providers: [CardViewService], viewQueries: [{ propertyName: "dynamicPage", first: true, predicate: DynamicPageComponent, descendants: true, static: true }, { propertyName: "tabListComponent", first: true, predicate: IconTabBarComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #dynPageTpl></div>\r\n<fd-dynamic-page [size]=\"deviceSize | dynamicPageSize\">\r\n    <fd-dynamic-page-header [class.simple-title]=\"true\" [title]=\"''\" class=\"no-toolbar-items hide\">\r\n    </fd-dynamic-page-header>\r\n    <fd-dynamic-page-subheader class=\"hide\"> </fd-dynamic-page-subheader>\r\n\r\n    <fdp-icon-tab-bar\r\n        [expandOverflowText]=\"'More' | bbbTranslate\"\r\n        layoutMode=\"row\"\r\n        [stackContent]=\"true\"\r\n        [shouldOverflow]=\"false\"\r\n        [fixTabMore]=\"tabListComponent\"\r\n        [style.width.px]=\"dynPageTpl.offsetWidth\"\r\n    >\r\n        @for ( tab of moDataList | groupBy: groupby[0].Name | reverse: isFirefox; track _trackByRow(index, tab); let\r\n        index = $index;let last=$last) {\r\n        <fdp-icon-tab-bar-tab [label]=\"tab.key | bbbTranslate\" [title]=\"tab.key | bbbTranslate\" [id]=\"'h_' + index\">\r\n            <fd-dynamic-page-content [id]=\"'h_' + index\" cdkScrollable>\r\n                <h4 fd-title [id]=\"index\">{{ tab.key | bbbTranslate }}</h4>\r\n                <bsu-card-view-content\r\n                    [moDataList]=\"tab.value\"\r\n                    [groupby]=\"[]\"\r\n                    [maxHeightHeader]=\"(maxHeightHeader$ | async)!!\"\r\n                    [title]=\"tab.key\"\r\n                    [setting]=\"cardSetting\"\r\n                    [editMode]=\"inlineEditMode\"\r\n                    [rtl]=\"rtl\"\r\n                    [detailsColumns]=\"detailsColumns\"\r\n                    [deviceName]=\"deviceName\"\r\n                    [deviceSize]=\"deviceSize\"\r\n                    [allColumns]=\"allColumns\"\r\n                    [contextMenuItems]=\"contextMenuItems\"\r\n                    [canView]=\"canView\"\r\n                    [conditionalFormats]=\"conditionalFormats\"\r\n                    [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n                    [navigationArrow]=\"navigationArrow\"\r\n                    [isCheckList]=\"isCheckList\"\r\n                    (rowCheck)=\"onRowCheck($event)\"\r\n                    (rowClick)=\"onRowClick($event)\"\r\n                    (ulvCommand)=\"onUlvCommand($event)\"\r\n                    (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n                    (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n                    (action)=\"onAction($event)\"\r\n                ></bsu-card-view-content>                \r\n            </fd-dynamic-page-content>\r\n        </fdp-icon-tab-bar-tab>\r\n        }\r\n    </fdp-icon-tab-bar>\r\n    <fd-dynamic-page-content>\r\n        <bsu-no-data [simple]=\"true\"></bsu-no-data>\r\n    </fd-dynamic-page-content>\r\n</fd-dynamic-page>\r\n", styles: [":host fd-dynamic-page-content{height:auto!important}:host ::ng-deep .fd-container.card-list{padding:0!important}\n"], dependencies: [{ kind: "directive", type: i3$1.ɵɵCdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i8.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i8.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i8.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i8.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i18.IconTabBarComponent, selector: "fdp-icon-tab-bar", inputs: ["stackContent", "tabHeadingLevel", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "settings", "maxContentHeight"], outputs: ["tabsConfigChange", "densityModeChange", "iconTabSelected", "iconTabReordered", "closeTab"] }, { kind: "component", type: i18.IconTabBarTabComponent, selector: "fdp-icon-tab-bar-tab", inputs: ["label", "color", "icon", "iconFont", "counter", "active", "badge", "closable", "id"] }, { kind: "component", type: NoDataComponent, selector: "bsu-no-data", inputs: ["simple"] }, { kind: "component", type: CardViewContentComponent, selector: "bsu-card-view-content" }, { kind: "directive", type: FixTabMoreDirective, selector: "[fixTabMore]", inputs: ["fixTabMore"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.GroupByPipe, name: "groupBy" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.ReversePipe, name: "reverse" }, { kind: "pipe", type: DynamicPageSizePipe, name: "dynamicPageSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiCardViewHorizontalGroupComponent, decorators: [{
             type: Component,
@@ -13723,7 +13855,7 @@ class FormToolbarButtonComponent extends BaseFormToolbaritemPropsComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormToolbarButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormToolbarButtonComponent, isStandalone: false, selector: "bsu-form-toolbar-button", inputs: { parameters: "parameters" }, outputs: { btnClick: "btnClick" }, viewQueries: [{ propertyName: "inlineHelpDirective", first: true, predicate: InlineHelpDirective, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<button\r\n    fd-toolbar-item\r\n    fd-button\r\n    [title]=\"inlineHelp | bbbTranslate\"\r\n    [glyph]=\"deviceSize === 's' ? null : icon\"\r\n    [class.control-disabled]=\"isEnable === false ? true : false\"\r\n    [fdType]=\"fdType || (!isEnable ? 'transparent' : fdType)\"\r\n    (click)=\"btnClick.emit()\"\r\n    [style.min-width.px]=\"minWidth ? minWidth : null\"\r\n>\r\n    @if ( deviceSize === 's' || (!onlyIcon && showText!==false )) {\r\n    <span>{{ customText || text | bbbTranslate }}</span>\r\n    }\r\n</button>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: FormToolbarButtonComponent, isStandalone: false, selector: "bsu-form-toolbar-button", inputs: { parameters: "parameters" }, outputs: { btnClick: "btnClick" }, viewQueries: [{ propertyName: "inlineHelpDirective", first: true, predicate: InlineHelpDirective, descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<button\r\n    fd-toolbar-item\r\n    fd-button\r\n    [title]=\"inlineHelp | bbbTranslate\"\r\n    [glyph]=\"deviceSize === 's' ? null : icon\"\r\n    [class.control-disabled]=\"isEnable === false ? true : false\"\r\n    [fdType]=\"fdType || (!isEnable ? 'transparent' : fdType)\"\r\n    (click)=\"btnClick.emit()\"\r\n    [style.min-width.px]=\"minWidth ? minWidth : null\"\r\n>\r\n    @if ( deviceSize === 's' || (!onlyIcon && showText!==false )) {\r\n    <span>{{ customText || text | bbbTranslate }}</span>\r\n    }\r\n</button>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: FormToolbarButtonComponent, decorators: [{
             type: Component,
@@ -13980,7 +14112,7 @@ class BarsaFieldKeyValueComponent extends FieldBaseComponent {
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaFieldKeyValueComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: BarsaFieldKeyValueComponent, isStandalone: false, selector: "bsu-barsa-field-key-value", inputs: { parameters: "parameters" }, providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<fd-facet type=\"key-value\" [facetTitle]=\"Setting.ControlFieldCaptionTranslated\">\n    <span\n        fd-object-status\n        [status]=\"status\"\n        [label]=\"valueString\"\n        [glyph]=\"parameters.Icon\"\n        [large]=\"parameters.IsLarge\"\n        [title]=\"valueString\"\n        [aria-label]=\"valueString\"\n    ></span>\n</fd-facet>\n", styles: ["h1{margin-bottom:1rem}\n"], dependencies: [{ kind: "component", type: i8$2.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: BarsaFieldKeyValueComponent, isStandalone: false, selector: "bsu-barsa-field-key-value", inputs: { parameters: "parameters" }, providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<fd-facet type=\"key-value\" [facetTitle]=\"Setting.ControlFieldCaptionTranslated\">\n    <span\n        fd-object-status\n        [status]=\"status\"\n        [label]=\"valueString\"\n        [glyph]=\"parameters.Icon\"\n        [large]=\"parameters.IsLarge\"\n        [title]=\"valueString\"\n        [aria-label]=\"valueString\"\n    ></span>\n</fd-facet>\n", styles: ["h1{margin-bottom:1rem}\n"], dependencies: [{ kind: "component", type: i8$1.FacetComponent, selector: "fd-facet", inputs: ["type", "facetTitle", "subtitle", "headingLevel", "id", "alignEnd"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaFieldKeyValueComponent, decorators: [{
             type: Component,
@@ -14006,7 +14138,7 @@ class BarsaToolbaritemSearchComponent extends BaseFormToolbaritemPropsComponent
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaToolbaritemSearchComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaToolbaritemSearchComponent, isStandalone: false, selector: "bsu-barsa-toolbaritem-search", host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"searchTpl\"> </ng-container>\r\n<!-- <ng-container *ngTemplateOutlet=\"deviceSize !== 's' ? searchTpl : btnTpl\"> </ng-container> -->\r\n\r\n<ng-template #btnTpl>\r\n    <button fd-button glyph=\"search\" fdType=\"transparent\" (click)=\"onSearchModeChange()\"></button>\r\n    @if (searchMode) {\r\n    <div style=\"z-index: 1; position: absolute; left: 0; top: 0; bottom: 0; right: 0\">\r\n        <ng-container *ngTemplateOutlet=\"searchTpl\"></ng-container>\r\n    </div>\r\n    }\r\n</ng-template>\r\n<ng-template #searchTpl>\r\n    <!-- <button fd-button glyph=\"arrow-right\" fdType=\"transparent\"></button> -->\r\n    <!-- <fd-input-group placement=\"before\" glyph=\"arrow-right\" glyphAriaLabel=\"search\" placeholder=\"Search\">\r\n</fd-input-group> -->\r\n    <fd-input-group\r\n        [style.width]=\"deviceSize === 's' ? '100%' : '220px'\"\r\n        fd-toolbar-item\r\n        type=\"search\"\r\n        glyph=\"search\"\r\n        [glyphAriaLabel]=\"'Search' | bbbTranslate\"\r\n        [placeholder]=\"'Search' | bbbTranslate\"\r\n        [button]=\"true\"\r\n        [disabled]=\"false\"\r\n        [(ngModel)]=\"searchTerm\"\r\n        (addOnButtonClicked)=\"onSearchSubmit()\"\r\n        (keydown.enter)=\"onSearchSubmit()\"\r\n    >\r\n    </fd-input-group>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%;min-width:180px}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaToolbaritemSearchComponent, isStandalone: false, selector: "bsu-barsa-toolbaritem-search", host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *ngTemplateOutlet=\"searchTpl\"> </ng-container>\r\n<!-- <ng-container *ngTemplateOutlet=\"deviceSize !== 's' ? searchTpl : btnTpl\"> </ng-container> -->\r\n\r\n<ng-template #btnTpl>\r\n    <button fd-button glyph=\"search\" fdType=\"transparent\" (click)=\"onSearchModeChange()\"></button>\r\n    @if (searchMode) {\r\n    <div style=\"z-index: 1; position: absolute; left: 0; top: 0; bottom: 0; right: 0\">\r\n        <ng-container *ngTemplateOutlet=\"searchTpl\"></ng-container>\r\n    </div>\r\n    }\r\n</ng-template>\r\n<ng-template #searchTpl>\r\n    <!-- <button fd-button glyph=\"arrow-right\" fdType=\"transparent\"></button> -->\r\n    <!-- <fd-input-group placement=\"before\" glyph=\"arrow-right\" glyphAriaLabel=\"search\" placeholder=\"Search\">\r\n</fd-input-group> -->\r\n    <fd-input-group\r\n        [style.width]=\"deviceSize === 's' ? '100%' : '220px'\"\r\n        fd-toolbar-item\r\n        type=\"search\"\r\n        glyph=\"search\"\r\n        [glyphAriaLabel]=\"'Search' | bbbTranslate\"\r\n        [placeholder]=\"'Search' | bbbTranslate\"\r\n        [button]=\"true\"\r\n        [disabled]=\"false\"\r\n        [(ngModel)]=\"searchTerm\"\r\n        (addOnButtonClicked)=\"onSearchSubmit()\"\r\n        (keydown.enter)=\"onSearchSubmit()\"\r\n    >\r\n    </fd-input-group>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%;min-width:180px}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i4$1.InputGroupComponent, selector: "fd-input-group", inputs: ["placement", "required", "inline", "addOnText", "buttonFocusable", "type", "glyph", "glyphFont", "button", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "addonButtonAriaHidden", "iconTitle", "ariaLabelledBy", "ariaLabel"], outputs: ["addOnButtonClicked", "search"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaToolbaritemSearchComponent, decorators: [{
             type: Component,
@@ -14061,7 +14193,7 @@ class BarsaPishnamayeshPayamComponent extends FieldBaseComponent {
                 useFactory: getDateService$1,
                 deps: [LogService]
             }
-        ], usesInheritance: true, ngImport: i0, template: "@if (data) {\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        showPayamClass;\r\n        context: {\r\n            $implicit: data,\r\n            primary: !data?.$details?.length,\r\n            isFirst: true\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n}\r\n<ng-template #showPayamClass let-data let-primary=\"primary\" let-isFirst=\"isFirst\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            namayeshPayam;\r\n            context: {\r\n                $implicit: data.payam.Subject,\r\n                mailNoText: data.payam.MailNoText,\r\n                fromText: data.payam.FromText,\r\n                toText: data.$toText,\r\n                importance: data.$importance,\r\n                readDate: data.$readDate,\r\n                sendDate: data.$sendDate,\r\n                ccText: data.$ccText,\r\n                bccText: data.$bccText,\r\n                accessLevel: data.$accessLevel,\r\n                content: data.$content,\r\n                fromPhoto: data.$fromPhoto,\r\n                details: data.$details,\r\n                attachments: data.$attachments,\r\n                todo: data.$todo,\r\n                customText: data.payam.CustomText,\r\n                primary: primary,\r\n                isFirst: isFirst\r\n            }\r\n        \"\r\n    >\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template\r\n    #namayeshPayam\r\n    let-subject\r\n    let-mailNoText=\"mailNoText\"\r\n    let-content=\"content\"\r\n    let-fromText=\"fromText\"\r\n    let-toText=\"toText\"\r\n    let-importance=\"importance\"\r\n    let-readDate=\"readDate\"\r\n    let-sendDate=\"sendDate\"\r\n    let-ccText=\"ccText\"\r\n    let-bccText=\"bccText\"\r\n    let-fromPhoto=\"fromPhoto\"\r\n    let-details=\"details\"\r\n    let-accessLevel=\"accessLevel\"\r\n    let-primary=\"primary\"\r\n    let-isFirst=\"isFirst\"\r\n    let-attachments=\"attachments\"\r\n    let-todo=\"todo\"\r\n    let-customText=\"customText\"\r\n>\r\n    <fd-card cardType=\"object\">\r\n        <fd-card-header>\r\n            <fd-card-main-header>\r\n                <fd-avatar\r\n                    [image]=\"fromPhoto\"\r\n                    [circle]=\"true\"\r\n                    size=\"s\"\r\n                    [ariaLabel]=\"fromText\"\r\n                    [label]=\"fromText\"\r\n                    [title]=\"fromText\"\r\n                ></fd-avatar>\r\n                <div fd-card-title class=\"header-fields\">\r\n                    <h5 fd-title>\r\n                        <a fd-link [emphasized]=\"true\" aria-label=\"Sender\"> {{ fromText }}</a>\r\n                    </h5>\r\n                    <fd-object-identifier [description]=\"'(' + sendDate + ')'\"> </fd-object-identifier>\r\n                </div>\r\n                <div fd-card-subtitle>\r\n                    <h5 fd-title>\r\n                        {{ subject }} @if(mailNoText){ <span>({{ mailNoText }})</span>}\r\n                    </h5>\r\n                    <fd-popover>\r\n                        <fd-popover-control>\r\n                            <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\r\n                                {{ 'Recievers' | bbbTranslate }}\r\n                            </button>\r\n                        </fd-popover-control>\r\n                        <fd-popover-body>\r\n                            <ul fd-list>\r\n                                @for (rec of toText; track rec) {\r\n                                <li fd-list-item>\r\n                                    <a fd-list-link>{{ rec }}</a>\r\n                                </li>\r\n                                }\r\n                            </ul>\r\n                        </fd-popover-body>\r\n                    </fd-popover>\r\n                </div>\r\n            </fd-card-main-header>\r\n        </fd-card-header>\r\n        <fd-card-content>\r\n            <fd-panel [expanded]=\"isFirst\">\r\n                <div fd-panel-title id=\"panel-expandable-title-1\">\r\n                    <h5 fd-title>{{ '\u0645\u062D\u062A\u0648\u0627\u06CC \u067E\u06CC\u0627\u0645' | bbbTranslate }}</h5>\r\n                    <div class=\"payamIcons\">\r\n                        @if (importance.icon) {\r\n                        <fd-popover>\r\n                            <fd-popover-control>\r\n                                <img [src]=\"'/Customization/Mail/' + importance.icon\" />\r\n                            </fd-popover-control>\r\n                            <fd-popover-body>\r\n                                <ul fd-list>\r\n                                    <li fd-list-item>{{ importance.text }}</li>\r\n                                </ul>\r\n                            </fd-popover-body>\r\n                        </fd-popover>\r\n                        } @if (accessLevel.icon) {\r\n                        <fd-popover>\r\n                            <fd-popover-control>\r\n                                <img [src]=\"'/Customization/Mail/' + accessLevel.icon\" />\r\n                            </fd-popover-control>\r\n                            <fd-popover-body>\r\n                                <ul fd-list>\r\n                                    <li fd-list-item>{{ accessLevel.text }}</li>\r\n                                </ul>\r\n                            </fd-popover-body>\r\n                        </fd-popover>\r\n                        } @if (todo) {\r\n                        <fd-info-label [label]=\"todo.text\" [color]=\"todo.color\" [title]=\"todo.text\"></fd-info-label>\r\n                        }\r\n                    </div>\r\n                </div>\r\n                <div fd-panel-content>\r\n                    @if (customText) {\r\n                    <div>\r\n                        <fd-message-strip type=\"information\" [noIcon]=\"true\" [dismissible]=\"false\">\r\n                            {{ customText }}\r\n                        </fd-message-strip>\r\n                    </div>\r\n                    }\r\n                    <div [innerHtml]=\"content\" [disable]=\"!primary || attachments?.length\"></div>\r\n\r\n                    @if (attachments?.length) {\r\n                    <div class=\"file-viewer-attachments\">\r\n                        @for (file of attachments; track file;let index=$index) { @if (!file.IsDeleted) {\r\n                        <bsu-file-viewer-popover\r\n                            [file]=\"file\"\r\n                            [index]=\"index\"\r\n                            [files]=\"attachments\"\r\n                            [deviceSize]=\"(deviceSize$ | async)!!\"\r\n                            [canDownload]=\"true\"\r\n                            [disableRemove]=\"true\"\r\n                        ></bsu-file-viewer-popover>\r\n                        } } @if (attachments.length > 1) {\r\n                        <button\r\n                            fd-button\r\n                            [title]=\"'Download' | bbbTranslate\"\r\n                            [glyph]=\"'download'\"\r\n                            downloadFiles\r\n                            [files]=\"attachments\"\r\n                        ></button>\r\n                        }\r\n                    </div>\r\n                    }\r\n                    <div class=\"readAt\">\r\n                        @if (readDate) {\r\n                        <fd-object-identifier [description]=\"('ReadAt' | bbbTranslate) + ': (' + readDate + ')'\">\r\n                        </fd-object-identifier>\r\n                        }\r\n                    </div>\r\n                </div>\r\n            </fd-panel>\r\n        </fd-card-content>\r\n        <!-- <fd-card-footer>\r\n    <button *fdCardFooterActionItem fd-button fdCompact>Assign to Project</button>\r\n  </fd-card-footer> -->\r\n    </fd-card>\r\n    @for (detail of details; track detail) {\r\n    <ng-contianer>\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                showPayamClass;\r\n                context: {\r\n                    $implicit: detail\r\n                }\r\n            \"\r\n        >\r\n        </ng-container>\r\n    </ng-contianer>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block;position:relative;width:100%;height:100%}:host ::ng-deep .fd-panel__content{border-bottom:none;padding-bottom:5px}:host ::ng-deep .fd-card__subtitle{display:flex;align-items:center;column-gap:5px;justify-content:start;height:auto;max-height:initial}:host ::ng-deep .fd-card__subtitle h5{white-space:initial!important}:host ::ng-deep .fd-object-identifier__text{margin-top:0}:host ::ng-deep .fd-panel__header{border-bottom:none}:host ::ng-deep ol{list-style:auto;margin:unset;padding:revert}fd-card-header{cursor:default;border-bottom:none!important}fd-card-header:before{position:relative!important;display:none!important}fd-card-header:hover{background:var(--fdCard_Background_Color)!important}.readAt{padding-top:2rem}.readAt ::ng-deep p{color:var(--sapButton_BorderColor)!important}.payamIcons{display:flex;column-gap:5px}.payamIcons img{width:16px}@media (max-width: 410px){h5{max-width:210px}}@media (max-width: 1040px){.h5{max-width:600px}}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$6.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$3.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i7$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "component", type: i6$1.InfoLabelComponent, selector: "fd-info-label", inputs: ["class", "type", "glyph", "font", "color", "label", "title", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i2$8.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "ariaLabelledBy", "dismissBtnTitle", "noIcon", "type", "id", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i10$2.ObjectIdentifierComponent, selector: "fd-object-identifier", inputs: ["description", "bold", "medium"] }, { kind: "component", type: i3$a.PanelComponent, selector: "fd-panel", inputs: ["class", "fixed", "id", "expandId", "expandAriaLabel", "expandAriaLabelledBy", "expanded", "transparent", "noRadius"], outputs: ["expandedChange"] }, { kind: "directive", type: i3$a.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "noPadding", "transparent", "id"] }, { kind: "directive", type: i3$a.PanelTitleDirective, selector: "[fd-panel-title]", inputs: ["id"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "index", "deviceSize", "canDownload", "disableRemove", "fdType", "attachmentViewType"], outputs: ["remove"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], usesInheritance: true, ngImport: i0, template: "@if (data) {\r\n<ng-container\r\n    *ngTemplateOutlet=\"\r\n        showPayamClass;\r\n        context: {\r\n            $implicit: data,\r\n            primary: !data?.$details?.length,\r\n            isFirst: true\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n}\r\n<ng-template #showPayamClass let-data let-primary=\"primary\" let-isFirst=\"isFirst\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            namayeshPayam;\r\n            context: {\r\n                $implicit: data.payam.Subject,\r\n                mailNoText: data.payam.MailNoText,\r\n                fromText: data.payam.FromText,\r\n                toText: data.$toText,\r\n                importance: data.$importance,\r\n                readDate: data.$readDate,\r\n                sendDate: data.$sendDate,\r\n                ccText: data.$ccText,\r\n                bccText: data.$bccText,\r\n                accessLevel: data.$accessLevel,\r\n                content: data.$content,\r\n                fromPhoto: data.$fromPhoto,\r\n                details: data.$details,\r\n                attachments: data.$attachments,\r\n                todo: data.$todo,\r\n                customText: data.payam.CustomText,\r\n                primary: primary,\r\n                isFirst: isFirst\r\n            }\r\n        \"\r\n    >\r\n    </ng-container>\r\n</ng-template>\r\n\r\n<ng-template\r\n    #namayeshPayam\r\n    let-subject\r\n    let-mailNoText=\"mailNoText\"\r\n    let-content=\"content\"\r\n    let-fromText=\"fromText\"\r\n    let-toText=\"toText\"\r\n    let-importance=\"importance\"\r\n    let-readDate=\"readDate\"\r\n    let-sendDate=\"sendDate\"\r\n    let-ccText=\"ccText\"\r\n    let-bccText=\"bccText\"\r\n    let-fromPhoto=\"fromPhoto\"\r\n    let-details=\"details\"\r\n    let-accessLevel=\"accessLevel\"\r\n    let-primary=\"primary\"\r\n    let-isFirst=\"isFirst\"\r\n    let-attachments=\"attachments\"\r\n    let-todo=\"todo\"\r\n    let-customText=\"customText\"\r\n>\r\n    <fd-card cardType=\"object\">\r\n        <fd-card-header>\r\n            <fd-card-main-header>\r\n                <fd-avatar\r\n                    [image]=\"fromPhoto\"\r\n                    [circle]=\"true\"\r\n                    size=\"s\"\r\n                    [ariaLabel]=\"fromText\"\r\n                    [label]=\"fromText\"\r\n                    [title]=\"fromText\"\r\n                ></fd-avatar>\r\n                <div fd-card-title class=\"header-fields\">\r\n                    <h5 fd-title>\r\n                        <a fd-link [emphasized]=\"true\" aria-label=\"Sender\"> {{ fromText }}</a>\r\n                    </h5>\r\n                    <fd-object-identifier [description]=\"'(' + sendDate + ')'\"> </fd-object-identifier>\r\n                </div>\r\n                <div fd-card-subtitle>\r\n                    <h5 fd-title>\r\n                        {{ subject }} @if(mailNoText){ <span>({{ mailNoText }})</span>}\r\n                    </h5>\r\n                    <fd-popover>\r\n                        <fd-popover-control>\r\n                            <button fd-button fdType=\"transparent\" [fdMenu]=\"true\">\r\n                                {{ 'Recievers' | bbbTranslate }}\r\n                            </button>\r\n                        </fd-popover-control>\r\n                        <fd-popover-body>\r\n                            <ul fd-list>\r\n                                @for (rec of toText; track rec) {\r\n                                <li fd-list-item>\r\n                                    <a fd-list-link>{{ rec }}</a>\r\n                                </li>\r\n                                }\r\n                            </ul>\r\n                        </fd-popover-body>\r\n                    </fd-popover>\r\n                </div>\r\n            </fd-card-main-header>\r\n        </fd-card-header>\r\n        <fd-card-content>\r\n            <fd-panel [expanded]=\"isFirst\">\r\n                <div fd-panel-title id=\"panel-expandable-title-1\">\r\n                    <h5 fd-title>{{ '\u0645\u062D\u062A\u0648\u0627\u06CC \u067E\u06CC\u0627\u0645' | bbbTranslate }}</h5>\r\n                    <div class=\"payamIcons\">\r\n                        @if (importance.icon) {\r\n                        <fd-popover>\r\n                            <fd-popover-control>\r\n                                <img [src]=\"'/Customization/Mail/' + importance.icon\" />\r\n                            </fd-popover-control>\r\n                            <fd-popover-body>\r\n                                <ul fd-list>\r\n                                    <li fd-list-item>{{ importance.text }}</li>\r\n                                </ul>\r\n                            </fd-popover-body>\r\n                        </fd-popover>\r\n                        } @if (accessLevel.icon) {\r\n                        <fd-popover>\r\n                            <fd-popover-control>\r\n                                <img [src]=\"'/Customization/Mail/' + accessLevel.icon\" />\r\n                            </fd-popover-control>\r\n                            <fd-popover-body>\r\n                                <ul fd-list>\r\n                                    <li fd-list-item>{{ accessLevel.text }}</li>\r\n                                </ul>\r\n                            </fd-popover-body>\r\n                        </fd-popover>\r\n                        } @if (todo) {\r\n                        <fd-info-label [label]=\"todo.text\" [color]=\"todo.color\" [title]=\"todo.text\"></fd-info-label>\r\n                        }\r\n                    </div>\r\n                </div>\r\n                <div fd-panel-content>\r\n                    @if (customText) {\r\n                    <div>\r\n                        <fd-message-strip type=\"information\" [noIcon]=\"true\" [dismissible]=\"false\">\r\n                            {{ customText }}\r\n                        </fd-message-strip>\r\n                    </div>\r\n                    }\r\n                    <div [innerHtml]=\"content\" [disable]=\"!primary || attachments?.length\"></div>\r\n\r\n                    @if (attachments?.length) {\r\n                    <div class=\"file-viewer-attachments\">\r\n                        @for (file of attachments; track file;let index=$index) { @if (!file.IsDeleted) {\r\n                        <bsu-file-viewer-popover\r\n                            [file]=\"file\"\r\n                            [index]=\"index\"\r\n                            [files]=\"attachments\"\r\n                            [deviceSize]=\"(deviceSize$ | async)!!\"\r\n                            [canDownload]=\"true\"\r\n                            [disableRemove]=\"true\"\r\n                        ></bsu-file-viewer-popover>\r\n                        } } @if (attachments.length > 1) {\r\n                        <button\r\n                            fd-button\r\n                            [title]=\"'Download' | bbbTranslate\"\r\n                            [glyph]=\"'download'\"\r\n                            downloadFiles\r\n                            [files]=\"attachments\"\r\n                        ></button>\r\n                        }\r\n                    </div>\r\n                    }\r\n                    <div class=\"readAt\">\r\n                        @if (readDate) {\r\n                        <fd-object-identifier [description]=\"('ReadAt' | bbbTranslate) + ': (' + readDate + ')'\">\r\n                        </fd-object-identifier>\r\n                        }\r\n                    </div>\r\n                </div>\r\n            </fd-panel>\r\n        </fd-card-content>\r\n        <!-- <fd-card-footer>\r\n    <button *fdCardFooterActionItem fd-button fdCompact>Assign to Project</button>\r\n  </fd-card-footer> -->\r\n    </fd-card>\r\n    @for (detail of details; track detail) {\r\n    <ng-contianer>\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                showPayamClass;\r\n                context: {\r\n                    $implicit: detail\r\n                }\r\n            \"\r\n        >\r\n        </ng-container>\r\n    </ng-contianer>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block;position:relative;width:100%;height:100%}:host ::ng-deep .fd-panel__content{border-bottom:none;padding-bottom:5px}:host ::ng-deep .fd-card__subtitle{display:flex;align-items:center;column-gap:5px;justify-content:start;height:auto;max-height:initial}:host ::ng-deep .fd-card__subtitle h5{white-space:initial!important}:host ::ng-deep .fd-object-identifier__text{margin-top:0}:host ::ng-deep .fd-panel__header{border-bottom:none}:host ::ng-deep ol{list-style:auto;margin:unset;padding:revert}fd-card-header{cursor:default;border-bottom:none!important}fd-card-header:before{position:relative!important;display:none!important}fd-card-header:hover{background:var(--fdCard_Background_Color)!important}.readAt{padding-top:2rem}.readAt ::ng-deep p{color:var(--sapButton_BorderColor)!important}.payamIcons{display:flex;column-gap:5px}.payamIcons img{width:16px}@media (max-width: 410px){h5{max-width:210px}}@media (max-width: 1040px){.h5{max-width:600px}}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i2$6.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$4.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$4.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i7$4.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "component", type: i6$1.InfoLabelComponent, selector: "fd-info-label", inputs: ["class", "type", "glyph", "font", "color", "label", "title", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i2$8.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "ariaLabelledBy", "dismissBtnTitle", "noIcon", "type", "id", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i10$2.ObjectIdentifierComponent, selector: "fd-object-identifier", inputs: ["description", "bold", "medium"] }, { kind: "component", type: i3$a.PanelComponent, selector: "fd-panel", inputs: ["class", "fixed", "id", "expandId", "expandAriaLabel", "expandAriaLabelledBy", "expanded", "transparent", "noRadius"], outputs: ["expandedChange"] }, { kind: "directive", type: i3$a.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "noPadding", "transparent", "id"] }, { kind: "directive", type: i3$a.PanelTitleDirective, selector: "[fd-panel-title]", inputs: ["id"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "index", "deviceSize", "canDownload", "disableRemove", "fdType", "attachmentViewType"], outputs: ["remove"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaPishnamayeshPayamComponent, decorators: [{
             type: Component,
@@ -14190,7 +14322,7 @@ class BarsaTextEllipsisComponent extends BaseComponent {
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaTextEllipsisComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaTextEllipsisComponent, isStandalone: false, selector: "bsu-barsa-text-ellipsis,[textEllipsis]", inputs: { text: "text", fontSize: "fontSize", deviceSize: "deviceSize" }, usesInheritance: true, ngImport: i0, template: "<div (ellapsised)=\"onEllapsised($event)\" ellapsisText [ellapsisText]=\"text | bbbTranslate\">\r\n    {{ text | bbbTranslate }}\r\n</div>\r\n@if (ellipsised) {\r\n<fd-popover>\r\n    <fd-popover-control>\r\n        <button style=\"position: absolute; left: 0\" fd-button glyph=\"overflow\" fdType=\"transparent\" fdCompact></button>\r\n    </fd-popover-control>\r\n    <fd-popover-body style=\"max-width: 320px\">\r\n        <fd-text [text]=\"text | bbbTranslate\" [whitespaces]=\"true\"></fd-text>\r\n    </fd-popover-body>\r\n</fd-popover>\r\n}\r\n", styles: [":host{display:block;position:relative}\n"], dependencies: [{ kind: "directive", type: i2.EllapsisTextDirective, selector: "[ellapsisText]", inputs: ["ellapsisText", "fontSize", "disableEllapsis"], outputs: ["ellapsised"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i5$3.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaTextEllipsisComponent, isStandalone: false, selector: "bsu-barsa-text-ellipsis,[textEllipsis]", inputs: { text: "text", fontSize: "fontSize", deviceSize: "deviceSize" }, usesInheritance: true, ngImport: i0, template: "<div (ellapsised)=\"onEllapsised($event)\" ellapsisText [ellapsisText]=\"text | bbbTranslate\">\r\n    {{ text | bbbTranslate }}\r\n</div>\r\n@if (ellipsised) {\r\n<fd-popover>\r\n    <fd-popover-control>\r\n        <button style=\"position: absolute; left: 0\" fd-button glyph=\"overflow\" fdType=\"transparent\" fdCompact></button>\r\n    </fd-popover-control>\r\n    <fd-popover-body style=\"max-width: 320px\">\r\n        <fd-text [text]=\"text | bbbTranslate\" [whitespaces]=\"true\"></fd-text>\r\n    </fd-popover-body>\r\n</fd-popover>\r\n}\r\n", styles: [":host{display:block;position:relative}\n"], dependencies: [{ kind: "directive", type: i2.EllapsisTextDirective, selector: "[ellapsisText]", inputs: ["ellapsisText", "fontSize", "disableEllapsis"], outputs: ["ellapsised"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i5$3.TextComponent, selector: "fd-text", inputs: ["text", "maxLines", "whitespaces", "hyphenation", "expandable", "isCollapsed"], outputs: ["isCollapsedChange"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaTextEllipsisComponent, decorators: [{
             type: Component,
@@ -14208,7 +14340,7 @@ class BarsaListFileLinearGmailComponent extends UiFileLinearListBoxComponent {
         this.retry(fileAttachment);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaListFileLinearGmailComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaListFileLinearGmailComponent, isStandalone: false, selector: "bsu-barsa-list-file-linear-gmail", providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<ul fd-list>\r\n    @for (item of value; track item) { @if (!item.IsDeleted) {\r\n    <li fd-list-item style=\"background-color: #f5f5f5; margin: 0.5rem 0 0 30%\">\r\n        @if (item.inEdit) {\r\n        <input\r\n            style=\"width: 90%\"\r\n            fd-form-control\r\n            [value]=\"item.fileName\"\r\n            (click)=\"$event.preventDefault(); $event.stopPropagation()\"\r\n        />\r\n        } @if (!item.inEdit) {\r\n        <span fd-list-title>\r\n            {{ item.fileName }}\r\n        </span>\r\n        }\r\n        <span fd-list-secondary>\r\n            <button\r\n                ariaLabel=\"Edit Or Save\"\r\n                fdType=\"transparent\"\r\n                class=\"fd-button--compact\"\r\n                fd-button\r\n                fdCompact\r\n                [glyph]=\"item.inEdit ? 'save' : 'edit'\"\r\n                (click)=\"item.inEdit = !item.inEdit\"\r\n            ></button>\r\n            @if (!item.inEdit) {\r\n            <button ariaLabel=\"Remove\" fdType=\"transparent\" title=\"Remove\" fd-button glyph=\"delete\"></button>\r\n            }\r\n        </span>\r\n    </li>\r\n    } }\r\n</ul>\r\n<ul fd-list [byline]=\"true\">\r\n    @if (fileCount$ | async; as fileCount) { @if (fileCount === 0) {\r\n    <li fd-list-item>\r\n        <div fd-list-content style=\"text-align: center\">\r\n            <span>{{ 'NoFiles' | bbbTranslate }}</span>\r\n        </div>\r\n    </li>\r\n    } } @for (file of value; track file) { @if (valueExtra$ | async; as valueExtra) { @if (!file.IsDeleted) {\r\n    <li fd-list-item>\r\n        <span fd-list-thumbnail>\r\n            @if (valueExtra[file.Id].IsIcon) {\r\n            <fd-icon [glyph]=\"valueExtra[file.Id].FileUrl\"></fd-icon>\r\n            } @else {\r\n            <fd-avatar size=\"m\" [image]=\"valueExtra[file.Id].FileUrl || ''\"></fd-avatar>\r\n            }\r\n        </span>\r\n        <!-- for byline, fd-list-content is mandatory -->\r\n        <div fd-list-content>\r\n            <div fd-list-title>{{ file.FileName }}</div>\r\n            <div fd-list-byline [twoCol]=\"true\">\r\n                <div fd-list-byline-left></div>\r\n                <div fd-list-byline-right style=\"display: flex; justify-content: flex-end\">\r\n                    <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n                        @if (file.IsNew) {\r\n                        <span\r\n                            fd-toolbar-item\r\n                            fd-object-status\r\n                            [status]=\"file.Id | uploadFileStatus: valueExtra\"\r\n                            [label]=\"valueExtra[file.Id]?.UploadState || ''\"\r\n                            [title]=\"valueExtra[file.Id]?.UploadState\"\r\n                            [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\r\n                        ></span>\r\n                        @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n                        <fd-slider\r\n                            [contentDensity]=\"(contentDensity$ | async)!!\"\r\n                            [(ngModel)]=\"valueExtra[file.Id].Progress\"\r\n                            [name]=\"'filerLinear_' + id\"\r\n                            fd-toolbar-item\r\n                            [id]=\"id\"\r\n                            [min]=\"0\"\r\n                            [max]=\"100\"\r\n                            [step]=\"1\"\r\n                        >\r\n                        </fd-slider>\r\n                        } }\r\n                    </fd-toolbar>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        @if ((disableOrReadonly$ | async) === false && valueExtra[file.Id].UploadState !== 'Uploading') {\r\n        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onFileDeleted(file.Id)\"></button>\r\n        } @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'stop'\" (click)=\"onTerminate(file)\"></button>\r\n        } @if (valueExtra[file.Id].UploadState === 'Error') {\r\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'refresh'\" (click)=\"onRetry(file)\"></button>\r\n        }\r\n    </li>\r\n    } } }\r\n</ul>\r\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListBylineLeftDirective, selector: "[fdListBylineLeft], [fd-list-byline-left]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListBylineRightDirective, selector: "[fdListBylineRight], [fd-list-byline-right]", inputs: ["status", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i8.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaListFileLinearGmailComponent, isStandalone: false, selector: "bsu-barsa-list-file-linear-gmail", providers: [UploadService], usesInheritance: true, ngImport: i0, template: "<ul fd-list>\r\n    @for (item of value; track item) { @if (!item.IsDeleted) {\r\n    <li fd-list-item style=\"background-color: #f5f5f5; margin: 0.5rem 0 0 30%\">\r\n        @if (item.inEdit) {\r\n        <input\r\n            style=\"width: 90%\"\r\n            fd-form-control\r\n            [value]=\"item.fileName\"\r\n            (click)=\"$event.preventDefault(); $event.stopPropagation()\"\r\n        />\r\n        } @if (!item.inEdit) {\r\n        <span fd-list-title>\r\n            {{ item.fileName }}\r\n        </span>\r\n        }\r\n        <span fd-list-secondary>\r\n            <button\r\n                ariaLabel=\"Edit Or Save\"\r\n                fdType=\"transparent\"\r\n                class=\"fd-button--compact\"\r\n                fd-button\r\n                fdCompact\r\n                [glyph]=\"item.inEdit ? 'save' : 'edit'\"\r\n                (click)=\"item.inEdit = !item.inEdit\"\r\n            ></button>\r\n            @if (!item.inEdit) {\r\n            <button ariaLabel=\"Remove\" fdType=\"transparent\" title=\"Remove\" fd-button glyph=\"delete\"></button>\r\n            }\r\n        </span>\r\n    </li>\r\n    } }\r\n</ul>\r\n<ul fd-list [byline]=\"true\">\r\n    @if (fileCount$ | async; as fileCount) { @if (fileCount === 0) {\r\n    <li fd-list-item>\r\n        <div fd-list-content style=\"text-align: center\">\r\n            <span>{{ 'NoFiles' | bbbTranslate }}</span>\r\n        </div>\r\n    </li>\r\n    } } @for (file of value; track file) { @if (valueExtra$ | async; as valueExtra) { @if (!file.IsDeleted) {\r\n    <li fd-list-item>\r\n        <span fd-list-thumbnail>\r\n            @if (valueExtra[file.Id].IsIcon) {\r\n            <fd-icon [glyph]=\"valueExtra[file.Id].FileUrl\"></fd-icon>\r\n            } @else {\r\n            <fd-avatar size=\"m\" [image]=\"valueExtra[file.Id].FileUrl || ''\"></fd-avatar>\r\n            }\r\n        </span>\r\n        <!-- for byline, fd-list-content is mandatory -->\r\n        <div fd-list-content>\r\n            <div fd-list-title>{{ file.FileName }}</div>\r\n            <div fd-list-byline [twoCol]=\"true\">\r\n                <div fd-list-byline-left></div>\r\n                <div fd-list-byline-right style=\"display: flex; justify-content: flex-end\">\r\n                    <fd-toolbar [fdType]=\"'transparent'\" [clearBorder]=\"true\">\r\n                        @if (file.IsNew) {\r\n                        <span\r\n                            fd-toolbar-item\r\n                            fd-object-status\r\n                            [status]=\"file.Id | uploadFileStatus: valueExtra\"\r\n                            [label]=\"valueExtra[file.Id]?.UploadState || ''\"\r\n                            [title]=\"valueExtra[file.Id]?.UploadState\"\r\n                            [aria-label]=\"'File Upload Status Is ' + valueExtra[file.Id]?.UploadState\"\r\n                        ></span>\r\n                        @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n                        <fd-slider\r\n                            [contentDensity]=\"(contentDensity$ | async)!!\"\r\n                            [(ngModel)]=\"valueExtra[file.Id].Progress\"\r\n                            [name]=\"'filerLinear_' + id\"\r\n                            fd-toolbar-item\r\n                            [id]=\"id\"\r\n                            [min]=\"0\"\r\n                            [max]=\"100\"\r\n                            [step]=\"1\"\r\n                        >\r\n                        </fd-slider>\r\n                        } }\r\n                    </fd-toolbar>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        @if ((disableOrReadonly$ | async) === false && valueExtra[file.Id].UploadState !== 'Uploading') {\r\n        <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onFileDeleted(file.Id)\"></button>\r\n        } @if (valueExtra[file.Id].UploadState === 'Uploading') {\r\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'stop'\" (click)=\"onTerminate(file)\"></button>\r\n        } @if (valueExtra[file.Id].UploadState === 'Error') {\r\n        <button fd-button [fdType]=\"'transparent'\" [glyph]=\"'refresh'\" (click)=\"onRetry(file)\"></button>\r\n        }\r\n    </li>\r\n    } } }\r\n</ul>\r\n", styles: [":host{display:block;width:100%;height:100%}:host ::ng-deep .fd-slider__handle{display:none}:host ::ng-deep .fd-file-uploader input{display:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListSecondaryDirective, selector: "[fd-list-secondary], [fdListSecondary]", inputs: ["type"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListBylineLeftDirective, selector: "[fdListBylineLeft], [fd-list-byline-left]", inputs: ["wrap"] }, { kind: "directive", type: i7.ListBylineRightDirective, selector: "[fdListBylineRight], [fd-list-byline-right]", inputs: ["status", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i7$2.ToolbarComponent, selector: "fd-toolbar", inputs: ["titleId", "class", "shouldOverflow", "fdType", "title", "active", "clearBorder", "forceOverflow", "tabindex", "headingLevel", "ariaLabel", "ariaLabelledBy"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: i11.SliderComponent, selector: "fd-slider", inputs: ["id", "class", "ariaLabelledBy", "ariaLabel", "min", "max", "step", "jump", "tickmarksBetweenLabels", "mode", "showTicks", "showTicksLabels", "customValues", "tooltipMode", "hideProgressBar", "disabled", "vertical", "value"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: UploadFileStatusPipe, name: "uploadFileStatus" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaListFileLinearGmailComponent, decorators: [{
             type: Component,
@@ -14311,7 +14443,7 @@ class BarsaCardLayoutPanelComponent extends LayoutPanelBaseComponent {
         FillAllLayoutControls(this.config, this.layoutControls);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaCardLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaCardLayoutPanelComponent, isStandalone: false, selector: "bsu-barsa-card-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card [style.margin]=\"parameters?.Margin\">\r\n    @if (parameters?.HideTitle !== true) {\r\n    <fd-card-header [class.hideBorder]=\"parameters?.HideHeaderBorder\">\r\n        <fd-card-main-header>\r\n            <h3 fd-title fd-card-title>\r\n                {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\r\n            </h3>\r\n        </fd-card-main-header>\r\n    </fd-card-header>\r\n    }\r\n    <fd-card-content>\r\n        <bsu-ly-layout-panel [config]=\"config\" [hideTitle]=\"true\"> </bsu-ly-layout-panel>\r\n    </fd-card-content>\r\n    <fd-card-footer style=\"display: none\"> </fd-card-footer>\r\n</fd-card>\r\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host fd-card-header.hideBorder{border:none}\n"], dependencies: [{ kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$3.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i7$3.CardFooterComponent, selector: "fd-card-footer" }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle", "notPanelMode"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaCardLayoutPanelComponent, isStandalone: false, selector: "bsu-barsa-card-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card [style.margin]=\"parameters?.Margin\">\r\n    @if (parameters?.HideTitle !== true) {\r\n    <fd-card-header [class.hideBorder]=\"parameters?.HideHeaderBorder\">\r\n        <fd-card-main-header>\r\n            <h3 fd-title fd-card-title>\r\n                {{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}\r\n            </h3>\r\n        </fd-card-main-header>\r\n    </fd-card-header>\r\n    }\r\n    <fd-card-content>\r\n        <bsu-ly-layout-panel [config]=\"config\" [hideTitle]=\"true\"> </bsu-ly-layout-panel>\r\n    </fd-card-content>\r\n    <fd-card-footer style=\"display: none\"> </fd-card-footer>\r\n</fd-card>\r\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host fd-card-header.hideBorder{border:none}\n"], dependencies: [{ kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$4.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$4.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i7$4.CardFooterComponent, selector: "fd-card-footer" }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle", "notPanelMode"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaCardLayoutPanelComponent, decorators: [{
             type: Component,
@@ -14369,7 +14501,7 @@ class BarsaBarPanelComponent extends LayoutPanelBaseComponent {
         FillAllLayoutControls(this.config, this.layoutControls);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaBarPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: BarsaBarPanelComponent, isStandalone: false, selector: "bsu-barsa-bar-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card>\n    <fd-card-content>\n        <bsu-barsa-base-layout-panel\n            [layoutControls]=\"layoutControls\"\n            [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\n            [isSearchPanel]=\"isSearchPanel\"\n            [config]=\"config\"\n        ></bsu-barsa-base-layout-panel>\n    </fd-card-content>\n</fd-card>\n", styles: [":host div:first-child{height:auto}\n"], dependencies: [{ kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: BarsaBaseLayoutPanelComponent, selector: "bsu-barsa-base-layout-panel", inputs: ["layoutControls", "config", "maxLabelWidth", "isSearchPanel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.0.6", type: BarsaBarPanelComponent, isStandalone: false, selector: "bsu-barsa-bar-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "<fd-card>\n    <fd-card-content>\n        <bsu-barsa-base-layout-panel\n            [layoutControls]=\"layoutControls\"\n            [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\n            [isSearchPanel]=\"isSearchPanel\"\n            [config]=\"config\"\n        ></bsu-barsa-base-layout-panel>\n    </fd-card-content>\n</fd-card>\n", styles: [":host div:first-child{height:auto}\n"], dependencies: [{ kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: BarsaBaseLayoutPanelComponent, selector: "bsu-barsa-base-layout-panel", inputs: ["layoutControls", "config", "maxLabelWidth", "isSearchPanel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaBarPanelComponent, decorators: [{
             type: Component,
@@ -14478,7 +14610,7 @@ class BarsaGridLayoutPanelComponent extends LayoutPanelBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaGridLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaGridLayoutPanelComponent, isStandalone: false, selector: "bsu-barsa-grid-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "@if (parameters?.CardMode) {\r\n<fd-card [style.margin]=\"parameters?.Margin\">\r\n    <fd-card-content>\r\n        <ng-container *ngTemplateOutlet=\"layoutGridTpl; context: { $implicit: true }\"></ng-container>\r\n    </fd-card-content>\r\n</fd-card>\r\n} @else { @if (config) {\r\n<fd-layout-grid [style.margin]=\"parameters?.CardMode ? null : parameters?.Margin\">\r\n    <div fdLayoutGridRow>\r\n        @for (gridCol of parameters?.GridColumns?.MoDataList; track gridCol) {\r\n        <div\r\n            class=\"container\"\r\n            [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\r\n            [colMd]=\"gridCol.ColMd\"\r\n            [colLg]=\"gridCol.ColLg\"\r\n            [colXl]=\"gridCol.ColXl\"\r\n        >\r\n            @if (gridCol.$LayoutGroup) {\r\n            <bnrc-dynamic-layout\r\n                [config]=\"gridCol.$LayoutGroup\"\r\n                [selector]=\"'bsu-ly-layout-panel'\"\r\n                [name]=\"'LyLayoutPanelComponent'\"\r\n                [module]=\"'BarsaSapUi'\"\r\n                [moduleFileName]=\"'BarsaSapUi'\"\r\n                [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\r\n                [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\r\n                [isSearchPanel]=\"isSearchPanel\"\r\n            >\r\n            </bnrc-dynamic-layout>\r\n            }\r\n            <!-- <bsu-ly-layout-panel [hideTitle]=\"true\" class=\"panel-inside-layout\"> </bsu-ly-layout-panel> -->\r\n        </div>\r\n        }\r\n    </div>\r\n</fd-layout-grid>\r\n} }\r\n<ng-template #layoutGridTpl let-cardMode>\r\n    @if (config) {\r\n    <fd-layout-grid [style.margin]=\"cardMode ? null : parameters?.Margin\">\r\n        <div fdLayoutGridRow>\r\n            @for (gridCol of parameters?.GridColumns?.MoDataList; track gridCol) {\r\n            <div\r\n                class=\"container\"\r\n                [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\r\n                [colMd]=\"gridCol.ColMd\"\r\n                [colLg]=\"gridCol.ColLg\"\r\n                [colXl]=\"gridCol.ColXl\"\r\n            >\r\n                @if (gridCol.$LayoutGroup) {\r\n                <bnrc-dynamic-layout\r\n                    [config]=\"gridCol.$LayoutGroup\"\r\n                    [selector]=\"'bsu-ly-layout-panel'\"\r\n                    [name]=\"'LyLayoutPanelComponent'\"\r\n                    [module]=\"'BarsaSapUi'\"\r\n                    [moduleFileName]=\"'BarsaSapUi'\"\r\n                    [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\r\n                    [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\r\n                    [isSearchPanel]=\"isSearchPanel\"\r\n                >\r\n                </bnrc-dynamic-layout>\r\n                }\r\n                <!-- <bsu-ly-layout-panel [hideTitle]=\"true\" class=\"panel-inside-layout\"> </bsu-ly-layout-panel> -->\r\n            </div>\r\n            }\r\n        </div>\r\n    </fd-layout-grid>\r\n    }\r\n</ng-template>\r\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host .container ::ng-deep>bsu-ly-layout-panel>fd-panel>.fd-panel>.fd-panel__content{padding:0}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i10.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i10.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i10.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaGridLayoutPanelComponent, isStandalone: false, selector: "bsu-barsa-grid-layout-panel", providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "@if (parameters?.CardMode) {\r\n<fd-card [style.margin]=\"parameters?.Margin\">\r\n    <fd-card-content>\r\n        <ng-container *ngTemplateOutlet=\"layoutGridTpl; context: { $implicit: true }\"></ng-container>\r\n    </fd-card-content>\r\n</fd-card>\r\n} @else { @if (config) {\r\n<fd-layout-grid [style.margin]=\"parameters?.CardMode ? null : parameters?.Margin\">\r\n    <div fdLayoutGridRow>\r\n        @for (gridCol of parameters?.GridColumns?.MoDataList; track gridCol) {\r\n        <div\r\n            class=\"container\"\r\n            [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\r\n            [colMd]=\"gridCol.ColMd\"\r\n            [colLg]=\"gridCol.ColLg\"\r\n            [colXl]=\"gridCol.ColXl\"\r\n        >\r\n            @if (gridCol.$LayoutGroup) {\r\n            <bnrc-dynamic-layout\r\n                [config]=\"gridCol.$LayoutGroup\"\r\n                [selector]=\"'bsu-ly-layout-panel'\"\r\n                [name]=\"'LyLayoutPanelComponent'\"\r\n                [module]=\"'BarsaSapUi'\"\r\n                [moduleFileName]=\"'BarsaSapUi'\"\r\n                [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\r\n                [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\r\n                [isSearchPanel]=\"isSearchPanel\"\r\n            >\r\n            </bnrc-dynamic-layout>\r\n            }\r\n            <!-- <bsu-ly-layout-panel [hideTitle]=\"true\" class=\"panel-inside-layout\"> </bsu-ly-layout-panel> -->\r\n        </div>\r\n        }\r\n    </div>\r\n</fd-layout-grid>\r\n} }\r\n<ng-template #layoutGridTpl let-cardMode>\r\n    @if (config) {\r\n    <fd-layout-grid [style.margin]=\"cardMode ? null : parameters?.Margin\">\r\n        <div fdLayoutGridRow>\r\n            @for (gridCol of parameters?.GridColumns?.MoDataList; track gridCol) {\r\n            <div\r\n                class=\"container\"\r\n                [fdLayoutGridCol]=\"gridCol.LayoutGridCol\"\r\n                [colMd]=\"gridCol.ColMd\"\r\n                [colLg]=\"gridCol.ColLg\"\r\n                [colXl]=\"gridCol.ColXl\"\r\n            >\r\n                @if (gridCol.$LayoutGroup) {\r\n                <bnrc-dynamic-layout\r\n                    [config]=\"gridCol.$LayoutGroup\"\r\n                    [selector]=\"'bsu-ly-layout-panel'\"\r\n                    [name]=\"'LyLayoutPanelComponent'\"\r\n                    [module]=\"'BarsaSapUi'\"\r\n                    [moduleFileName]=\"'BarsaSapUi'\"\r\n                    [maxLabelWidth]=\"(maxLabelWidth$ | async)!!\"\r\n                    [flex]=\"isSearchPanel ? 'unset' : config.Bounds.width\"\r\n                    [isSearchPanel]=\"isSearchPanel\"\r\n                >\r\n                </bnrc-dynamic-layout>\r\n                }\r\n                <!-- <bsu-ly-layout-panel [hideTitle]=\"true\" class=\"panel-inside-layout\"> </bsu-ly-layout-panel> -->\r\n            </div>\r\n            }\r\n        </div>\r\n    </fd-layout-grid>\r\n    }\r\n</ng-template>\r\n", styles: [":host fd-card-header{cursor:default}:host fd-card-header:hover{background:var(--fdCard_Background_Color)}:host .container ::ng-deep>bsu-ly-layout-panel>fd-panel>.fd-panel>.fd-panel__content{padding:0}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i2.DynamicLayoutComponent, selector: "bnrc-dynamic-layout", inputs: ["selector", "module", "name", "parameters", "moduleFileName", "flex", "config", "maxLabelWidth", "hasHorizontalText", "isSearchPanel"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "component", type: i10.LayoutGridComponent, selector: "fd-layout-grid, [fdLayoutGrid]", inputs: ["class", "noGap", "noHorizontalGap", "noVerticalGap"] }, { kind: "directive", type: i10.LayoutGridColDirective, selector: "[fd-layout-grid-col], [fdLayoutGridCol]", inputs: ["fdLayoutGridCol", "colGrow", "colMd", "colLg", "colXl", "colOffset", "colOffsetMd", "colOffsetLg", "colOffsetXl", "class"] }, { kind: "directive", type: i10.LayoutGridRowDirective, selector: "[fd-layout-grid-row], [fdLayoutGridRow]" }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaGridLayoutPanelComponent, decorators: [{
             type: Component,
@@ -14703,7 +14835,7 @@ class UiMultiSelectCardComponent extends UiMultiSelectComboComponent {
         this._raiseValueChanged();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiMultiSelectCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiMultiSelectCardComponent, isStandalone: false, selector: "bsu-ui-multi-select-card", usesInheritance: true, ngImport: i0, template: "<fd-form-group [isInline]=\"!parameters?.IsVertically && !(isMobile && parameters?.OnlyInMobileVertically)\">\r\n    @for (item of dataList; track item; let i = $index; let first = $first) {\r\n    <div fd-form-item>\r\n        <fd-card>\r\n            <fd-card-content>\r\n                <img\r\n                    width=\"90px\"\r\n                    [src]=\"item.fileId | picFieldSrc: 'PictureFileInfo':item.Id:item.fieldDefId\"\r\n                    [alt]=\"item.txt\"\r\n                    [attr.aria-label]=\"item.txt\"\r\n                    [title]=\"item.txt\"\r\n                />\r\n            </fd-card-content>\r\n            <fd-card-header (click)=\"onRadioClicked(item)\">\r\n                <fd-card-main-header>\r\n                    <fd-radio-button\r\n                        fd-card-title\r\n                        [value]=\"item.id\"\r\n                        [id]=\"'radio-' + id + i\"\r\n                        [name]=\"'radio' + id + i\"                        \r\n                        [class.control-disabled]=\"(disableOrReadonly$ | async) === true\"\r\n                        [disabled]=\"(disableOrReadonly$ | async) === true\"\r\n                        [ngModel]=\"value\"\r\n                        [selectedValue]=\"value\"\r\n                    >\r\n                        {{ item.txt }}\r\n                    </fd-radio-button>\r\n                </fd-card-main-header>\r\n            </fd-card-header>\r\n        </fd-card>\r\n    </div>\r\n    }\r\n</fd-form-group>\r\n", styles: [":host{display:block;width:100%;height:100%}:host div[fd-form-item]{margin:0 .5rem}fd-form-group{row-gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$3.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "component", type: i3$7.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "readOnly", "selectedValue", "name", "id", "value", "required", "standalone", "wrapLabel", "valignLabel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiMultiSelectCardComponent, isStandalone: false, selector: "bsu-ui-multi-select-card", usesInheritance: true, ngImport: i0, template: "<fd-form-group [isInline]=\"!parameters?.IsVertically && !(isMobile && parameters?.OnlyInMobileVertically)\">\r\n    @for (item of dataList; track item; let i = $index; let first = $first) {\r\n    <div fd-form-item>\r\n        <fd-card>\r\n            <fd-card-content>\r\n                <img\r\n                    width=\"90px\"\r\n                    [src]=\"item.fileId | picFieldSrc: 'PictureFileInfo':item.Id:item.fieldDefId\"\r\n                    [alt]=\"item.txt\"\r\n                    [attr.aria-label]=\"item.txt\"\r\n                    [title]=\"item.txt\"\r\n                />\r\n            </fd-card-content>\r\n            <fd-card-header (click)=\"onRadioClicked(item)\">\r\n                <fd-card-main-header>\r\n                    <fd-radio-button\r\n                        fd-card-title\r\n                        [value]=\"item.id\"\r\n                        [id]=\"'radio-' + id + i\"\r\n                        [name]=\"'radio' + id + i\"                        \r\n                        [class.control-disabled]=\"(disableOrReadonly$ | async) === true\"\r\n                        [disabled]=\"(disableOrReadonly$ | async) === true\"\r\n                        [ngModel]=\"value\"\r\n                        [selectedValue]=\"value\"\r\n                    >\r\n                        {{ item.txt }}\r\n                    </fd-radio-button>\r\n                </fd-card-main-header>\r\n            </fd-card-header>\r\n        </fd-card>\r\n    </div>\r\n    }\r\n</fd-form-group>\r\n", styles: [":host{display:block;width:100%;height:100%}:host div[fd-form-item]{margin:0 .5rem}fd-form-group{row-gap:1rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$4.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$4.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i2$1.FormItemComponent, selector: "[fd-form-item]", inputs: ["isInline", "horizontal"] }, { kind: "component", type: i2$1.FormGroupComponent, selector: "fd-form-group", inputs: ["isInline"] }, { kind: "component", type: i3$7.RadioButtonComponent, selector: "fd-radio-button", inputs: ["ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "title", "tabIndex", "state", "disabled", "readOnly", "selectedValue", "name", "id", "value", "required", "standalone", "wrapLabel", "valignLabel"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiMultiSelectCardComponent, decorators: [{
             type: Component,
@@ -14847,7 +14979,7 @@ class BarsaReportOneOfListComponent extends ReportViewBaseComponent {
         this.hastLastRecord.set(molist.length ? true : false);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaReportOneOfListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaReportOneOfListComponent, isStandalone: false, selector: "bsu-barsa-report-one-of-list", inputs: { disabled: "disabled" }, viewQueries: [{ propertyName: "_inputGroupRef", first: true, predicate: ["InputGroupRef"], descendants: true, static: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(viewSetting && moDataList){\r\n<div class=\"tw-relative\" #containerRef>\r\n    <input\r\n        fd-form-control\r\n        [readonly]=\"true\"\r\n        [ngModel]=\"!hastLastRecord() ? '' : (viewSetting.DbColumnName | rval: moDataList[0]:allColumns:true)\"\r\n        class=\"revert-readonly-bg\"\r\n    />\r\n    <div class=\"!tw-absolute tw-left-0 tw-top-[0.1875rem] tw-flex\">\r\n        @if (viewSetting?.OpenInIndependentForm) {\r\n        <button\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            glyph=\"popup-window\"\r\n            ariaLabel=\"Open in an independent form\"\r\n            title=\"Open in an independent form\"\r\n            (click)=\"openInIndependentFormClicked()\"\r\n        ></button>\r\n        }\r\n        <button\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            glyph=\"list\"\r\n            ariaLabel=\"Show list\"\r\n            title=\"Show list\"\r\n            (click)=\"open(popover, dialogTemplate)\"\r\n        ></button>\r\n    </div>\r\n    <fd-popover\r\n        #popover\r\n        placement=\"bottom-end\"\r\n        [focusTrapped]=\"true\"\r\n        [focusAutoCapture]=\"true\"\r\n        [appendTo]=\"containerRef\"\r\n        class=\"!tw-block\"\r\n    >\r\n        <fd-popover-body [style.width.px]=\"containerRef.offsetWidth\">\r\n            <ng-container *ngTemplateOutlet=\"middle\"></ng-container>\r\n            <div fd-popover-body-footer>\r\n                <ng-container *ngTemplateOutlet=\"footer\"></ng-container>\r\n            </div>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</div>\r\n<ng-template #middle>\r\n    <bsu-ulv-toolbar\r\n        [hideToolbar]=\"customButtons.length === 0\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [toolbarButtons]=\"customButtons\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [title]=\"isMobile ? title : ''\"\r\n        [access]=\"access\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [inDialog]=\"inDialog\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [inlineEditMode]=\"false\"\r\n        [allowInlineEdit]=\"false\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n    ></bsu-ulv-toolbar>\r\n    <bsu-ui-table-view\r\n        [gridFreeColumnSizing]=\"false\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [disableResize]=\"true\"\r\n        [disableHeaderContextMenu]=\"true\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [fullscreen]=\"fullscreen\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [rtl]=\"rtl\"\r\n        [inDialog]=\"inDialog\"\r\n        [disableFixedTableLayout]=\"true\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [contextView]=\"contextView\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [hasInlineDeleteButton]=\"true\"\r\n        [hasInlineEditButton]=\"true\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [groupby]=\"groupby\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [columns]=\"columns\"\r\n        [columnWidth]=\"100 / columns.length\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [rowHoverable]=\"rowHoverable\"\r\n        [rowActivable]=\"rowActivable\"\r\n        [formSetting]=\"formSetting\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [reportId]=\"reportId\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        [fitWidth]=\"false\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [newInlineEditMo]=\"newInlineEditMo\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n    >\r\n    </bsu-ui-table-view>\r\n</ng-template>\r\n<ng-template #footer let-dialog=\"dialog\" let-popover=\"popover\">\r\n    <div fd-bar [barDesign]=\"'footer'\">\r\n        <div fd-bar-right>\r\n            <fd-button-bar\r\n                [label]=\"getNewButton?.text ?? ''\"\r\n                fdType=\"emphasized\"\r\n                (click)=\"onAdd(popover)\"\r\n                bodyClick\r\n                glyph=\"add\"\r\n            ></fd-button-bar>\r\n            <fd-button-bar\r\n                fdType=\"transparent\"\r\n                label=\"\u0628\u0633\u062A\u0646\"\r\n                bodyClick\r\n                (click)=\"close(dialog)\"\r\n                ariaLabel=\"Close\"\r\n            ></fd-button-bar>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template [fdDialogTemplate] let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h1 id=\"fd-dialog-header-3\" fd-title>{{ title }}</h1>\r\n            <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body class=\"!tw-pt-0\">\r\n            <ng-container *ngTemplateOutlet=\"middle\"></ng-container>\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer>\r\n            <ng-container *ngTemplateOutlet=\"footer; context: { dialog: dialog }\"></ng-container>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n}\r\n", styles: [".revert-readonly-bg{background-color:var(--sapField_Background)}bsu-ui-table-view ::ng-deep table tbody bsu-barsa-table-row:last-child ::ng-deep>tr>td{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$3.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i3$3.DialogTemplateDirective, selector: "[fdDialogTemplate]", inputs: ["fdDialogTemplateConfig"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$2.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "enableSearch", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected", "config", "hidden", "buttons", "moDataListCount"], outputs: ["search", "groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiTableViewComponent, selector: "bsu-ui-table-view", inputs: ["columnWidth", "minWidth", "minHeight", "disableResize", "disableHeaderContextMenu", "rowResizer", "enableResizing", "disableFixedTableLayout"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaReportOneOfListComponent, isStandalone: false, selector: "bsu-barsa-report-one-of-list", inputs: { disabled: "disabled" }, viewQueries: [{ propertyName: "_inputGroupRef", first: true, predicate: ["InputGroupRef"], descendants: true, static: true }, { propertyName: "popover", first: true, predicate: ["popover"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if(viewSetting && moDataList){\r\n<div class=\"tw-relative\" #containerRef>\r\n    <input\r\n        fd-form-control\r\n        [readonly]=\"true\"\r\n        [ngModel]=\"!hastLastRecord() ? '' : (viewSetting.DbColumnName | rval: moDataList[0]:allColumns:true)\"\r\n        class=\"revert-readonly-bg\"\r\n    />\r\n    <div class=\"!tw-absolute tw-left-0 tw-top-[0.1875rem] tw-flex\">\r\n        @if (viewSetting?.OpenInIndependentForm) {\r\n        <button\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            glyph=\"popup-window\"\r\n            ariaLabel=\"Open in an independent form\"\r\n            title=\"Open in an independent form\"\r\n            (click)=\"openInIndependentFormClicked()\"\r\n        ></button>\r\n        }\r\n        <button\r\n            fd-button\r\n            fdType=\"transparent\"\r\n            glyph=\"list\"\r\n            ariaLabel=\"Show list\"\r\n            title=\"Show list\"\r\n            (click)=\"open(popover, dialogTemplate)\"\r\n        ></button>\r\n    </div>\r\n    <fd-popover\r\n        #popover\r\n        placement=\"bottom-end\"\r\n        [focusTrapped]=\"true\"\r\n        [focusAutoCapture]=\"true\"\r\n        [appendTo]=\"containerRef\"\r\n        class=\"!tw-block\"\r\n    >\r\n        <fd-popover-body [style.width.px]=\"containerRef.offsetWidth\">\r\n            <ng-container *ngTemplateOutlet=\"middle\"></ng-container>\r\n            <div fd-popover-body-footer>\r\n                <ng-container *ngTemplateOutlet=\"footer\"></ng-container>\r\n            </div>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</div>\r\n<ng-template #middle>\r\n    <bsu-ulv-toolbar\r\n        [hideToolbar]=\"customButtons.length === 0\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [toolbarButtons]=\"customButtons\"\r\n        [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n        [title]=\"isMobile ? title : ''\"\r\n        [access]=\"access\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [inDialog]=\"inDialog\"\r\n        [hasSelected]=\"hasSelected\"\r\n        [contentDensity]=\"contentDensity\"\r\n        [inlineEditMode]=\"false\"\r\n        [allowInlineEdit]=\"false\"\r\n        [moDataListCount]=\"moDataList.length\"\r\n    ></bsu-ulv-toolbar>\r\n    <bsu-ui-table-view\r\n        [gridFreeColumnSizing]=\"false\"\r\n        [cartableTemplates]=\"cartableTemplates\"\r\n        [disableResize]=\"true\"\r\n        [disableHeaderContextMenu]=\"true\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [fullscreen]=\"fullscreen\"\r\n        [selectedMo]=\"selectedMo\"\r\n        [rtl]=\"rtl\"\r\n        [inDialog]=\"inDialog\"\r\n        [disableFixedTableLayout]=\"true\"\r\n        [isMultiSelect]=\"isMultiSelect\"\r\n        [cartableChildsMo]=\"cartableChildsMo\"\r\n        [contextView]=\"contextView\"\r\n        [isCheckList]=\"isCheckList\"\r\n        [allChecked]=\"allChecked\"\r\n        [moDataList]=\"moDataList\"\r\n        [access]=\"access\"\r\n        [hasInlineDeleteButton]=\"true\"\r\n        [hasInlineEditButton]=\"true\"\r\n        [toolbarButtons]=\"toolbarButtons\"\r\n        [groupby]=\"groupby\"\r\n        [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n        [conditionalFormats]=\"conditionalFormats\"\r\n        [deviceName]=\"deviceName\"\r\n        [deviceSize]=\"deviceSize\"\r\n        [navigationArrow]=\"navigationArrow\"\r\n        [title]=\"title\"\r\n        [mobileOrTablet]=\"mobileOrTablet\"\r\n        [disableResponsive]=\"disableResponsive\"\r\n        [popin]=\"popin\"\r\n        [secondaryColumns]=\"secondaryColumns\"\r\n        [contextMenuItems]=\"contextMenuItems\"\r\n        [inlineEditMode]=\"inlineEditMode && allowInlineEdit\"\r\n        [allowInlineEdit]=\"allowInlineEdit\"\r\n        [columns]=\"columns\"\r\n        [columnWidth]=\"100 / columns.length\"\r\n        [columnsCount]=\"columnsCount\"\r\n        [rowHoverable]=\"rowHoverable\"\r\n        [rowActivable]=\"rowActivable\"\r\n        [formSetting]=\"formSetting\"\r\n        [typeDefId]=\"typeDefId\"\r\n        [reportId]=\"reportId\"\r\n        [listEditViewId]=\"listEditViewId\"\r\n        [typeViewId]=\"typeViewId\"\r\n        [extraRelation]=\"extraRelation\"\r\n        [showOkCancelButtons]=\"showOkCancelButtons\"\r\n        [fitWidth]=\"false\"\r\n        [hasSummary]=\"hasSummary\"\r\n        [newInlineEditMo]=\"newInlineEditMo\"\r\n        (ulvCommandClick)=\"onUlvCommand($event)\"\r\n        (selectNextInlineRecord)=\"onSelectNextInlineRecord($event)\"\r\n        (editFormPanelCancel)=\"onEditFormPanelCancel($event)\"\r\n        (editFormPanelSave)=\"onEditFormPanelSave($event)\"\r\n        (editFormPanelValueChange)=\"onEditFormPanelValueChange($event)\"\r\n        (sortAscending)=\"onSortAscending($event)\"\r\n        (sortDescending)=\"onSortDescending($event)\"\r\n        (filter)=\"onFilter($event)\"\r\n        (rowClick)=\"onRowClick($event)\"\r\n        (rowCheck)=\"onRowCheck($event)\"\r\n        (allCheckbox)=\"onAllCheckbox($event)\"\r\n        (expandClick)=\"onExpandClick($event)\"\r\n        (workflowShareButtons)=\"onWorkflowShareButtons($event)\"\r\n    >\r\n    </bsu-ui-table-view>\r\n</ng-template>\r\n<ng-template #footer let-dialog=\"dialog\" let-popover=\"popover\">\r\n    <div fd-bar [barDesign]=\"'footer'\">\r\n        <div fd-bar-right>\r\n            <fd-button-bar\r\n                [label]=\"getNewButton?.text ?? ''\"\r\n                fdType=\"emphasized\"\r\n                (click)=\"onAdd(popover)\"\r\n                bodyClick\r\n                glyph=\"add\"\r\n            ></fd-button-bar>\r\n            <fd-button-bar\r\n                fdType=\"transparent\"\r\n                label=\"\u0628\u0633\u062A\u0646\"\r\n                bodyClick\r\n                (click)=\"close(dialog)\"\r\n                ariaLabel=\"Close\"\r\n            ></fd-button-bar>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n\r\n<ng-template [fdDialogTemplate] let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <h1 id=\"fd-dialog-header-3\" fd-title>{{ title }}</h1>\r\n            <button fd-dialog-close-button (click)=\"dialog.dismiss()\"></button>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body class=\"!tw-pt-0\">\r\n            <ng-container *ngTemplateOutlet=\"middle\"></ng-container>\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer>\r\n            <ng-container *ngTemplateOutlet=\"footer; context: { dialog: dialog }\"></ng-container>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n}\r\n", styles: [".revert-readonly-bg{background-color:var(--sapField_Background)}bsu-ui-table-view ::ng-deep table tbody bsu-barsa-table-row:last-child ::ng-deep>tr>td{border-bottom:none!important}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "component", type: i3$3.DialogCloseButtonComponent, selector: "[fd-dialog-close-button]", inputs: ["mobile", "title", "ariaLabel"] }, { kind: "directive", type: i3$3.DialogTemplateDirective, selector: "[fdDialogTemplate]", inputs: ["fdDialogTemplateConfig"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: i7$3.PopoverBodyFooterDirective, selector: "[fdPopoverBodyFooter], [fd-popover-body-footer]" }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: UlvToolbarComponent, selector: "bsu-ulv-toolbar", inputs: ["allowGridColumnSort", "useLayoutItemTextForControl", "hideTitle", "title", "icon", "deviceName", "deviceSize", "access", "hideToolbar", "toolbarButtons", "contentDensity", "inlineEditMode", "allowInlineEdit", "gridSetting", "viewCollection", "reportView", "inDialog", "isMultiSelect", "cls", "hasSelected"], outputs: ["groupbyClick", "sortClick", "columnClick", "editModeClick", "viewClick", "createNewInlineMo"] }, { kind: "component", type: UiTableViewComponent, selector: "bsu-ui-table-view", inputs: ["columnWidth", "minWidth", "minHeight", "disableResize", "disableHeaderContextMenu", "rowResizer", "enableResizing", "disableFixedTableLayout"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaReportOneOfListComponent, decorators: [{
             type: Component,
@@ -14872,7 +15004,7 @@ class BarsaCardRowPayamComponent extends BaseViewItemPropsComponent {
         this.content = this._domSanitizer.bypassSecurityTrustHtml(`<div style="color:black;font-size:12pt;font-family:Calibri,Helvetica,sans-serif;">okkkk</div>`);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaCardRowPayamComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaCardRowPayamComponent, isStandalone: false, selector: "bsu-barsa-card-row-payam", usesInheritance: true, ngImport: i0, template: "<fd-card cardType=\"object\" class=\"docs-flex-item-margin\">\r\n    <fd-card-header (click)=\"hideContent = !hideContent\" bodyClick style=\"border-bottom: none\">\r\n        <fd-card-main-header>\r\n            <fd-avatar\r\n                image=\"http://picsum.photos/id/1018/400\"\r\n                [circle]=\"true\"\r\n                size=\"s\"\r\n                ariaLabel=\"avatar image\"\r\n                title=\"avatar image\"\r\n            ></fd-avatar>\r\n            <h2 fd-card-title>\r\n                <div style=\"display: flex; column-gap: 1.275rem\">\r\n                    <span>\u0631\u0627\u0647\u0628\u0631 \u0633\u06CC\u0633\u062A\u0645</span>\r\n                    <fd-object-attribute style=\"direction: ltr\">\u062E\u0648\u0627\u0646\u062F\u0647 \u062F\u0631: 1402/12/28 14:20 </fd-object-attribute>\r\n                    <span fd-object-status status=\"negative\" label=\"\u062E\u06CC\u0644\u06CC \u0645\u0647\u0645\" aria-label=\"\u062E\u06CC\u0644\u06CC \u0645\u0647\u0645\"></span>\r\n                </div>\r\n                <div style=\"position: absolute; left: 1.2rem; top: 50%\"><fd-icon [glyph]=\"'attachment'\"></fd-icon></div>\r\n            </h2>\r\n\r\n            <h3 fd-card-subtitle>\r\n                @if (hideContent) {\r\n                <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n                } @if (!hideContent) {\r\n                <ng-container *ngTemplateOutlet=\"toTpl\"></ng-container>\r\n                }\r\n            </h3>\r\n            @if (hideContent) {\r\n            <span fd-card-counter><div style=\"direction: ltr\">1402/12/28 14:20</div> </span>\r\n            } @if (!hideContent) {\r\n            <span\r\n                fd-card-counter\r\n                ulvContextMenu\r\n                [menuItems]=\"contextMenuItems\"\r\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            ></span>\r\n            }\r\n        </fd-card-main-header>\r\n    </fd-card-header>\r\n    @if (!hideContent) {\r\n    <fd-card-content>\r\n        <ng-container *ngTemplateOutlet=\"attachmentsTpl\"></ng-container>\r\n        <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n    </fd-card-content>\r\n    }\r\n</fd-card>\r\n\r\n<ng-template #contentTpl>\r\n    <div style=\"padding-top: 0.5rem; margin-top: 1rem; border-top: 1px solid #ccc\" [innerHtml]=\"content\"></div>\r\n</ng-template>\r\n\r\n<ng-template #toTpl>\r\n    <div>To: \u0645\u0646</div>\r\n    <div>Cc: \u0645\u0646</div>\r\n</ng-template>\r\n<ng-template #attachmentsTpl>\r\n    <div class=\"file-viewer-attachments\">\r\n        @for (file of mo.F5.Files; track file;let index=$index) { @if (!file.IsDeleted) {\r\n        <bsu-file-viewer-popover\r\n            [file]=\"file\"\r\n            [index]=\"index\"\r\n            [files]=\"mo.F5.Files\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [canDownload]=\"true\"\r\n            [disableRemove]=\"true\"\r\n            [fdType]=\"'transparent'\"\r\n        ></bsu-file-viewer-popover>\r\n        } }\r\n    </div>\r\n    @if (mo.F5.Files.length > 1) {\r\n    <button\r\n        fd-button\r\n        [fdType]=\"'transparent'\"\r\n        [label]=\"'Download' | bbbTranslate: 'All'\"\r\n        [glyph]=\"'download'\"\r\n        downloadFiles\r\n        [files]=\"mo.F5.Files\"\r\n    ></button>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%;padding-bottom:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$3.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$3.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$3.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i7$3.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "directive", type: i7$3.CardCounterDirective, selector: "[fd-card-counter]", inputs: ["statusInput"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i8$4.ObjectAttributeComponent, selector: "fd-object-attribute", inputs: ["label", "linkText", "islink", "disabled"], outputs: ["objectAttributeclick"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "closeOnOutsideClick", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "index", "deviceSize", "canDownload", "disableRemove", "fdType", "attachmentViewType"], outputs: ["remove"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaCardRowPayamComponent, isStandalone: false, selector: "bsu-barsa-card-row-payam", usesInheritance: true, ngImport: i0, template: "<fd-card cardType=\"object\" class=\"docs-flex-item-margin\">\r\n    <fd-card-header (click)=\"hideContent = !hideContent\" bodyClick style=\"border-bottom: none\">\r\n        <fd-card-main-header>\r\n            <fd-avatar\r\n                image=\"http://picsum.photos/id/1018/400\"\r\n                [circle]=\"true\"\r\n                size=\"s\"\r\n                ariaLabel=\"avatar image\"\r\n                title=\"avatar image\"\r\n            ></fd-avatar>\r\n            <h2 fd-card-title>\r\n                <div style=\"display: flex; column-gap: 1.275rem\">\r\n                    <span>\u0631\u0627\u0647\u0628\u0631 \u0633\u06CC\u0633\u062A\u0645</span>\r\n                    <fd-object-attribute style=\"direction: ltr\">\u062E\u0648\u0627\u0646\u062F\u0647 \u062F\u0631: 1402/12/28 14:20 </fd-object-attribute>\r\n                    <span fd-object-status status=\"negative\" label=\"\u062E\u06CC\u0644\u06CC \u0645\u0647\u0645\" aria-label=\"\u062E\u06CC\u0644\u06CC \u0645\u0647\u0645\"></span>\r\n                </div>\r\n                <div style=\"position: absolute; left: 1.2rem; top: 50%\"><fd-icon [glyph]=\"'attachment'\"></fd-icon></div>\r\n            </h2>\r\n\r\n            <h3 fd-card-subtitle>\r\n                @if (hideContent) {\r\n                <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n                } @if (!hideContent) {\r\n                <ng-container *ngTemplateOutlet=\"toTpl\"></ng-container>\r\n                }\r\n            </h3>\r\n            @if (hideContent) {\r\n            <span fd-card-counter><div style=\"direction: ltr\">1402/12/28 14:20</div> </span>\r\n            } @if (!hideContent) {\r\n            <span\r\n                fd-card-counter\r\n                ulvContextMenu\r\n                [menuItems]=\"contextMenuItems\"\r\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\r\n            ></span>\r\n            }\r\n        </fd-card-main-header>\r\n    </fd-card-header>\r\n    @if (!hideContent) {\r\n    <fd-card-content>\r\n        <ng-container *ngTemplateOutlet=\"attachmentsTpl\"></ng-container>\r\n        <ng-container *ngTemplateOutlet=\"contentTpl\"></ng-container>\r\n    </fd-card-content>\r\n    }\r\n</fd-card>\r\n\r\n<ng-template #contentTpl>\r\n    <div style=\"padding-top: 0.5rem; margin-top: 1rem; border-top: 1px solid #ccc\" [innerHtml]=\"content\"></div>\r\n</ng-template>\r\n\r\n<ng-template #toTpl>\r\n    <div>To: \u0645\u0646</div>\r\n    <div>Cc: \u0645\u0646</div>\r\n</ng-template>\r\n<ng-template #attachmentsTpl>\r\n    <div class=\"file-viewer-attachments\">\r\n        @for (file of mo.F5.Files; track file;let index=$index) { @if (!file.IsDeleted) {\r\n        <bsu-file-viewer-popover\r\n            [file]=\"file\"\r\n            [index]=\"index\"\r\n            [files]=\"mo.F5.Files\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [canDownload]=\"true\"\r\n            [disableRemove]=\"true\"\r\n            [fdType]=\"'transparent'\"\r\n        ></bsu-file-viewer-popover>\r\n        } }\r\n    </div>\r\n    @if (mo.F5.Files.length > 1) {\r\n    <button\r\n        fd-button\r\n        [fdType]=\"'transparent'\"\r\n        [label]=\"'Download' | bbbTranslate: 'All'\"\r\n        [glyph]=\"'download'\"\r\n        downloadFiles\r\n        [files]=\"mo.F5.Files\"\r\n    ></button>\r\n    }\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%;padding-bottom:.5rem}\n"], dependencies: [{ kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i7$4.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i7$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i7$4.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "directive", type: i7$4.CardSubtitleDirective, selector: "[fd-card-subtitle]" }, { kind: "directive", type: i7$4.CardCounterDirective, selector: "[fd-card-counter]", inputs: ["statusInput"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i10$1.ObjectStatusComponent, selector: "[fd-object-status]", inputs: ["class", "status", "glyph", "glyphFont", "label", "glyphAriaLabel", "indicationColor", "clickable", "inverted", "large", "secondaryIndication", "textTemplate"] }, { kind: "component", type: i8$3.ObjectAttributeComponent, selector: "fd-object-attribute", inputs: ["label", "linkText", "islink", "disabled"], outputs: ["objectAttributeclick"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "closeOnOutsideClick", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "component", type: FileViewerPopoverComponent, selector: "bsu-file-viewer-popover", inputs: ["files", "file", "index", "deviceSize", "canDownload", "disableRemove", "fdType", "attachmentViewType"], outputs: ["remove"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaCardRowPayamComponent, decorators: [{
             type: Component,
@@ -15494,7 +15626,7 @@ class BarsaChatMessageComponent extends BaseComponent {
         return { ...image, displayWidth, displayHeight };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaChatMessageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaChatMessageComponent, isStandalone: false, selector: "bsu-barsa-chat-message", inputs: { message: "message", showSender: "showSender", nextIsSame: "nextIsSame", pervIsSame: "pervIsSame", badge: "badge", nextHasBadge: "nextHasBadge", badgeLabel: "badgeLabel" }, outputs: { reply: "reply" }, usesInheritance: true, ngImport: i0, template: "<div\r\n    class=\"tw-w-full tw-px-4 tw-flex tw-flex-wrap\"\r\n    [ngClass]=\"{\r\n'tw-pt-1': pervIsSame,\r\n'tw-pt-3': !pervIsSame,\r\n}\"\r\n>\r\n    @if (badge) {\r\n    <div class=\"tw-w-full tw-pb-6 tw-pt-5\">\r\n        <div class=\"tw-w-fit tw-bg-zinc-500 tw-text-white tw-px-4 tw-mx-auto tw-rounded-full tw-text-md\">\r\n            {{ badgeLabel }}\r\n        </div>\r\n    </div>\r\n    }\r\n    <div\r\n        class=\"tw-w-full tw-flex tw-gap-2 tw-items-end tw-relative\"\r\n        [ngClass]=\"{\r\n'tw-justify-start': message.owner.id === message.userId,\r\n'tw-flex-row-reverse': message.owner.id !== message.userId,\r\n'tw-ms-14': (nextIsSame && !nextHasBadge) && message.owner.id === message.userId,\r\n'tw-me-14': (nextIsSame && !nextHasBadge) && message.owner.id !== message.userId,\r\n    }\"\r\n    >\r\n        @if (!nextIsSame || nextHasBadge) {\r\n        <fd-avatar\r\n            size=\"s\"\r\n            [label]=\"message.owner.avatar ? '' : message.owner?.name\"\r\n            [circle]=\"true\"\r\n            [image]=\"message.owner?.avatar\"\r\n            [placeholder]=\"message.owner.avatar ? false : true\"\r\n        ></fd-avatar>\r\n        } @if (!nextIsSame || nextHasBadge) {\r\n        <div\r\n            class=\"tw-bg-transparent tw-overflow-hidden tw-size-3 tw-absolute tw-bottom-0 tw-border-[6px] tw-border-t-transparent\"\r\n            [ngClass]=\"{\r\n                'tw-right-11 tw-border-b-green-100 tw-border-l-green-100 tw-border-r-transparent':\r\n                    message.owner.id === message.userId,\r\n                'tw-left-11 tw-border-b-default tw-border-r-default tw-border-l-transparent':\r\n                    message.owner.id !== message.userId\r\n            }\"\r\n        ></div>\r\n        }\r\n        <div\r\n            [@inPaneAnimation]=\"animationState\"\r\n            class=\"tw-max-w-[80%] tw-min-w-40 tw-rounded-2xl tw-text-base tw-relative tw-overflow-hidden\"\r\n            [ngClass]=\"{\r\n                '!tw-rounded-br-none':\r\n                    message.owner.id === message.userId &&\r\n                    (nextHasBadge || (nextIsSame && !nextHasBadge) || !nextIsSame),\r\n                '!tw-rounded-bl-none':\r\n                    message.owner.id !== message.userId &&\r\n                    (nextHasBadge || (nextIsSame && !nextHasBadge) || !nextIsSame),\r\n                '!tw-rounded-tr-none': message.owner.id === message.userId && pervIsSame && !badge,\r\n                '!tw-rounded-tl-none': message.owner.id !== message.userId && pervIsSame && !badge\r\n            }\"\r\n        >\r\n            @if (showSender && (!pervIsSame || badge)) {\r\n            <div\r\n                [ngClass]=\"{\r\n'tw-bg-green-100': message.owner.id === message.userId && !message.image,\r\n'tw-bg-default': message.owner.id !== message.userId && !message.image,\r\n'tw-absolute tw-top-0 tw-right-0 tw-pb-8 tw-w-full tw-rounded-tr-2xl tw-bg-gradient-to-b tw-to-transparent': message.image,\r\n'tw-from-green-100': message.owner.id === message.userId && message.image,\r\n'tw-from-default': message.owner.id !== message.userId && message.image,\r\n                    }\"\r\n                class=\"tw-font-bold tw-text-base tw-px-3 tw-pt-2 tw-z-10\"\r\n            >\r\n                {{ message.owner.name }}\r\n            </div>\r\n            } @if (message.image) { @if (imageRatio(message.image); as image) {\r\n            <div\r\n                [ngClass]=\"{\r\n'tw-bg-green-100/[.3]': message.owner.id === message.userId,\r\n'tw-bg-default/[.3]': message.owner.id !== message.userId,\r\n                    }\"\r\n                class=\"tw-flex tw-justify-center tw-items-center tw-bg-zinc-500/[.3] tw-relative\"\r\n            >\r\n                <a\r\n                    [download]=\"message.image.name\"\r\n                    href=\"assets/bg-chat.jpg\"\r\n                    target=\"_blank\"\r\n                    class=\"tw-absolute tw-w-full tw-h-full tw-bg-black/[.4] dark:tw-bg-white/[.4] tw-opacity-0 hover:tw-opacity-100 tw-transition-all tw-cursor-pointer tw-flex tw-justify-center tw-items-center\"\r\n                >\r\n                    <fd-icon class=\"!tw-text-default !tw-text-3xl\" glyph=\"download\"></fd-icon>\r\n                </a>\r\n                <img\r\n                    [ngStyle]=\"{\r\n                        width: image.displayWidth + 'px',\r\n                        height: image.displayHeight + 'px'\r\n                    }\"\r\n                    [src]=\"image.url\"\r\n                />\r\n            </div>\r\n            } } @for(file of message.files;track file.Id) {\r\n            <div\r\n                [ngClass]=\"{\r\n'tw-bg-green-100': message.owner.id === message.userId,\r\n'tw-bg-default': message.owner.id !== message.userId,\r\n                    }\"\r\n                class=\"tw-px-2 tw-pt-2 w-full tw-flex tw-gap-2\"\r\n            >\r\n                <a\r\n                    downloadFiles\r\n                    [files]=\"[file]\"\r\n                    class=\"tw-shrink-0 tw-row-0 tw-size-12 tw-rounded-lg tw-bg-orange-400 tw-flex tw-justify-center tw-items-center tw-cursor-pointer tw-transition-all hover:tw-bg-orange-600\"\r\n                >\r\n                    <span class=\"tw-font-bold leading-6 tw-text-lg tw-text-white\">\r\n                        {{ file.Type }}\r\n                    </span>\r\n                </a>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                    <span\r\n                        class=\"tw-font-bold tw-text-md tw-text-base tw-truncate tw-max-w-48\"\r\n                        [attr.title]=\"file.FileName\"\r\n                    >\r\n                        {{ file.FileName }}</span\r\n                    >\r\n                    <span class=\"tw-text-sm tw-text-gray-500 dark:tw-text-gray-400 tw-w-full tw-truncate\">\r\n                        {{ file.Size }}KB</span\r\n                    >\r\n                </div>\r\n            </div>\r\n            } @if (message.text) {\r\n            <div\r\n                [ngClass]=\"{\r\n'tw-bg-green-100': message.owner.id === message.userId,\r\n'tw-bg-default': message.owner.id !== message.userId,\r\n                    }\"\r\n                class=\"tw-whitespace-pre-line tw-px-3 tw-pt-1\"\r\n                [innerHTML]=\"message.text\"\r\n            ></div>\r\n            }\r\n            <div\r\n                class=\"tw-flex tw-w-full tw-px-2 tw-pt-1 tw-pb-2 tw-items-center tw-gap-2 tw-justify-end\"\r\n                [ngClass]=\"{\r\n'tw-bg-green-100': message.owner.id === message.userId,\r\n'tw-bg-default tw-flex-row-reverse': message.owner.id !== message.userId,\r\n}\"\r\n            >\r\n                <span class=\"tw-text-xs tw-text-gray-500 dark:tw-text-gray-300\">\r\n                    {{ message.createdAt | utilDateToHhMm }}\r\n                    @if(message.owner.id === message.userId){\r\n                    <bsu-barsa-chat-message-status\r\n                        [messageSent]=\"true\"\r\n                        [messageRead]=\"!!message.readAt\"\r\n                    ></bsu-barsa-chat-message-status>\r\n                    }\r\n                </span>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n<ng-template #moreActions>\r\n    <fd-popover placement=\"bottom-end\" title=\"bottom-end\">\r\n        <fd-popover-control>\r\n            <button fd-button fdType=\"transparent\" [fdCompact]=\"true\" glyph=\"navigation-down-arrow\"></button>\r\n        </fd-popover-control>\r\n        <fd-popover-body minWidth=\"10rem\">\r\n            <div class=\"tw-flex tw-flex-col tw-bg-default tw-w-full\" bodyClick>\r\n                <label\r\n                    class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                    (click)=\"reply.emit(message)\"\r\n                >\r\n                    <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"undo\"></fd-icon>\r\n                    <span class=\"!tw-text-base\">\u067E\u0627\u0633\u062E \u062F\u0627\u062F\u0646</span>\r\n                </label>\r\n                <label\r\n                    class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                >\r\n                    <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"forward\"></fd-icon>\r\n                    <span class=\"!tw-text-base\">\u0627\u0631\u0633\u0627\u0644 \u06A9\u0631\u062F\u0646</span>\r\n                </label>\r\n                <label\r\n                    class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                >\r\n                    <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"delete\"></fd-icon>\r\n                    <span class=\"!tw-text-base\">\u062D\u0630\u0641</span>\r\n                </label>\r\n            </div>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</ng-template>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: BarsaChatMessageStatusComponent, selector: "bsu-barsa-chat-message-status", inputs: ["messageRead", "messageSent"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: UtilDateToHhMmPipe, name: "utilDateToHhMm" }], animations: [
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaChatMessageComponent, isStandalone: false, selector: "bsu-barsa-chat-message", inputs: { message: "message", showSender: "showSender", nextIsSame: "nextIsSame", pervIsSame: "pervIsSame", badge: "badge", nextHasBadge: "nextHasBadge", badgeLabel: "badgeLabel" }, outputs: { reply: "reply" }, usesInheritance: true, ngImport: i0, template: "<div\r\n    class=\"tw-w-full tw-px-4 tw-flex tw-flex-wrap\"\r\n    [ngClass]=\"{\r\n'tw-pt-1': pervIsSame,\r\n'tw-pt-3': !pervIsSame,\r\n}\"\r\n>\r\n    @if (badge) {\r\n    <div class=\"tw-w-full tw-pb-6 tw-pt-5\">\r\n        <div class=\"tw-w-fit tw-bg-zinc-500 tw-text-white tw-px-4 tw-mx-auto tw-rounded-full tw-text-md\">\r\n            {{ badgeLabel }}\r\n        </div>\r\n    </div>\r\n    }\r\n    <div\r\n        class=\"tw-w-full tw-flex tw-gap-2 tw-items-end tw-relative\"\r\n        [ngClass]=\"{\r\n'tw-justify-start': message.owner.id === message.userId,\r\n'tw-flex-row-reverse': message.owner.id !== message.userId,\r\n'tw-ms-14': (nextIsSame && !nextHasBadge) && message.owner.id === message.userId,\r\n'tw-me-14': (nextIsSame && !nextHasBadge) && message.owner.id !== message.userId,\r\n    }\"\r\n    >\r\n        @if (!nextIsSame || nextHasBadge) {\r\n        <fd-avatar\r\n            size=\"s\"\r\n            [label]=\"message.owner.avatar ? '' : message.owner?.name\"\r\n            [circle]=\"true\"\r\n            [image]=\"message.owner?.avatar\"\r\n            [placeholder]=\"message.owner.avatar ? false : true\"\r\n        ></fd-avatar>\r\n        } @if (!nextIsSame || nextHasBadge) {\r\n        <div\r\n            class=\"tw-bg-transparent tw-overflow-hidden tw-size-3 tw-absolute tw-bottom-0 tw-border-[6px] tw-border-t-transparent\"\r\n            [ngClass]=\"{\r\n                'tw-right-11 tw-border-b-green-100 tw-border-l-green-100 tw-border-r-transparent':\r\n                    message.owner.id === message.userId,\r\n                'tw-left-11 tw-border-b-default tw-border-r-default tw-border-l-transparent':\r\n                    message.owner.id !== message.userId\r\n            }\"\r\n        ></div>\r\n        }\r\n        <div\r\n            [@inPaneAnimation]=\"animationState\"\r\n            class=\"tw-max-w-[80%] tw-min-w-40 tw-rounded-2xl tw-text-base tw-relative tw-overflow-hidden\"\r\n            [ngClass]=\"{\r\n                '!tw-rounded-br-none':\r\n                    message.owner.id === message.userId &&\r\n                    (nextHasBadge || (nextIsSame && !nextHasBadge) || !nextIsSame),\r\n                '!tw-rounded-bl-none':\r\n                    message.owner.id !== message.userId &&\r\n                    (nextHasBadge || (nextIsSame && !nextHasBadge) || !nextIsSame),\r\n                '!tw-rounded-tr-none': message.owner.id === message.userId && pervIsSame && !badge,\r\n                '!tw-rounded-tl-none': message.owner.id !== message.userId && pervIsSame && !badge\r\n            }\"\r\n        >\r\n            @if (showSender && (!pervIsSame || badge)) {\r\n            <div\r\n                [ngClass]=\"{\r\n'tw-bg-green-100': message.owner.id === message.userId && !message.image,\r\n'tw-bg-default': message.owner.id !== message.userId && !message.image,\r\n'tw-absolute tw-top-0 tw-right-0 tw-pb-8 tw-w-full tw-rounded-tr-2xl tw-bg-gradient-to-b tw-to-transparent': message.image,\r\n'tw-from-green-100': message.owner.id === message.userId && message.image,\r\n'tw-from-default': message.owner.id !== message.userId && message.image,\r\n                    }\"\r\n                class=\"tw-font-bold tw-text-base tw-px-3 tw-pt-2 tw-z-10\"\r\n            >\r\n                {{ message.owner.name }}\r\n            </div>\r\n            } @if (message.image) { @if (imageRatio(message.image); as image) {\r\n            <div\r\n                [ngClass]=\"{\r\n'tw-bg-green-100/[.3]': message.owner.id === message.userId,\r\n'tw-bg-default/[.3]': message.owner.id !== message.userId,\r\n                    }\"\r\n                class=\"tw-flex tw-justify-center tw-items-center tw-bg-zinc-500/[.3] tw-relative\"\r\n            >\r\n                <a\r\n                    [download]=\"message.image.name\"\r\n                    href=\"assets/bg-chat.jpg\"\r\n                    target=\"_blank\"\r\n                    class=\"tw-absolute tw-w-full tw-h-full tw-bg-black/[.4] dark:tw-bg-white/[.4] tw-opacity-0 hover:tw-opacity-100 tw-transition-all tw-cursor-pointer tw-flex tw-justify-center tw-items-center\"\r\n                >\r\n                    <fd-icon class=\"!tw-text-default !tw-text-3xl\" glyph=\"download\"></fd-icon>\r\n                </a>\r\n                <img\r\n                    [ngStyle]=\"{\r\n                        width: image.displayWidth + 'px',\r\n                        height: image.displayHeight + 'px'\r\n                    }\"\r\n                    [src]=\"image.url\"\r\n                />\r\n            </div>\r\n            } } @for(file of message.files;track file.Id) {\r\n            <div\r\n                [ngClass]=\"{\r\n'tw-bg-green-100': message.owner.id === message.userId,\r\n'tw-bg-default': message.owner.id !== message.userId,\r\n                    }\"\r\n                class=\"tw-px-2 tw-pt-2 w-full tw-flex tw-gap-2\"\r\n            >\r\n                <a\r\n                    downloadFiles\r\n                    [files]=\"[file]\"\r\n                    class=\"tw-shrink-0 tw-row-0 tw-size-12 tw-rounded-lg tw-bg-orange-400 tw-flex tw-justify-center tw-items-center tw-cursor-pointer tw-transition-all hover:tw-bg-orange-600\"\r\n                >\r\n                    <span class=\"tw-font-bold leading-6 tw-text-lg tw-text-white\">\r\n                        {{ file.Type }}\r\n                    </span>\r\n                </a>\r\n                <div class=\"tw-flex tw-flex-col\">\r\n                    <span\r\n                        class=\"tw-font-bold tw-text-md tw-text-base tw-truncate tw-max-w-48\"\r\n                        [attr.title]=\"file.FileName\"\r\n                    >\r\n                        {{ file.FileName }}</span\r\n                    >\r\n                    <span class=\"tw-text-sm tw-text-gray-500 dark:tw-text-gray-400 tw-w-full tw-truncate\">\r\n                        {{ file.Size }}KB</span\r\n                    >\r\n                </div>\r\n            </div>\r\n            } @if (message.text) {\r\n            <div\r\n                [ngClass]=\"{\r\n'tw-bg-green-100': message.owner.id === message.userId,\r\n'tw-bg-default': message.owner.id !== message.userId,\r\n                    }\"\r\n                class=\"tw-whitespace-pre-line tw-px-3 tw-pt-1\"\r\n                [innerHTML]=\"message.text\"\r\n            ></div>\r\n            }\r\n            <div\r\n                class=\"tw-flex tw-w-full tw-px-2 tw-pt-1 tw-pb-2 tw-items-center tw-gap-2 tw-justify-end\"\r\n                [ngClass]=\"{\r\n'tw-bg-green-100': message.owner.id === message.userId,\r\n'tw-bg-default tw-flex-row-reverse': message.owner.id !== message.userId,\r\n}\"\r\n            >\r\n                <span class=\"tw-text-xs tw-text-gray-500 dark:tw-text-gray-300\">\r\n                    {{ message.createdAt | utilDateToHhMm }}\r\n                    @if(message.owner.id === message.userId){\r\n                    <bsu-barsa-chat-message-status\r\n                        [messageSent]=\"true\"\r\n                        [messageRead]=\"!!message.readAt\"\r\n                    ></bsu-barsa-chat-message-status>\r\n                    }\r\n                </span>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n<ng-template #moreActions>\r\n    <fd-popover placement=\"bottom-end\" title=\"bottom-end\">\r\n        <fd-popover-control>\r\n            <button fd-button fdType=\"transparent\" [fdCompact]=\"true\" glyph=\"navigation-down-arrow\"></button>\r\n        </fd-popover-control>\r\n        <fd-popover-body minWidth=\"10rem\">\r\n            <div class=\"tw-flex tw-flex-col tw-bg-default tw-w-full\" bodyClick>\r\n                <label\r\n                    class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                    (click)=\"reply.emit(message)\"\r\n                >\r\n                    <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"undo\"></fd-icon>\r\n                    <span class=\"!tw-text-base\">\u067E\u0627\u0633\u062E \u062F\u0627\u062F\u0646</span>\r\n                </label>\r\n                <label\r\n                    class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                >\r\n                    <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"forward\"></fd-icon>\r\n                    <span class=\"!tw-text-base\">\u0627\u0631\u0633\u0627\u0644 \u06A9\u0631\u062F\u0646</span>\r\n                </label>\r\n                <label\r\n                    class=\"tw-px-4 tw-py-2 tw-flex tw-gap-2 tw-w-full hover:tw-bg-base/[.1] tw-transition-all tw-cursor-pointer\"\r\n                >\r\n                    <fd-icon class=\"!tw-text-base !tw-text-3xl\" glyph=\"delete\"></fd-icon>\r\n                    <span class=\"!tw-text-base\">\u062D\u0630\u0641</span>\r\n                </label>\r\n            </div>\r\n        </fd-popover-body>\r\n    </fd-popover>\r\n</ng-template>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$6.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "interactive", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: BarsaChatMessageStatusComponent, selector: "bsu-barsa-chat-message-status", inputs: ["messageRead", "messageSent"] }, { kind: "directive", type: DownloadFilesDirective, selector: "[downloadFiles]", inputs: ["files"] }, { kind: "pipe", type: UtilDateToHhMmPipe, name: "utilDateToHhMm" }], animations: [
             trigger('inPaneAnimation', [
                 state('hidden', style({ opacity: 0, transform: 'scale(0, 0)' })),
                 state('visible', style({ opacity: 1, transform: 'scale(1, 1)' })),
@@ -15828,7 +15960,7 @@ class BarsaModalComponent extends BaseComponent {
         this._router.navigate(['../']);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaModalComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaModalComponent, isStandalone: false, selector: "bsu-barsa-modal", viewQueries: [{ propertyName: "_dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-template [fdDialogTemplate] let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                <div fd-bar-left>\r\n                    <fd-bar-element>\r\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.$breadCrumb }}</h1>\r\n                    </fd-bar-element>\r\n                </div>\r\n                <div fd-bar-right>\r\n                    <fd-button-bar\r\n                        glyph=\"decline\"\r\n                        [ariaLabel]=\"'Close' | bbbTranslate\"\r\n                        (click)=\"onClose()\"\r\n                    ></fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            @if(dialog.data?.BodyComponent){\r\n            <bnrc-dynamic-component [component]=\"dialog.data.BodyComponent\"></bnrc-dynamic-component>\r\n            }\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer>\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div fd-bar-right>\r\n                    <fd-button-bar\r\n                        fdType=\"standard\"\r\n                        [label]=\"'Close' | bbbTranslate\"\r\n                        ariaLabel=\"'Close' | bbbTranslate\"\r\n                        (click)=\"onClose()\"\r\n                    >\r\n                    </fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "value"], outputs: ["events"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i3$3.DialogTemplateDirective, selector: "[fdDialogTemplate]", inputs: ["fdDialogTemplateConfig"] }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaModalComponent, isStandalone: false, selector: "bsu-barsa-modal", viewQueries: [{ propertyName: "_dialogTemplate", first: true, predicate: ["dialogTemplate"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-template [fdDialogTemplate] let-dialog let-dialogConfig=\"dialogConfig\" #dialogTemplate>\r\n    <fd-dialog [dialogConfig]=\"dialogConfig\" [dialogRef]=\"dialog\">\r\n        <fd-dialog-header>\r\n            <ng-template fdkTemplate=\"header\">\r\n                <div fd-bar-left>\r\n                    <fd-bar-element>\r\n                        <h1 id=\"fd-dialog-header-3\" fd-title>{{ dialog.data.$breadCrumb }}</h1>\r\n                    </fd-bar-element>\r\n                </div>\r\n                <div fd-bar-right>\r\n                    <fd-button-bar\r\n                        glyph=\"decline\"\r\n                        [ariaLabel]=\"'Close' | bbbTranslate\"\r\n                        (click)=\"onClose()\"\r\n                    ></fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-header>\r\n        <fd-dialog-body>\r\n            @if(dialog.data?.BodyComponent){\r\n            <bnrc-dynamic-component [component]=\"dialog.data.BodyComponent\"></bnrc-dynamic-component>\r\n            }\r\n        </fd-dialog-body>\r\n        <fd-dialog-footer>\r\n            <ng-template fdkTemplate=\"footer\">\r\n                <div fd-bar-right>\r\n                    <fd-button-bar\r\n                        fdType=\"standard\"\r\n                        [label]=\"'Close' | bbbTranslate\"\r\n                        ariaLabel=\"'Close' | bbbTranslate\"\r\n                        (click)=\"onClose()\"\r\n                    >\r\n                    </fd-button-bar>\r\n                </div>\r\n            </ng-template>\r\n        </fd-dialog-footer>\r\n    </fd-dialog>\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "component", type: i2.BaseDynamicComponent, selector: "bnrc-dynamic-component", inputs: ["component", "FnHandleEvents", "value"], outputs: ["events"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "directive", type: i3$2.BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "component", type: i3$3.DialogComponent, selector: "fd-dialog", inputs: ["class", "dialogRef", "dialogConfig"] }, { kind: "component", type: i3$3.DialogBodyComponent, selector: "fd-dialog-body", inputs: ["disablePaddings"] }, { kind: "component", type: i3$3.DialogFooterComponent, selector: "fd-dialog-footer" }, { kind: "component", type: i3$3.DialogHeaderComponent, selector: "fd-dialog-header" }, { kind: "directive", type: i3$3.DialogTemplateDirective, selector: "[fdDialogTemplate]", inputs: ["fdDialogTemplateConfig"] }, { kind: "directive", type: i4$2.TemplateDirective, selector: "[fdkTemplate]", inputs: ["fdkTemplate"] }, { kind: "component", type: i5.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaModalComponent, decorators: [{
             type: Component,
@@ -16209,7 +16341,7 @@ class BarsaCardBannerComponent extends BaseViewItemPropsComponent {
         this.events.emit({ title: 'ulvCommandClick', data: { mo: this.mo, index: this.index } });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaCardBannerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaCardBannerComponent, isStandalone: false, selector: "bsu-barsa-card-banner", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-card\n    cardType=\"banner\"\n    [style.height.px]=\"deviceSize === 's' ? null : parameters.Height || 300\"\n    (click)=\"rowChecked()\"\n>\n    <fd-card-media>\n        <div\n            fd-card-media-content-container            \n            [legendColor]=\"parameters.LegendColor || 13\"\n            [style.background]=\"parameters.ColorColumn | rval: mo:allColumns:true | bbbTranslate\"\n            [style.background]=\"\n                parameters.ColorColumn\n                    ? (parameters.ColorColumn | rval: mo:allColumns:true | bbbTranslate)\n                    : parameters.CustomColor\n                    ? parameters.CustomColor\n                    : null\n            \"\n        >\n            <div fd-card-media-heading [level]=\"2\">\n                {{ parameters.TitleColumn | rval: mo:allColumns:true | bbbTranslate }}\n            </div>\n            <p fd-card-media-text>\n                {{ parameters.SubtitleColumn | rval: mo:allColumns:true | bbbTranslate }}\n            </p>\n            @if (contextMenuItems.length ) {\n\n            <bsu-ulv-context-menu\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [conditionalFormats]=\"conditionalFormats\"\n                [styleIndex]=\"styleIndex\"\n                [mo]=\"mo\"\n                [index]=\"index\"\n                (commandClick)=\"onUlvCommand2()\"\n                [deviceName]=\"deviceName\"\n                [menuItems]=\"contextMenuItems\"\n                [allColumns]=\"allColumns\"\n            ></bsu-ulv-context-menu>\n            }\n        </div>\n        <div fd-card-media-image-container>\n            <!-- <bsu-barsa-img-skeleton\n                fd-card-media-image\n                [title]=\"parameters.TitleColumn | rval: mo:allColumns:true | bbbTranslate\"\n                [imageUrl]=\"\n                    (parameters.PictureColumn | rval: mo:allColumns)?.FileId\n                        | picFieldSrc: 'GetPictureFromFileInfo':null\n                \"\n                [size]=\"[parameters?.Height || 300, 0]\"\n                [widthFull]=\"true\"\n            ></bsu-barsa-img-skeleton> -->\n            <img\n                fd-card-media-image\n                [src]=\"\n                    (parameters.PictureColumn | rval: mo:allColumns)?.FileId\n                        | picFieldSrc: 'GetPictureFromFileInfo':null\n                \"\n                [alt]=\"parameters.TitleColumn | rval: mo:allColumns:true | bbbTranslate\"\n                [style.height.px]=\"parameters?.Height || 300\"\n            />\n        </div>\n    </fd-card-media>\n</fd-card>\n\n", styles: [""], dependencies: [{ kind: "component", type: i7$3.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$3.CardMediaComponent, selector: "fd-card-media", inputs: ["ariaRoleDescription", "hasPadding", "shellColor", "legendColor"] }, { kind: "directive", type: i7$3.CardMediaImageDirective, selector: "[fd-card-media-image]" }, { kind: "directive", type: i7$3.CardMediaImageContainerDirective, selector: "[fd-card-media-image-container]" }, { kind: "directive", type: i7$3.CardMediaContentContainerDirective, selector: "[fd-card-media-content-container]", inputs: ["isOverlay", "shellColor", "legendColor"] }, { kind: "directive", type: i7$3.CardMediaHeadingDirective, selector: "[fd-card-media-heading]", inputs: ["id", "level"] }, { kind: "directive", type: i7$3.CardMediaTextDirective, selector: "[fd-card-media-text]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "closeOnOutsideClick", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaCardBannerComponent, isStandalone: false, selector: "bsu-barsa-card-banner", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<fd-card\n    cardType=\"banner\"\n    [style.height.px]=\"deviceSize === 's' ? null : parameters.Height || 300\"\n    (click)=\"rowChecked()\"\n>\n    <fd-card-media>\n        <div\n            fd-card-media-content-container            \n            [legendColor]=\"parameters.LegendColor || 13\"\n            [style.background]=\"parameters.ColorColumn | rval: mo:allColumns:true | bbbTranslate\"\n            [style.background]=\"\n                parameters.ColorColumn\n                    ? (parameters.ColorColumn | rval: mo:allColumns:true | bbbTranslate)\n                    : parameters.CustomColor\n                    ? parameters.CustomColor\n                    : null\n            \"\n        >\n            <div fd-card-media-heading [level]=\"2\">\n                {{ parameters.TitleColumn | rval: mo:allColumns:true | bbbTranslate }}\n            </div>\n            <p fd-card-media-text>\n                {{ parameters.SubtitleColumn | rval: mo:allColumns:true | bbbTranslate }}\n            </p>\n            @if (contextMenuItems.length ) {\n\n            <bsu-ulv-context-menu\n                [disableOverflowContextMenu]=\"disableOverflowContextMenu\"\n                [conditionalFormats]=\"conditionalFormats\"\n                [styleIndex]=\"styleIndex\"\n                [mo]=\"mo\"\n                [index]=\"index\"\n                (commandClick)=\"onUlvCommand2()\"\n                [deviceName]=\"deviceName\"\n                [menuItems]=\"contextMenuItems\"\n                [allColumns]=\"allColumns\"\n            ></bsu-ulv-context-menu>\n            }\n        </div>\n        <div fd-card-media-image-container>\n            <!-- <bsu-barsa-img-skeleton\n                fd-card-media-image\n                [title]=\"parameters.TitleColumn | rval: mo:allColumns:true | bbbTranslate\"\n                [imageUrl]=\"\n                    (parameters.PictureColumn | rval: mo:allColumns)?.FileId\n                        | picFieldSrc: 'GetPictureFromFileInfo':null\n                \"\n                [size]=\"[parameters?.Height || 300, 0]\"\n                [widthFull]=\"true\"\n            ></bsu-barsa-img-skeleton> -->\n            <img\n                fd-card-media-image\n                [src]=\"\n                    (parameters.PictureColumn | rval: mo:allColumns)?.FileId\n                        | picFieldSrc: 'GetPictureFromFileInfo':null\n                \"\n                [alt]=\"parameters.TitleColumn | rval: mo:allColumns:true | bbbTranslate\"\n                [style.height.px]=\"parameters?.Height || 300\"\n            />\n        </div>\n    </fd-card-media>\n</fd-card>\n\n", styles: [""], dependencies: [{ kind: "component", type: i7$4.CardComponent, selector: "fd-card", inputs: ["badge", "badgeIcon", "badgeColor", "badgeColorSecondary", "badgeStatus", "badgeAriaLabel", "secondBadge", "secondBadgeIcon", "secondBadgeColor", "secondBadgeColorSecondary", "secondBadgeStatus", "secondBadgeAriaLabel", "isLoading", "cardType", "id", "ariaRoledescription", "ariaDescription", "ariaLabel", "role", "interactive", "selected", "ariaPosinset", "ariaSetsize"], outputs: ["ariaPosinsetChange", "ariaSetsizeChange"] }, { kind: "component", type: i7$4.CardMediaComponent, selector: "fd-card-media", inputs: ["ariaRoleDescription", "hasPadding", "shellColor", "legendColor"] }, { kind: "directive", type: i7$4.CardMediaImageDirective, selector: "[fd-card-media-image]" }, { kind: "directive", type: i7$4.CardMediaImageContainerDirective, selector: "[fd-card-media-image-container]" }, { kind: "directive", type: i7$4.CardMediaContentContainerDirective, selector: "[fd-card-media-content-container]", inputs: ["isOverlay", "shellColor", "legendColor"] }, { kind: "directive", type: i7$4.CardMediaHeadingDirective, selector: "[fd-card-media-heading]", inputs: ["id", "level"] }, { kind: "directive", type: i7$4.CardMediaTextDirective, selector: "[fd-card-media-text]" }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "closeOnOutsideClick", "deviceName", "menuItems", "allColumns", "index", "mo", "styleIndex", "conditionalFormats", "disableOverflowContextMenu", "footerMode", "contextMenuOverflowText", "appendTo"], outputs: ["commandClick"] }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.PictureFieldSourcePipe, name: "picFieldSrc" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaCardBannerComponent, decorators: [{
             type: Component,
@@ -16460,7 +16592,7 @@ class UiSignatureComponent extends FieldBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiSignatureComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiSignatureComponent, isStandalone: false, selector: "bsu-ui-signature", viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["canvas"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "@if(context){\n<bsu-ui-picture-file [context]=\"context\" [layoutInfo]=\"layoutInfo\" [hideUpload]=\"true\">\n    @if(!value || (value && value?.IsDeleted)){\n    <button\n        fd-toolbar-item\n        fd-button\n        [disabled]=\"(disableOrReadonly$ | async) === true\"\n        glyph=\"clear-all\"\n        [fdType]=\"'transparent'\"\n        (click)=\"onCanvasClear()\"\n    ></button>\n    } </bsu-ui-picture-file\n>}\n\n<canvas\n    #canvas\n    style=\"\n        touch-action: none;\n        width: 100%;\n        height: 100%;\n        background-color: var(--sapBaseColor);\n        border: 0.0625rem solid var(--sapGroup_TitleBorderColor);\n    \"\n    [class.hide]=\"value && value.IsDeleted !== true\"\n    [style.min-height.px]=\"layoutInfo?.ControlBounds.height\"\n    resizeObserver\n    (elResized)=\"onCanvasResize($event)\"\n></canvas>\n\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i2.ResizeObserverDirective, selector: "[resizeObserver]", outputs: ["elResized"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "directive", type: i8.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: UiPictureFileComponent, selector: "bsu-ui-picture-file", inputs: ["imageUrl", "sizeMode", "hideUpload"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: UiSignatureComponent, isStandalone: false, selector: "bsu-ui-signature", viewQueries: [{ propertyName: "canvasRef", first: true, predicate: ["canvas"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, ngImport: i0, template: "@if(context){\n<bsu-ui-picture-file [context]=\"context\" [layoutInfo]=\"layoutInfo\" [hideUpload]=\"true\">\n    @if(!value || (value && value?.IsDeleted)){\n    <button\n        fd-toolbar-item\n        fd-button\n        [disabled]=\"(disableOrReadonly$ | async) === true\"\n        glyph=\"clear-all\"\n        [fdType]=\"'transparent'\"\n        (click)=\"onCanvasClear()\"\n    ></button>\n    } </bsu-ui-picture-file\n>}\n\n<canvas\n    #canvas\n    style=\"\n        touch-action: none;\n        width: 100%;\n        height: 100%;\n        background-color: var(--sapBaseColor);\n        border: 0.0625rem solid var(--sapGroup_TitleBorderColor);\n    \"\n    [class.hide]=\"value && value.IsDeleted !== true\"\n    [style.min-height.px]=\"layoutInfo?.ControlBounds.height\"\n    resizeObserver\n    (elResized)=\"onCanvasResize($event)\"\n></canvas>\n\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i2.ResizeObserverDirective, selector: "[resizeObserver]", outputs: ["elResized"] }, { kind: "component", type: i1$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class", "id"], exportAs: ["fd-button"] }, { kind: "directive", type: i7$2.ToolbarItemDirective, selector: "[fd-toolbar-item], [fdOverflowGroup], [fdOverflowPriority]", inputs: ["fdOverflowPriority", "fdOverflowGroup"] }, { kind: "component", type: UiPictureFileComponent, selector: "bsu-ui-picture-file", inputs: ["imageUrl", "sizeMode", "hideUpload"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: UiSignatureComponent, decorators: [{
             type: Component,
@@ -16517,7 +16649,7 @@ class BarsaMegamenuComponent extends BaseComponent {
         this.sideNavScroll.nativeElement.scrollBy({ left: 200, behavior: 'smooth' });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaMegamenuComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaMegamenuComponent, isStandalone: false, selector: "bsu-barsa-megamenu", inputs: { menuGroups: "menuGroups", titleKey: "titleKey", iconKey: "iconKey" }, outputs: { visibilityChange: "visibilityChange" }, viewQueries: [{ propertyName: "sideNavScroll", first: true, predicate: ["sideNavScroll"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-side-nav>\r\n    <div class=\"side-nav-wrapper tw-relative\">\r\n        @if(showScrollButtons()){\r\n        <button class=\"scroll-btn left\" (click)=\"onScrollSideNavLeft()\">{{ rtl() ? '\u2039' : '\u203A' }}</button>}\r\n        <div\r\n            fd-side-nav-main\r\n            #sideNavScroll\r\n            class=\"side-scroll-container tw-overflow-x-auto tw-flex tw-whitespace-nowrap tw-scroll-smooth\"\r\n            [class.tw-px-8]=\"showScrollButtons()\"\r\n        >\r\n            <ul\r\n                fd-nested-list\r\n                class=\"fd-shellbar--xl\"\r\n                [noBorder]=\"true\"\r\n                [style.width]=\"showScrollButtons() ? 'auto' : '100%'\"\r\n            >\r\n                @for (group of menuGroups; track group.id; let i = $index) {\r\n                <li\r\n                    class=\"tw-inline-block\"\r\n                    fd-nested-list-item\r\n                    [routerLink]=\"group.routePath && !group.children?.length ? [group.routePath] : null\"\r\n                    [routerLinkActive]=\"[group.children?.length ? '' : 'active']\"\r\n                >\r\n                    <fd-popover\r\n                        [noArrow]=\"true\"\r\n                        [disabled]=\"!group.children?.length\"\r\n                        placement=\"bottom-start\"\r\n                        #popover\r\n                        (beforeOpen)=\"onPopoverBeforeOpen(group)\"\r\n                    >\r\n                        <fd-popover-control>\r\n                            <a fd-nested-list-link (click)=\"onMainGroupClick(group)\">\r\n                                @if(group.icon){\r\n                                <i fd-nested-list-icon [ngClass]=\"'fd-button--' + group.color\" [glyph]=\"group.icon\"></i>\r\n                                }@else if(group.iconImage){\r\n                                <span class=\"tw-w-8 tw-flex\">\r\n                                    <img [src]=\"group.iconImage\" />\r\n                                </span>\r\n                                }\r\n                                <span fd-nested-list-title [ngClass]=\"'fd-button--' + group.color\"\r\n                                    >{{ group.title | bbbTranslate }}\r\n                                    @if(group.children?.length){\r\n                                    <svg\r\n                                        class=\"tw-w-4 tw-h-4 tw-mt-0.5\"\r\n                                        fill=\"none\"\r\n                                        stroke=\"currentColor\"\r\n                                        viewBox=\"0 0 24 24\"\r\n                                    >\r\n                                        <path\r\n                                            stroke-linecap=\"round\"\r\n                                            stroke-linejoin=\"round\"\r\n                                            stroke-width=\"2\"\r\n                                            d=\"M19 9l-7 7-7-7\"\r\n                                        />\r\n                                    </svg>\r\n                                    }\r\n                                </span>\r\n                            </a>\r\n                        </fd-popover-control>\r\n                        <fd-popover-body>\r\n                            <!-- <fd-toolbar>\r\n                            <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                            <fd-input-group\r\n                                glyph=\"decline\"\r\n                                glyphAriaLabel=\"Clear\"\r\n                                placeholder=\"Search\"\r\n                                [button]=\"true\"\r\n                                [disabled]=\"false\"\r\n                            >\r\n                            </fd-input-group>\r\n                        </fd-toolbar> -->\r\n                            <div class=\"tw-grid tw-gap-1 mega-menu\">\r\n                                @if(group.items?.length){\r\n                                <ng-template *ngTemplateOutlet=\"ulAppTileGroup; context: { $implicit: group }\">\r\n                                </ng-template>\r\n                                } @for (childGroup of group.children; track childGroup.id) {\r\n                                <ng-template *ngTemplateOutlet=\"ulAppTileGroup; context: { $implicit: childGroup }\">\r\n                                </ng-template>\r\n                                }\r\n                            </div>\r\n                            <div fd-bar aria-label=\"Default Bar\" barDesign=\"footer\">\r\n                                <div fd-bar-left></div>\r\n                                <div fd-bar-middle></div>\r\n                                <div fd-bar-right>\r\n                                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"popover.close()\">\r\n                                        {{ 'Close' | bbbTranslate }}</fd-button-bar\r\n                                    >\r\n                                </div>\r\n                            </div>\r\n                        </fd-popover-body>\r\n                    </fd-popover>\r\n                </li>\r\n                }\r\n            </ul>\r\n        </div>\r\n        @if(showScrollButtons()){\r\n        <button class=\"scroll-btn right\" (click)=\"onScrollSideNavRight()\">{{ rtl() ? '\u203A' : '\u2039' }}</button>}\r\n    </div>\r\n</fd-side-nav>\r\n<ng-template #ulAppTileGroup let-group>\r\n    <ul fd-list fdCompact [noBorder]=\"true\">\r\n        <li fd-list-group-header>\r\n            <span fd-list-title>{{ group.title | bbbTranslate }}</span>\r\n        </li>\r\n    </ul>\r\n    <ul fd-list [byline]=\"true\" class=\"tw-grid tw-grid-cols-2\" [noBorder]=\"true\" fdCompact>\r\n        @for (item of group.items; track index;let index = $index) {\r\n        <li fd-list-item fdCompact>\r\n            <a fd-list-link bodyClick (click)=\"item.handleClick(item)\" fdCompact>\r\n                 @if(item.icon){\r\n                <span fd-list-thumbnail><fd-icon [glyph]=\"item.icon\" style=\"font-size: large\"></fd-icon></span>                                \r\n                }@else if(item.iconImage){\r\n                <span class=\"fd-list__thumbnail\">\r\n                    <img [src]=\"item.iconImage\" />\r\n                </span>\r\n                }\r\n                <div fd-list-content fdCompact>\r\n                    <div fd-list-title>{{ item.title | bbbTranslate }}</div>\r\n                    <div fd-list-byline>{{ item.subtitle | bbbTranslate }}</div>\r\n                </div>\r\n            </a>\r\n        </li>\r\n        }\r\n    </ul>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";fd-side-nav ul{box-shadow:var(--sapShell_Shadow);border-bottom:none!important;display:flex}fd-side-nav ul li{border:none;background-color:transparent;padding-inline-start:0rem}fd-side-nav ul li.active{background-color:var(--sapList_SelectionBackgroundColor)}fd-side-nav ul li a{height:var(--megamenu-height);min-width:5rem;border:none}fd-side-nav ul li a.is-selected{background-color:transparent}fd-side-nav ul li a i,fd-side-nav ul li a span{background-color:transparent;color:var(--fdButtonBorderColor)}fd-side-nav ul li a i{min-width:2rem;font-size:1.3rem;margin-top:-2px}fd-side-nav ul li a span{text-align:center;justify-content:center}fd-side-nav .fd-nested-list__title:first-child{padding-inline-start:0}.side-nav-wrapper{position:relative}.scroll-btn{position:absolute;top:50%;transform:translateY(-50%);background-color:#ffffffe6;border:none;z-index:10;width:32px;height:32px;font-size:20px;cursor:pointer;box-shadow:0 0 5px #0000004d;border-radius:50%;display:flex;align-items:center;justify-content:center}.scroll-btn.left{left:0}.scroll-btn.right{right:0}.side-scroll-container{scrollbar-width:none;-ms-overflow-style:none;-webkit-user-select:none;user-select:none}.side-scroll-container::-webkit-scrollbar{height:6px;opacity:0;transition:opacity .3s ease-in-out}.side-scroll-container:hover::-webkit-scrollbar{opacity:1}.side-scroll-container::-webkit-scrollbar-thumb{background-color:#0000004d;border-radius:3px}.side-scroll-container::-webkit-scrollbar-track{background-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "directive", type: i7$4.NestedListDirective, selector: "[fdNestedList], [fd-nested-list]", inputs: ["textOnly", "ariaRoledescriptionTree", "ariaRoledescriptionMenuBar", "ariaLabelSelected"] }, { kind: "directive", type: i7$4.NestedLinkDirective, selector: "[fdNestedLink], [fd-nested-list-link]", inputs: ["onClickCallback", "selected", "ariaDescribedby"], outputs: ["selectedChange"] }, { kind: "directive", type: i7$4.NestedItemDirective, selector: "[fdNestedItem], [fd-nested-list-item]", inputs: ["expanded"], outputs: ["expandedChange", "keyboardTriggered"] }, { kind: "component", type: i7$4.NestedListIconComponent, selector: "[fdNestedDirectivesIcon], [fd-nested-list-icon]", inputs: ["role"] }, { kind: "directive", type: i7$4.NestedListTitleDirective, selector: "[fdNestedDirectivesTitle], [fd-nested-list-title]" }, { kind: "component", type: i7$2.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$2.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i9$1.SideNavigationComponent, selector: "fd-side-nav", inputs: ["sideNavigationConfiguration", "condensed", "collapseWidth", "selectable"] }, { kind: "directive", type: i9$1.SideNavigationMainDirective, selector: "[fdSideNavigationMain], [fd-side-nav-main]" }, { kind: "directive", type: i3$8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$8.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: BarsaMegamenuComponent, isStandalone: false, selector: "bsu-barsa-megamenu", inputs: { menuGroups: "menuGroups", titleKey: "titleKey", iconKey: "iconKey" }, outputs: { visibilityChange: "visibilityChange" }, viewQueries: [{ propertyName: "sideNavScroll", first: true, predicate: ["sideNavScroll"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<fd-side-nav>\r\n    <div class=\"side-nav-wrapper tw-relative\">\r\n        @if(showScrollButtons()){\r\n        <button class=\"scroll-btn left\" (click)=\"onScrollSideNavLeft()\">{{ rtl() ? '\u2039' : '\u203A' }}</button>}\r\n        <div\r\n            fd-side-nav-main\r\n            #sideNavScroll\r\n            class=\"side-scroll-container tw-overflow-x-auto tw-flex tw-whitespace-nowrap tw-scroll-smooth\"\r\n            [class.tw-px-8]=\"showScrollButtons()\"\r\n        >\r\n            <ul\r\n                fd-nested-list\r\n                class=\"fd-shellbar--xl\"\r\n                [noBorder]=\"true\"\r\n                [style.width]=\"showScrollButtons() ? 'auto' : '100%'\"\r\n            >\r\n                @for (group of menuGroups; track group.id; let i = $index) {\r\n                <li\r\n                    class=\"tw-inline-block\"\r\n                    fd-nested-list-item\r\n                    [routerLink]=\"group.routePath && !group.children?.length ? [group.routePath] : null\"\r\n                    [routerLinkActive]=\"[group.children?.length ? '' : 'active']\"\r\n                >\r\n                    <fd-popover\r\n                        [noArrow]=\"true\"\r\n                        [disabled]=\"!group.children?.length\"\r\n                        placement=\"bottom-start\"\r\n                        #popover\r\n                        (beforeOpen)=\"onPopoverBeforeOpen(group)\"\r\n                    >\r\n                        <fd-popover-control>\r\n                            <a fd-nested-list-link (click)=\"onMainGroupClick(group)\">\r\n                                @if(group.icon){\r\n                                <i fd-nested-list-icon [ngClass]=\"'fd-button--' + group.color\" [glyph]=\"group.icon\"></i>\r\n                                }@else if(group.iconImage){\r\n                                <span class=\"tw-w-8 tw-flex\">\r\n                                    <img [src]=\"group.iconImage\" />\r\n                                </span>\r\n                                }\r\n                                <span fd-nested-list-title [ngClass]=\"'fd-button--' + group.color\"\r\n                                    >{{ group.title | bbbTranslate }}\r\n                                    @if(group.children?.length){\r\n                                    <svg\r\n                                        class=\"tw-w-4 tw-h-4 tw-mt-0.5\"\r\n                                        fill=\"none\"\r\n                                        stroke=\"currentColor\"\r\n                                        viewBox=\"0 0 24 24\"\r\n                                    >\r\n                                        <path\r\n                                            stroke-linecap=\"round\"\r\n                                            stroke-linejoin=\"round\"\r\n                                            stroke-width=\"2\"\r\n                                            d=\"M19 9l-7 7-7-7\"\r\n                                        />\r\n                                    </svg>\r\n                                    }\r\n                                </span>\r\n                            </a>\r\n                        </fd-popover-control>\r\n                        <fd-popover-body>\r\n                            <!-- <fd-toolbar>\r\n                            <fd-toolbar-spacer></fd-toolbar-spacer>\r\n                            <fd-input-group\r\n                                glyph=\"decline\"\r\n                                glyphAriaLabel=\"Clear\"\r\n                                placeholder=\"Search\"\r\n                                [button]=\"true\"\r\n                                [disabled]=\"false\"\r\n                            >\r\n                            </fd-input-group>\r\n                        </fd-toolbar> -->\r\n                            <div class=\"tw-grid tw-gap-1 mega-menu\">\r\n                                @if(group.items?.length){\r\n                                <ng-template *ngTemplateOutlet=\"ulAppTileGroup; context: { $implicit: group }\">\r\n                                </ng-template>\r\n                                } @for (childGroup of group.children; track childGroup.id) {\r\n                                <ng-template *ngTemplateOutlet=\"ulAppTileGroup; context: { $implicit: childGroup }\">\r\n                                </ng-template>\r\n                                }\r\n                            </div>\r\n                            <div fd-bar aria-label=\"Default Bar\" barDesign=\"footer\">\r\n                                <div fd-bar-left></div>\r\n                                <div fd-bar-middle></div>\r\n                                <div fd-bar-right>\r\n                                    <fd-button-bar ariaLabel=\"close\" glyph=\"decline\" (click)=\"popover.close()\">\r\n                                        {{ 'Close' | bbbTranslate }}</fd-button-bar\r\n                                    >\r\n                                </div>\r\n                            </div>\r\n                        </fd-popover-body>\r\n                    </fd-popover>\r\n                </li>\r\n                }\r\n            </ul>\r\n        </div>\r\n        @if(showScrollButtons()){\r\n        <button class=\"scroll-btn right\" (click)=\"onScrollSideNavRight()\">{{ rtl() ? '\u203A' : '\u2039' }}</button>}\r\n    </div>\r\n</fd-side-nav>\r\n<ng-template #ulAppTileGroup let-group>\r\n    <ul fd-list fdCompact [noBorder]=\"true\">\r\n        <li fd-list-group-header>\r\n            <span fd-list-title>{{ group.title | bbbTranslate }}</span>\r\n        </li>\r\n    </ul>\r\n    <ul fd-list [byline]=\"true\" class=\"tw-grid tw-grid-cols-2\" [noBorder]=\"true\" fdCompact>\r\n        @for (item of group.items; track index;let index = $index) {\r\n        <li fd-list-item fdCompact>\r\n            <a fd-list-link bodyClick (click)=\"item.handleClick(item)\" fdCompact>\r\n                 @if(item.icon){\r\n                <span fd-list-thumbnail><fd-icon [glyph]=\"item.icon\" style=\"font-size: large\"></fd-icon></span>                                \r\n                }@else if(item.iconImage){\r\n                <span class=\"fd-list__thumbnail\">\r\n                    <img [src]=\"item.iconImage\" />\r\n                </span>\r\n                }\r\n                <div fd-list-content fdCompact>\r\n                    <div fd-list-title>{{ item.title | bbbTranslate }}</div>\r\n                    <div fd-list-byline>{{ item.subtitle | bbbTranslate }}</div>\r\n                </div>\r\n            </a>\r\n        </li>\r\n        }\r\n    </ul>\r\n</ng-template>\r\n", styles: ["@charset \"UTF-8\";fd-side-nav ul{box-shadow:var(--sapShell_Shadow);border-bottom:none!important;display:flex}fd-side-nav ul li{border:none;background-color:transparent;padding-inline-start:0rem}fd-side-nav ul li.active{background-color:var(--sapList_SelectionBackgroundColor)}fd-side-nav ul li a{height:var(--megamenu-height);min-width:5rem;border:none}fd-side-nav ul li a.is-selected{background-color:transparent}fd-side-nav ul li a i,fd-side-nav ul li a span{background-color:transparent;color:var(--fdButtonBorderColor)}fd-side-nav ul li a i{min-width:2rem;font-size:1.3rem;margin-top:-2px}fd-side-nav ul li a span{text-align:center;justify-content:center}fd-side-nav .fd-nested-list__title:first-child{padding-inline-start:0}.side-nav-wrapper{position:relative}.scroll-btn{position:absolute;top:50%;transform:translateY(-50%);background-color:#ffffffe6;border:none;z-index:10;width:32px;height:32px;font-size:20px;cursor:pointer;box-shadow:0 0 5px #0000004d;border-radius:50%;display:flex;align-items:center;justify-content:center}.scroll-btn.left{left:0}.scroll-btn.right{right:0}.side-scroll-container{scrollbar-width:none;-ms-overflow-style:none;-webkit-user-select:none;user-select:none}.side-scroll-container::-webkit-scrollbar{height:6px;opacity:0;transition:opacity .3s ease-in-out}.side-scroll-container:hover::-webkit-scrollbar{opacity:1}.side-scroll-container::-webkit-scrollbar-thumb{background-color:#0000004d;border-radius:3px}.side-scroll-container::-webkit-scrollbar-track{background-color:transparent}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$2.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "clear", "size", "role"] }, { kind: "directive", type: i3$2.BarLeftDirective, selector: "[fd-bar-left]" }, { kind: "directive", type: i3$2.BarMiddleDirective, selector: "[fd-bar-middle]" }, { kind: "directive", type: i3$2.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "directive", type: i4$3.ContentDensityDirective, selector: "[fdContentDensity]:not([fdCompact]):not([fdCondensed]):not([fdCozy]),                [fdCompact]:not([fdContentDensity]):not([fdCondensed]):not([fdCozy]),                [fdCondensed]:not([fdContentDensity]):not([fdCompact]):not([fdCozy]),                [fdCozy]:not([fdContentDensity]):not([fdCompact]):not([fdCondensed])", inputs: ["fdContentDensity", "fdCompact", "fdCondensed", "fdCozy"], exportAs: ["fdContentDensity"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "subline", "theme", "unreadIndicator", "role", "settingsList", "settingsListFooter"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "active", "unread", "byline", "ariaRole", "id", "preventClick", "settingsListTpl"], outputs: ["keyDown"], exportAs: ["fdListItem"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap", "truncate"] }, { kind: "directive", type: i7.ListGroupHeaderDirective, selector: "[fdListGroupHeader], [fd-list-group-header]", inputs: ["nativeElementId"], outputs: ["keyDown"] }, { kind: "directive", type: i7.ListLinkDirective, selector: "[fd-list-link], [fdListLink]", inputs: ["navigationIndicator", "navigated", "focusable"] }, { kind: "directive", type: i7.ListBylineDirective, selector: "[fdListByline], [fd-list-byline]", inputs: ["twoCol", "wrap"] }, { kind: "directive", type: i7.ListContentDirective, selector: "[fdListContent], [fd-list-content]", inputs: ["twoCol"] }, { kind: "directive", type: i7.ListThumbnailDirective, selector: "[fdListThumbnail], [fd-list-thumbnail]" }, { kind: "directive", type: i7$5.NestedListDirective, selector: "[fdNestedList], [fd-nested-list]", inputs: ["textOnly", "ariaRoledescriptionTree", "ariaRoledescriptionMenuBar", "ariaLabelSelected"] }, { kind: "directive", type: i7$5.NestedLinkDirective, selector: "[fdNestedLink], [fd-nested-list-link]", inputs: ["onClickCallback", "selected", "ariaDescribedby"], outputs: ["selectedChange"] }, { kind: "directive", type: i7$5.NestedItemDirective, selector: "[fdNestedItem], [fd-nested-list-item]", inputs: ["expanded"], outputs: ["expandedChange", "keyboardTriggered"] }, { kind: "component", type: i7$5.NestedListIconComponent, selector: "[fdNestedDirectivesIcon], [fd-nested-list-icon]", inputs: ["role"] }, { kind: "directive", type: i7$5.NestedListTitleDirective, selector: "[fdNestedDirectivesTitle], [fd-nested-list-title]" }, { kind: "component", type: i7$3.PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: i7$3.PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "component", type: i7$3.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: i9$1.SideNavigationComponent, selector: "fd-side-nav", inputs: ["sideNavigationConfiguration", "condensed", "collapseWidth", "selectable"] }, { kind: "directive", type: i9$1.SideNavigationMainDirective, selector: "[fdSideNavigationMain], [fd-side-nav-main]" }, { kind: "directive", type: i3$8.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$8.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: BarsaMegamenuComponent, decorators: [{
             type: Component,