barsa-sap-ui 2.2.61 → 2.2.63

package/fesm2022/barsa-sap-ui.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { Component, ChangeDetectionStrategy, Input, Pipe, EventEmitter, ElementRef, SkipSelf, ViewChild, HostBinding, Output, ViewEncapsulation, ViewChildren, Inject, Optional, Self, inject, Renderer2, Directive, TemplateRef, HostListener, signal, ViewContainerRef, NgZone, NgModule, ChangeDetectorRef, Injectable, APP_INITIALIZER, NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import * as i2 from 'barsa-novin-ray-core';
-import { BaseComponent, ReportViewBaseComponent, getUniqueId, BarsaApi, LayoutItemBaseComponent, getDeviceIsMobile, measureText, getLabelWidth, LayoutService, SortDirection, BaseUlvSettingComponent, getResetGridSettings, FormComponent, createFormPanelMetaConditions, ReportBaseComponent, SelectionMode, GetAllColumnsSorted, getParentHeight, getControlSizeMode, getDeviceIsDesktop, getDeviceIsTablet, getGridSettings, BaseDirective, PortalService, FieldBaseComponent, DateService, getDateService as getDateService$1, DateMiladiService, DateHijriService, DateShamsiService, EllipsifyDirective, createGridEditorFormPanel, FormPanelService, getAllItemsPerChildren, setOneDepthLevel, BaseViewItemPropsComponent, MoReportValuePipe, ExecuteDynamicCommand, isImage, getIcon, UploadService, LayoutPanelBaseComponent, BaseColumnPropsComponent, ColumnService, BaseViewContentPropsComponent, enumValueToStringSize, PreventDefaulEvent, setTableThWidth, TableHeaderWidthMode, calcContextMenuWidth, setColumnWidthByMaxMoContentWidth, calculateColumnWidth, calculateColumnContent, calculateColumnWidthFitToContainer, calculateFreeColumnSize, DateRanges, LogService, UlvMainService, isFunction, FilesValidationHelper, getValidExtension, getImagePath, LinearListHelper, FormToolbarBaseComponent, isFirefox, FormBaseComponent, getFieldValue, ContainerComponent, DIALOG_SERVICE, FORM_DIALOG_COMPONENT, ContainerService, FindToolbarItem, FindLayoutSettingFromLayout94, FormPropsBaseComponent, NumberBaseComponent, ImageMimeType, BaseFormToolbaritemPropsComponent, isInLocalMode, executeUlvCommandHandler, FillAllLayoutControls, PictureFieldSourcePipe, IntersectionStatus, BreadcrumbService, LayoutMainContentService, getDeviceIsPhone, LocalStorageService, NOTIFICATAION_POPUP_SERVER, TOAST_SERVICE, BaseModule, BarsaNovinRayCoreModule, ResizableModule } from 'barsa-novin-ray-core';
+import { BaseComponent, ReportViewBaseComponent, getUniqueId, BarsaApi, LayoutItemBaseComponent, getDeviceIsMobile, measureText, getLabelWidth, LayoutService, SortDirection, BaseUlvSettingComponent, getResetGridSettings, FormComponent, createFormPanelMetaConditions, ReportBaseComponent, SelectionMode, GetAllColumnsSorted, getParentHeight, getControlSizeMode, getDeviceIsDesktop, getDeviceIsTablet, getGridSettings, BaseDirective, PortalService, FieldBaseComponent, DateService, getDateService as getDateService$1, DateMiladiService, DateHijriService, DateShamsiService, EllipsifyDirective, createGridEditorFormPanel, FormPanelService, TabpageService, LocalStorageService, getAllItemsPerChildren, setOneDepthLevel, BaseViewItemPropsComponent, MoReportValuePipe, ExecuteDynamicCommand, isImage, getIcon, UploadService, LayoutPanelBaseComponent, BaseColumnPropsComponent, ColumnService, BaseViewContentPropsComponent, enumValueToStringSize, PreventDefaulEvent, setTableThWidth, TableHeaderWidthMode, calcContextMenuWidth, setColumnWidthByMaxMoContentWidth, calculateColumnWidth, calculateColumnContent, calculateColumnWidthFitToContainer, calculateFreeColumnSize, DateRanges, LogService, UlvMainService, isFunction, FilesValidationHelper, getValidExtension, getImagePath, LinearListHelper, FormToolbarBaseComponent, isFirefox, FormBaseComponent, getFieldValue, ContainerComponent, DIALOG_SERVICE, FORM_DIALOG_COMPONENT, ContainerService, FindToolbarItem, FindLayoutSettingFromLayout94, FormPropsBaseComponent, NumberBaseComponent, ImageMimeType, BaseFormToolbaritemPropsComponent, isInLocalMode, executeUlvCommandHandler, FillAllLayoutControls, PictureFieldSourcePipe, IntersectionStatus, BreadcrumbService, LayoutMainContentService, getDeviceIsPhone, NOTIFICATAION_POPUP_SERVER, TOAST_SERVICE, BaseModule, BarsaNovinRayCoreModule, ResizableModule } from 'barsa-novin-ray-core';
 import moment from 'moment';
 import jmoment from 'moment-jalaali';
 import { combineLatest, of, BehaviorSubject, Subject, takeUntil as takeUntil$1, throwError, concatMap, tap as tap$1, Observable, fromEvent, first as first$1, filter as filter$1, map as map$1 } from 'rxjs';
@@ -842,6 +842,7 @@ class LayoutControlComponent extends LayoutItemBaseComponent {
         this.layoutControlClass = true;
         this.isContainer = true;
         this.readonlyiswraped = false;
+        this._labelNotInRow = false;
         this.minHeight = '2.25rem';
         this.controlIsReadonly = false;
         this.isMobile = getDeviceIsMobile();
@@ -900,6 +901,7 @@ class LayoutControlComponent extends LayoutItemBaseComponent {
         this.isRowReverseDirection = config.TextLocation === 'Left';
         this.isColumnDirection = config.TextLocation === 'Top' || this.isSearchPanel;
         this.isColumnReverseDirection = config.TextLocation === 'Bottom';
+        this._labelNotInRow = config.TextLocation === 'Top' || config.TextLocation === 'Bottom';
         config.FieldUi.LayoutControl = this;
         this.helpDescription = BarsaApi.Common.Util.TryGetValue(config.FieldUi, 'Setting.HelpDescription', '');
         this.fieldIcon = config.FieldUi.Setting.FieldIcon;
@@ -1042,7 +1044,7 @@ class LayoutControlComponent extends LayoutItemBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LayoutControlComponent, deps: [{ token: i2.FormPanelService }, { token: i0.ElementRef }, { token: i1.ContentDensityService }, { token: i1$1.DomSanitizer }, { token: i0.ChangeDetectorRef }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i2.BbbTranslatePipe }, { token: i2.LayoutService, skipSelf: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: { inlineEdit: "inlineEdit", caption: "caption", focusControl: "focusControl", showLabel: "showLabel", maxLabelWidth: "maxLabelWidth", hasHorizontalText: "hasHorizontalText", contentDensity: "contentDensity", flex: "flex", RefreshLabel: "RefreshLabel", SetVisible: "SetVisible" }, outputs: { events: "events" }, host: { properties: { "class.layout-control": "this.layoutControlClass", "class.row-direction": "this.isRowDirection", "class.row-reverse-direction": "this.isRowReverseDirection", "class.column-direction": "this.isColumnDirection", "class.column-reverse-direction": "this.isColumnReverseDirection", "class.container-field": "this.isContainer", "class.readonlyiswraped": "this.readonlyiswraped", "style.max-width": "this.maxWidth", "style.min-width": "this.minWidth", "style.min-height": "this.minHeight", "style.height": "this.height", "attr.isCheckbox": "this.isCheckbox", "attr.controlIsReadonly": "this.controlIsReadonly", "attr.isButton": "this.isButton", "attr.issinglepicture": "this.isSinglePicture", "attr.minWidth": "this.attrMinWidth", "attr.ismobile": "this.isMobile", "attr.controlId": "this.attrControlId", "attr.caption": "this.attrCaption" } }, providers: [LayoutService], viewQueries: [{ propertyName: "tempLabelRef", first: true, predicate: ["tempLabelRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (!hide) { @if (labelVisible) {\r\n<bsu-ly-label\r\n    [attr.labelWidth]=\"labelWidth\"\r\n    [attrRtl]\r\n    #tempLabelRef\r\n    [class.no-padding]=\"config.Padding[0] === 0\"\r\n    [config]=\"config\"\r\n    [caption]=\"labelCaption\"\r\n    [translateCaption]=\"translateCaption\"\r\n    [originalWidth]=\"labelWidth\"\r\n    [style.min-width]=\"\r\n        isCheckbox\r\n            ? checkboxWidth\r\n            : (config.CaptionSetting?.AlignMode === 'AutoSize' && !isMobile) || (isMobile && controlIsReadonly)\r\n            ? 'fit-content'\r\n            : isColumnDirection || isColumnReverseDirection\r\n            ? '100%'\r\n            : maxLabelWidth + 'px'\r\n    \"\r\n    [style.width]=\"\r\n        (config.CaptionSetting?.AlignMode === 'AutoSize' && !isMobile) || (isMobile && (isCheckbox || controlIsReadonly))\r\n            ? 'auto'\r\n            : isColumnDirection || isColumnReverseDirection\r\n            ? '100%'\r\n            : maxLabelWidth + 'px'\r\n    \"\r\n    [isMandatory]=\"isMandatory\"\r\n    [fieldIcon]=\"fieldIcon\"\r\n    [attr.autosize]=\"config.CaptionSetting?.AlignMode ? true:null\"\r\n    [helpDescription]=\"helpDescription\"\r\n    [originalXtype]=\"originalXtype\"\r\n    [textVisible]=\"textVisible\"\r\n    [isColumn]=\"isColumnDirection || isColumnReverseDirection\"\r\n></bsu-ly-label>\r\n}\r\n<label [attr.visible]=\"labelVisible\" class=\"horizontal-label\" [innerHtml]=\"emptyText\"></label>\r\n<bnrc-field-ui\r\n    [attr.xtype]=\"config.FieldUi.originalXtype\"\r\n    [attr.fieldWidth]=\"layoutControlWidth\"\r\n    [attr.isCheckbox]=\"isCheckbox\"\r\n    [attr.isbutton]=\"isButton\"\r\n    [style.flex-grow]=\"isCheckbox ? 1 : 0\"\r\n    [class.no-padding]=\"config.Padding[0] === 0\"\r\n    [customField]=\"config.FieldUi\"\r\n    [layoutInfo]=\"config\"\r\n    [inlineEdit]=\"inlineEdit\"\r\n    [formHeight]=\"(formHeight$ | async)!!\"\r\n    [focusControl]=\"focusControl\"\r\n    [isSearchPanel]=\"isSearchPanel\"\r\n    [style.height]=\"isUlv ? '100%' : 'auto'\"\r\n    [attr.isulv]=\"isUlv\"\r\n></bnrc-field-ui>\r\n}\r\n", styles: [":host{width:100%;display:flex}:host[ismobile=true].isUlv{width:100%!important}.form-item-label-container{display:flex;position:relative}.lbl-temp{position:absolute;visibility:hidden}bsu-ly-label{padding:0 5px;margin:auto}bsu-ly-label[autosize=true]{margin:inherit}:host[ismobile=true] bsu-ly-label{margin:inherit}bnrc-field-ui[xtype=\"Ui.CheckBox\"]{padding:0}@media screen and (max-width: 599px){:host{height:auto}:host:not([isbutton=true]){min-width:7rem}bnrc-field-ui:not([isbutton=true]){height:auto!important}}\n"], dependencies: [{ kind: "component", type: i2.FieldUiComponent, selector: "bnrc-field-ui", inputs: ["isSearchPanel", "customField", "componentUi", "layoutInfo", "inlineEdit", "focusControl", "formHeight"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "component", type: LyLabelComponent, selector: "bsu-ly-label", inputs: ["originalWidth", "minWidth", "translateCaption", "caption", "captionIcon", "helpDescription", "isColumn", "isMandatory", "fieldIcon", "originalXtype", "textVisible"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LayoutControlComponent, selector: "bsu-layout-control", inputs: { inlineEdit: "inlineEdit", caption: "caption", focusControl: "focusControl", showLabel: "showLabel", maxLabelWidth: "maxLabelWidth", hasHorizontalText: "hasHorizontalText", contentDensity: "contentDensity", flex: "flex", RefreshLabel: "RefreshLabel", SetVisible: "SetVisible" }, outputs: { events: "events" }, host: { properties: { "class.layout-control": "this.layoutControlClass", "class.row-direction": "this.isRowDirection", "class.row-reverse-direction": "this.isRowReverseDirection", "class.column-direction": "this.isColumnDirection", "class.column-reverse-direction": "this.isColumnReverseDirection", "class.container-field": "this.isContainer", "class.readonlyiswraped": "this.readonlyiswraped", "class.labelnotinrow": "this._labelNotInRow", "style.max-width": "this.maxWidth", "style.min-width": "this.minWidth", "style.min-height": "this.minHeight", "style.height": "this.height", "attr.isCheckbox": "this.isCheckbox", "attr.controlIsReadonly": "this.controlIsReadonly", "attr.isButton": "this.isButton", "attr.issinglepicture": "this.isSinglePicture", "attr.minWidth": "this.attrMinWidth", "attr.ismobile": "this.isMobile", "attr.controlId": "this.attrControlId", "attr.caption": "this.attrCaption" } }, providers: [LayoutService], viewQueries: [{ propertyName: "tempLabelRef", first: true, predicate: ["tempLabelRef"], descendants: true, read: ElementRef }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "@if (!hide) { @if (labelVisible) {\r\n<bsu-ly-label\r\n    [attr.labelWidth]=\"labelWidth\"\r\n    [attrRtl]\r\n    #tempLabelRef\r\n    [class.no-padding]=\"config.Padding[0] === 0\"\r\n    [config]=\"config\"\r\n    [caption]=\"labelCaption\"\r\n    [translateCaption]=\"translateCaption\"\r\n    [originalWidth]=\"labelWidth\"\r\n    [style.min-width]=\"\r\n        isCheckbox\r\n            ? checkboxWidth\r\n            : (config.CaptionSetting?.AlignMode === 'AutoSize' && !isMobile) || (isMobile && controlIsReadonly)\r\n            ? 'fit-content'\r\n            : isColumnDirection || isColumnReverseDirection\r\n            ? '100%'\r\n            : maxLabelWidth + 'px'\r\n    \"\r\n    [style.width]=\"\r\n        (config.CaptionSetting?.AlignMode === 'AutoSize' && !isMobile) || (isMobile && (isCheckbox || controlIsReadonly))\r\n            ? 'auto'\r\n            : isColumnDirection || isColumnReverseDirection\r\n            ? '100%'\r\n            : maxLabelWidth + 'px'\r\n    \"\r\n    [isMandatory]=\"isMandatory\"\r\n    [fieldIcon]=\"fieldIcon\"\r\n    [attr.autosize]=\"config.CaptionSetting?.AlignMode ? true:null\"\r\n    [helpDescription]=\"helpDescription\"\r\n    [originalXtype]=\"originalXtype\"\r\n    [textVisible]=\"textVisible\"\r\n    [isColumn]=\"isColumnDirection || isColumnReverseDirection\"\r\n></bsu-ly-label>\r\n}\r\n<label [attr.visible]=\"labelVisible\" class=\"horizontal-label\" [innerHtml]=\"emptyText\"></label>\r\n<bnrc-field-ui\r\n    [attr.xtype]=\"config.FieldUi.originalXtype\"\r\n    [attr.fieldWidth]=\"layoutControlWidth\"\r\n    [attr.isCheckbox]=\"isCheckbox\"\r\n    [attr.isbutton]=\"isButton\"\r\n    [style.flex-grow]=\"isCheckbox ? 1 : 0\"\r\n    [class.no-padding]=\"config.Padding[0] === 0\"\r\n    [customField]=\"config.FieldUi\"\r\n    [layoutInfo]=\"config\"\r\n    [inlineEdit]=\"inlineEdit\"\r\n    [formHeight]=\"(formHeight$ | async)!!\"\r\n    [focusControl]=\"focusControl\"\r\n    [isSearchPanel]=\"isSearchPanel\"\r\n    [style.height]=\"isUlv ? '100%' : 'auto'\"\r\n    [attr.isulv]=\"isUlv\"\r\n></bnrc-field-ui>\r\n}\r\n", styles: [":host{width:100%;display:flex}:host[ismobile=true].isUlv{width:100%!important}.form-item-label-container{display:flex;position:relative}.lbl-temp{position:absolute;visibility:hidden}bsu-ly-label{padding:0 5px;margin:auto}bsu-ly-label[autosize=true]{margin:inherit}:host[ismobile=true] bsu-ly-label{margin:inherit}bnrc-field-ui[xtype=\"Ui.CheckBox\"]{padding:0}@media screen and (max-width: 599px){:host{height:auto}:host:not([isbutton=true]){min-width:7rem}bnrc-field-ui:not([isbutton=true]){height:auto!important}}\n"], dependencies: [{ kind: "component", type: i2.FieldUiComponent, selector: "bnrc-field-ui", inputs: ["isSearchPanel", "customField", "componentUi", "layoutInfo", "inlineEdit", "focusControl", "formHeight"] }, { kind: "directive", type: i2.AttrRtlDirective, selector: "[attrRtl]", inputs: ["attrRtl"] }, { kind: "component", type: LyLabelComponent, selector: "bsu-ly-label", inputs: ["originalWidth", "minWidth", "translateCaption", "caption", "captionIcon", "helpDescription", "isColumn", "isMandatory", "fieldIcon", "originalXtype", "textVisible"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LayoutControlComponent, decorators: [{
             type: Component,
@@ -1073,6 +1075,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }], readonlyiswraped: [{
                 type: HostBinding,
                 args: ['class.readonlyiswraped']
+            }], _labelNotInRow: [{
+                type: HostBinding,
+                args: ['class.labelnotinrow']
             }], maxWidth: [{
                 type: HostBinding,
                 args: ['style.max-width']
@@ -1135,7 +1140,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 
 class GridMoDataList {
     constructor(moDataList$, gridSetting$, visibleColumns$, searchTerm$, inlineEditMode$) {
-        this.data$ = combineLatest([
+        this.subscriptions = [];
+        visibleColumns$.pipe(tap((visibleColumns) => (this.visibleColumns = visibleColumns))).subscribe();
+        this.subscriptions.push((this.data$ = combineLatest([
             moDataList$.pipe(tap((items) => (this.items = items))),
             gridSetting$.pipe(tap((gridSetting) => (this.gridSetting = gridSetting)))
         ]
@@ -1151,13 +1158,16 @@ class GridMoDataList {
         // }),
         // tap((items) => (this.resultItems = items))
         // tap((items) => console.log(items))
-        );
+        )));
+    }
+    destroy() {
+        this.subscriptions.forEach((c) => c.unsubscribe());
     }
     getSortby() {
         return this.gridSetting.SortSettingList.map((c) => ({
             field: c.Name,
             direction: this.getSortDirection(c.SortDirection),
-            isNumber: this.visibleColumns?.find((d) => d.Name === c.Name)?.FieldType === 'عدد'
+            isNumber: this.visibleColumns?.find((d) => d.Name === c.Name)?.FieldTypeId === 0
         })).concat({ field: '$NewInlineMo', direction: SortDirection.DESC, isNumber: false });
     }
     getSortDirection(direction) {
@@ -2651,11 +2661,11 @@ class UlvToolbarComponent extends BaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UlvToolbarComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: UlvToolbarComponent, 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 }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n    style=\"width: 100%; height: 0; visibility: hidden; opacity: 0\"\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n></div>\r\n@if (!useLayoutItemTextForControl && !hideToolbar) {\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>\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.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 | 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$2.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.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i6$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$1.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$1.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i6$1.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i6$1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i6.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: "18.2.13", type: UlvToolbarComponent, 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 }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n    style=\"width: 100%; height: 0; visibility: hidden; opacity: 0\"\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n></div>\r\n@if (!useLayoutItemTextForControl && !hideToolbar) {\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>\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$2.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.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "directive", type: i2.BodyClickDirective, selector: "[bodyClick]", inputs: ["disableBodyClick"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i6$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$1.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$1.MenuTitleDirective, selector: "[fd-menu-title]" }, { kind: "component", type: i6$1.MenuAddonDirective, selector: "fd-menu-addon", inputs: ["position", "submenuIndicator", "ariaHidden"] }, { kind: "directive", type: i6$1.MenuTriggerDirective, selector: "[fdMenuTrigger]", inputs: ["fdMenuTrigger"] }, { kind: "component", type: i6.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UlvToolbarComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ulv-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div\r\n    style=\"width: 100%; height: 0; visibility: hidden; opacity: 0\"\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n></div>\r\n@if (!useLayoutItemTextForControl && !hideToolbar) {\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>\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.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 | 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"] }]
+            args: [{ selector: 'bsu-ulv-toolbar', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div\r\n    style=\"width: 100%; height: 0; visibility: hidden; opacity: 0\"\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n></div>\r\n@if (!useLayoutItemTextForControl && !hideToolbar) {\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>\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"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { _tlbCmp: [{
                 type: ViewChild,
                 args: ['toolbar']
@@ -2846,6 +2856,14 @@ class BarsaAspViewerComponent extends BaseComponent {
         const iframEl = this.iframe.nativeElement;
         if (handleEvent) {
             iframEl.addEventListener('load', this._onLoadIfram.bind(this));
+            if (this.fitToIframe) {
+                window.addEventListener('message', (event) => {
+                    const iframe = iframEl;
+                    if (iframe && event.data) {
+                        this.renderer.setStyle(this.el.nativeElement, 'height', event.data + 100 + 'px');
+                    }
+                });
+            }
         }
     }
     _onLoadIfram() {
@@ -2868,6 +2886,7 @@ class BarsaAspViewerComponent extends BaseComponent {
         //     this._cdr.markForCheck();
         // }
         if (iframEl.contentWindow) {
+            iframEl.contentWindow['IsPortal'] = true;
             // console.log('outerHeight',iframEl.contentWindow.outerHeight);
             // this.renderer.setStyle(iframEl, 'min-height', `${iframEl.contentWindow.outerHeight}px`);
             setTimeout(() => {
@@ -2896,6 +2915,8 @@ class BarsaAspViewerComponent extends BaseComponent {
                 params.FolderId +
                 '&FrameId=' +
                 frameId +
+                '&Zoom=' +
+                this.defaultZoom || 100 +
                 '&Language=' +
                 BarsaApi.BBB.CurrentCulture +
                 '&CtrlIsPressed=' +
@@ -2905,11 +2926,11 @@ class BarsaAspViewerComponent extends BaseComponent {
         form.submit();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaAspViewerComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: BarsaAspViewerComponent, selector: "bsu-barsa-asp-viewer", inputs: { context: "context", parentHeight: "parentHeight", isReportPage: "isReportPage", hideSearchpanel: "hideSearchpanel" }, host: { listeners: { "window:keypress": "handleKeyDown(event)" } }, viewQueries: [{ propertyName: "form", first: true, predicate: ["form"], descendants: true }, { propertyName: "iframe", first: true, predicate: ["iframe"], descendants: true }, { propertyName: "hidden", first: true, predicate: ["hidden"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form #form method=\"post\" target=\"ppppp\" [name]=\"'frm_' + _frameId\" [id]=\"'frm_' + _frameId\">\r\n    <input #hidden [name]=\"'hidden_' + _frameId\" [id]=\"'hidden_' + _frameId\" type=\"hidden\" />\r\n</form>\r\n<iframe\r\n    #iframe\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n    name=\"ppppp\"\r\n    id=\"ppppp\"\r\n    class=\"iframe\"\r\n    src=\"about:blank\"\r\n></iframe>\r\n<bsu-mask *ngIf=\"loading\"></bsu-mask>\r\n", styles: [":host{display:flex;width:100%;height:100%;position:relative}.iframe{border-style:none;height:98%;width:98%}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: BarsaAspViewerComponent, selector: "bsu-barsa-asp-viewer", inputs: { context: "context", parentHeight: "parentHeight", isReportPage: "isReportPage", hideSearchpanel: "hideSearchpanel", fitToIframe: "fitToIframe", defaultZoom: "defaultZoom" }, host: { listeners: { "window:keypress": "handleKeyDown(event)" } }, viewQueries: [{ propertyName: "form", first: true, predicate: ["form"], descendants: true }, { propertyName: "iframe", first: true, predicate: ["iframe"], descendants: true }, { propertyName: "hidden", first: true, predicate: ["hidden"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form #form method=\"post\" target=\"ppppp\" [name]=\"'frm_' + _frameId\" [id]=\"'frm_' + _frameId\">\r\n    <input #hidden [name]=\"'hidden_' + _frameId\" [id]=\"'hidden_' + _frameId\" type=\"hidden\" />\r\n</form>\r\n<iframe\r\n    #iframe\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n    name=\"ppppp\"\r\n    id=\"ppppp\"\r\n    class=\"iframe\"\r\n    src=\"about:blank\"\r\n></iframe>\r\n<bsu-mask *ngIf=\"loading\"></bsu-mask>\r\n", styles: [":host{display:flex;width:100%;height:100%;position:relative}.iframe{border-style:none;height:100%;width:100%}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.IntersectionObserverDirective, selector: "[intersectionObserver]", inputs: ["intersectionDebounce", "intersectionRootMargin", "intersectionRoot", "intersectionThreshold"], outputs: ["visibilityChange"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaAspViewerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-asp-viewer', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<form #form method=\"post\" target=\"ppppp\" [name]=\"'frm_' + _frameId\" [id]=\"'frm_' + _frameId\">\r\n    <input #hidden [name]=\"'hidden_' + _frameId\" [id]=\"'hidden_' + _frameId\" type=\"hidden\" />\r\n</form>\r\n<iframe\r\n    #iframe\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n    name=\"ppppp\"\r\n    id=\"ppppp\"\r\n    class=\"iframe\"\r\n    src=\"about:blank\"\r\n></iframe>\r\n<bsu-mask *ngIf=\"loading\"></bsu-mask>\r\n", styles: [":host{display:flex;width:100%;height:100%;position:relative}.iframe{border-style:none;height:98%;width:98%}\n"] }]
+            args: [{ selector: 'bsu-barsa-asp-viewer', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<form #form method=\"post\" target=\"ppppp\" [name]=\"'frm_' + _frameId\" [id]=\"'frm_' + _frameId\">\r\n    <input #hidden [name]=\"'hidden_' + _frameId\" [id]=\"'hidden_' + _frameId\" type=\"hidden\" />\r\n</form>\r\n<iframe\r\n    #iframe\r\n    intersectionObserver\r\n    [intersectionThreshold]=\"0.1\"\r\n    (visibilityChange)=\"onVisibilityChange($event)\"\r\n    name=\"ppppp\"\r\n    id=\"ppppp\"\r\n    class=\"iframe\"\r\n    src=\"about:blank\"\r\n></iframe>\r\n<bsu-mask *ngIf=\"loading\"></bsu-mask>\r\n", styles: [":host{display:flex;width:100%;height:100%;position:relative}.iframe{border-style:none;height:100%;width:100%}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }], propDecorators: { context: [{
                 type: Input
             }], parentHeight: [{
@@ -2918,6 +2939,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 type: Input
             }], hideSearchpanel: [{
                 type: Input
+            }], fitToIframe: [{
+                type: Input
+            }], defaultZoom: [{
+                type: Input
             }], form: [{
                 type: ViewChild,
                 args: ['form']
@@ -3543,11 +3568,11 @@ class UlvContextMenuComponent extends BaseComponent {
         this._popoverCmp.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UlvContextMenuComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: { onlyOverflow: "onlyOverflow", rightClickEnable: "rightClickEnable", 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]=\"true\"\r\n        [noArrow]=\"true\"\r\n        [appendTo]=\"appendTo\"\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        [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$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.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: i4$1.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4$1.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "component", type: i6$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$1.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$1.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: "18.2.13", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: { onlyOverflow: "onlyOverflow", rightClickEnable: "rightClickEnable", 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]=\"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        [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$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.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: i4$1.BarComponent, selector: "[fd-bar]", inputs: ["class", "barDesign", "inPage", "inHomePage", "size"] }, { kind: "directive", type: i4$1.BarRightDirective, selector: "[fd-bar-right]" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i7.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline", "unreadIndicator", "role"], outputs: ["focusEscapeList"] }, { kind: "component", type: i7.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "noData", "action", "interactive", "growing", "counter", "unread", "byline", "ariaRole", "id", "preventClick"], outputs: ["keyDown"] }, { kind: "component", type: i6$1.MenuComponent, selector: "fd-menu", inputs: ["mobile", "disabled", "focusTrapped", "focusAutoCapture", "openOnHoverTime", "mobileConfig", "ariaLabel", "ariaLabelledby", "id"], outputs: ["activePath"] }, { kind: "component", type: i6$1.MenuItemComponent, selector: "li[fd-menu-item]", inputs: ["disabled", "itemId", "submenu", "parentSubmenu", "hasSeparator"], outputs: ["onSelect"], exportAs: ["fd-menu-item"] }, { kind: "component", type: i6$1.MenuInteractiveComponent, selector: "[fd-menu-interactive]" }, { kind: "directive", type: i6$1.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UlvContextMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ulv-context-menu,[ulvContextMenu]', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, 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]=\"true\"\r\n        [noArrow]=\"true\"\r\n        [appendTo]=\"appendTo\"\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        [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"] }]
+            args: [{ selector: 'bsu-ulv-context-menu,[ulvContextMenu]', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, 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]=\"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        [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"] }]
         }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { _popoverCmp: [{
                 type: ViewChild,
                 args: [PopoverComponent]
@@ -3646,11 +3671,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class UiAspReportViewerComponent extends SapUiReportBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.zoomValue = 100;
+        this._tabpageService = inject(TabpageService, { optional: true, skipSelf: true });
+        this._localStorage = inject(LocalStorageService);
+    }
     ngOnInit() {
         super.ngOnInit();
         this.hideSearchpanel$.pipe(takeUntil$1(this._onDestroy$)).subscribe((c) => {
             this._resizeAspViewer();
         });
+        const defaultZoom = this._localStorage.getItem('printRep_defaultZoom');
+        defaultZoom && !isNaN(+defaultZoom) && (this.zoomValue = +defaultZoom);
+        this.singleControlInTabPage = this._tabpageService?.itemCount === 1;
     }
     _resizeAspViewer() {
         setTimeout(() => {
@@ -3658,11 +3692,11 @@ class UiAspReportViewerComponent extends SapUiReportBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UiAspReportViewerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UiAspReportViewerComponent, selector: "bsu-ui-asp-report-viewer", inputs: { isReportPage: "isReportPage", layoutInfo: "layoutInfo" }, viewQueries: [{ propertyName: "fillEmptySpace", first: true, predicate: ["fillEmptySpace"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\r\n    <bsu-barsa-asp-viewer\r\n        #fillEmptySpace=\"fillEmptySpace\"\r\n        fillEmptySpace\r\n        [dontUseTopBound]=\"false\"\r\n        [height]=\"layoutInfo?.ControlBounds?.height\"\r\n        [context]=\"context\"\r\n        [style.min-height.px]=\"parentHeight\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [hideSearchpanel]=\"(hideSearchpanel$ | async) === true\"\r\n    ></bsu-barsa-asp-viewer>\r\n</ng-container>\r\n", styles: [":host{display:block;width:100%;height:100%}\n"], dependencies: [{ 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: "component", type: BarsaAspViewerComponent, selector: "bsu-barsa-asp-viewer", inputs: ["context", "parentHeight", "isReportPage", "hideSearchpanel"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UiAspReportViewerComponent, selector: "bsu-ui-asp-report-viewer", inputs: { isReportPage: "isReportPage", layoutInfo: "layoutInfo" }, viewQueries: [{ propertyName: "fillEmptySpace", first: true, predicate: ["fillEmptySpace"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\r\n    <bsu-barsa-asp-viewer\r\n        #fillEmptySpace=\"fillEmptySpace\"\r\n        fillEmptySpace\r\n        [dontUseTopBound]=\"false\"\r\n        [height]=\"layoutInfo?.ControlBounds?.height\"\r\n        [context]=\"context\"\r\n        [fitToIframe]=\"singleControlInTabPage\"        \r\n        [decrement]=\"'1rem'\"\r\n        [defaultZoom]=\"zoomValue\"\r\n        [style.min-height.px]=\"parentHeight\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [hideSearchpanel]=\"(hideSearchpanel$ | async) === true\"\r\n    ></bsu-barsa-asp-viewer>\r\n</ng-container>\r\n", styles: [":host{display:block;width:100%;height:100%}\n"], dependencies: [{ 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: "component", type: BarsaAspViewerComponent, selector: "bsu-barsa-asp-viewer", inputs: ["context", "parentHeight", "isReportPage", "hideSearchpanel", "fitToIframe", "defaultZoom"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UiAspReportViewerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-asp-report-viewer', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container *untilInView=\"el\">\r\n    <bsu-barsa-asp-viewer\r\n        #fillEmptySpace=\"fillEmptySpace\"\r\n        fillEmptySpace\r\n        [dontUseTopBound]=\"false\"\r\n        [height]=\"layoutInfo?.ControlBounds?.height\"\r\n        [context]=\"context\"\r\n        [style.min-height.px]=\"parentHeight\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [hideSearchpanel]=\"(hideSearchpanel$ | async) === true\"\r\n    ></bsu-barsa-asp-viewer>\r\n</ng-container>\r\n", styles: [":host{display:block;width:100%;height:100%}\n"] }]
+            args: [{ selector: 'bsu-ui-asp-report-viewer', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container *untilInView=\"el\">\r\n    <bsu-barsa-asp-viewer\r\n        #fillEmptySpace=\"fillEmptySpace\"\r\n        fillEmptySpace\r\n        [dontUseTopBound]=\"false\"\r\n        [height]=\"layoutInfo?.ControlBounds?.height\"\r\n        [context]=\"context\"\r\n        [fitToIframe]=\"singleControlInTabPage\"        \r\n        [decrement]=\"'1rem'\"\r\n        [defaultZoom]=\"zoomValue\"\r\n        [style.min-height.px]=\"parentHeight\"\r\n        [parentHeight]=\"parentHeight\"\r\n        [hideSearchpanel]=\"(hideSearchpanel$ | async) === true\"\r\n    ></bsu-barsa-asp-viewer>\r\n</ng-container>\r\n", styles: [":host{display:block;width:100%;height:100%}\n"] }]
         }], propDecorators: { isReportPage: [{
                 type: Input
             }], layoutInfo: [{
@@ -5419,11 +5453,11 @@ class UiReportContainerComponent extends SapUiReportBaseComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UiReportContainerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: UiReportContainerComponent, 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        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\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>\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\"\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        reportViewRenderer\r\n        [simpleInlineEdit]=\"simpleInlineEdit\"\r\n        class=\"report-view\"\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        (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        parameters.ShortcutList.MoDataList\r\n    ></div>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%}: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$2.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: 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", "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$2.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: "17.0.0", version: "18.2.13", type: UiReportContainerComponent, 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        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\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        reportViewRenderer\r\n        [simpleInlineEdit]=\"simpleInlineEdit\"\r\n        class=\"report-view\"\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        parameters.ShortcutList.MoDataList\r\n    ></div>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%}: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$2.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: 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", "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$2.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 }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", 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        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\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>\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\"\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        reportViewRenderer\r\n        [simpleInlineEdit]=\"simpleInlineEdit\"\r\n        class=\"report-view\"\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        (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        parameters.ShortcutList.MoDataList\r\n    ></div>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%}: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,\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        }\r\n    \"\r\n></ng-container>\r\n<!--render container -->\r\n<ng-template\r\n    #renderContainer\r\n    let-moDataList\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        reportViewRenderer\r\n        [simpleInlineEdit]=\"simpleInlineEdit\"\r\n        class=\"report-view\"\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        parameters.ShortcutList.MoDataList\r\n    ></div>\r\n</ng-template>\r\n", styles: [":host{display:block;width:100%;height:100%}: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 }]
@@ -6063,11 +6097,11 @@ class BarsaTableRowComponent extends BaseViewItemPropsComponent {
         this._cdr.detectChanges();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaTableRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaTableRowComponent, selector: "bsu-barsa-table-row", inputs: { showDetailsInRow: "showDetailsInRow", previewColumn: "previewColumn", columnComponents: "columnComponents", dirtyColumns: "dirtyColumns", detailsCollapsed: "detailsCollapsed" }, outputs: { columnSummary: "columnSummary" }, providers: [FormPanelService], viewQueries: [{ propertyName: "detailsFormItems", first: true, predicate: ["detailsFormItems"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\r\n<tr\r\n    [class.row-error]=\"hasError\"\r\n    [class.showdetails-on]=\"!detailsCollapsed && (detailsComponent?.Selector || detailsColumns?.length)\"\r\n    [class.hasForm]=\"formSetting\"\r\n    [class.hasCartable]=\"!!cartableParams\"\r\n    #trEl\r\n    fd-table-row\r\n    [activable]=\"false\"\r\n    [hoverable]=\"true\"\r\n    [main]=\"true\"\r\n    [focusable]=\"true\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked\"\r\n    [class.has-preview-column]=\"!!previewColumn\"\r\n    [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\r\n    [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    @if (mo.$Group || mo.$Group === '') {\r\n    <td\r\n        [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\r\n        [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\r\n        fd-table-cell\r\n        style=\"font-weight: bold; font-size: 1rem\"\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n        class=\"row-group\"\r\n        [class.mobile-mode]=\"secondaryColumns?.length\"\r\n        [attr.level]=\"level\"\r\n        [class.root-group]=\"level === 0\"\r\n    >\r\n        <button\r\n            fd-button\r\n            [fdType]=\"'transparent'\"\r\n            [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\r\n            class=\"cell-expand\"\r\n            (click)=\"onExpandClick()\"\r\n        ></button>\r\n        {{ mo.$Group === 'undefined' ? '' : mo.$Group }}\r\n    </td>\r\n    } @else {\r\n\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (isCheckList) {\r\n    <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\r\n        @if (workflowState?.state === 'Pending') {\r\n        <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\r\n            <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\r\n        </div>\r\n        } @if (checkboxComponent?.Selector) {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"checkboxComponent\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"isChecked\"\r\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n            [setting]=\"setting\"\r\n            [parameters]=\"checkboxComponent.Parameters\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [value]=\"isChecked\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n            [typeDefId]=\"typeDefId\"\r\n            (events)=\"onRowCheck()\"\r\n        ></bnrc-dynamic-item-component>\r\n        } @else {\r\n        <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\r\n        }\r\n    </td>\r\n    } @if (!isCheckList && !showRowNumber) {\r\n    <td\r\n        fd-table-cell\r\n        class=\"single-select\"\r\n        (click)=\"!isCheckList && onRowCheck()\"\r\n        style=\"padding: 0; text-align: center\"\r\n    >\r\n        @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\r\n        <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\r\n        } @if (saving) {\r\n        <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\r\n        } @if (saved) {\r\n        <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\r\n        } } @else { @if (mo.$State === 'New' && !isChecked) {\r\n        <fd-icon glyph=\"favorite\"></fd-icon>\r\n        } @if (inlineEditMode && allowInlineEdit && isChecked) {\r\n        <fd-icon glyph=\"edit\"></fd-icon>\r\n        } }\r\n    </td>\r\n    }\r\n    <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\r\n    @for (column of columns; track column.Name; let columnIndex = $index) {\r\n    <td\r\n        class=\"rep-column\"\r\n        [attr.dbName]=\"column.Name\"\r\n        #tdEl\r\n        fd-table-cell\r\n        [applyConditionalFormats]=\"conditionalFormats\"\r\n        [hostEl]=\"tdEl\"\r\n        [styleIndex]=\"styleIndex\"\r\n        [dbName]=\"column.Name\"\r\n        [focusable]=\"false\"\r\n        (click)=\"onColumnClick()\"\r\n        (dblclick)=\"onRowClick()\"\r\n        [hoverable]=\"inlineEditMode && allowInlineEdit\"\r\n        [class.control-readonly]=\"column.IsReadonly\"\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: layout$ | async\r\n                }\r\n            \"\r\n        ></ng-container>\r\n    </td>\r\n    } @if (contextMenuItems.length ) {\r\n    <td class=\"col-context-menu\" fd-table-cell>\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    </td>\r\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\r\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\r\n        @if ((detailsComponent?.Selector || detailsColumns?.length || cartableParams?.moId ) && !hideDetailsText) {\r\n        <div class=\"tw-flex tw-justify-end tw-w-full\">\r\n            <button\r\n                fd-button\r\n                [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\r\n                [fdType]=\"'transparent'\"\r\n                (click)=\"onRowDetails()\"\r\n            ></button>\r\n        </div>\r\n        }\r\n    </td>\r\n    } @if (actionList?.length && !inlineEditMode) {\r\n    <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\r\n        <bsu-barsa-row-inline-actionlist\r\n            [actionList]=\"actionList\"\r\n            (btnClick)=\"actionListClick.emit($event)\"\r\n        ></bsu-barsa-row-inline-actionlist>\r\n    </td>\r\n    } }\r\n</tr>\r\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\r\n<tr\r\n    #trEl\r\n    fd-table-row\r\n    [secondary]=\"true\"\r\n    class=\"secondary-row\"\r\n    [class.no-edit-mode]=\"!inlineEditMode\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (!isCheckList) {\r\n    <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\r\n    }\r\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\r\n        <div style=\"display: flex; flex-direction: column\">\r\n            @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\r\n            <p\r\n                #pEl\r\n                fd-table-text\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [hostEl]=\"pEl\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"column.Name\"\r\n                style=\"font-family: 'B-Font Medium'\"\r\n            >\r\n                <label fd-form-label>{{ column.Caption }} :</label>\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: layout$ | async\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n            }\r\n        </div>\r\n    </td>\r\n</tr>\r\n} @if (cartableParams?.moId) {\r\n<tr\r\n    [class.detailCollapsed]=\"detailsCollapsed\"\r\n    fd-table-row\r\n    class=\"showdetails cartable\"\r\n    [attr.aria-selected]=\"isChecked\"\r\n    [class.has-preview-column]=\"!!previewColumn\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        (click)=\"onRowCheck()\"\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? 1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        <ng-container>\r\n            <bnrc-form\r\n                #cartableFormRef\r\n                class=\"cartable-template\"\r\n                [inlineEditInReport]=\"true\"\r\n                [params]=\"cartableParams\"\r\n                (beforeTransition)=\"onCartableBeforeTansition()\"\r\n                (afterTransition)=\"onCartableAfterTansition($event)\"\r\n                (bruleAction)=\"onCartableBruleAction($event)\"\r\n                (click)=\"OnCartableFormClick($event)\"\r\n                (formClose)=\"onCartableFormClosed()\"\r\n            ></bnrc-form>\r\n        </ng-container>\r\n    </td>\r\n</tr>\r\n} @if (!detailsCollapsed && (detailsComponent?.Selector|| detailsColumns?.length)) {\r\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\" [class.has-preview-column]=\"!!previewColumn\">\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        (click)=\"onRowCheck()\"\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\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        @if (detailsComponent && detailsComponent.Selector) {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"detailsComponent\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"isChecked\"\r\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n            [setting]=\"detailsComponentSetting\"\r\n            [parameters]=\"detailsComponent.Settings\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [formSetting]=\"formSetting\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n            [typeDefId]=\"typeDefId\"\r\n        ></bnrc-dynamic-item-component>\r\n        }\r\n    </td>\r\n</tr>\r\n} @if(previewColumn){\r\n<tr\r\n    #trEl\r\n    fd-table-row\r\n    [secondary]=\"true\"\r\n    class=\"preview-column\"\r\n    [class.no-edit-mode]=\"!inlineEditMode\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n        (click)=\"onRowCheck()\"\r\n    >\r\n        <div style=\"display: flex; flex-direction: column\">\r\n            <p\r\n                #pEl\r\n                fd-table-text\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [hostEl]=\"pEl\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"previewColumn.Name\"\r\n                style=\"color: var(--sapAccentColor6)\"\r\n            >\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: previewColumn,\r\n                            mo: mo,\r\n                            index: columns.length,\r\n                            inlineEditMode: inlineEditMode,\r\n                            layout94: layout$ | async\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n        </div>\r\n    </td>\r\n</tr>\r\n} @if(isLastChildGroup && groupSummary){\r\n<tr #trEl fd-table-row class=\"group-summary-row\" [class.no-edit-mode]=\"true\" [attr.aria-selected]=\"false\">\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (!isCheckList) {\r\n    <td fd-table-cell class=\"single-select\"></td>\r\n    } @for (column of columns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\r\n    <td fd-table-cell>\r\n        <label #summaryRef>{{ reCalculateColumnSummary(summaryRef, column) }}</label>\r\n    </td>\r\n    } @if (contextMenuItems.length) {\r\n    <td class=\"col-context-menu\" fd-table-cell></td>\r\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\r\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\"></td>\r\n    } @if (actionList?.length && !inlineEditMode) {\r\n    <td class=\"col-view\" fd-table-cell [fitContent]=\"true\"></td>\r\n    }\r\n</tr>\r\n} @if (bruleActionMessage && inlineEditMode) {\r\n<tr fd-table-row>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        @if (bruleActionMessage.MessageType === 2) {\r\n        <fd-message-strip [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\" [dismissible]=\"false\">\r\n            {{ bruleActionMessage.MessageExpression }}\r\n        </fd-message-strip>\r\n        }\r\n    </td>\r\n</tr>\r\n} @if (workflowState?.state === 'Finish' && workflowState?.error) {\r\n<tr fd-table-row>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\r\n            {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\r\n        </fd-message-strip>\r\n    </td>\r\n</tr>\r\n}\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\">\r\n        @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n        <div fd-form-item>\r\n            <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\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-inlineEditMode=\"inlineEditMode\"\r\n    let-layout94=\"layout94\"\r\n>\r\n    <bsu-barsa-table-column\r\n        [mo]=\"mo\"\r\n        [allColumns]=\"allColumns\"\r\n        [column]=\"column\"\r\n        [attachmentViewType]=\"attachmentViewType\"\r\n        [isdirty]=\"dirtyColumns && dirtyColumns[column.Name]\"\r\n        [value]=\"column | columnValue: mo\"\r\n        [icon]=\"column | columnIcon: mo\"\r\n        [customComponent]=\"column.$CustomComponent\"\r\n        [column]=\"column\"\r\n        [disableEllapsis]=\"secondaryColumns?.length || disableEllapsis\"\r\n        [editMode]=\"(isChecked || inlineEditWithoutSelection) && inlineEditMode && allowInlineEdit\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [isChecked]=\"isChecked === true\"\r\n        [index]=\"index\"\r\n        [formSetting]=\"formSetting\"\r\n        [rtl]=\"rtl\"\r\n        [isMobile]=\"isMobile\"\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</ng-template>\r\n<ng-template #statusIndicator>\r\n    @if (rowIndicator) {\r\n    <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\r\n    </bsu-barsa-column-indicator>\r\n    }\r\n</ng-template>\r\n<ng-template #rowNumberTemplate>\r\n    @if (showRowNumber) {\r\n    <td fd-table-cell bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\"></td>\r\n    }\r\n</ng-template>\r\n<tr fd-table-row style=\"pointer-events: none\"></tr>\r\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}:host.has-preview-column .secondary-row td{border-bottom:none}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}:host ::ng-deep .inlineEditMode bnrc-field-ui{padding:0;margin:0}:host ::ng-deep .inlineEditMode bsu-ui-simple-combo{margin:0!important}:host ::ng-deep .secondary.p-wrapper p{display:flex;align-items:center}bsu-layout-control:not(.hide-form-item){align-items:center;height:100%;min-width:auto;width:auto}tr.group-summary-row td{border:none;background-color:#dde5f0;border-right:none!important;font-weight:700}tr.group-summary-row td label{font-weight:700}tr.group-summary-row td label.NaN{display:none}td{vertical-align:middle}td.control-readonly{background-color:var(--sapList_HeaderBackground)}tr.brule-message td{border:0}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.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}.save-error{color:var(--sapField_InvalidColor)}.save-success{color:var(--sapField_SuccessColor)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}tr td.rep-column:first-child{position:sticky;right:0}tr:not([aria-selected=true]).preview-column td{border-bottom:var(--sapList_BorderWidth) var(--fdTable_Cell_Horizontal_Border_Style, solid) var(--sapList_BorderColor)}tr[aria-selected=true].has-preview-column td,tr.showdetails-on.hasCartable td,tr.showdetails-on.hasForm td{border-bottom:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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.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", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "component", type: i5$3.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5.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: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i2$5.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i3$3.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$3.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "directive", type: i3$3.TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "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: "component", type: BarsaColumnIndicatorComponent, selector: "bsu-barsa-column-indicator", inputs: ["backColor", "hideBorderBottom"] }, { kind: "component", type: BarsaColumnRowNumberComponent, selector: "td[bsu-barsa-column-rownumber],bsu-barsa-column-rownumber", inputs: ["rowNumber"] }, { kind: "component", type: BarsaRowInlineActionlistComponent, selector: "bsu-barsa-row-inline-actionlist", inputs: ["actionList", "mo", "index"], outputs: ["btnClick"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { 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: "18.2.13", type: BarsaTableRowComponent, selector: "bsu-barsa-table-row", inputs: { showDetailsInRow: "showDetailsInRow", previewColumn: "previewColumn", columnComponents: "columnComponents", dirtyColumns: "dirtyColumns", detailsCollapsed: "detailsCollapsed" }, outputs: { columnSummary: "columnSummary" }, providers: [FormPanelService], viewQueries: [{ propertyName: "detailsFormItems", first: true, predicate: ["detailsFormItems"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\r\n<tr\r\n    [class.row-error]=\"hasError\"\r\n    [class.showdetails-on]=\"!detailsCollapsed && (detailsComponent?.Selector || detailsColumns?.length)\"\r\n    [class.hasForm]=\"formSetting\"\r\n    [class.hasCartable]=\"!!cartableParams\"\r\n    #trEl\r\n    fd-table-row\r\n    [activable]=\"false\"\r\n    [hoverable]=\"true\"\r\n    [main]=\"true\"\r\n    [focusable]=\"true\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked\"\r\n    [class.has-preview-column]=\"!!previewColumn\"\r\n    [class.brule-message]=\"bruleActionMessage() || workflowState()?.error\"\r\n    [class.workflow-pending]=\"workflowState()?.state === 'Pending'\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    @if (mo.$Group || mo.$Group === '') {\r\n    <td\r\n        [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\r\n        [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\r\n        fd-table-cell\r\n        style=\"font-weight: bold; font-size: 1rem\"\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n        class=\"row-group\"\r\n        [class.mobile-mode]=\"secondaryColumns?.length\"\r\n        [attr.level]=\"level\"\r\n        [class.root-group]=\"level === 0\"\r\n    >\r\n        <button\r\n            fd-button\r\n            [fdType]=\"'transparent'\"\r\n            [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\r\n            class=\"cell-expand\"\r\n            (click)=\"onExpandClick()\"\r\n        ></button>\r\n        {{ mo.$Group === 'undefined' ? '' : mo.$Group }}\r\n    </td>\r\n    } @else {\r\n\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (isCheckList) {\r\n    <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\r\n        @if (workflowState()?.state === 'Pending') {\r\n        <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\r\n            <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\r\n        </div>\r\n        } @if (checkboxComponent?.Selector) {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"checkboxComponent\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"isChecked\"\r\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n            [setting]=\"setting\"\r\n            [parameters]=\"checkboxComponent.Parameters\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [value]=\"isChecked\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n            [typeDefId]=\"typeDefId\"\r\n            (events)=\"onRowCheck()\"\r\n        ></bnrc-dynamic-item-component>\r\n        } @else {\r\n        <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\r\n        }\r\n    </td>\r\n    } @if (!isCheckList && !showRowNumber) {\r\n    <td\r\n        fd-table-cell\r\n        class=\"single-select\"\r\n        (click)=\"!isCheckList && onRowCheck()\"\r\n        style=\"padding: 0; text-align: center\"\r\n    >\r\n        @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\r\n        <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\r\n        } @if (saving) {\r\n        <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\r\n        } @if (saved) {\r\n        <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\r\n        } } @else { @if (mo.$State === 'New' && !isChecked) {\r\n        <fd-icon glyph=\"favorite\"></fd-icon>\r\n        } @if (inlineEditMode && allowInlineEdit && isChecked) {\r\n        <fd-icon glyph=\"edit\"></fd-icon>\r\n        } }\r\n    </td>\r\n    }\r\n    <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\r\n    @for (column of columns; track column.Name; let columnIndex = $index) {\r\n    <td\r\n        class=\"rep-column\"\r\n        [attr.dbName]=\"column.Name\"\r\n        #tdEl\r\n        fd-table-cell\r\n        [applyConditionalFormats]=\"conditionalFormats\"\r\n        [hostEl]=\"tdEl\"\r\n        [styleIndex]=\"styleIndex\"\r\n        [dbName]=\"column.Name\"\r\n        [focusable]=\"false\"\r\n        (click)=\"onColumnClick()\"\r\n        (dblclick)=\"onRowClick()\"\r\n        [hoverable]=\"inlineEditMode && allowInlineEdit\"\r\n        [class.control-readonly]=\"column.IsReadonly\"\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: layout$ | async\r\n                }\r\n            \"\r\n        ></ng-container>\r\n    </td>\r\n    } @if (contextMenuItems.length ) {\r\n    <td class=\"col-context-menu\" fd-table-cell>\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    </td>\r\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\r\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\r\n        @if ((detailsComponent?.Selector || detailsColumns?.length || cartableParams?.moId ) && !hideDetailsText) {\r\n        <div class=\"tw-flex tw-justify-end tw-w-full\">\r\n            <button\r\n                fd-button\r\n                [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\r\n                [fdType]=\"'transparent'\"\r\n                (click)=\"onRowDetails()\"\r\n            ></button>\r\n        </div>\r\n        }\r\n    </td>\r\n    } @if (actionList?.length && !inlineEditMode) {\r\n    <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\r\n        <bsu-barsa-row-inline-actionlist\r\n            [actionList]=\"actionList\"\r\n            (btnClick)=\"actionListClick.emit($event)\"\r\n        ></bsu-barsa-row-inline-actionlist>\r\n    </td>\r\n    } }\r\n</tr>\r\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\r\n<tr\r\n    #trEl\r\n    fd-table-row\r\n    [secondary]=\"true\"\r\n    class=\"secondary-row\"\r\n    [class.no-edit-mode]=\"!inlineEditMode\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (!isCheckList) {\r\n    <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\r\n    }\r\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\r\n        <div style=\"display: flex; flex-direction: column\">\r\n            @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\r\n            <p\r\n                #pEl\r\n                fd-table-text\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [hostEl]=\"pEl\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"column.Name\"\r\n                style=\"font-family: 'B-Font Medium'\"\r\n            >\r\n                <label fd-form-label>{{ column.Caption }} :</label>\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: layout$ | async\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n            }\r\n        </div>\r\n    </td>\r\n</tr>\r\n} @if (cartableParams?.moId) {\r\n<tr\r\n    [class.detailCollapsed]=\"detailsCollapsed\"\r\n    fd-table-row\r\n    class=\"showdetails cartable\"\r\n    [attr.aria-selected]=\"isChecked\"\r\n    [class.has-preview-column]=\"!!previewColumn\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        (click)=\"onRowCheck()\"\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? 1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        <ng-container>\r\n            <bnrc-form\r\n                #cartableFormRef\r\n                class=\"cartable-template\"\r\n                [inlineEditInReport]=\"true\"\r\n                [params]=\"cartableParams\"\r\n                (beforeTransition)=\"onCartableBeforeTansition()\"\r\n                (afterTransition)=\"onCartableAfterTansition($event)\"\r\n                (bruleAction)=\"onCartableBruleAction($event)\"\r\n                (click)=\"OnCartableFormClick($event)\"\r\n                (formClose)=\"onCartableFormClosed()\"\r\n            ></bnrc-form>\r\n        </ng-container>\r\n    </td>\r\n</tr>\r\n} @if (!detailsCollapsed && (detailsComponent?.Selector|| detailsColumns?.length)) {\r\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\" [class.has-preview-column]=\"!!previewColumn\">\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        (click)=\"onRowCheck()\"\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\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        @if (detailsComponent && detailsComponent.Selector) {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"detailsComponent\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"isChecked\"\r\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n            [setting]=\"detailsComponentSetting\"\r\n            [parameters]=\"detailsComponent.Settings\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [formSetting]=\"formSetting\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n            [typeDefId]=\"typeDefId\"\r\n        ></bnrc-dynamic-item-component>\r\n        }\r\n    </td>\r\n</tr>\r\n} @if(previewColumn){\r\n<tr\r\n    #trEl\r\n    fd-table-row\r\n    [secondary]=\"true\"\r\n    class=\"preview-column\"\r\n    [class.no-edit-mode]=\"!inlineEditMode\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n        (click)=\"onRowCheck()\"\r\n    >\r\n        <div style=\"display: flex; flex-direction: column\">\r\n            <p\r\n                #pEl\r\n                fd-table-text\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [hostEl]=\"pEl\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"previewColumn.Name\"\r\n                style=\"color: var(--sapAccentColor6)\"\r\n            >\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: previewColumn,\r\n                            mo: mo,\r\n                            index: columns.length,\r\n                            inlineEditMode: inlineEditMode,\r\n                            layout94: layout$ | async\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n        </div>\r\n    </td>\r\n</tr>\r\n} @if(isLastChildGroup && groupSummary){\r\n<tr #trEl fd-table-row class=\"group-summary-row\" [class.no-edit-mode]=\"true\" [attr.aria-selected]=\"false\">\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (!isCheckList) {\r\n    <td fd-table-cell class=\"single-select\"></td>\r\n    } @for (column of columns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\r\n    <td fd-table-cell>\r\n        <label #summaryRef>{{ reCalculateColumnSummary(summaryRef, column) }}</label>\r\n    </td>\r\n    } @if (contextMenuItems.length) {\r\n    <td class=\"col-context-menu\" fd-table-cell></td>\r\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\r\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\"></td>\r\n    } @if (actionList?.length && !inlineEditMode) {\r\n    <td class=\"col-view\" fd-table-cell [fitContent]=\"true\"></td>\r\n    }\r\n</tr>\r\n} @if (bruleActionMessage() && inlineEditMode) {\r\n<tr fd-table-row>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        @if (bruleActionMessage()?.MessageType === 2) {\r\n        <fd-message-strip\r\n            [type]=\"bruleActionMessage()?.MessageType === 2 ? 'error' : 'information'\"\r\n            [dismissible]=\"false\"\r\n        >\r\n            {{ bruleActionMessage()?.MessageExpression }}\r\n        </fd-message-strip>\r\n        }\r\n    </td>\r\n</tr>\r\n} @if (workflowState()?.state === 'Finish' && workflowState()?.error) {\r\n<tr fd-table-row>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\r\n            {{ workflowState()?.error?.Text || workflowState()?.error?.MessageExpression }}\r\n        </fd-message-strip>\r\n    </td>\r\n</tr>\r\n}\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\">\r\n        @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n        <div fd-form-item>\r\n            <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\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-inlineEditMode=\"inlineEditMode\"\r\n    let-layout94=\"layout94\"\r\n>\r\n    <bsu-barsa-table-column\r\n        [mo]=\"mo\"\r\n        [allColumns]=\"allColumns\"\r\n        [column]=\"column\"\r\n        [attachmentViewType]=\"attachmentViewType\"\r\n        [isdirty]=\"dirtyColumns && dirtyColumns[column.Name]\"\r\n        [value]=\"column | columnValue: mo\"\r\n        [icon]=\"column | columnIcon: mo\"\r\n        [customComponent]=\"column.$CustomComponent\"\r\n        [column]=\"column\"\r\n        [disableEllapsis]=\"secondaryColumns?.length || disableEllapsis\"\r\n        [editMode]=\"(isChecked || inlineEditWithoutSelection) && inlineEditMode && allowInlineEdit\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [isChecked]=\"isChecked === true\"\r\n        [index]=\"index\"\r\n        [formSetting]=\"formSetting\"\r\n        [rtl]=\"rtl\"\r\n        [isMobile]=\"isMobile\"\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</ng-template>\r\n<ng-template #statusIndicator>\r\n    @if (rowIndicator) {\r\n    <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\r\n    </bsu-barsa-column-indicator>\r\n    }\r\n</ng-template>\r\n<ng-template #rowNumberTemplate>\r\n    @if (showRowNumber) {\r\n    <td fd-table-cell bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\"></td>\r\n    }\r\n</ng-template>\r\n<tr fd-table-row style=\"pointer-events: none\"></tr>\r\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}:host.has-preview-column .secondary-row td{border-bottom:none}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}:host ::ng-deep .inlineEditMode bnrc-field-ui{padding:0;margin:0}:host ::ng-deep .inlineEditMode bsu-ui-simple-combo{margin:0!important}:host ::ng-deep .secondary.p-wrapper p{display:flex;align-items:center}bsu-layout-control:not(.hide-form-item){align-items:center;height:100%;min-width:auto;width:auto}tr.group-summary-row td{border:none;background-color:#dde5f0;border-right:none!important;font-weight:700}tr.group-summary-row td label{font-weight:700}tr.group-summary-row td label.NaN{display:none}td{vertical-align:middle}td.control-readonly{background-color:var(--sapList_HeaderBackground)}tr.brule-message td{border:0}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.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}.save-error{color:var(--sapField_InvalidColor)}.save-success{color:var(--sapField_SuccessColor)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}tr td.rep-column:first-child{position:sticky;right:0}tr:not([aria-selected=true]).preview-column td{border-bottom:var(--sapList_BorderWidth) var(--fdTable_Cell_Horizontal_Border_Style, solid) var(--sapList_BorderColor)}tr[aria-selected=true].has-preview-column td,tr.showdetails-on.hasCartable td,tr.showdetails-on.hasForm td{border-bottom:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { 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.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", "fields", "isChecked", "layout94$", "inlineEditMode", "isNewInlineMo", "allowInlineEdit", "typeDefId", "rowIndicator", "rowIndicatorColor", "UlvMainCtrlr"] }, { kind: "directive", type: i2.FormCloseDirective, selector: "[formClose]", inputs: ["isMobile"] }, { kind: "component", type: i5$3.BusyIndicatorComponent, selector: "fd-busy-indicator", inputs: ["loading", "size", "block", "ariaLabel", "title", "label", "ariaLive"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i5.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: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: i2$5.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i3$3.TableRowDirective, selector: "[fdTableRow], [fd-table-row]", inputs: ["activable", "highlightActive", "hoverable", "focusable", "main", "secondary", "active"] }, { kind: "directive", type: i3$3.TableCellDirective, selector: "[fdTableCell], [fd-table-cell]", inputs: ["noBorderX", "noBorderY", "activable", "focusable", "hoverable", "fitContent", "noPadding", "noData", "nonInteractive", "key"] }, { kind: "directive", type: i3$3.TableTextDirective, selector: "[fdTableText], [fd-table-text]", inputs: ["fdTableTextClass", "noWrap", "title", "maxWidth"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: UlvContextMenuComponent, selector: "bsu-ulv-context-menu,[ulvContextMenu]", inputs: ["onlyOverflow", "rightClickEnable", "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: "component", type: BarsaColumnIndicatorComponent, selector: "bsu-barsa-column-indicator", inputs: ["backColor", "hideBorderBottom"] }, { kind: "component", type: BarsaColumnRowNumberComponent, selector: "td[bsu-barsa-column-rownumber],bsu-barsa-column-rownumber", inputs: ["rowNumber"] }, { kind: "component", type: BarsaRowInlineActionlistComponent, selector: "bsu-barsa-row-inline-actionlist", inputs: ["actionList", "mo", "index"], outputs: ["btnClick"] }, { kind: "directive", type: ApplyConditionalFormatsDirective, selector: "[applyConditionalFormats]", inputs: ["applyConditionalFormats", "styleIndex", "hostEl", "dbName"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { 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: "18.2.13", ngImport: i0, type: BarsaTableRowComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-table-row', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\r\n<tr\r\n    [class.row-error]=\"hasError\"\r\n    [class.showdetails-on]=\"!detailsCollapsed && (detailsComponent?.Selector || detailsColumns?.length)\"\r\n    [class.hasForm]=\"formSetting\"\r\n    [class.hasCartable]=\"!!cartableParams\"\r\n    #trEl\r\n    fd-table-row\r\n    [activable]=\"false\"\r\n    [hoverable]=\"true\"\r\n    [main]=\"true\"\r\n    [focusable]=\"true\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked\"\r\n    [class.has-preview-column]=\"!!previewColumn\"\r\n    [class.brule-message]=\"bruleActionMessage || workflowState?.error\"\r\n    [class.workflow-pending]=\"workflowState?.state === 'Pending'\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    @if (mo.$Group || mo.$Group === '') {\r\n    <td\r\n        [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\r\n        [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\r\n        fd-table-cell\r\n        style=\"font-weight: bold; font-size: 1rem\"\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n        class=\"row-group\"\r\n        [class.mobile-mode]=\"secondaryColumns?.length\"\r\n        [attr.level]=\"level\"\r\n        [class.root-group]=\"level === 0\"\r\n    >\r\n        <button\r\n            fd-button\r\n            [fdType]=\"'transparent'\"\r\n            [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\r\n            class=\"cell-expand\"\r\n            (click)=\"onExpandClick()\"\r\n        ></button>\r\n        {{ mo.$Group === 'undefined' ? '' : mo.$Group }}\r\n    </td>\r\n    } @else {\r\n\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (isCheckList) {\r\n    <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\r\n        @if (workflowState?.state === 'Pending') {\r\n        <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\r\n            <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\r\n        </div>\r\n        } @if (checkboxComponent?.Selector) {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"checkboxComponent\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"isChecked\"\r\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n            [setting]=\"setting\"\r\n            [parameters]=\"checkboxComponent.Parameters\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [value]=\"isChecked\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n            [typeDefId]=\"typeDefId\"\r\n            (events)=\"onRowCheck()\"\r\n        ></bnrc-dynamic-item-component>\r\n        } @else {\r\n        <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\r\n        }\r\n    </td>\r\n    } @if (!isCheckList && !showRowNumber) {\r\n    <td\r\n        fd-table-cell\r\n        class=\"single-select\"\r\n        (click)=\"!isCheckList && onRowCheck()\"\r\n        style=\"padding: 0; text-align: center\"\r\n    >\r\n        @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\r\n        <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\r\n        } @if (saving) {\r\n        <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\r\n        } @if (saved) {\r\n        <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\r\n        } } @else { @if (mo.$State === 'New' && !isChecked) {\r\n        <fd-icon glyph=\"favorite\"></fd-icon>\r\n        } @if (inlineEditMode && allowInlineEdit && isChecked) {\r\n        <fd-icon glyph=\"edit\"></fd-icon>\r\n        } }\r\n    </td>\r\n    }\r\n    <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\r\n    @for (column of columns; track column.Name; let columnIndex = $index) {\r\n    <td\r\n        class=\"rep-column\"\r\n        [attr.dbName]=\"column.Name\"\r\n        #tdEl\r\n        fd-table-cell\r\n        [applyConditionalFormats]=\"conditionalFormats\"\r\n        [hostEl]=\"tdEl\"\r\n        [styleIndex]=\"styleIndex\"\r\n        [dbName]=\"column.Name\"\r\n        [focusable]=\"false\"\r\n        (click)=\"onColumnClick()\"\r\n        (dblclick)=\"onRowClick()\"\r\n        [hoverable]=\"inlineEditMode && allowInlineEdit\"\r\n        [class.control-readonly]=\"column.IsReadonly\"\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: layout$ | async\r\n                }\r\n            \"\r\n        ></ng-container>\r\n    </td>\r\n    } @if (contextMenuItems.length ) {\r\n    <td class=\"col-context-menu\" fd-table-cell>\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    </td>\r\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\r\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\r\n        @if ((detailsComponent?.Selector || detailsColumns?.length || cartableParams?.moId ) && !hideDetailsText) {\r\n        <div class=\"tw-flex tw-justify-end tw-w-full\">\r\n            <button\r\n                fd-button\r\n                [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\r\n                [fdType]=\"'transparent'\"\r\n                (click)=\"onRowDetails()\"\r\n            ></button>\r\n        </div>\r\n        }\r\n    </td>\r\n    } @if (actionList?.length && !inlineEditMode) {\r\n    <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\r\n        <bsu-barsa-row-inline-actionlist\r\n            [actionList]=\"actionList\"\r\n            (btnClick)=\"actionListClick.emit($event)\"\r\n        ></bsu-barsa-row-inline-actionlist>\r\n    </td>\r\n    } }\r\n</tr>\r\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\r\n<tr\r\n    #trEl\r\n    fd-table-row\r\n    [secondary]=\"true\"\r\n    class=\"secondary-row\"\r\n    [class.no-edit-mode]=\"!inlineEditMode\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (!isCheckList) {\r\n    <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\r\n    }\r\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\r\n        <div style=\"display: flex; flex-direction: column\">\r\n            @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\r\n            <p\r\n                #pEl\r\n                fd-table-text\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [hostEl]=\"pEl\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"column.Name\"\r\n                style=\"font-family: 'B-Font Medium'\"\r\n            >\r\n                <label fd-form-label>{{ column.Caption }} :</label>\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: layout$ | async\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n            }\r\n        </div>\r\n    </td>\r\n</tr>\r\n} @if (cartableParams?.moId) {\r\n<tr\r\n    [class.detailCollapsed]=\"detailsCollapsed\"\r\n    fd-table-row\r\n    class=\"showdetails cartable\"\r\n    [attr.aria-selected]=\"isChecked\"\r\n    [class.has-preview-column]=\"!!previewColumn\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        (click)=\"onRowCheck()\"\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? 1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        <ng-container>\r\n            <bnrc-form\r\n                #cartableFormRef\r\n                class=\"cartable-template\"\r\n                [inlineEditInReport]=\"true\"\r\n                [params]=\"cartableParams\"\r\n                (beforeTransition)=\"onCartableBeforeTansition()\"\r\n                (afterTransition)=\"onCartableAfterTansition($event)\"\r\n                (bruleAction)=\"onCartableBruleAction($event)\"\r\n                (click)=\"OnCartableFormClick($event)\"\r\n                (formClose)=\"onCartableFormClosed()\"\r\n            ></bnrc-form>\r\n        </ng-container>\r\n    </td>\r\n</tr>\r\n} @if (!detailsCollapsed && (detailsComponent?.Selector|| detailsColumns?.length)) {\r\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\" [class.has-preview-column]=\"!!previewColumn\">\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        (click)=\"onRowCheck()\"\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\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        @if (detailsComponent && detailsComponent.Selector) {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"detailsComponent\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"isChecked\"\r\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n            [setting]=\"detailsComponentSetting\"\r\n            [parameters]=\"detailsComponent.Settings\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [formSetting]=\"formSetting\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n            [typeDefId]=\"typeDefId\"\r\n        ></bnrc-dynamic-item-component>\r\n        }\r\n    </td>\r\n</tr>\r\n} @if(previewColumn){\r\n<tr\r\n    #trEl\r\n    fd-table-row\r\n    [secondary]=\"true\"\r\n    class=\"preview-column\"\r\n    [class.no-edit-mode]=\"!inlineEditMode\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n        (click)=\"onRowCheck()\"\r\n    >\r\n        <div style=\"display: flex; flex-direction: column\">\r\n            <p\r\n                #pEl\r\n                fd-table-text\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [hostEl]=\"pEl\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"previewColumn.Name\"\r\n                style=\"color: var(--sapAccentColor6)\"\r\n            >\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: previewColumn,\r\n                            mo: mo,\r\n                            index: columns.length,\r\n                            inlineEditMode: inlineEditMode,\r\n                            layout94: layout$ | async\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n        </div>\r\n    </td>\r\n</tr>\r\n} @if(isLastChildGroup && groupSummary){\r\n<tr #trEl fd-table-row class=\"group-summary-row\" [class.no-edit-mode]=\"true\" [attr.aria-selected]=\"false\">\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (!isCheckList) {\r\n    <td fd-table-cell class=\"single-select\"></td>\r\n    } @for (column of columns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\r\n    <td fd-table-cell>\r\n        <label #summaryRef>{{ reCalculateColumnSummary(summaryRef, column) }}</label>\r\n    </td>\r\n    } @if (contextMenuItems.length) {\r\n    <td class=\"col-context-menu\" fd-table-cell></td>\r\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\r\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\"></td>\r\n    } @if (actionList?.length && !inlineEditMode) {\r\n    <td class=\"col-view\" fd-table-cell [fitContent]=\"true\"></td>\r\n    }\r\n</tr>\r\n} @if (bruleActionMessage && inlineEditMode) {\r\n<tr fd-table-row>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        @if (bruleActionMessage.MessageType === 2) {\r\n        <fd-message-strip [type]=\"bruleActionMessage.MessageType === 2 ? 'error' : 'information'\" [dismissible]=\"false\">\r\n            {{ bruleActionMessage.MessageExpression }}\r\n        </fd-message-strip>\r\n        }\r\n    </td>\r\n</tr>\r\n} @if (workflowState?.state === 'Finish' && workflowState?.error) {\r\n<tr fd-table-row>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\r\n            {{ workflowState.error?.Text || workflowState.error?.MessageExpression }}\r\n        </fd-message-strip>\r\n    </td>\r\n</tr>\r\n}\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\">\r\n        @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n        <div fd-form-item>\r\n            <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\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-inlineEditMode=\"inlineEditMode\"\r\n    let-layout94=\"layout94\"\r\n>\r\n    <bsu-barsa-table-column\r\n        [mo]=\"mo\"\r\n        [allColumns]=\"allColumns\"\r\n        [column]=\"column\"\r\n        [attachmentViewType]=\"attachmentViewType\"\r\n        [isdirty]=\"dirtyColumns && dirtyColumns[column.Name]\"\r\n        [value]=\"column | columnValue: mo\"\r\n        [icon]=\"column | columnIcon: mo\"\r\n        [customComponent]=\"column.$CustomComponent\"\r\n        [column]=\"column\"\r\n        [disableEllapsis]=\"secondaryColumns?.length || disableEllapsis\"\r\n        [editMode]=\"(isChecked || inlineEditWithoutSelection) && inlineEditMode && allowInlineEdit\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [isChecked]=\"isChecked === true\"\r\n        [index]=\"index\"\r\n        [formSetting]=\"formSetting\"\r\n        [rtl]=\"rtl\"\r\n        [isMobile]=\"isMobile\"\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</ng-template>\r\n<ng-template #statusIndicator>\r\n    @if (rowIndicator) {\r\n    <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\r\n    </bsu-barsa-column-indicator>\r\n    }\r\n</ng-template>\r\n<ng-template #rowNumberTemplate>\r\n    @if (showRowNumber) {\r\n    <td fd-table-cell bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\"></td>\r\n    }\r\n</ng-template>\r\n<tr fd-table-row style=\"pointer-events: none\"></tr>\r\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}:host.has-preview-column .secondary-row td{border-bottom:none}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}:host ::ng-deep .inlineEditMode bnrc-field-ui{padding:0;margin:0}:host ::ng-deep .inlineEditMode bsu-ui-simple-combo{margin:0!important}:host ::ng-deep .secondary.p-wrapper p{display:flex;align-items:center}bsu-layout-control:not(.hide-form-item){align-items:center;height:100%;min-width:auto;width:auto}tr.group-summary-row td{border:none;background-color:#dde5f0;border-right:none!important;font-weight:700}tr.group-summary-row td label{font-weight:700}tr.group-summary-row td label.NaN{display:none}td{vertical-align:middle}td.control-readonly{background-color:var(--sapList_HeaderBackground)}tr.brule-message td{border:0}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.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}.save-error{color:var(--sapField_InvalidColor)}.save-success{color:var(--sapField_SuccessColor)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}tr td.rep-column:first-child{position:sticky;right:0}tr:not([aria-selected=true]).preview-column td{border-bottom:var(--sapList_BorderWidth) var(--fdTable_Cell_Horizontal_Border_Style, solid) var(--sapList_BorderColor)}tr[aria-selected=true].has-preview-column td,tr.showdetails-on.hasCartable td,tr.showdetails-on.hasForm td{border-bottom:none}\n"] }]
+            args: [{ selector: 'bsu-barsa-table-row', providers: [FormPanelService], changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if ((!mo.$Parent || parentExpanded) && visibility !== false) {\r\n<tr\r\n    [class.row-error]=\"hasError\"\r\n    [class.showdetails-on]=\"!detailsCollapsed && (detailsComponent?.Selector || detailsColumns?.length)\"\r\n    [class.hasForm]=\"formSetting\"\r\n    [class.hasCartable]=\"!!cartableParams\"\r\n    #trEl\r\n    fd-table-row\r\n    [activable]=\"false\"\r\n    [hoverable]=\"true\"\r\n    [main]=\"true\"\r\n    [focusable]=\"true\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked\"\r\n    [class.has-preview-column]=\"!!previewColumn\"\r\n    [class.brule-message]=\"bruleActionMessage() || workflowState()?.error\"\r\n    [class.workflow-pending]=\"workflowState()?.state === 'Pending'\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    @if (mo.$Group || mo.$Group === '') {\r\n    <td\r\n        [style.padding-right]=\"rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\r\n        [style.padding-left]=\"!rtl ? 'calc( 1rem + ' + level * 12 + 'px' + ' )' : 'inherit'\"\r\n        fd-table-cell\r\n        style=\"font-weight: bold; font-size: 1rem\"\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n        class=\"row-group\"\r\n        [class.mobile-mode]=\"secondaryColumns?.length\"\r\n        [attr.level]=\"level\"\r\n        [class.root-group]=\"level === 0\"\r\n    >\r\n        <button\r\n            fd-button\r\n            [fdType]=\"'transparent'\"\r\n            [glyph]=\"expanded !== false ? 'navigation-down-arrow' : 'navigation-left-arrow'\"\r\n            class=\"cell-expand\"\r\n            (click)=\"onExpandClick()\"\r\n        ></button>\r\n        {{ mo.$Group === 'undefined' ? '' : mo.$Group }}\r\n    </td>\r\n    } @else {\r\n\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (isCheckList) {\r\n    <td fd-table-cell [style.width]=\"checkboxComponent ? '60px' : null\">\r\n        @if (workflowState()?.state === 'Pending') {\r\n        <div style=\"position: absolute; left: 0; right: 0; bottom: 0; top: 0\">\r\n            <bsu-mask [top]=\"'20px'\" [size]=\"'s'\"></bsu-mask>\r\n        </div>\r\n        } @if (checkboxComponent?.Selector) {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"checkboxComponent\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"isChecked\"\r\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n            [setting]=\"setting\"\r\n            [parameters]=\"checkboxComponent.Parameters\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [value]=\"isChecked\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n            [typeDefId]=\"typeDefId\"\r\n            (events)=\"onRowCheck()\"\r\n        ></bnrc-dynamic-item-component>\r\n        } @else {\r\n        <fd-checkbox [name]=\"mo.$Caption\" [ngModel]=\"isChecked\" (ngModelChange)=\"onRowCheck()\"></fd-checkbox>\r\n        }\r\n    </td>\r\n    } @if (!isCheckList && !showRowNumber) {\r\n    <td\r\n        fd-table-cell\r\n        class=\"single-select\"\r\n        (click)=\"!isCheckList && onRowCheck()\"\r\n        style=\"padding: 0; text-align: center\"\r\n    >\r\n        @if (inlineEditMode && allowInlineEdit && (hasError || saving || saved)) { @if (hasError) {\r\n        <fd-icon class=\"save-error\" glyph=\"error\"></fd-icon>\r\n        } @if (saving) {\r\n        <fd-busy-indicator [loading]=\"true\" [size]=\"'s'\" title=\"record saving\"></fd-busy-indicator>\r\n        } @if (saved) {\r\n        <fd-icon class=\"save-success\" glyph=\"accept\"></fd-icon>\r\n        } } @else { @if (mo.$State === 'New' && !isChecked) {\r\n        <fd-icon glyph=\"favorite\"></fd-icon>\r\n        } @if (inlineEditMode && allowInlineEdit && isChecked) {\r\n        <fd-icon glyph=\"edit\"></fd-icon>\r\n        } }\r\n    </td>\r\n    }\r\n    <ng-container *ngTemplateOutlet=\"rowNumberTemplate\"></ng-container>\r\n    @for (column of columns; track column.Name; let columnIndex = $index) {\r\n    <td\r\n        class=\"rep-column\"\r\n        [attr.dbName]=\"column.Name\"\r\n        #tdEl\r\n        fd-table-cell\r\n        [applyConditionalFormats]=\"conditionalFormats\"\r\n        [hostEl]=\"tdEl\"\r\n        [styleIndex]=\"styleIndex\"\r\n        [dbName]=\"column.Name\"\r\n        [focusable]=\"false\"\r\n        (click)=\"onColumnClick()\"\r\n        (dblclick)=\"onRowClick()\"\r\n        [hoverable]=\"inlineEditMode && allowInlineEdit\"\r\n        [class.control-readonly]=\"column.IsReadonly\"\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: layout$ | async\r\n                }\r\n            \"\r\n        ></ng-container>\r\n    </td>\r\n    } @if (contextMenuItems.length ) {\r\n    <td class=\"col-context-menu\" fd-table-cell>\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    </td>\r\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\r\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\">\r\n        @if ((detailsComponent?.Selector || detailsColumns?.length || cartableParams?.moId ) && !hideDetailsText) {\r\n        <div class=\"tw-flex tw-justify-end tw-w-full\">\r\n            <button\r\n                fd-button\r\n                [label]=\"(detailsCollapsed ? detailsText : 'Hide') | bbbTranslate\"\r\n                [fdType]=\"'transparent'\"\r\n                (click)=\"onRowDetails()\"\r\n            ></button>\r\n        </div>\r\n        }\r\n    </td>\r\n    } @if (actionList?.length && !inlineEditMode) {\r\n    <td class=\"col-view\" [class.rtl]=\"rtl\" fd-table-cell [fitContent]=\"true\">\r\n        <bsu-barsa-row-inline-actionlist\r\n            [actionList]=\"actionList\"\r\n            (btnClick)=\"actionListClick.emit($event)\"\r\n        ></bsu-barsa-row-inline-actionlist>\r\n    </td>\r\n    } }\r\n</tr>\r\n} @if (secondaryColumns?.length && !mo.$Group && (!mo.$Parent || parentExpanded) && visibility !== false) {\r\n<tr\r\n    #trEl\r\n    fd-table-row\r\n    [secondary]=\"true\"\r\n    class=\"secondary-row\"\r\n    [class.no-edit-mode]=\"!inlineEditMode\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (!isCheckList) {\r\n    <td fd-table-cell class=\"single-select\" (click)=\"onRowCheck()\"></td>\r\n    }\r\n    <td fd-table-cell colspan=\"100%\" (click)=\"onRowCheck()\" class=\"secondary p-wrapper\">\r\n        <div style=\"display: flex; flex-direction: column\">\r\n            @for (column of secondaryColumns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\r\n            <p\r\n                #pEl\r\n                fd-table-text\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [hostEl]=\"pEl\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"column.Name\"\r\n                style=\"font-family: 'B-Font Medium'\"\r\n            >\r\n                <label fd-form-label>{{ column.Caption }} :</label>\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: layout$ | async\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n            }\r\n        </div>\r\n    </td>\r\n</tr>\r\n} @if (cartableParams?.moId) {\r\n<tr\r\n    [class.detailCollapsed]=\"detailsCollapsed\"\r\n    fd-table-row\r\n    class=\"showdetails cartable\"\r\n    [attr.aria-selected]=\"isChecked\"\r\n    [class.has-preview-column]=\"!!previewColumn\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        (click)=\"onRowCheck()\"\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? 1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        <ng-container>\r\n            <bnrc-form\r\n                #cartableFormRef\r\n                class=\"cartable-template\"\r\n                [inlineEditInReport]=\"true\"\r\n                [params]=\"cartableParams\"\r\n                (beforeTransition)=\"onCartableBeforeTansition()\"\r\n                (afterTransition)=\"onCartableAfterTansition($event)\"\r\n                (bruleAction)=\"onCartableBruleAction($event)\"\r\n                (click)=\"OnCartableFormClick($event)\"\r\n                (formClose)=\"onCartableFormClosed()\"\r\n            ></bnrc-form>\r\n        </ng-container>\r\n    </td>\r\n</tr>\r\n} @if (!detailsCollapsed && (detailsComponent?.Selector|| detailsColumns?.length)) {\r\n<tr fd-table-row class=\"showdetails\" [attr.aria-selected]=\"isChecked\" [class.has-preview-column]=\"!!previewColumn\">\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        (click)=\"onRowCheck()\"\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\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        @if (detailsComponent && detailsComponent.Selector) {\r\n        <bnrc-dynamic-item-component\r\n            [component]=\"detailsComponent\"\r\n            [mo]=\"mo\"\r\n            [isChecked]=\"isChecked\"\r\n            [UlvMainCtrlr]=\"UlvMainCtrlr\"\r\n            [setting]=\"detailsComponentSetting\"\r\n            [parameters]=\"detailsComponent.Settings\"\r\n            [editMode]=\"inlineEditMode\"\r\n            [formSetting]=\"formSetting\"\r\n            [rtl]=\"rtl\"\r\n            [deviceName]=\"deviceName\"\r\n            [deviceSize]=\"deviceSize\"\r\n            [index]=\"index\"\r\n            [allColumns]=\"allColumns\"\r\n            [typeDefId]=\"typeDefId\"\r\n        ></bnrc-dynamic-item-component>\r\n        }\r\n    </td>\r\n</tr>\r\n} @if(previewColumn){\r\n<tr\r\n    #trEl\r\n    fd-table-row\r\n    [secondary]=\"true\"\r\n    class=\"preview-column\"\r\n    [class.no-edit-mode]=\"!inlineEditMode\"\r\n    [applyConditionalFormats]=\"conditionalFormats\"\r\n    [styleIndex]=\"styleIndex\"\r\n    [hostEl]=\"trEl\"\r\n    [attr.aria-selected]=\"isChecked && !inlineEditMode ? true : false\"\r\n    [style.background-color]=\"isOdd && !isChecked ? 'var(--sapList_Hover_Background)' : null\"\r\n>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n        (click)=\"onRowCheck()\"\r\n    >\r\n        <div style=\"display: flex; flex-direction: column\">\r\n            <p\r\n                #pEl\r\n                fd-table-text\r\n                [applyConditionalFormats]=\"conditionalFormats\"\r\n                [hostEl]=\"pEl\"\r\n                [styleIndex]=\"styleIndex\"\r\n                [dbName]=\"previewColumn.Name\"\r\n                style=\"color: var(--sapAccentColor6)\"\r\n            >\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"\r\n                        columnTemplate;\r\n                        context: {\r\n                            $implicit: previewColumn,\r\n                            mo: mo,\r\n                            index: columns.length,\r\n                            inlineEditMode: inlineEditMode,\r\n                            layout94: layout$ | async\r\n                        }\r\n                    \"\r\n                ></ng-container>\r\n            </p>\r\n        </div>\r\n    </td>\r\n</tr>\r\n} @if(isLastChildGroup && groupSummary){\r\n<tr #trEl fd-table-row class=\"group-summary-row\" [class.no-edit-mode]=\"true\" [attr.aria-selected]=\"false\">\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    @if (!isCheckList) {\r\n    <td fd-table-cell class=\"single-select\"></td>\r\n    } @for (column of columns; track _trackByColumn(columnIndex, column); let columnIndex = $index) {\r\n    <td fd-table-cell>\r\n        <label #summaryRef>{{ reCalculateColumnSummary(summaryRef, column) }}</label>\r\n    </td>\r\n    } @if (contextMenuItems.length) {\r\n    <td class=\"col-context-menu\" fd-table-cell></td>\r\n    } @if (showDetailsInRow && (!inlineEditMode || !allowInlineEdit)) {\r\n    <td class=\"col-details\" fd-table-cell [fitContent]=\"true\"></td>\r\n    } @if (actionList?.length && !inlineEditMode) {\r\n    <td class=\"col-view\" fd-table-cell [fitContent]=\"true\"></td>\r\n    }\r\n</tr>\r\n} @if (bruleActionMessage() && inlineEditMode) {\r\n<tr fd-table-row>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        @if (bruleActionMessage()?.MessageType === 2) {\r\n        <fd-message-strip\r\n            [type]=\"bruleActionMessage()?.MessageType === 2 ? 'error' : 'information'\"\r\n            [dismissible]=\"false\"\r\n        >\r\n            {{ bruleActionMessage()?.MessageExpression }}\r\n        </fd-message-strip>\r\n        }\r\n    </td>\r\n</tr>\r\n} @if (workflowState()?.state === 'Finish' && workflowState()?.error) {\r\n<tr fd-table-row>\r\n    <ng-container *ngTemplateOutlet=\"statusIndicator\"></ng-container>\r\n    <td\r\n        fd-table-cell\r\n        [attr.colspan]=\"\r\n            columns.length +\r\n            1 +\r\n            (rowIndicator ? -1 : 0) +\r\n            (contextMenuItems && contextMenuItems.length > 0 ? 1 : 0) +\r\n            (showViewButton ? 1 : 0) +\r\n            (showDetailsInRow && !inlineEditMode ? 1 : 0)\r\n        \"\r\n    >\r\n        <fd-message-strip type=\"error\" [dismissible]=\"true\" (onDismiss)=\"onResetWorkflowState()\">\r\n            {{ workflowState()?.error?.Text || workflowState()?.error?.MessageExpression }}\r\n        </fd-message-strip>\r\n    </td>\r\n</tr>\r\n}\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\">\r\n        @for (column of detailsColumns; track column; let columnIndex = $index) {\r\n        <div fd-form-item>\r\n            <label fd-form-label for=\"input-2\">{{ column.Caption }}</label>\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-inlineEditMode=\"inlineEditMode\"\r\n    let-layout94=\"layout94\"\r\n>\r\n    <bsu-barsa-table-column\r\n        [mo]=\"mo\"\r\n        [allColumns]=\"allColumns\"\r\n        [column]=\"column\"\r\n        [attachmentViewType]=\"attachmentViewType\"\r\n        [isdirty]=\"dirtyColumns && dirtyColumns[column.Name]\"\r\n        [value]=\"column | columnValue: mo\"\r\n        [icon]=\"column | columnIcon: mo\"\r\n        [customComponent]=\"column.$CustomComponent\"\r\n        [column]=\"column\"\r\n        [disableEllapsis]=\"secondaryColumns?.length || disableEllapsis\"\r\n        [editMode]=\"(isChecked || inlineEditWithoutSelection) && inlineEditMode && allowInlineEdit\"\r\n        [inlineEditMode]=\"inlineEditMode\"\r\n        [isChecked]=\"isChecked === true\"\r\n        [index]=\"index\"\r\n        [formSetting]=\"formSetting\"\r\n        [rtl]=\"rtl\"\r\n        [isMobile]=\"isMobile\"\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</ng-template>\r\n<ng-template #statusIndicator>\r\n    @if (rowIndicator) {\r\n    <bsu-barsa-column-indicator [hideBorderBottom]=\"!detailsCollapsed\" [backColor]=\"rowIndicatorColor\">\r\n    </bsu-barsa-column-indicator>\r\n    }\r\n</ng-template>\r\n<ng-template #rowNumberTemplate>\r\n    @if (showRowNumber) {\r\n    <td fd-table-cell bsu-barsa-column-rownumber [rowNumber]=\"rowNumber\" (click)=\"!isCheckList && onRowCheck()\"></td>\r\n    }\r\n</ng-template>\r\n<tr fd-table-row style=\"pointer-events: none\"></tr>\r\n", styles: [":host{display:contents;width:100%}:host bnrc-form.cartable-template ::ng-deep bsu-ly-layout-container-of-root{padding-bottom:1rem}:host.has-preview-column .secondary-row td{border-bottom:none}:host ::ng-deep .row-group.mobile-mode{border-bottom:var(--sapList_BorderWidth, .0625rem) solid var(--sapList_BorderColor, #e4e4e4)!important}:host ::ng-deep .inlineEditMode bnrc-field-ui{padding:0;margin:0}:host ::ng-deep .inlineEditMode bsu-ui-simple-combo{margin:0!important}:host ::ng-deep .secondary.p-wrapper p{display:flex;align-items:center}bsu-layout-control:not(.hide-form-item){align-items:center;height:100%;min-width:auto;width:auto}tr.group-summary-row td{border:none;background-color:#dde5f0;border-right:none!important;font-weight:700}tr.group-summary-row td label{font-weight:700}tr.group-summary-row td label.NaN{display:none}td{vertical-align:middle}td.control-readonly{background-color:var(--sapList_HeaderBackground)}tr.brule-message td{border:0}.row-group{background-color:var(--sapBackgroundColor, \"#f7f7ff\")}.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}.save-error{color:var(--sapField_InvalidColor)}.save-success{color:var(--sapField_SuccessColor)}.flow{max-width:100%}.flow-item{display:flex}.flow-item fd-micro-process-flow-icon{width:1.375rem;height:1.375rem}.flow-item h5{padding-right:.3rem}.cartable-template{padding:.5rem 0}.workflow-pending{opacity:.5;pointer-events:none;position:relative}.detailCollapsed{height:0;display:none}tr td.rep-column:first-child{position:sticky;right:0}tr:not([aria-selected=true]).preview-column td{border-bottom:var(--sapList_BorderWidth) var(--fdTable_Cell_Horizontal_Border_Style, solid) var(--sapList_BorderColor)}tr[aria-selected=true].has-preview-column td,tr.showdetails-on.hasCartable td,tr.showdetails-on.hasForm td{border-bottom:none}\n"] }]
         }], propDecorators: { showDetailsInRow: [{
                 type: Input
             }], previewColumn: [{
@@ -9006,6 +9040,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
             }] } });
 
 class LyTabPageComponent extends LayoutPanelBaseComponent {
+    constructor() {
+        super(...arguments);
+        this._tabpageService = inject(TabpageService);
+    }
     ngOnInit() {
         super.ngOnInit();
         const config = this.config;
@@ -9013,16 +9051,17 @@ class LyTabPageComponent extends LayoutPanelBaseComponent {
         this.title = config.Title;
         this.flex = config.Bounds.width;
         this._classes = this.config.items.length === 0 ? 'field-nopadding' : 'field-nopadding';
+        this._tabpageService.setItemCount(this.layoutControlCount);
     }
     refreshLayout() {
         this.layoutService.refreshLayout();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LyTabPageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: { renderItems: "renderItems", tablist: "tablist" }, host: { properties: { "style.flex": "this.flex", "attr.tabtitle": "this.title", "class": "this._classes" } }, providers: [LayoutService], viewQueries: [{ propertyName: "vcr", first: true, predicate: ["placeholder"], descendants: true, read: ViewContainerRef }, { propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\r\n    @for (item of config | filterToolbarControl; track item) { @switch (item.xtype) { @case ('Ly.LayoutTabPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n    } @case ('Ly.LayoutPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n    } @case ('Ly.LayoutContainer') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutContainerComponent',\r\n                selector: 'bsu-ly-layout-container'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n    } @case ('Ly.EmptySpace') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n    } @case ('Ly.SimpleLabel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n    } @case ('Ly.LayoutLine') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n    } @case ('Ly.LayoutJoin') { @if (item.Type === 'HorizontalJoin') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-horizontal-layout',\r\n                name: 'LyLayoutHorizontalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n    } @else {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-vertical-layout',\r\n                name: 'LyLayoutVerticalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n    } } @case ('Ly.LayoutControl') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-layout-control',\r\n                name: 'LayoutControlComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n    } } }\r\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\r\n        <bnrc-dynamic-layout\r\n            [config]=\"config\"\r\n            [selector]=\"selector\"\r\n            [name]=\"name\"\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    </ng-template>\r\n</ng-container>\r\n", styles: [":host{display:block;padding:.3rem 0}\n"], dependencies: [{ kind: "directive", type: i1$2.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: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LyTabPageComponent, selector: "bsu-ly-tab-page", inputs: { renderItems: "renderItems", tablist: "tablist" }, host: { properties: { "style.flex": "this.flex", "attr.tabtitle": "this.title", "class": "this._classes" } }, providers: [LayoutService, TabpageService], viewQueries: [{ propertyName: "vcr", first: true, predicate: ["placeholder"], descendants: true, read: ViewContainerRef }, { propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\r\n    @for (item of config | filterToolbarControl; track item) { @switch (item.xtype) { @case ('Ly.LayoutTabPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n    } @case ('Ly.LayoutPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n    } @case ('Ly.LayoutContainer') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutContainerComponent',\r\n                selector: 'bsu-ly-layout-container'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n    } @case ('Ly.EmptySpace') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n    } @case ('Ly.SimpleLabel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n    } @case ('Ly.LayoutLine') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n    } @case ('Ly.LayoutJoin') { @if (item.Type === 'HorizontalJoin') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-horizontal-layout',\r\n                name: 'LyLayoutHorizontalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n    } @else {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-vertical-layout',\r\n                name: 'LyLayoutVerticalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n    } } @case ('Ly.LayoutControl') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-layout-control',\r\n                name: 'LayoutControlComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n    } } }\r\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\r\n        <bnrc-dynamic-layout\r\n            [config]=\"config\"\r\n            [selector]=\"selector\"\r\n            [name]=\"name\"\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    </ng-template>\r\n</ng-container>\r\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "directive", type: i1$2.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: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LyTabPageComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ly-tab-page', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], standalone: false, template: "<ng-container *untilInView=\"el\">\r\n    @for (item of config | filterToolbarControl; track item) { @switch (item.xtype) { @case ('Ly.LayoutTabPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n    } @case ('Ly.LayoutPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n    } @case ('Ly.LayoutContainer') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutContainerComponent',\r\n                selector: 'bsu-ly-layout-container'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n    } @case ('Ly.EmptySpace') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n    } @case ('Ly.SimpleLabel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n    } @case ('Ly.LayoutLine') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n    } @case ('Ly.LayoutJoin') { @if (item.Type === 'HorizontalJoin') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-horizontal-layout',\r\n                name: 'LyLayoutHorizontalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n    } @else {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-vertical-layout',\r\n                name: 'LyLayoutVerticalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n    } } @case ('Ly.LayoutControl') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-layout-control',\r\n                name: 'LayoutControlComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n    } } }\r\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\r\n        <bnrc-dynamic-layout\r\n            [config]=\"config\"\r\n            [selector]=\"selector\"\r\n            [name]=\"name\"\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    </ng-template>\r\n</ng-container>\r\n", styles: [":host{display:block;padding:.3rem 0}\n"] }]
+            args: [{ selector: 'bsu-ly-tab-page', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService, TabpageService], standalone: false, template: "<ng-container *untilInView=\"el\">\r\n    @for (item of config | filterToolbarControl; track item) { @switch (item.xtype) { @case ('Ly.LayoutTabPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-tab-container' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n    } @case ('Ly.LayoutPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLayoutPanelComponent', selector: 'bsu-ly-layout-panel' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n    } @case ('Ly.LayoutContainer') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutContainerComponent',\r\n                selector: 'bsu-ly-layout-container'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n    } @case ('Ly.EmptySpace') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n    } @case ('Ly.SimpleLabel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LySimpleLabelComponent', selector: 'bsu-ly-simple-label' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n    } @case ('Ly.LayoutLine') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n    } @case ('Ly.LayoutJoin') { @if (item.Type === 'HorizontalJoin') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-horizontal-layout',\r\n                name: 'LyLayoutHorizontalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n    } @else {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-vertical-layout',\r\n                name: 'LyLayoutVerticalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n    } } @case ('Ly.LayoutControl') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-layout-control',\r\n                name: 'LayoutControlComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n    } } }\r\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-name=\"name\">\r\n        <bnrc-dynamic-layout\r\n            [config]=\"config\"\r\n            [selector]=\"selector\"\r\n            [name]=\"name\"\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    </ng-template>\r\n</ng-container>\r\n", styles: [":host{display:block}\n"] }]
         }], propDecorators: { vcr: [{
                 type: ViewChild,
                 args: ['placeholder', { read: ViewContainerRef }]
@@ -9172,11 +9211,11 @@ class FundamentalDynamicFormComponent extends BaseComponent {
         this.layout2 = GetFormLayoutGrid(false, this.colXl, this.colLg, this.colMd);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: FundamentalDynamicFormComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FundamentalDynamicFormComponent, 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", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", 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", formVisibilityStatus: "formVisibilityStatus", layoutGridCol: "layoutGridCol", colLg: "colLg", colXl: "colXl", colMd: "colMd", footerDesign: "footerDesign", formContentMaxWidth: "formContentMaxWidth", workflowButtons: "workflowButtons" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest" }, 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, usesOnChanges: 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.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\r\n        #titleRef\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n            <fd-breadcrumb>\r\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\r\n                breadCrumb.url; let i = $index; let last = $last) {\r\n                <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <fd-dynamic-page-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) {}\r\n    <fd-dynamic-page-subheader\r\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\r\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\r\n        [collapsible]=\"true\"\r\n        [pinnable]=\"false\"\r\n        [collapsed]=\"!facetList?.length && !workflowInfoText\"\r\n    >\r\n        @if (workflowInfoText) {\r\n        <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\r\n            {{ workflowInfoText | bbbTranslate }}\r\n        </fd-message-strip>\r\n        }\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 }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue\" 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)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue\"\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\"\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\"\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\" 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\"\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 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'\"\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 }}</span>\r\n        }\r\n    </fd-dynamic-page-subheader>\r\n    @if(!modernTabs.length && !contentIsPage){\r\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\r\n        <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\r\n            <div fdLayoutGridRow>\r\n                <div\r\n                    style=\"padding: 0; padding-inline: 0; padding-block: 0\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\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 style=\"min-height: 100%\" [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                    style=\"padding: 0; padding-inline: 0; padding-block: 0\"\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 [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\r\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\r\n\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            [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\">\r\n                    <div fdLayoutGridRow>\r\n                        <div\r\n                            style=\"padding: 0; padding-inline: 0; padding-block: 0\"\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 [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\r\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\r\n                        </div>\r\n                        <div\r\n                            style=\"padding: 0; padding-inline: 0; padding-block: 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        </fdp-icon-tab-bar-tab>\r\n        }\r\n    </fdp-icon-tab-bar>\r\n    } @if(!hideFooter && hasLayoutButtons){\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]=\"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-dynamic-page[contentIsPage=true] .fd-dynamic-page{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 ::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}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{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$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.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: i3$7.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$5.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$6.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$6.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i9$1.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$5.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i5$8.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$5.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", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "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", "tablist"] }, { 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: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1$2.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.FilterWorkflowInMobilePipe, name: "filterWorkflowInMobile" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: FundamentalDynamicFormComponent, 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", fieldDict: "fieldDict", removeHeaderBorder: "removeHeaderBorder", removeContentPadding: "removeContentPadding", isMobile: "isMobile", mo: "mo", avatar: "avatar", circleAvatar: "circleAvatar", 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", formVisibilityStatus: "formVisibilityStatus", layoutGridCol: "layoutGridCol", colLg: "colLg", colXl: "colXl", colMd: "colMd", footerDesign: "footerDesign", formContentMaxWidth: "formContentMaxWidth", workflowButtons: "workflowButtons" }, outputs: { toolbarClick: "toolbarClick", workflowChoiceClick: "workflowChoiceClick", close: "close", fullscreenRequest: "fullscreenRequest" }, 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, usesOnChanges: 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.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\r\n        #titleRef\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n            <fd-breadcrumb>\r\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\r\n                breadCrumb.url; let i = $index; let last = $last) {\r\n                <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <fd-dynamic-page-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) {}\r\n    <fd-dynamic-page-subheader\r\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\r\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\r\n        [collapsible]=\"true\"\r\n        [pinnable]=\"false\"\r\n        [collapsed]=\"!facetList?.length && !workflowInfoText\"\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        <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 }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue\" 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)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue\"\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\"\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\"\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\" 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\"\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'\"\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 }}</span>\r\n        }\r\n    </fd-dynamic-page-subheader>\r\n    @if(!modernTabs.length && !contentIsPage){\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                    [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]=\"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 [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\r\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\r\n\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            [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                        ></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                        ></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){\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]=\"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-dynamic-page[contentIsPage=true] .fd-dynamic-page{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 ::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}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{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$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.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: i3$7.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "component", type: i3$5.AvatarComponent, selector: "fd-avatar", inputs: ["class", "id", "ariaLabel", "ariaLabelledby", "label", "size", "font", "glyph", "zoomGlyph", "circle", "transparent", "contain", "placeholder", "tile", "border", "colorAccent", "colorIndication", "random", "clickable", "valueState", "image", "alterIcon", "backupImage"], outputs: ["avatarClicked", "zoomGlyphClicked"] }, { kind: "component", type: i5$6.BreadcrumbComponent, selector: "fd-breadcrumb", inputs: ["reverse", "tabIndex"], outputs: ["visibleItemsCount", "hiddenItemsCount"] }, { kind: "component", type: i5$6.BreadcrumbItemComponent, selector: "fd-breadcrumb-item" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i9$1.DynamicPageComponent, selector: "fd-dynamic-page", inputs: ["disableSnapOnScroll", "ariaLabel", "ariaRoledescription", "background", "autoResponsive", "size", "offset", "expandContent", "positionRelative"] }, { kind: "component", type: i9$1.DynamicPageHeaderComponent, selector: "fd-dynamic-page-header", inputs: ["title", "titleWrap", "subtitle", "subtitleWrap", "headingLevel", "titleId"] }, { kind: "component", type: i9$1.DynamicPageGlobalActionsComponent, selector: "fd-dynamic-page-global-actions" }, { kind: "component", type: i9$1.DynamicPageLayoutActionsComponent, selector: "fd-dynamic-page-layout-actions" }, { kind: "component", type: i9$1.DynamicPageSubheaderComponent, selector: "fd-dynamic-page-subheader", inputs: ["collapsible", "pinnable", "collapsed", "expandLabel", "collapseLabel", "id", "headerAriaLabel", "pinAriaLabel", "unpinAriaLabel"], outputs: ["collapsedChange"] }, { kind: "component", type: i9$1.DynamicPageContentComponent, selector: "fd-dynamic-page-content", inputs: ["tabLabel", "id"] }, { kind: "component", type: i9$1.DynamicPageFooterComponent, selector: "fd-dynamic-page-footer" }, { kind: "component", type: i9$1.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$5.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "component", type: i5$8.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$5.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", "iconTabType", "tabsConfig", "densityMode", "iconTabFont", "enableTabReordering", "showTotalTab", "multiClick", "layoutMode", "iconTabBackground", "iconTabSize", "colorAssociations", "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", "tablist"] }, { 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: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1$2.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: "18.2.13", ngImport: i0, type: FundamentalDynamicFormComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-fundamental-dynamic-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, 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.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\r\n        #titleRef\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n            <fd-breadcrumb>\r\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\r\n                breadCrumb.url; let i = $index; let last = $last) {\r\n                <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <fd-dynamic-page-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) {}\r\n    <fd-dynamic-page-subheader\r\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\r\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\r\n        [collapsible]=\"true\"\r\n        [pinnable]=\"false\"\r\n        [collapsed]=\"!facetList?.length && !workflowInfoText\"\r\n    >\r\n        @if (workflowInfoText) {\r\n        <fd-message-strip [type]=\"'warning'\" [dismissible]=\"false\">\r\n            {{ workflowInfoText | bbbTranslate }}\r\n        </fd-message-strip>\r\n        }\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 }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue\" 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)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue\"\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\"\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\"\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\" 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\"\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 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'\"\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 }}</span>\r\n        }\r\n    </fd-dynamic-page-subheader>\r\n    @if(!modernTabs.length && !contentIsPage){\r\n    <fd-dynamic-page-content [class.limit-content-width]=\"formContentMaxWidth > 0\" cdkScrollable>\r\n        <fd-layout-grid style=\"min-height: 100%\" [style.max-width.px]=\"formContentMaxWidth\">\r\n            <div fdLayoutGridRow>\r\n                <div\r\n                    style=\"padding: 0; padding-inline: 0; padding-block: 0\"\r\n                    [class.hide]=\"layout2.colXl === 0\"\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 style=\"min-height: 100%\" [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                    style=\"padding: 0; padding-inline: 0; padding-block: 0\"\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 [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\r\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\r\n\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            [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\">\r\n                    <div fdLayoutGridRow>\r\n                        <div\r\n                            style=\"padding: 0; padding-inline: 0; padding-block: 0\"\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 [fdLayoutGridCol]=\"12\" [colMd]=\"colMd\" [colLg]=\"colLg\" [colXl]=\"colXl\">\r\n                            <bsu-ly-tab-page [config]=\"tab\"></bsu-ly-tab-page>\r\n                        </div>\r\n                        <div\r\n                            style=\"padding: 0; padding-inline: 0; padding-block: 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        </fdp-icon-tab-bar-tab>\r\n        }\r\n    </fdp-icon-tab-bar>\r\n    } @if(!hideFooter && hasLayoutButtons){\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]=\"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-dynamic-page[contentIsPage=true] .fd-dynamic-page{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 ::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}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{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"] }]
+            args: [{ selector: 'bsu-fundamental-dynamic-form', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, 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.p-b0]=\"removeContentPadding\"\r\n        [class.hide-title]=\"hideTitle === true && hideClose === true\"\r\n        [class.no-toolbar-items]=\"!(toolbarItems | filterWorkflowInMobile: worfklowButtonsOnFooter)?.length\"\r\n        #titleRef\r\n    >\r\n        <fd-dynamic-page-breadcrumb [class.hide]=\"isMobile\">\r\n            <fd-breadcrumb>\r\n                @if (breadCrumbs && !isMobile) { @for (breadCrumb of breadCrumbs | slice: 0:breadCrumbs.length; track\r\n                breadCrumb.url; let i = $index; let last = $last) {\r\n                <fd-breadcrumb-item>\r\n                    <bsu-breadcrumb\r\n                        [index]=\"i\"\r\n                        [isLast]=\"last\"\r\n                        [breadCrumb]=\"breadCrumb\"\r\n                        [allBreadCrumb]=\"breadCrumbs\"\r\n                    ></bsu-breadcrumb>\r\n                </fd-breadcrumb-item>\r\n                } }\r\n            </fd-breadcrumb>\r\n        </fd-dynamic-page-breadcrumb>\r\n        <fd-dynamic-page-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) {}\r\n    <fd-dynamic-page-subheader\r\n        [class.header-no-description]=\"!(description || workflowInfoText)\"\r\n        [class.no-pin]=\"hidePin || (!facetList?.length && !workflowInfoText)\"\r\n        [collapsible]=\"true\"\r\n        [pinnable]=\"false\"\r\n        [collapsed]=\"!facetList?.length && !workflowInfoText\"\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        <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 }}</label>\r\n                    <fd-text [text]=\"item.Value | facetValue\" 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)\"\r\n                    [large]=\"facet.mo.IsLarge\"\r\n                    [title]=\"facet.mo.Text | facetValue\"\r\n                    [aria-label]=\"facet.mo.Text | facetValue\"\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\"\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\"\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\" 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\"\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'\"\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 }}</span>\r\n        }\r\n    </fd-dynamic-page-subheader>\r\n    @if(!modernTabs.length && !contentIsPage){\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                    [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]=\"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 [stackContent]=\"false\" [collapseOverflow]=\"true\" [expandOverflowText]=\"'More' | bbbTranslate\">\r\n        @for (tab of modernTabs; track tab.Title; let i = $index) {\r\n\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            [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                        ></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                        ></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){\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]=\"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-dynamic-page[contentIsPage=true] .fd-dynamic-page{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 ::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}.no-pin ::ng-deep .fd-dynamic-page__collapsible-header-visibility-container,.no-pin ::ng-deep .fd-dynamic-page__collapsible-header{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"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { _dynamicPageComponent: [{
                 type: ViewChild,
                 args: [DynamicPageComponent, { static: true }]
@@ -11770,11 +11809,11 @@ class UiTinymceComponent extends FieldBaseComponent {
         this.context.fireEvent('change', this, newValue, this.value, {});
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UiTinymceComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UiTinymceComponent, selector: "bsu-ui-tinymce", host: { properties: { "style.min-height": "this.tinyHeight", "style.min-width": "this._minWidth" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            (Setting.IsHtmlViewer || (disableOrReadonly$ | async)) === true ? readonlyMode : editMode;\r\n            context: { disable: (disable$ | async) === true }\r\n        \"\r\n    ></ng-container>\r\n    <ng-template #readonlyMode let-disable=\"disable\">\r\n        <input fd-form-control class=\"hide\" />\r\n        <div\r\n            class=\"html-readonly fd-input\"\r\n            contentDensity\r\n            [attr.readonly]=\"true\"\r\n            [class.readonly]=\"true\"\r\n            [class.anonymous]=\"isAnonymous\"\r\n            [class.disable]=\"disable\"\r\n            [innerHtml]=\"value | sanitizeText\"\r\n            [style.pointer-event]=\"disable ? 'none' : null\"\r\n            style=\"height: auto !important\"\r\n        ></div>\r\n    </ng-template>\r\n\r\n    <ng-template #editMode>\r\n        <bsu-mask *ngIf=\"!tinyInit\"></bsu-mask>\r\n        <bsu-barsa-tinyemce\r\n            [attr.ismobile]=\"isMobile\"\r\n            [attr.ismobile]=\"isTablet\"\r\n            [Setting]=\"Setting\"\r\n            [IsInline]=\"parameters?.IsInline === true\"\r\n            [value]=\"value\"\r\n            [defaultVerbs]=\"context.defaultVerbs\"\r\n            (tinyInit)=\"onTinyInit()\"\r\n            (valueChange)=\"onTinyChanged($event)\"\r\n            [readonly]=\"isReadonly\"\r\n        ></bsu-barsa-tinyemce>\r\n    </ng-template>\r\n</ng-container>\r\n", styles: [":host{display:flex;flex-direction:column;justify-content:stretch;align-items:stretch;height:100%;width:100%;align-self:flex-start}:host ::ng-deep .tox.tox-tinymce{border-radius:0%;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor)}.html-readonly,bsu-barsa-tinyemce{flex-grow:1}.html-readonly ::ng-deep>p{overflow:auto}.readonly{background:var(--sapBackgroundColor);height:100%}.disable{background:var(--sapBackgroundColor);height:100%;opacity:.5}.readonly.anonymous{background-color:transparent;border:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: BarsaTinyemceComponent, selector: "bsu-barsa-tinyemce", inputs: ["Setting", "isReadonly", "value", "IsInline", "defaultVerbs"], outputs: ["valueChange", "tinyInit"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SanitizeTextPipe, name: "sanitizeText" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: UiTinymceComponent, selector: "bsu-ui-tinymce", host: { properties: { "style.min-height": "this.tinyHeight", "style.min-width": "this._minWidth" } }, usesInheritance: true, ngImport: i0, template: "<ng-container *untilInView=\"el\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            (Setting.IsHtmlViewer || (disableOrReadonly$ | async)) === true ? readonlyMode : editMode;\r\n            context: { disable: (disable$ | async) === true }\r\n        \"\r\n    ></ng-container>\r\n    <ng-template #readonlyMode let-disable=\"disable\">\r\n        <input fd-form-control class=\"hide\" />\r\n        <div\r\n            class=\"html-readonly fd-input\"\r\n            contentDensity\r\n            [attr.readonly]=\"true\"\r\n            [class.readonly]=\"true\"\r\n            [class.anonymous]=\"isAnonymous\"\r\n            [class.disable]=\"disable\"\r\n            [innerHtml]=\"value | sanitizeText\"\r\n            [style.pointer-event]=\"disable ? 'none' : null\"\r\n            style=\"height: auto !important;text-wrap: auto;\"\r\n        ></div>\r\n    </ng-template>\r\n\r\n    <ng-template #editMode>\r\n        <bsu-mask *ngIf=\"!tinyInit\"></bsu-mask>\r\n        <bsu-barsa-tinyemce\r\n            [attr.ismobile]=\"isMobile\"\r\n            [attr.ismobile]=\"isTablet\"\r\n            [Setting]=\"Setting\"\r\n            [IsInline]=\"parameters?.IsInline === true\"\r\n            [value]=\"value\"\r\n            [defaultVerbs]=\"context.defaultVerbs\"\r\n            (tinyInit)=\"onTinyInit()\"\r\n            (valueChange)=\"onTinyChanged($event)\"\r\n            [readonly]=\"isReadonly\"\r\n        ></bsu-barsa-tinyemce>\r\n    </ng-template>\r\n</ng-container>\r\n", styles: [":host{display:flex;flex-direction:column;justify-content:stretch;align-items:stretch;height:100%;width:100%;align-self:flex-start}:host ::ng-deep .tox.tox-tinymce{border-radius:0%;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor)}.html-readonly,bsu-barsa-tinyemce{flex-grow:1}.html-readonly ::ng-deep>p{overflow:auto}.readonly{background:var(--sapBackgroundColor);height:100%}.disable{background:var(--sapBackgroundColor);height:100%;opacity:.5}.readonly.anonymous{background-color:transparent;border:none}\n"], dependencies: [{ kind: "directive", type: i1$2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "component", type: i2$1.FormControlComponent, selector: "input[fd-form-control], textarea[fd-form-control]", inputs: ["state", "type", "class", "ariaLabel", "ariaLabelledBy"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "component", type: BarsaTinyemceComponent, selector: "bsu-barsa-tinyemce", inputs: ["Setting", "isReadonly", "value", "IsInline", "defaultVerbs"], outputs: ["valueChange", "tinyInit"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.SanitizeTextPipe, name: "sanitizeText" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UiTinymceComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-tinymce', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container *untilInView=\"el\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            (Setting.IsHtmlViewer || (disableOrReadonly$ | async)) === true ? readonlyMode : editMode;\r\n            context: { disable: (disable$ | async) === true }\r\n        \"\r\n    ></ng-container>\r\n    <ng-template #readonlyMode let-disable=\"disable\">\r\n        <input fd-form-control class=\"hide\" />\r\n        <div\r\n            class=\"html-readonly fd-input\"\r\n            contentDensity\r\n            [attr.readonly]=\"true\"\r\n            [class.readonly]=\"true\"\r\n            [class.anonymous]=\"isAnonymous\"\r\n            [class.disable]=\"disable\"\r\n            [innerHtml]=\"value | sanitizeText\"\r\n            [style.pointer-event]=\"disable ? 'none' : null\"\r\n            style=\"height: auto !important\"\r\n        ></div>\r\n    </ng-template>\r\n\r\n    <ng-template #editMode>\r\n        <bsu-mask *ngIf=\"!tinyInit\"></bsu-mask>\r\n        <bsu-barsa-tinyemce\r\n            [attr.ismobile]=\"isMobile\"\r\n            [attr.ismobile]=\"isTablet\"\r\n            [Setting]=\"Setting\"\r\n            [IsInline]=\"parameters?.IsInline === true\"\r\n            [value]=\"value\"\r\n            [defaultVerbs]=\"context.defaultVerbs\"\r\n            (tinyInit)=\"onTinyInit()\"\r\n            (valueChange)=\"onTinyChanged($event)\"\r\n            [readonly]=\"isReadonly\"\r\n        ></bsu-barsa-tinyemce>\r\n    </ng-template>\r\n</ng-container>\r\n", styles: [":host{display:flex;flex-direction:column;justify-content:stretch;align-items:stretch;height:100%;width:100%;align-self:flex-start}:host ::ng-deep .tox.tox-tinymce{border-radius:0%;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor)}.html-readonly,bsu-barsa-tinyemce{flex-grow:1}.html-readonly ::ng-deep>p{overflow:auto}.readonly{background:var(--sapBackgroundColor);height:100%}.disable{background:var(--sapBackgroundColor);height:100%;opacity:.5}.readonly.anonymous{background-color:transparent;border:none}\n"] }]
+            args: [{ selector: 'bsu-ui-tinymce', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container *untilInView=\"el\">\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            (Setting.IsHtmlViewer || (disableOrReadonly$ | async)) === true ? readonlyMode : editMode;\r\n            context: { disable: (disable$ | async) === true }\r\n        \"\r\n    ></ng-container>\r\n    <ng-template #readonlyMode let-disable=\"disable\">\r\n        <input fd-form-control class=\"hide\" />\r\n        <div\r\n            class=\"html-readonly fd-input\"\r\n            contentDensity\r\n            [attr.readonly]=\"true\"\r\n            [class.readonly]=\"true\"\r\n            [class.anonymous]=\"isAnonymous\"\r\n            [class.disable]=\"disable\"\r\n            [innerHtml]=\"value | sanitizeText\"\r\n            [style.pointer-event]=\"disable ? 'none' : null\"\r\n            style=\"height: auto !important;text-wrap: auto;\"\r\n        ></div>\r\n    </ng-template>\r\n\r\n    <ng-template #editMode>\r\n        <bsu-mask *ngIf=\"!tinyInit\"></bsu-mask>\r\n        <bsu-barsa-tinyemce\r\n            [attr.ismobile]=\"isMobile\"\r\n            [attr.ismobile]=\"isTablet\"\r\n            [Setting]=\"Setting\"\r\n            [IsInline]=\"parameters?.IsInline === true\"\r\n            [value]=\"value\"\r\n            [defaultVerbs]=\"context.defaultVerbs\"\r\n            (tinyInit)=\"onTinyInit()\"\r\n            (valueChange)=\"onTinyChanged($event)\"\r\n            [readonly]=\"isReadonly\"\r\n        ></bsu-barsa-tinyemce>\r\n    </ng-template>\r\n</ng-container>\r\n", styles: [":host{display:flex;flex-direction:column;justify-content:stretch;align-items:stretch;height:100%;width:100%;align-self:flex-start}:host ::ng-deep .tox.tox-tinymce{border-radius:0%;border:var(--sapField_BorderWidth) var(--sapField_BorderStyle) var(--sapField_BorderColor)}.html-readonly,bsu-barsa-tinyemce{flex-grow:1}.html-readonly ::ng-deep>p{overflow:auto}.readonly{background:var(--sapBackgroundColor);height:100%}.disable{background:var(--sapBackgroundColor);height:100%;opacity:.5}.readonly.anonymous{background-color:transparent;border:none}\n"] }]
         }], propDecorators: { tinyHeight: [{
                 type: HostBinding,
                 args: ['style.min-height']
@@ -12655,11 +12694,11 @@ class UiMoInfoUlvComboComponent extends FieldBaseComponent {
         // this._triggerClick('ItemSelect', this.value);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UiMoInfoUlvComboComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: UiMoInfoUlvComboComponent, selector: "bsu-ui-mo-info-ulv-combo", inputs: { ulvAdapter: "ulvAdapter", Control: "Control", UlvMainCtrlr: "UlvMainCtrlr", UlvUi: "UlvUi", IsExpanded: "IsExpanded", Collapse: "Collapse", Expand: "Expand", on: "on", Focus: "Focus", SetUlvAdapter: "SetUlvAdapter", IsUiCreated: "IsUiCreated", Mask: "Mask", hide: "hide", show: "show", Unmask: "Unmask", getRawValue: "getRawValue" }, host: { listeners: { "keydown": "onKeyDown($event)", "keydown.alt": "onAlt($event)" } }, viewQueries: [{ propertyName: "fdComboRef", first: true, predicate: ComboboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        comboTemplate;\r\n        context: {\r\n            $implicit:\r\n                (loading$ | async) === true\r\n                | moInfoUlvMoList\r\n                    : isDataLoadedFirstTime\r\n                    : ulvAdapter?.Setting?.Data?.MoDataList\r\n                    : UlvUi?.Setting?.Data?.MoDataList\r\n                    : ulvAdapter?.Setting?.Data?.Paging\r\n                    : UlvUi?.Setting?.Data?.Paging,\r\n            deviceSize: deviceSize$ | async,\r\n            disableOrReadonly: disableOrReadonly$ | async,\r\n            disable: disable$ | async,\r\n            readonly: readonly$ | async,\r\n            isSearch: context._showPopup || context._showDropDown === false\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n\r\n<ng-template #btnsTpl let-disableOrReadonly=\"disableOrReadonly\">\r\n    <div class=\"extra-buttons fd-input-group fd-input-group--control\" contentDensity>\r\n        @if (hasValue && disableOrReadonly !== true) {\r\n        <span class=\"fd-input-group__addon--button combo-popup-btn\" fd-input-group-addon>\r\n            <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onClear()\"></button>\r\n        </span>\r\n        } @if (!hasValue && disableOrReadonly !== true && Setting.ShowNewButton) {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"add\" (click)=\"onNew()\"></button>\r\n        </span>\r\n        } @if (hasValue && disableOrReadonly !== true && Setting.ViewRelatedFormType !== 'Hide') {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"edit\" (click)=\"onEdit()\"></button>\r\n        </span>\r\n        } @if (context._showPopup && !value && disableOrReadonly !== true) {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"search\" (click)=\"onSearch()\"></button>\r\n        </span>\r\n        }\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n    #comboTemplate\r\n    let-moDataList\r\n    let-deviceSize=\"deviceSize\"\r\n    let-disableOrReadonly=\"disableOrReadonly\"\r\n    let-disable=\"disable\"\r\n    let-readonly=\"readonly\"\r\n    let-isSearch=\"isSearch\"\r\n>\r\n    <div class=\"simple-combo-wrapper\">\r\n        <fd-combobox\r\n            #fdCombobox\r\n            class=\"combo-mo-ulv\"\r\n            [class.canAdd]=\"!hasValue && disableOrReadonly !== true && Setting.ShowNewButton\"\r\n            [class.canEdit]=\"hasValue && disableOrReadonly !== true\"\r\n            [class.disableorreadonly]=\"disableOrReadonly === true\"\r\n            [comboboxId]=\"comboboxId\"\r\n            [class.has-Value]=\"hasValue\"\r\n            [placeholder]=\"'Select' | bbbTranslate\"\r\n            [mobile]=\"deviceSize === 's'\"\r\n            [mobileConfig]=\"mobileConfig\"\r\n            [fillOnSelect]=\"true\"\r\n            [readOnly]=\"readonly === true ? true : false\"\r\n            [disabled]=\"disable === true ? true : false\"\r\n            [dropdownValues]=\"moDataList\"\r\n            [filterFn]=\"customFilter\"\r\n            [openOnKeyboardEvent]=\"true\"\r\n            [byline]=\"allColumns.length > 0\"\r\n            [isSearch]=\"false\"\r\n            [itemTemplate]=\"itemTemplate\"\r\n            [displayFn]=\"displayFunc\"\r\n            [showDropdownButton]=\"context._showDropDown !== false && disableOrReadonly !== true\"\r\n            (itemClicked)=\"onItemClick($event, moDataList)\"\r\n            (inputTextChange)=\"onInputChange($event)\"\r\n            (openChange)=\"onOpenChange(fdCombobox, $event)\"\r\n        >\r\n        </fd-combobox>\r\n        <ng-container\r\n            *ngTemplateOutlet=\"btnsTpl; context: { disableOrReadonly: this.disableOrReadonly }\"\r\n        ></ng-container>\r\n    </div>\r\n    <ng-template #itemTemplate let-item>\r\n        @if (item.$isLoading) {\r\n        <div fd-list-content style=\"width: 100%; height: 20px\">\r\n            <bsu-mask [size]=\"'s'\" [top]=\"'10px'\"></bsu-mask>\r\n        </div>\r\n        } @else {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"item.$LoadMore ? loadMoreButton : showItem; context: { ulv: ulvAdapter || UlvUi }\"\r\n        >\r\n        </ng-container>\r\n        }\r\n        <ng-template #loadMoreButton let-ulv=\"ulv\">\r\n            @if (ulv) {\r\n            <bsu-ulv-paging\r\n                (click)=\"onPagingClick($event)\"\r\n                (pageChange)=\"onPageChange($event)\"\r\n                [pagingSetting]=\"ulv.Setting.Data.Paging\"\r\n            >\r\n            </bsu-ulv-paging>\r\n            }\r\n            <!-- <button\r\n        style=\"width: 100%\"\r\n        *ngIf=\"ulv && ulv.Setting.Data.Paging.Page + 1 < ulv.Setting.Data.Paging.TotalPages\"\r\n        fd-button\r\n        (click)=\"onPageChange2(ulv.Setting.Data.Paging, $event)\"\r\n        [label]=\"'More' | bbbTranslate\"\r\n      ></button> -->\r\n        </ng-template>\r\n        <ng-template #showItem>\r\n            @if (allColumns?.length && !item.isEmpty) { @if (!item.$__IsLast) {\r\n            <div class=\"moinfoulv devider\"></div>\r\n            } @if (item.$Icon) {\r\n            <span fd-list-thumbnail><fd-icon [glyph]=\"item.$Icon\"></fd-icon></span>\r\n            }\r\n            <div fd-list-content class=\"moinfoulv hasColumns\">\r\n                <div fd-list-title class=\"title\">{{ allColumns[0].Alias | rval: item:allColumns:true }}</div>\r\n                @if (allColumns[1]) {\r\n                <div fd-list-byline class=\"byline\">\r\n                    {{ allColumns[1].Alias | rval: item:allColumns:true }}\r\n                </div>\r\n                }\r\n                <div style=\"display: flex; column-gap: 8px; flex-wrap: wrap\">\r\n                    @for (column of allColumns; track column; let index = $index) { @if (index > 1) { @if (column.Alias\r\n                    | rval: item:allColumns:true; as value) {\r\n                    <span> {{ column.Alias }}:{{ value }}</span>\r\n                    } } }\r\n                </div>\r\n            </div>\r\n            } @else {\r\n            <span fd-list-title [class.list-empty-item]=\"item.isEmpty\"\r\n                >{{ item.isEmpty ? ('NoData' | bbbTranslate) : (item.$MoCaption || item.$Caption | bbbTranslate) }}\r\n            </span>\r\n            }\r\n        </ng-template>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{display:block}.combo-mo-ulv{width:100%}.combo-mo-ulv ::ng-deep .fd-popover-custom{width:100%}.fd-input-group{min-width:fit-content}.simple-combo-wrapper{display:flex;align-items:center;position:relative}.simple-combo-wrapper ::ng-deep .combo-mo-ulv[class*=has-]:not(.disableorreadonly) .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canAdd:not(.disableorreadonly) .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canEdit:not(.disableorreadonly) .fd-input-group{border-left:none;border-bottom-left-radius:unset;border-top-left-radius:unset}.combo-wrapper{display:flex;align-items:center;border:var(--sapField_BorderWidth, .0625rem) solid var(--sapField_BorderColor, #89919a);border-radius:var(--sapField_BorderCornerRadius, .125rem)}::ng-deep .combo-popup-btn{border:none;background:transparent}::ng-deep .combo-popup-btn button{border-color:transparent!important;border:none}::ng-deep .fd-combobox-count-list-results{display:none}.extra-buttons{width:auto;border-right:none;border-left:none;margin:0}.extra-buttons>span{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$6.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", "width", "searchFn", "highlighting", "closeOnSelect", "fillOnSelect", "autoComplete", "fillControlMode", "communicateByObject", "displayFn", "buttonFocusable", "clearButtonFocusable", "readOnly", "mobile", "mobileConfig", "showDropdownButton", "includes", "title", "byline", "tabOutStrategy"], outputs: ["itemClicked", "openChange", "inputTextChange"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: i5$1.InputGroupAddOnDirective, selector: "[fdInputGroupAddon], [fd-input-group-addon]", inputs: ["class", "placement", "type", "state", "button"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { 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: "component", type: UlvPagingComponent, selector: "bsu-ulv-paging", inputs: ["pagingSetting"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.MoInfoUlvMoListPipe, name: "moInfoUlvMoList" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: UiMoInfoUlvComboComponent, selector: "bsu-ui-mo-info-ulv-combo", inputs: { ulvAdapter: "ulvAdapter", Control: "Control", UlvMainCtrlr: "UlvMainCtrlr", UlvUi: "UlvUi", IsExpanded: "IsExpanded", Collapse: "Collapse", Expand: "Expand", on: "on", Focus: "Focus", SetUlvAdapter: "SetUlvAdapter", IsUiCreated: "IsUiCreated", Mask: "Mask", hide: "hide", show: "show", Unmask: "Unmask", getRawValue: "getRawValue" }, host: { listeners: { "keydown": "onKeyDown($event)", "keydown.alt": "onAlt($event)" } }, viewQueries: [{ propertyName: "fdComboRef", first: true, predicate: ComboboxComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        comboTemplate;\r\n        context: {\r\n            $implicit:\r\n                (loading$ | async) === true\r\n                | moInfoUlvMoList\r\n                    : isDataLoadedFirstTime\r\n                    : ulvAdapter?.Setting?.Data?.MoDataList\r\n                    : UlvUi?.Setting?.Data?.MoDataList\r\n                    : ulvAdapter?.Setting?.Data?.Paging\r\n                    : UlvUi?.Setting?.Data?.Paging,\r\n            deviceSize: deviceSize$ | async,\r\n            disableOrReadonly: disableOrReadonly$ | async,\r\n            disable: disable$ | async,\r\n            readonly: readonly$ | async,\r\n            isSearch: context._showPopup || context._showDropDown === false\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n\r\n<ng-template #btnsTpl let-disableOrReadonly=\"disableOrReadonly\">\r\n    <div class=\"extra-buttons fd-input-group fd-input-group--control\" contentDensity>\r\n        @if (hasValue && disableOrReadonly !== true) {\r\n        <span class=\"fd-input-group__addon--button combo-popup-btn\" fd-input-group-addon>\r\n            <button tabindex=\"-1\" fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onClear()\"></button>\r\n        </span>\r\n        } @if (!hasValue && disableOrReadonly !== true && Setting.ShowNewButton) {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"add\" (click)=\"onNew()\"></button>\r\n        </span>\r\n        } @if (hasValue && disableOrReadonly !== true && Setting.ViewRelatedFormType !== 'Hide') {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"edit\" (click)=\"onEdit()\"></button>\r\n        </span>\r\n        } @if (context._showPopup && !value && disableOrReadonly !== true) {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"search\" (click)=\"onSearch()\"></button>\r\n        </span>\r\n        }\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n    #comboTemplate\r\n    let-moDataList\r\n    let-deviceSize=\"deviceSize\"\r\n    let-disableOrReadonly=\"disableOrReadonly\"\r\n    let-disable=\"disable\"\r\n    let-readonly=\"readonly\"\r\n    let-isSearch=\"isSearch\"\r\n>\r\n    <div class=\"simple-combo-wrapper\">\r\n        <fd-combobox\r\n            #fdCombobox\r\n            class=\"combo-mo-ulv\"\r\n            [class.canAdd]=\"!hasValue && disableOrReadonly !== true && Setting.ShowNewButton\"\r\n            [class.canEdit]=\"hasValue && disableOrReadonly !== true\"\r\n            [class.disableorreadonly]=\"disableOrReadonly === true\"\r\n            [comboboxId]=\"comboboxId\"\r\n            [class.has-Value]=\"hasValue\"\r\n            [placeholder]=\"'Select' | bbbTranslate\"\r\n            [mobile]=\"deviceSize === 's'\"\r\n            [mobileConfig]=\"mobileConfig\"\r\n            [fillOnSelect]=\"true\"\r\n            [readOnly]=\"readonly === true ? true : false\"\r\n            [disabled]=\"disable === true ? true : false\"\r\n            [dropdownValues]=\"moDataList\"\r\n            [filterFn]=\"customFilter\"\r\n            [openOnKeyboardEvent]=\"true\"\r\n            [byline]=\"allColumns.length > 0\"\r\n            [isSearch]=\"false\"\r\n            [itemTemplate]=\"itemTemplate\"\r\n            [displayFn]=\"displayFunc\"\r\n            [showDropdownButton]=\"context._showDropDown !== false && disableOrReadonly !== true\"\r\n            (itemClicked)=\"onItemClick($event, moDataList)\"\r\n            (inputTextChange)=\"onInputChange($event)\"\r\n            (openChange)=\"onOpenChange(fdCombobox, $event)\"\r\n        >\r\n        </fd-combobox>\r\n        <ng-container\r\n            *ngTemplateOutlet=\"btnsTpl; context: { disableOrReadonly: this.disableOrReadonly }\"\r\n        ></ng-container>\r\n    </div>\r\n    <ng-template #itemTemplate let-item>\r\n        @if (item.$isLoading) {\r\n        <div fd-list-content style=\"width: 100%; height: 20px\">\r\n            <bsu-mask [size]=\"'s'\" [top]=\"'10px'\"></bsu-mask>\r\n        </div>\r\n        } @else {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"item.$LoadMore ? loadMoreButton : showItem; context: { ulv: ulvAdapter || UlvUi }\"\r\n        >\r\n        </ng-container>\r\n        }\r\n        <ng-template #loadMoreButton let-ulv=\"ulv\">\r\n            @if (ulv) {\r\n            <bsu-ulv-paging\r\n                (click)=\"onPagingClick($event)\"\r\n                (pageChange)=\"onPageChange($event)\"\r\n                [pagingSetting]=\"ulv.Setting.Data.Paging\"\r\n            >\r\n            </bsu-ulv-paging>\r\n            }\r\n            <!-- <button\r\n        style=\"width: 100%\"\r\n        *ngIf=\"ulv && ulv.Setting.Data.Paging.Page + 1 < ulv.Setting.Data.Paging.TotalPages\"\r\n        fd-button\r\n        (click)=\"onPageChange2(ulv.Setting.Data.Paging, $event)\"\r\n        [label]=\"'More' | bbbTranslate\"\r\n      ></button> -->\r\n        </ng-template>\r\n        <ng-template #showItem>\r\n            @if (allColumns?.length && !item.isEmpty) { @if (!item.$__IsLast) {\r\n            <div class=\"moinfoulv devider\"></div>\r\n            } @if (item.$Icon) {\r\n            <span fd-list-thumbnail><fd-icon [glyph]=\"item.$Icon\"></fd-icon></span>\r\n            }\r\n            <div fd-list-content class=\"moinfoulv hasColumns\">\r\n                <div fd-list-title class=\"title\">{{ allColumns[0].Alias | rval: item:allColumns:true }}</div>\r\n                @if (allColumns[1]) {\r\n                <div fd-list-byline class=\"byline\">\r\n                    {{ allColumns[1].Alias | rval: item:allColumns:true }}\r\n                </div>\r\n                }\r\n                <div style=\"display: flex; column-gap: 8px; flex-wrap: wrap\">\r\n                    @for (column of allColumns; track column; let index = $index) { @if (index > 1) { @if (column.Alias\r\n                    | rval: item:allColumns:true; as value) {\r\n                    <span> {{ column.Alias }}:{{ value }}</span>\r\n                    } } }\r\n                </div>\r\n            </div>\r\n            } @else {\r\n            <span fd-list-title [class.list-empty-item]=\"item.isEmpty\"\r\n                >{{ item.isEmpty ? ('NoData' | bbbTranslate) : (item.$MoCaption || item.$Caption | bbbTranslate) }}\r\n            </span>\r\n            }\r\n        </ng-template>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{display:block}.combo-mo-ulv{width:100%}.combo-mo-ulv ::ng-deep .fd-popover-custom{width:100%}.fd-input-group{min-width:fit-content}.simple-combo-wrapper{display:flex;align-items:center;position:relative}.simple-combo-wrapper ::ng-deep .combo-mo-ulv[class*=has-]:not(.disableorreadonly) .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canAdd:not(.disableorreadonly) .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canEdit:not(.disableorreadonly) .fd-input-group{border-left:none;border-bottom-left-radius:unset;border-top-left-radius:unset}.combo-wrapper{display:flex;align-items:center;border:var(--sapField_BorderWidth, .0625rem) solid var(--sapField_BorderColor, #89919a);border-radius:var(--sapField_BorderCornerRadius, .125rem)}::ng-deep .combo-popup-btn{border:none;background:transparent}::ng-deep .combo-popup-btn button{border-color:transparent!important;border:none}::ng-deep .fd-combobox-count-list-results{display:none}.extra-buttons{width:auto;border-right:none;border-left:none;margin:0}.extra-buttons>span{overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1$2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.MobileDirective, selector: "[mobile]" }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i4$6.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", "width", "searchFn", "highlighting", "closeOnSelect", "fillOnSelect", "autoComplete", "fillControlMode", "communicateByObject", "displayFn", "buttonFocusable", "clearButtonFocusable", "readOnly", "mobile", "mobileConfig", "showDropdownButton", "includes", "title", "byline", "tabOutStrategy"], outputs: ["itemClicked", "openChange", "inputTextChange"] }, { kind: "component", type: i3.IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "directive", type: i5$1.InputGroupAddOnDirective, selector: "[fdInputGroupAddon], [fd-input-group-addon]", inputs: ["class", "placement", "type", "state", "button"] }, { kind: "directive", type: i7.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }, { 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: "component", type: UlvPagingComponent, selector: "bsu-ulv-paging", inputs: ["pagingSetting"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: MaskComponent, selector: "bsu-mask", inputs: ["size", "top"] }, { kind: "directive", type: ContentDensityDirective, selector: "[contentDensity]" }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.MoReportValuePipe, name: "rval" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.MoInfoUlvMoListPipe, name: "moInfoUlvMoList" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: UiMoInfoUlvComboComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ui-mo-info-ulv-combo', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        comboTemplate;\r\n        context: {\r\n            $implicit:\r\n                (loading$ | async) === true\r\n                | moInfoUlvMoList\r\n                    : isDataLoadedFirstTime\r\n                    : ulvAdapter?.Setting?.Data?.MoDataList\r\n                    : UlvUi?.Setting?.Data?.MoDataList\r\n                    : ulvAdapter?.Setting?.Data?.Paging\r\n                    : UlvUi?.Setting?.Data?.Paging,\r\n            deviceSize: deviceSize$ | async,\r\n            disableOrReadonly: disableOrReadonly$ | async,\r\n            disable: disable$ | async,\r\n            readonly: readonly$ | async,\r\n            isSearch: context._showPopup || context._showDropDown === false\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n\r\n<ng-template #btnsTpl let-disableOrReadonly=\"disableOrReadonly\">\r\n    <div class=\"extra-buttons fd-input-group fd-input-group--control\" contentDensity>\r\n        @if (hasValue && disableOrReadonly !== true) {\r\n        <span class=\"fd-input-group__addon--button combo-popup-btn\" fd-input-group-addon>\r\n            <button fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onClear()\"></button>\r\n        </span>\r\n        } @if (!hasValue && disableOrReadonly !== true && Setting.ShowNewButton) {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"add\" (click)=\"onNew()\"></button>\r\n        </span>\r\n        } @if (hasValue && disableOrReadonly !== true && Setting.ViewRelatedFormType !== 'Hide') {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"edit\" (click)=\"onEdit()\"></button>\r\n        </span>\r\n        } @if (context._showPopup && !value && disableOrReadonly !== true) {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"search\" (click)=\"onSearch()\"></button>\r\n        </span>\r\n        }\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n    #comboTemplate\r\n    let-moDataList\r\n    let-deviceSize=\"deviceSize\"\r\n    let-disableOrReadonly=\"disableOrReadonly\"\r\n    let-disable=\"disable\"\r\n    let-readonly=\"readonly\"\r\n    let-isSearch=\"isSearch\"\r\n>\r\n    <div class=\"simple-combo-wrapper\">\r\n        <fd-combobox\r\n            #fdCombobox\r\n            class=\"combo-mo-ulv\"\r\n            [class.canAdd]=\"!hasValue && disableOrReadonly !== true && Setting.ShowNewButton\"\r\n            [class.canEdit]=\"hasValue && disableOrReadonly !== true\"\r\n            [class.disableorreadonly]=\"disableOrReadonly === true\"\r\n            [comboboxId]=\"comboboxId\"\r\n            [class.has-Value]=\"hasValue\"\r\n            [placeholder]=\"'Select' | bbbTranslate\"\r\n            [mobile]=\"deviceSize === 's'\"\r\n            [mobileConfig]=\"mobileConfig\"\r\n            [fillOnSelect]=\"true\"\r\n            [readOnly]=\"readonly === true ? true : false\"\r\n            [disabled]=\"disable === true ? true : false\"\r\n            [dropdownValues]=\"moDataList\"\r\n            [filterFn]=\"customFilter\"\r\n            [openOnKeyboardEvent]=\"true\"\r\n            [byline]=\"allColumns.length > 0\"\r\n            [isSearch]=\"false\"\r\n            [itemTemplate]=\"itemTemplate\"\r\n            [displayFn]=\"displayFunc\"\r\n            [showDropdownButton]=\"context._showDropDown !== false && disableOrReadonly !== true\"\r\n            (itemClicked)=\"onItemClick($event, moDataList)\"\r\n            (inputTextChange)=\"onInputChange($event)\"\r\n            (openChange)=\"onOpenChange(fdCombobox, $event)\"\r\n        >\r\n        </fd-combobox>\r\n        <ng-container\r\n            *ngTemplateOutlet=\"btnsTpl; context: { disableOrReadonly: this.disableOrReadonly }\"\r\n        ></ng-container>\r\n    </div>\r\n    <ng-template #itemTemplate let-item>\r\n        @if (item.$isLoading) {\r\n        <div fd-list-content style=\"width: 100%; height: 20px\">\r\n            <bsu-mask [size]=\"'s'\" [top]=\"'10px'\"></bsu-mask>\r\n        </div>\r\n        } @else {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"item.$LoadMore ? loadMoreButton : showItem; context: { ulv: ulvAdapter || UlvUi }\"\r\n        >\r\n        </ng-container>\r\n        }\r\n        <ng-template #loadMoreButton let-ulv=\"ulv\">\r\n            @if (ulv) {\r\n            <bsu-ulv-paging\r\n                (click)=\"onPagingClick($event)\"\r\n                (pageChange)=\"onPageChange($event)\"\r\n                [pagingSetting]=\"ulv.Setting.Data.Paging\"\r\n            >\r\n            </bsu-ulv-paging>\r\n            }\r\n            <!-- <button\r\n        style=\"width: 100%\"\r\n        *ngIf=\"ulv && ulv.Setting.Data.Paging.Page + 1 < ulv.Setting.Data.Paging.TotalPages\"\r\n        fd-button\r\n        (click)=\"onPageChange2(ulv.Setting.Data.Paging, $event)\"\r\n        [label]=\"'More' | bbbTranslate\"\r\n      ></button> -->\r\n        </ng-template>\r\n        <ng-template #showItem>\r\n            @if (allColumns?.length && !item.isEmpty) { @if (!item.$__IsLast) {\r\n            <div class=\"moinfoulv devider\"></div>\r\n            } @if (item.$Icon) {\r\n            <span fd-list-thumbnail><fd-icon [glyph]=\"item.$Icon\"></fd-icon></span>\r\n            }\r\n            <div fd-list-content class=\"moinfoulv hasColumns\">\r\n                <div fd-list-title class=\"title\">{{ allColumns[0].Alias | rval: item:allColumns:true }}</div>\r\n                @if (allColumns[1]) {\r\n                <div fd-list-byline class=\"byline\">\r\n                    {{ allColumns[1].Alias | rval: item:allColumns:true }}\r\n                </div>\r\n                }\r\n                <div style=\"display: flex; column-gap: 8px; flex-wrap: wrap\">\r\n                    @for (column of allColumns; track column; let index = $index) { @if (index > 1) { @if (column.Alias\r\n                    | rval: item:allColumns:true; as value) {\r\n                    <span> {{ column.Alias }}:{{ value }}</span>\r\n                    } } }\r\n                </div>\r\n            </div>\r\n            } @else {\r\n            <span fd-list-title [class.list-empty-item]=\"item.isEmpty\"\r\n                >{{ item.isEmpty ? ('NoData' | bbbTranslate) : (item.$MoCaption || item.$Caption | bbbTranslate) }}\r\n            </span>\r\n            }\r\n        </ng-template>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{display:block}.combo-mo-ulv{width:100%}.combo-mo-ulv ::ng-deep .fd-popover-custom{width:100%}.fd-input-group{min-width:fit-content}.simple-combo-wrapper{display:flex;align-items:center;position:relative}.simple-combo-wrapper ::ng-deep .combo-mo-ulv[class*=has-]:not(.disableorreadonly) .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canAdd:not(.disableorreadonly) .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canEdit:not(.disableorreadonly) .fd-input-group{border-left:none;border-bottom-left-radius:unset;border-top-left-radius:unset}.combo-wrapper{display:flex;align-items:center;border:var(--sapField_BorderWidth, .0625rem) solid var(--sapField_BorderColor, #89919a);border-radius:var(--sapField_BorderCornerRadius, .125rem)}::ng-deep .combo-popup-btn{border:none;background:transparent}::ng-deep .combo-popup-btn button{border-color:transparent!important;border:none}::ng-deep .fd-combobox-count-list-results{display:none}.extra-buttons{width:auto;border-right:none;border-left:none;margin:0}.extra-buttons>span{overflow:hidden}\n"] }]
+            args: [{ selector: 'bsu-ui-mo-info-ulv-combo', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<ng-container\r\n    *ngTemplateOutlet=\"\r\n        comboTemplate;\r\n        context: {\r\n            $implicit:\r\n                (loading$ | async) === true\r\n                | moInfoUlvMoList\r\n                    : isDataLoadedFirstTime\r\n                    : ulvAdapter?.Setting?.Data?.MoDataList\r\n                    : UlvUi?.Setting?.Data?.MoDataList\r\n                    : ulvAdapter?.Setting?.Data?.Paging\r\n                    : UlvUi?.Setting?.Data?.Paging,\r\n            deviceSize: deviceSize$ | async,\r\n            disableOrReadonly: disableOrReadonly$ | async,\r\n            disable: disable$ | async,\r\n            readonly: readonly$ | async,\r\n            isSearch: context._showPopup || context._showDropDown === false\r\n        }\r\n    \"\r\n>\r\n</ng-container>\r\n\r\n<ng-template #btnsTpl let-disableOrReadonly=\"disableOrReadonly\">\r\n    <div class=\"extra-buttons fd-input-group fd-input-group--control\" contentDensity>\r\n        @if (hasValue && disableOrReadonly !== true) {\r\n        <span class=\"fd-input-group__addon--button combo-popup-btn\" fd-input-group-addon>\r\n            <button tabindex=\"-1\" fd-button fdType=\"transparent\" glyph=\"decline\" (click)=\"onClear()\"></button>\r\n        </span>\r\n        } @if (!hasValue && disableOrReadonly !== true && Setting.ShowNewButton) {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"add\" (click)=\"onNew()\"></button>\r\n        </span>\r\n        } @if (hasValue && disableOrReadonly !== true && Setting.ViewRelatedFormType !== 'Hide') {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"edit\" (click)=\"onEdit()\"></button>\r\n        </span>\r\n        } @if (context._showPopup && !value && disableOrReadonly !== true) {\r\n        <span fd-input-group-addon class=\"fd-input-group__addon--button combo-popup-btn\">\r\n            <button fd-button fdType=\"transparent\" glyph=\"search\" (click)=\"onSearch()\"></button>\r\n        </span>\r\n        }\r\n    </div>\r\n</ng-template>\r\n<ng-template\r\n    #comboTemplate\r\n    let-moDataList\r\n    let-deviceSize=\"deviceSize\"\r\n    let-disableOrReadonly=\"disableOrReadonly\"\r\n    let-disable=\"disable\"\r\n    let-readonly=\"readonly\"\r\n    let-isSearch=\"isSearch\"\r\n>\r\n    <div class=\"simple-combo-wrapper\">\r\n        <fd-combobox\r\n            #fdCombobox\r\n            class=\"combo-mo-ulv\"\r\n            [class.canAdd]=\"!hasValue && disableOrReadonly !== true && Setting.ShowNewButton\"\r\n            [class.canEdit]=\"hasValue && disableOrReadonly !== true\"\r\n            [class.disableorreadonly]=\"disableOrReadonly === true\"\r\n            [comboboxId]=\"comboboxId\"\r\n            [class.has-Value]=\"hasValue\"\r\n            [placeholder]=\"'Select' | bbbTranslate\"\r\n            [mobile]=\"deviceSize === 's'\"\r\n            [mobileConfig]=\"mobileConfig\"\r\n            [fillOnSelect]=\"true\"\r\n            [readOnly]=\"readonly === true ? true : false\"\r\n            [disabled]=\"disable === true ? true : false\"\r\n            [dropdownValues]=\"moDataList\"\r\n            [filterFn]=\"customFilter\"\r\n            [openOnKeyboardEvent]=\"true\"\r\n            [byline]=\"allColumns.length > 0\"\r\n            [isSearch]=\"false\"\r\n            [itemTemplate]=\"itemTemplate\"\r\n            [displayFn]=\"displayFunc\"\r\n            [showDropdownButton]=\"context._showDropDown !== false && disableOrReadonly !== true\"\r\n            (itemClicked)=\"onItemClick($event, moDataList)\"\r\n            (inputTextChange)=\"onInputChange($event)\"\r\n            (openChange)=\"onOpenChange(fdCombobox, $event)\"\r\n        >\r\n        </fd-combobox>\r\n        <ng-container\r\n            *ngTemplateOutlet=\"btnsTpl; context: { disableOrReadonly: this.disableOrReadonly }\"\r\n        ></ng-container>\r\n    </div>\r\n    <ng-template #itemTemplate let-item>\r\n        @if (item.$isLoading) {\r\n        <div fd-list-content style=\"width: 100%; height: 20px\">\r\n            <bsu-mask [size]=\"'s'\" [top]=\"'10px'\"></bsu-mask>\r\n        </div>\r\n        } @else {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"item.$LoadMore ? loadMoreButton : showItem; context: { ulv: ulvAdapter || UlvUi }\"\r\n        >\r\n        </ng-container>\r\n        }\r\n        <ng-template #loadMoreButton let-ulv=\"ulv\">\r\n            @if (ulv) {\r\n            <bsu-ulv-paging\r\n                (click)=\"onPagingClick($event)\"\r\n                (pageChange)=\"onPageChange($event)\"\r\n                [pagingSetting]=\"ulv.Setting.Data.Paging\"\r\n            >\r\n            </bsu-ulv-paging>\r\n            }\r\n            <!-- <button\r\n        style=\"width: 100%\"\r\n        *ngIf=\"ulv && ulv.Setting.Data.Paging.Page + 1 < ulv.Setting.Data.Paging.TotalPages\"\r\n        fd-button\r\n        (click)=\"onPageChange2(ulv.Setting.Data.Paging, $event)\"\r\n        [label]=\"'More' | bbbTranslate\"\r\n      ></button> -->\r\n        </ng-template>\r\n        <ng-template #showItem>\r\n            @if (allColumns?.length && !item.isEmpty) { @if (!item.$__IsLast) {\r\n            <div class=\"moinfoulv devider\"></div>\r\n            } @if (item.$Icon) {\r\n            <span fd-list-thumbnail><fd-icon [glyph]=\"item.$Icon\"></fd-icon></span>\r\n            }\r\n            <div fd-list-content class=\"moinfoulv hasColumns\">\r\n                <div fd-list-title class=\"title\">{{ allColumns[0].Alias | rval: item:allColumns:true }}</div>\r\n                @if (allColumns[1]) {\r\n                <div fd-list-byline class=\"byline\">\r\n                    {{ allColumns[1].Alias | rval: item:allColumns:true }}\r\n                </div>\r\n                }\r\n                <div style=\"display: flex; column-gap: 8px; flex-wrap: wrap\">\r\n                    @for (column of allColumns; track column; let index = $index) { @if (index > 1) { @if (column.Alias\r\n                    | rval: item:allColumns:true; as value) {\r\n                    <span> {{ column.Alias }}:{{ value }}</span>\r\n                    } } }\r\n                </div>\r\n            </div>\r\n            } @else {\r\n            <span fd-list-title [class.list-empty-item]=\"item.isEmpty\"\r\n                >{{ item.isEmpty ? ('NoData' | bbbTranslate) : (item.$MoCaption || item.$Caption | bbbTranslate) }}\r\n            </span>\r\n            }\r\n        </ng-template>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{display:block}.combo-mo-ulv{width:100%}.combo-mo-ulv ::ng-deep .fd-popover-custom{width:100%}.fd-input-group{min-width:fit-content}.simple-combo-wrapper{display:flex;align-items:center;position:relative}.simple-combo-wrapper ::ng-deep .combo-mo-ulv[class*=has-]:not(.disableorreadonly) .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canAdd:not(.disableorreadonly) .fd-input-group,.simple-combo-wrapper ::ng-deep .combo-mo-ulv.canEdit:not(.disableorreadonly) .fd-input-group{border-left:none;border-bottom-left-radius:unset;border-top-left-radius:unset}.combo-wrapper{display:flex;align-items:center;border:var(--sapField_BorderWidth, .0625rem) solid var(--sapField_BorderColor, #89919a);border-radius:var(--sapField_BorderCornerRadius, .125rem)}::ng-deep .combo-popup-btn{border:none;background:transparent}::ng-deep .combo-popup-btn button{border-color:transparent!important;border:none}::ng-deep .fd-combobox-count-list-results{display:none}.extra-buttons{width:auto;border-right:none;border-left:none;margin:0}.extra-buttons>span{overflow:hidden}\n"] }]
         }], propDecorators: { ulvAdapter: [{
                 type: Input
             }], Control: [{
@@ -12904,17 +12943,19 @@ class LyLayoutPanelComponent extends LayoutPanelBaseComponent {
         this.setDisplay();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LyLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: { renderItems: "renderItems", isRoot: "isRoot", hideTitle: "hideTitle" }, host: { properties: { "attr.maxLabelWidth": "this.maxLabelWidth", "style.flex": "this.flex", "style.display": "this.display", "attr.title": "this.title", "attr.layoutpanel": "this.layoutpanel" } }, providers: [LayoutService], viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "@if (visible) {\r\n<fd-panel\r\n    [fixed]=\"!config.ExpandButtonVisible\"\r\n    [class.hide-header]=\"!config.TextVisible || hideTitle\"\r\n    [attr.maxWidth]=\"maxWidth\"\r\n    [expanded]=\"config.Expanded\"\r\n>\r\n    @if (!hideTitle) {\r\n    <h5 fd-panel-title>\r\n        <div style=\"display: flex; gap: 0.5rem; align-items: center\">\r\n            @if (config.FontIcon) {\r\n            <i\r\n                style=\"font-size: 1.5rem\"\r\n                [style.color]=\"config.IconColor || null\"\r\n                [class]=\"'sap-icon--' + config.FontIcon\"\r\n            ></i>\r\n            }\r\n            <span>{{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}</span>\r\n        </div>\r\n    </h5>\r\n    }\r\n    <div fd-panel-content [class.row-reverse-direction]=\"rowDirection\" [class.column-direction]=\"columnDirection\">\r\n        @for (item of config | filterToolbarControl; track item) { @switch (item.xtype) { @case ('Ly.LayoutTabPanel') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    name: 'LyLayoutPanelComponent',\r\n                    selector: 'bsu-ly-tab-container'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n        } @case ('Ly.LayoutPanel') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    name: 'LyLayoutPanelComponent',\r\n                    selector: 'bsu-ly-layout-panel'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n        } @case ('Ly.LayoutContainer') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    name: 'LyLayoutContainerComponent',\r\n                    selector: 'bsu-ly-layout-container'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n        } @case ('Ly.EmptySpace') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n        } @case ('Ly.SimpleLabel') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    name: 'LySimpleLabelComponent',\r\n                    selector: 'bsu-ly-simple-label'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n        } @case ('Ly.LayoutLine') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n        } @case ('Ly.LayoutJoin') { @if (item.Type === 'HorizontalJoin') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    selector: 'bsu-ly-horizontal-layout',\r\n                    name: 'LyLayoutHorizontalComponent'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n        } @else {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    selector: 'bsu-ly-vertical-layout',\r\n                    name: 'LyLayoutVerticalComponent'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n        } } @case ('Ly.LayoutControl') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    selector: 'bsu-layout-control',\r\n                    name: 'LayoutControlComponent'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n        } } }\r\n        <ng-template\r\n            #dynamicLayout\r\n            let-config\r\n            let-selector=\"selector\"\r\n            let-maxLabelWidth=\"maxLabelWidth\"\r\n            let-name=\"name\"\r\n        >\r\n            <bnrc-dynamic-layout\r\n                [config]=\"config\"\r\n                [selector]=\"selector\"\r\n                [name]=\"name\"\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                (events)=\"onEvents($event)\"\r\n            >\r\n            </bnrc-dynamic-layout>\r\n        </ng-template>\r\n    </div>\r\n</fd-panel>\r\n}\r\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start;margin:.2rem 0}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}fd-panel{width:100%}fd-panel div{display:flex;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1$2.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: i3$9.PanelComponent, selector: "fd-panel", inputs: ["class", "fixed", "id", "expandId", "expandAriaLabel", "expandAriaLabelledBy", "expanded"], outputs: ["expandedChange"] }, { kind: "directive", type: i3$9.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "directive", type: i3$9.PanelTitleDirective, selector: "[fd-panel-title]", inputs: ["id"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: { renderItems: "renderItems", isRoot: "isRoot", hideTitle: "hideTitle", notPanelMode: "notPanelMode" }, host: { properties: { "attr.maxLabelWidth": "this.maxLabelWidth", "style.flex": "this.flex", "style.display": "this.display", "attr.title": "this.title", "attr.layoutpanel": "this.layoutpanel" } }, providers: [LayoutService], viewQueries: [{ propertyName: "viewRef", first: true, predicate: ["viewRefTemplate"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: "@if (visible) { @if(!notPanelMode){\r\n<fd-panel\r\n    [fixed]=\"!config.ExpandButtonVisible\"\r\n    [class.hide-header]=\"!config.TextVisible || hideTitle\"\r\n    [attr.maxWidth]=\"maxWidth\"\r\n    [expanded]=\"config.Expanded\"\r\n>\r\n    @if (!hideTitle) {\r\n    <h5 fd-panel-title>\r\n        <div style=\"display: flex; gap: 0.5rem; align-items: center\">\r\n            @if (config.FontIcon) {\r\n            <i\r\n                style=\"font-size: 1.5rem\"\r\n                [style.color]=\"config.IconColor || null\"\r\n                [class]=\"'sap-icon--' + config.FontIcon\"\r\n            ></i>\r\n            }\r\n            <span>{{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}</span>\r\n        </div>\r\n    </h5>\r\n    }\r\n    <div fd-panel-content [class.row-reverse-direction]=\"rowDirection\" [class.column-direction]=\"columnDirection\">\r\n        <ng-container *ngTemplateOutlet=\"renderControls\"></ng-container>\r\n    </div>\r\n</fd-panel>\r\n} @else {\r\n<ng-container *ngTemplateOutlet=\"renderControls\"></ng-container>\r\n} }\r\n<ng-template #renderControls>\r\n    @for (item of config | filterToolbarControl; track item) { @switch (item.xtype) { @case ('Ly.LayoutTabPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutPanelComponent',\r\n                selector: 'bsu-ly-tab-container'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n    } @case ('Ly.LayoutPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutPanelComponent',\r\n                selector: 'bsu-ly-layout-panel'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n    } @case ('Ly.LayoutContainer') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutContainerComponent',\r\n                selector: 'bsu-ly-layout-container'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n    } @case ('Ly.EmptySpace') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n    } @case ('Ly.SimpleLabel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LySimpleLabelComponent',\r\n                selector: 'bsu-ly-simple-label'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n    } @case ('Ly.LayoutLine') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n    } @case ('Ly.LayoutJoin') { @if (item.Type === 'HorizontalJoin') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-horizontal-layout',\r\n                name: 'LyLayoutHorizontalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n    } @else {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-vertical-layout',\r\n                name: 'LyLayoutVerticalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n    } } @case ('Ly.LayoutControl') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-layout-control',\r\n                name: 'LayoutControlComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n    } } }\r\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-maxLabelWidth=\"maxLabelWidth\" let-name=\"name\">\r\n        <bnrc-dynamic-layout\r\n            [config]=\"config\"\r\n            [selector]=\"selector\"\r\n            [name]=\"name\"\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            (events)=\"onEvents($event)\"\r\n        >\r\n        </bnrc-dynamic-layout>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start;margin:.2rem 0}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}fd-panel{width:100%}fd-panel div{display:flex;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1$2.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: i3$9.PanelComponent, selector: "fd-panel", inputs: ["class", "fixed", "id", "expandId", "expandAriaLabel", "expandAriaLabelledBy", "expanded"], outputs: ["expandedChange"] }, { kind: "directive", type: i3$9.PanelContentDirective, selector: "[fd-panel-content]", inputs: ["height", "minHeight", "maxHeight", "ariaLabel", "ariaLabelledBy", "role", "id"] }, { kind: "directive", type: i3$9.PanelTitleDirective, selector: "[fd-panel-title]", inputs: ["id"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }, { kind: "pipe", type: i2.FilterToolbarControlPipe, name: "filterToolbarControl" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: LyLayoutPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-ly-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], standalone: false, template: "@if (visible) {\r\n<fd-panel\r\n    [fixed]=\"!config.ExpandButtonVisible\"\r\n    [class.hide-header]=\"!config.TextVisible || hideTitle\"\r\n    [attr.maxWidth]=\"maxWidth\"\r\n    [expanded]=\"config.Expanded\"\r\n>\r\n    @if (!hideTitle) {\r\n    <h5 fd-panel-title>\r\n        <div style=\"display: flex; gap: 0.5rem; align-items: center\">\r\n            @if (config.FontIcon) {\r\n            <i\r\n                style=\"font-size: 1.5rem\"\r\n                [style.color]=\"config.IconColor || null\"\r\n                [class]=\"'sap-icon--' + config.FontIcon\"\r\n            ></i>\r\n            }\r\n            <span>{{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}</span>\r\n        </div>\r\n    </h5>\r\n    }\r\n    <div fd-panel-content [class.row-reverse-direction]=\"rowDirection\" [class.column-direction]=\"columnDirection\">\r\n        @for (item of config | filterToolbarControl; track item) { @switch (item.xtype) { @case ('Ly.LayoutTabPanel') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    name: 'LyLayoutPanelComponent',\r\n                    selector: 'bsu-ly-tab-container'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n        } @case ('Ly.LayoutPanel') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    name: 'LyLayoutPanelComponent',\r\n                    selector: 'bsu-ly-layout-panel'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n        } @case ('Ly.LayoutContainer') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    name: 'LyLayoutContainerComponent',\r\n                    selector: 'bsu-ly-layout-container'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n        } @case ('Ly.EmptySpace') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n        } @case ('Ly.SimpleLabel') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    name: 'LySimpleLabelComponent',\r\n                    selector: 'bsu-ly-simple-label'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n        } @case ('Ly.LayoutLine') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n        } @case ('Ly.LayoutJoin') { @if (item.Type === 'HorizontalJoin') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    selector: 'bsu-ly-horizontal-layout',\r\n                    name: 'LyLayoutHorizontalComponent'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n        } @else {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    selector: 'bsu-ly-vertical-layout',\r\n                    name: 'LyLayoutVerticalComponent'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n        } } @case ('Ly.LayoutControl') {\r\n        <ng-container\r\n            *ngTemplateOutlet=\"\r\n                dynamicLayout;\r\n                context: {\r\n                    $implicit: item,\r\n                    selector: 'bsu-layout-control',\r\n                    name: 'LayoutControlComponent'\r\n                }\r\n            \"\r\n        ></ng-container>\r\n        <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n        } } }\r\n        <ng-template\r\n            #dynamicLayout\r\n            let-config\r\n            let-selector=\"selector\"\r\n            let-maxLabelWidth=\"maxLabelWidth\"\r\n            let-name=\"name\"\r\n        >\r\n            <bnrc-dynamic-layout\r\n                [config]=\"config\"\r\n                [selector]=\"selector\"\r\n                [name]=\"name\"\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                (events)=\"onEvents($event)\"\r\n            >\r\n            </bnrc-dynamic-layout>\r\n        </ng-template>\r\n    </div>\r\n</fd-panel>\r\n}\r\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start;margin:.2rem 0}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}fd-panel{width:100%}fd-panel div{display:flex;overflow:hidden}\n"] }]
+            args: [{ selector: 'bsu-ly-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService], standalone: false, template: "@if (visible) { @if(!notPanelMode){\r\n<fd-panel\r\n    [fixed]=\"!config.ExpandButtonVisible\"\r\n    [class.hide-header]=\"!config.TextVisible || hideTitle\"\r\n    [attr.maxWidth]=\"maxWidth\"\r\n    [expanded]=\"config.Expanded\"\r\n>\r\n    @if (!hideTitle) {\r\n    <h5 fd-panel-title>\r\n        <div style=\"display: flex; gap: 0.5rem; align-items: center\">\r\n            @if (config.FontIcon) {\r\n            <i\r\n                style=\"font-size: 1.5rem\"\r\n                [style.color]=\"config.IconColor || null\"\r\n                [class]=\"'sap-icon--' + config.FontIcon\"\r\n            ></i>\r\n            }\r\n            <span>{{ (config.TextVisible ? config.Title ?? '' : '') | bbbTranslate }}</span>\r\n        </div>\r\n    </h5>\r\n    }\r\n    <div fd-panel-content [class.row-reverse-direction]=\"rowDirection\" [class.column-direction]=\"columnDirection\">\r\n        <ng-container *ngTemplateOutlet=\"renderControls\"></ng-container>\r\n    </div>\r\n</fd-panel>\r\n} @else {\r\n<ng-container *ngTemplateOutlet=\"renderControls\"></ng-container>\r\n} }\r\n<ng-template #renderControls>\r\n    @for (item of config | filterToolbarControl; track item) { @switch (item.xtype) { @case ('Ly.LayoutTabPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutPanelComponent',\r\n                selector: 'bsu-ly-tab-container'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-tab-container [config]=\"item\"></bsu-ly-tab-container> -->\r\n    } @case ('Ly.LayoutPanel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutPanelComponent',\r\n                selector: 'bsu-ly-layout-panel'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-panel [config]=\"item\"></bsu-ly-layout-panel> -->\r\n    } @case ('Ly.LayoutContainer') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LyLayoutContainerComponent',\r\n                selector: 'bsu-ly-layout-container'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-layout-container [config]=\"item\"></bsu-ly-layout-container> -->\r\n    } @case ('Ly.EmptySpace') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyEmptySpaceComponent', selector: 'bsu-ly-empty-space' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-empty-space [config]=\"item\"></bsu-ly-empty-space> -->\r\n    } @case ('Ly.SimpleLabel') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                name: 'LySimpleLabelComponent',\r\n                selector: 'bsu-ly-simple-label'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-simple-label [config]=\"item\"></bsu-ly-simple-label> -->\r\n    } @case ('Ly.LayoutLine') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: { $implicit: item, name: 'LyLineComponent', selector: 'bsu-ly-line' }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-line [isVertical]=\"item.IsVertical\"></bsu-ly-line> -->\r\n    } @case ('Ly.LayoutJoin') { @if (item.Type === 'HorizontalJoin') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-horizontal-layout',\r\n                name: 'LyLayoutHorizontalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-horizontal-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-horizontal-layout> -->\r\n    } @else {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-ly-vertical-layout',\r\n                name: 'LyLayoutVerticalComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-ly-vertical-layout [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-ly-vertical-layout> -->\r\n    } } @case ('Ly.LayoutControl') {\r\n    <ng-container\r\n        *ngTemplateOutlet=\"\r\n            dynamicLayout;\r\n            context: {\r\n                $implicit: item,\r\n                selector: 'bsu-layout-control',\r\n                name: 'LayoutControlComponent'\r\n            }\r\n        \"\r\n    ></ng-container>\r\n    <!-- <bsu-layout-control [config]=\"item\" [maxLabelWidth]=\"maxLabelWidth\"></bsu-layout-control> -->\r\n    } } }\r\n    <ng-template #dynamicLayout let-config let-selector=\"selector\" let-maxLabelWidth=\"maxLabelWidth\" let-name=\"name\">\r\n        <bnrc-dynamic-layout\r\n            [config]=\"config\"\r\n            [selector]=\"selector\"\r\n            [name]=\"name\"\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            (events)=\"onEvents($event)\"\r\n        >\r\n        </bnrc-dynamic-layout>\r\n    </ng-template>\r\n</ng-template>\r\n", styles: [":host{width:100%;display:flex;height:auto;align-items:flex-start;margin:.2rem 0}.fd-wizard-example .fd-wizard__content{min-height:300px}.full-width{width:100%}@media (max-width: 600px){:host{align-items:stretch}}fd-panel{width:100%}fd-panel div{display:flex;overflow:hidden}\n"] }]
         }], propDecorators: { renderItems: [{
                 type: Input
             }], isRoot: [{
                 type: Input
             }], hideTitle: [{
                 type: Input
+            }], notPanelMode: [{
+                type: Input
             }], maxLabelWidth: [{
                 type: HostBinding,
                 args: ['attr.maxLabelWidth']
@@ -13912,7 +13953,7 @@ class BarsaCardLayoutPanelComponent extends LayoutPanelBaseComponent {
         FillAllLayoutControls(this.config, this.layoutControls);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaCardLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaCardLayoutPanelComponent, 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: i5$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: i5$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$4.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i5$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$4.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5$4.CardFooterComponent, selector: "fd-card-footer" }, { kind: "component", type: i6.TitleComponent, selector: "[fd-title], [fdTitle]", inputs: ["headerSize", "wrap"], exportAs: ["fd-title"] }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }, { kind: "pipe", type: i2.BbbTranslatePipe, name: "bbbTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaCardLayoutPanelComponent, 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: i5$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: i5$4.CardHeaderComponent, selector: "fd-card-header", inputs: ["ariaRoleDescription"] }, { kind: "component", type: i5$4.CardMainHeaderComponent, selector: "fd-card-main-header", inputs: ["interactive", "title"] }, { kind: "component", type: i5$4.CardContentComponent, selector: "fd-card-content" }, { kind: "directive", type: i5$4.CardTitleDirective, selector: "[fd-card-title]", inputs: ["id"] }, { kind: "component", type: i5$4.CardFooterComponent, selector: "fd-card-footer" }, { kind: "component", type: i6.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: "18.2.13", ngImport: i0, type: BarsaCardLayoutPanelComponent, decorators: [{
             type: Component,
@@ -14011,7 +14052,7 @@ class BarsaFormSideContentComponent extends FormPropsBaseComponent {
         return isSmallDevice;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaFormSideContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaFormSideContentComponent, selector: "bsu-barsa-form-side-content", host: { properties: { "class.smallDevice": "this._isSmallDevice", "style.background": "this._background" } }, providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "@if(isMobile) {\r\n<button\r\n    fd-shellbar-side-nav\r\n    fd-button\r\n    fdType=\"transparent\"\r\n    glyph=\"menu2\"\r\n    style=\"width: 2.75rem\"\r\n    (click)=\"$event.stopPropagation(); openSidebar()\"\r\n></button>\r\n\r\n<div\r\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[1001] tw-shadow-2xl tw-overflow-auto\"\r\n    [ngClass]=\"{ 'tw-w-4/5': isMobile }\"\r\n    [class.-tw-right-full]=\"isMobile\"\r\n    [class.tw-w-96]=\"!isMobile\"\r\n    [class.-tw-right-96]=\"!isMobile\"\r\n    fillEmptySpace\r\n    [class.!tw-right-0]=\"isOpenQuickAccess$ | async\"\r\n    (click)=\"$event.stopPropagation()\"\r\n    #sidebar\r\n>\r\n    <button\r\n        fd-shellbar-side-nav\r\n        fd-button\r\n        fdType=\"transparent\"\r\n        glyph=\"decline\"\r\n        (click)=\"$event.stopPropagation(); closeSidebar()\"\r\n        routeFormChange\r\n        [bodyClick]=\"true\"\r\n        (stateChanged)=\"afterViewInit && closeSidebar()\"\r\n    ></button>\r\n    @if (sideContentLayout ) {\r\n    <bsu-ly-layout-panel\r\n        style=\"width: 100%\"\r\n        [config]=\"sideContentLayout\"\r\n        [hideTitle]=\"parameters?.HideSideContentTitle === true\"\r\n        class=\"xxx\"\r\n    ></bsu-ly-layout-panel\r\n    >}\r\n</div>\r\n} @if (sideContentLayout && mainContentLayout) {\r\n\r\n<fd-dynamic-side-content\r\n    [class.rtl]=\"rtl\"\r\n    fillEmptySpace\r\n    [decrement]=\"'40px'\"\r\n    [disable]=\"autoHeight\"\r\n    [setMinHeight]=\"true\"\r\n    [size]=\"isMobile ? 'sm' : smallDevice ? 'md' : 'xl'\"\r\n>\r\n    <fd-dynamic-side-content-side>\r\n        <bsu-ly-layout-panel\r\n            fillEmptySpace\r\n            [disable]=\"!parameters?.FixSideContentHeight\"\r\n            [style.overflow-y]=\"parameters?.FixSideContentHeight === true ? 'auto' : null\"\r\n            [config]=\"sideContentLayout\"\r\n            [hideTitle]=\"parameters?.HideSideContentTitle === true\"\r\n        >\r\n        </bsu-ly-layout-panel>\r\n    </fd-dynamic-side-content-side>\r\n    <fd-dynamic-side-content-main [style.width]=\"isMobile ? null : parameters?.MainContentWidth\">\r\n        <bsu-ly-layout-panel [config]=\"mainContentLayout\" [hideTitle]=\"parameters?.HideMainContentTitle === true\">\r\n        </bsu-ly-layout-panel>\r\n    </fd-dynamic-side-content-main>\r\n</fd-dynamic-side-content>\r\n} @else {\r\n<fd-message-strip type=\"error\" [dismissible]=\"false\"\r\n    >side content and main content does not defined correctly.</fd-message-strip\r\n>\r\n}\r\n<ng-template #error>\r\n    <fd-message-strip type=\"error\" [dismissible]=\"false\"\r\n        >side content and main content does not defined correctly.</fd-message-strip\r\n    >\r\n</ng-template>\r\n", styles: [":host{width:100%;height:100%;display:flex;position:relative;flex-direction:column}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;background-color:var(--sapBaseColor)}fd-dynamic-side-content-side{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;border-left:none;background-color:var(--sapBaseColor)}fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-left:none!important}fd-dynamic-side-content-main>bsu-ly-layout-panel ::ng-deep>fd-panel>.fd-panel>.fd-panel__content,fd-dynamic-side-content-side>bsu-ly-layout-panel ::ng-deep>fd-panel>.fd-panel>.fd-panel__content{border:none;padding:0}:host ::ng-deep bnrc-field-ui{padding:0!important}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i2.RouteFormChangeDirective, selector: "[routeFormChange]", inputs: ["handleBodyClick"], outputs: ["stateChanged"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i10$2.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$2.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$2.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i2$5.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i6$6.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaFormSideContentComponent, selector: "bsu-barsa-form-side-content", host: { properties: { "class.smallDevice": "this._isSmallDevice", "style.background": "this._background" } }, providers: [LayoutService], usesInheritance: true, ngImport: i0, template: "@if(isMobile) {\r\n<button\r\n    fd-shellbar-side-nav\r\n    fd-button\r\n    fdType=\"transparent\"\r\n    glyph=\"menu2\"\r\n    style=\"width: 2.75rem\"\r\n    (click)=\"$event.stopPropagation(); openSidebar()\"\r\n></button>\r\n\r\n<div\r\n    class=\"sidemenu-h tw-fixed tw-bg-white tw-transition-all tw-z-[1001] tw-shadow-2xl tw-overflow-auto\"\r\n    [ngClass]=\"{ 'tw-w-4/5': isMobile }\"\r\n    [class.-tw-right-full]=\"isMobile\"\r\n    [class.tw-w-96]=\"!isMobile\"\r\n    [class.-tw-right-96]=\"!isMobile\"\r\n    fillEmptySpace\r\n    [class.!tw-right-0]=\"isOpenQuickAccess$ | async\"\r\n    (click)=\"$event.stopPropagation()\"\r\n    #sidebar\r\n>\r\n    <button\r\n        fd-shellbar-side-nav\r\n        fd-button\r\n        fdType=\"transparent\"\r\n        glyph=\"decline\"\r\n        (click)=\"$event.stopPropagation(); closeSidebar()\"\r\n        routeFormChange\r\n        [bodyClick]=\"true\"\r\n        (stateChanged)=\"afterViewInit && closeSidebar()\"\r\n    ></button>\r\n    @if (sideContentLayout ) {\r\n    <bsu-ly-layout-panel\r\n        style=\"width: 100%\"\r\n        [config]=\"sideContentLayout\"\r\n        [hideTitle]=\"parameters?.HideSideContentTitle === true\"\r\n        class=\"xxx\"\r\n    ></bsu-ly-layout-panel\r\n    >}\r\n</div>\r\n} @if (sideContentLayout && mainContentLayout) {\r\n\r\n<fd-dynamic-side-content\r\n    [class.rtl]=\"rtl\"\r\n    fillEmptySpace\r\n    [decrement]=\"'40px'\"\r\n    [disable]=\"autoHeight\"\r\n    [setMinHeight]=\"true\"\r\n    [size]=\"isMobile ? 'sm' : smallDevice ? 'md' : 'xl'\"\r\n>\r\n    <fd-dynamic-side-content-side>\r\n        <bsu-ly-layout-panel\r\n            fillEmptySpace\r\n            [disable]=\"!parameters?.FixSideContentHeight\"\r\n            [style.overflow-y]=\"parameters?.FixSideContentHeight === true ? 'auto' : null\"\r\n            [config]=\"sideContentLayout\"\r\n            [hideTitle]=\"parameters?.HideSideContentTitle === true\"\r\n        >\r\n        </bsu-ly-layout-panel>\r\n    </fd-dynamic-side-content-side>\r\n    <fd-dynamic-side-content-main [style.width]=\"isMobile ? null : parameters?.MainContentWidth\">\r\n        <bsu-ly-layout-panel [config]=\"mainContentLayout\" [hideTitle]=\"parameters?.HideMainContentTitle === true\">\r\n        </bsu-ly-layout-panel>\r\n    </fd-dynamic-side-content-main>\r\n</fd-dynamic-side-content>\r\n} @else {\r\n<fd-message-strip type=\"error\" [dismissible]=\"false\"\r\n    >side content and main content does not defined correctly.</fd-message-strip\r\n>\r\n}\r\n<ng-template #error>\r\n    <fd-message-strip type=\"error\" [dismissible]=\"false\"\r\n        >side content and main content does not defined correctly.</fd-message-strip\r\n    >\r\n</ng-template>\r\n", styles: [":host{width:100%;height:100%;display:flex;position:relative;flex-direction:column}fd-dynamic-side-content-main{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;background-color:var(--sapBaseColor)}fd-dynamic-side-content-side{border:.0625rem solid var(--sapTile_SeparatorColor, #ccc)!important;border-left:none;background-color:var(--sapBaseColor)}fd-dynamic-side-content.rtl fd-dynamic-side-content-side{border-left:none!important}fd-dynamic-side-content-main>bsu-ly-layout-panel ::ng-deep>fd-panel>.fd-panel>.fd-panel__content,fd-dynamic-side-content-side>bsu-ly-layout-panel ::ng-deep>fd-panel>.fd-panel>.fd-panel__content{border:none;padding:0}:host ::ng-deep bnrc-field-ui{padding:0!important}\n"], dependencies: [{ kind: "directive", type: i1$2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i2.RouteFormChangeDirective, selector: "[routeFormChange]", inputs: ["handleBodyClick"], outputs: ["stateChanged"] }, { kind: "component", type: i3$2.ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i10$2.DynamicSideContentComponent, selector: "fd-dynamic-side-content", inputs: ["position", "size", "id"] }, { kind: "component", type: i10$2.DynamicSideContentSideComponent, selector: "fd-dynamic-side-content-side", inputs: ["id"] }, { kind: "component", type: i10$2.DynamicSideContentMainComponent, selector: "fd-dynamic-side-content-main", inputs: ["id"] }, { kind: "component", type: i2$5.MessageStripComponent, selector: "fd-message-strip", inputs: ["class", "dismissible", "noIcon", "type", "id", "ariaLabelledBy", "ariaLabel", "width", "minWidth", "marginBottom", "indicationColor"], outputs: ["onDismiss"] }, { kind: "directive", type: i6$6.ShellbarSidenavDirective, selector: "[fdShellbarSidenav], [fd-shellbar-side-nav]" }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle", "notPanelMode"] }, { kind: "pipe", type: i1$2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaFormSideContentComponent, decorators: [{
             type: Component,
@@ -15530,11 +15571,11 @@ class BarsaFormLayoutPanelComponent extends LayoutPanelBaseComponent {
         this._layoutMainContentService.setMainContentHeight(this._mainEl.nativeElement.offsetHeight - x * 2);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaFormLayoutPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaFormLayoutPanelComponent, selector: "bsu-barsa-form-layout-panel", host: { properties: { "class.smallDevice": "this._isSmallDevice", "style.background": "this._background" } }, providers: [LayoutService, LayoutMainContentService], viewQueries: [{ propertyName: "_headerEl", first: true, predicate: ["headerEl"], descendants: true, read: ElementRef }, { propertyName: "_footerEl", first: true, predicate: ["footerEl"], descendants: true, read: ElementRef }, { propertyName: "_mainEl", first: true, predicate: ["mainEl"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<fd-layout-panel fillEmptySpace [decrement]=\"'40px'\" (heightChanged)=\"onFillEmptyHeightChanged()\">\r\n    <fd-layout-panel-header #headerEl>\r\n        @if(headerContentLayout){\r\n        <fd-layout-panel-head>\r\n            <bsu-ly-layout-panel\r\n                class=\"extra-layout-panel\"\r\n                style=\"width: 100%\"\r\n                [config]=\"headerContentLayout\"\r\n                [hideTitle]=\"true\"\r\n            ></bsu-ly-layout-panel>\r\n        </fd-layout-panel-head>\r\n        }\r\n    </fd-layout-panel-header>\r\n    <fd-layout-panel-body #mainEl>\r\n        @if(mainContentLayout){\r\n        <bsu-ly-layout-panel\r\n            style=\"width: 100%\"\r\n            [style.overflow-y]=\"true\"\r\n            [config]=\"mainContentLayout\"\r\n            [hideTitle]=\"true\"\r\n            class=\"extra-layout-panel\"\r\n        >\r\n        </bsu-ly-layout-panel>\r\n        }\r\n    </fd-layout-panel-body>\r\n    <fd-layout-panel-footer #footerEl>\r\n        @if(footerContentLayout){\r\n        <bsu-ly-layout-panel\r\n            class=\"extra-layout-panel\"\r\n            style=\"width: 100%\"\r\n            [config]=\"footerContentLayout\"\r\n            [hideTitle]=\"true\"\r\n        ></bsu-ly-layout-panel>\r\n        }\r\n    </fd-layout-panel-footer>\r\n</fd-layout-panel>\r\n", styles: [":host{display:block}.extra-layout-panel ::ng-deep>fd-panel>div>div{border:none;padding:0}fd-layout-panel{display:flex;flex-direction:column}fd-layout-panel>fd-layout-panel-body{flex:1}\n"], dependencies: [{ kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i2$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i2$3.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i2$3.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "component", type: i2$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i2$3.LayoutPanelFooterComponent, selector: "fd-layout-panel-footer", inputs: ["class", "position"] }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BarsaFormLayoutPanelComponent, selector: "bsu-barsa-form-layout-panel", host: { properties: { "class.smallDevice": "this._isSmallDevice", "style.background": "this._background" } }, providers: [LayoutService, LayoutMainContentService], viewQueries: [{ propertyName: "_headerEl", first: true, predicate: ["headerEl"], descendants: true, read: ElementRef }, { propertyName: "_footerEl", first: true, predicate: ["footerEl"], descendants: true, read: ElementRef }, { propertyName: "_mainEl", first: true, predicate: ["mainEl"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<fd-layout-panel fillEmptySpace [decrement]=\"'40px'\" (heightChanged)=\"onFillEmptyHeightChanged()\">\r\n    <fd-layout-panel-header #headerEl style=\"width: 100%\">\r\n        @if(headerContentLayout){\r\n        <fd-layout-panel-head style=\"width: 100%\">\r\n            <bsu-ly-layout-panel\r\n                class=\"extra-layout-panel\"\r\n                [notPanelMode]=\"true\"\r\n                [config]=\"headerContentLayout\"\r\n                [hideTitle]=\"true\"\r\n            ></bsu-ly-layout-panel>\r\n        </fd-layout-panel-head>\r\n        }\r\n    </fd-layout-panel-header>\r\n    <fd-layout-panel-body #mainEl>\r\n        @if(mainContentLayout){\r\n        <bsu-ly-layout-panel\r\n            [style.overflow-y]=\"true\"\r\n            [config]=\"mainContentLayout\"\r\n            [hideTitle]=\"true\"\r\n            [notPanelMode]=\"true\"\r\n            class=\"extra-layout-panel\"\r\n        >\r\n        </bsu-ly-layout-panel>\r\n        }\r\n    </fd-layout-panel-body>\r\n    <fd-layout-panel-footer #footerEl>\r\n        @if(footerContentLayout){\r\n        <bsu-ly-layout-panel\r\n            class=\"extra-layout-panel\"\r\n            [config]=\"footerContentLayout\"\r\n            [notPanelMode]=\"true\"\r\n            [hideTitle]=\"true\"\r\n        ></bsu-ly-layout-panel>\r\n        }\r\n    </fd-layout-panel-footer>\r\n</fd-layout-panel>\r\n", styles: [":host{display:block}.extra-layout-panel{border:none;width:100%}fd-layout-panel{display:flex;flex-direction:column}fd-layout-panel>fd-layout-panel-body{flex:1;height:100%;overflow:auto}\n"], dependencies: [{ kind: "directive", type: i2.FillEmptySpaceDirective, selector: "[fillEmptySpace]", inputs: ["containerDom", "decrement", "disable", "height", "dontUseTopBound", "setMinHeight"], outputs: ["heightChanged"], exportAs: ["fillEmptySpace"] }, { kind: "component", type: i2$3.LayoutPanelComponent, selector: "fd-layout-panel", inputs: ["backgroundImage", "id", "transparent"] }, { kind: "component", type: i2$3.LayoutPanelHeaderComponent, selector: "fd-layout-panel-header" }, { kind: "component", type: i2$3.LayoutPanelHeadComponent, selector: "fd-layout-panel-head" }, { kind: "component", type: i2$3.LayoutPanelBodyComponent, selector: "fd-layout-panel-body", inputs: ["bleed"] }, { kind: "component", type: i2$3.LayoutPanelFooterComponent, selector: "fd-layout-panel-footer", inputs: ["class", "position"] }, { kind: "component", type: LyLayoutPanelComponent, selector: "bsu-ly-layout-panel", inputs: ["renderItems", "isRoot", "hideTitle", "notPanelMode"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BarsaFormLayoutPanelComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'bsu-barsa-form-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService, LayoutMainContentService], standalone: false, template: "<fd-layout-panel fillEmptySpace [decrement]=\"'40px'\" (heightChanged)=\"onFillEmptyHeightChanged()\">\r\n    <fd-layout-panel-header #headerEl>\r\n        @if(headerContentLayout){\r\n        <fd-layout-panel-head>\r\n            <bsu-ly-layout-panel\r\n                class=\"extra-layout-panel\"\r\n                style=\"width: 100%\"\r\n                [config]=\"headerContentLayout\"\r\n                [hideTitle]=\"true\"\r\n            ></bsu-ly-layout-panel>\r\n        </fd-layout-panel-head>\r\n        }\r\n    </fd-layout-panel-header>\r\n    <fd-layout-panel-body #mainEl>\r\n        @if(mainContentLayout){\r\n        <bsu-ly-layout-panel\r\n            style=\"width: 100%\"\r\n            [style.overflow-y]=\"true\"\r\n            [config]=\"mainContentLayout\"\r\n            [hideTitle]=\"true\"\r\n            class=\"extra-layout-panel\"\r\n        >\r\n        </bsu-ly-layout-panel>\r\n        }\r\n    </fd-layout-panel-body>\r\n    <fd-layout-panel-footer #footerEl>\r\n        @if(footerContentLayout){\r\n        <bsu-ly-layout-panel\r\n            class=\"extra-layout-panel\"\r\n            style=\"width: 100%\"\r\n            [config]=\"footerContentLayout\"\r\n            [hideTitle]=\"true\"\r\n        ></bsu-ly-layout-panel>\r\n        }\r\n    </fd-layout-panel-footer>\r\n</fd-layout-panel>\r\n", styles: [":host{display:block}.extra-layout-panel ::ng-deep>fd-panel>div>div{border:none;padding:0}fd-layout-panel{display:flex;flex-direction:column}fd-layout-panel>fd-layout-panel-body{flex:1}\n"] }]
+            args: [{ selector: 'bsu-barsa-form-layout-panel', changeDetection: ChangeDetectionStrategy.OnPush, providers: [LayoutService, LayoutMainContentService], standalone: false, template: "<fd-layout-panel fillEmptySpace [decrement]=\"'40px'\" (heightChanged)=\"onFillEmptyHeightChanged()\">\r\n    <fd-layout-panel-header #headerEl style=\"width: 100%\">\r\n        @if(headerContentLayout){\r\n        <fd-layout-panel-head style=\"width: 100%\">\r\n            <bsu-ly-layout-panel\r\n                class=\"extra-layout-panel\"\r\n                [notPanelMode]=\"true\"\r\n                [config]=\"headerContentLayout\"\r\n                [hideTitle]=\"true\"\r\n            ></bsu-ly-layout-panel>\r\n        </fd-layout-panel-head>\r\n        }\r\n    </fd-layout-panel-header>\r\n    <fd-layout-panel-body #mainEl>\r\n        @if(mainContentLayout){\r\n        <bsu-ly-layout-panel\r\n            [style.overflow-y]=\"true\"\r\n            [config]=\"mainContentLayout\"\r\n            [hideTitle]=\"true\"\r\n            [notPanelMode]=\"true\"\r\n            class=\"extra-layout-panel\"\r\n        >\r\n        </bsu-ly-layout-panel>\r\n        }\r\n    </fd-layout-panel-body>\r\n    <fd-layout-panel-footer #footerEl>\r\n        @if(footerContentLayout){\r\n        <bsu-ly-layout-panel\r\n            class=\"extra-layout-panel\"\r\n            [config]=\"footerContentLayout\"\r\n            [notPanelMode]=\"true\"\r\n            [hideTitle]=\"true\"\r\n        ></bsu-ly-layout-panel>\r\n        }\r\n    </fd-layout-panel-footer>\r\n</fd-layout-panel>\r\n", styles: [":host{display:block}.extra-layout-panel{border:none;width:100%}fd-layout-panel{display:flex;flex-direction:column}fd-layout-panel>fd-layout-panel-body{flex:1;height:100%;overflow:auto}\n"] }]
         }], propDecorators: { _isSmallDevice: [{
                 type: HostBinding,
                 args: ['class.smallDevice']